1// JavaScript React
2
3/** @author Willy <willy@wmail.com>
4  * @url https://reactjs.org/ **/
5
6import React from 'react';
7import { PhotoStory, VideoStory } from './stories';
8
9function Story(props) {
10  const SpecificStory = components[props.storyType];
11  return <SpecificStory story={ props.story } attr2="&ref;" attr3="Hello\n" />;
12}
13
14function
15<Tag attr1={ <tag/> function <noTag/> return class var 0x123 { } &noRef; hello() React.Component() } attr2="&ref;">
16	/* no comment*/ function <tag/> return class var 0x123 &ref; hello() React.Component()
17	.<tag/> anyWord <tag/>
18	{ function <tag> return class var 0x123 hello() React.Component() }
19</Tag>
20
21<tag1> </tag1>
22<tag1> </Tag$>
23<Tag$> </tag>
24
25<tag/*comment*/attr1/*comment*/= /*comment*/"value"/*comment*/attr2 /*comment*/attr3='a' key/*comment*/key2 />
26
27// Detect Valid tags
28
29/* comment */ <tag></tag>
30{ /* comment
31	*/ <Tag />
32	word <noTag/> . <noTag/> } <noTag/>
33return /* comment
34	multiline */ <tag/> /* comment */ <Tag/>
35&& /*comment*/ <Tag/>
36& /*comment*/ <noTag/>
37
38  <tag/>
39{ <hello>Hello</hello> }
40?<Tag />;
41[ <tag />  ( <tag /> ]
42,<Tag/>    =<Tag/>
43&&<tag/>   ||<tag/>
44return <tag/> ;
45default<tag/> ;
46<Tag> <tag> <tag$/> </tag> return </Tag>
47
48anyWord<noTag>
49anyWord/*comment*/ <noTag/>
50.<noTag>
51&<notag> | <noTag/>
52% /* comment*/ <noTag/>
53
54// Non-ASCII tag name & attribute
55<日本語></日本語>;
56<Component 本本:本-本 aa本:本 aa:aa />
57
58<Namespace.DeepNamespace.Component />;
59<Component { ... x } y
60={2 } z />;
61
62let k1 = <div> <h2> Hello </h2> <h1> world </h1></div>;
63let k2 = <Button> <h2> Hello </h2> </Button>;
64
65// Empty tags
66<></>; // no whitespace
67<    ></   >; // lots of whitespace
68< /*starting wrap*/ ></ /*ending wrap*/>; // comments in the tags
69<>hi</>; // text inside
70<><span>hi</span><div>bye</div></>; // children
71<><span>1</span><><span>2.1</span><span>2.2</span></><span>3</span></>; // nested fragments
72<>#</>; // # would cause scanning error if not in jsxtext
73
74// Tags after substitutions in templates
75`aaa${<tag></tag>//comment
76    /*comment*/<A/>}`
77
78// Don't highlight tags within variable declaration
79let myIdentity: <T>(arg: T) => T = identity;
80var myIdentity: <U>(arg: U) => U = identity;
81const myIdentity: {<T>(arg: T): T} = identity;
82
83// Don't highlight tags within interfaces and classes
84interface GenericIdentityFn {
85    <T>(arg: T): T;
86    <noTag />
87}
88class Handler {
89    info: <T>(arg: T): T <noTag />;
90    <tag> </tag>
91}
92
93// Check character after tag name, do not highlight invalid tags
94<noTag ?
95<noTag  ,
96<noTag /* comment */ ?
97<noTag#
98<noTag/*comment*/#
99
100// Tagged template literals
101tagFunc`
102    Hello world!
103    ${ <Tag />; 22 + "11" }`;
104obj.something.tagFunc`Setting ${setting} is ${value}!`;
105