Add JSX Fragment syntax support (#6552)

* Add JSX Fragments to babel-types

* Support JSX fragments in the transform-react-jsx plugin

* Add tests JSX fragments

* Update helper-builder and transform plugin documentations for jsx fragment

* Add generator for jsx fragments

* Add test for jsx fragment generator

* Split jsx transform example into normal and fragment examples

* Remove unnecessary fields from ElementState in babel-helper-builder-react-jsx

* inline [skip ci]

packages/babel-plugin-transform-react-jsx/README.md

@@ -46,12 +46,76 @@ var profile = <div>
 
 var dom = require("deku").dom;
 
-var profile = dom( "div", null,
+var profile = dom("div", null,
   dom("img", { src: "avatar.png", className: "profile" }),
   dom("h3", null, [user.firstName, user.lastName].join(" "))
 );
 ```
 
+### Fragments
+
+Fragments are a feature available in React 16.2.0+.
+
+#### React
+
+**In**
+
+```javascript
+var descriptions = items.map(item => (
+  <>
+    <dt>{item.name}</dt>
+    <dd>{item.value}</dd>
+  </>
+));
+```
+
+**Out**
+
+```javascript
+var descriptions = items.map(item => React.createElement(
+  React.Fragment,
+  null,
+  React.createElement("dt", null, item.name),
+  React.createElement("dd", null, item.value)
+));
+```
+
+#### Custom
+
+**In**
+
+```javascript
+/** @jsx dom */
+/** @jsxFrag DomFrag */
+
+var { dom, DomFrag } = require("deku"); // DomFrag is fictional!
+
+var descriptions = items.map(item => (
+  <>
+    <dt>{item.name}</dt>
+    <dd>{item.value}</dd>
+  </>
+));
+```
+
+**Out**
+
+```javascript
+/** @jsx dom */
+/** @jsxFrag DomFrag */
+
+var { dom, DomFrag } = require("deku"); // DomFrag is fictional!
+
+var descriptions = items.map(item => dom(
+  DomFrag,
+  null,
+  dom("dt", null, item.name),
+  dom("dd", null, item.value)
+));
+```
+
+Note that if a custom pragma is specified, then a custom fragment pragma must also be specified if the `<></>` is used. Otherwise, an error will be thrown.
+
 ## Installation
 
 ```sh
@@ -79,6 +143,7 @@ With options:
   "plugins": [
     ["@babel/transform-react-jsx", {
       "pragma": "dom", // default pragma is React.createElement
+      "pragmaFrag": "DomFrag", // default is React.Fragment
       "throwIfNamespace": false // defaults to true
     }]
   ]
@@ -109,6 +174,12 @@ Replace the function used when compiling JSX expressions.
 
 Note that the `@jsx React.DOM` pragma has been deprecated as of React v0.12
 
+### `pragmaFrag`
+
+`string`, defaults to `React.Fragment`.
+
+Replace the component used when compiling JSX fragments.
+
 ### `useBuiltIns`
 
 `boolean`, defaults to `false`.