🔥 use React.Fragment instead of div

Author: rahulcs

lib/generators/templates/component.es6.jsx

@@ -1,16 +1,12 @@
 <%= file_header %>class <%= component_name %> extends React.Component {
   render () {
-<% if attributes.size > 0 -%>
     return (
-      <div>
+      <React.Fragment>
 <% attributes.each do |attribute| -%>
-        <div><%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}</div>
+        <%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}
 <% end -%>
-      </div>
+      </React.Fragment>
     );
-<% else -%>
-    return <div />;
-<% end -%>
   }
 }
 

lib/generators/templates/component.js.jsx

@@ -8,17 +8,13 @@
 <% end -%>
 
   render: function() {
-<% if attributes.size > 0 -%>
     return (
-      <div>
+      <React.Fragment>
 <% attributes.each do |attribute| -%>
-        <div><%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}</div>
+        <%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}
 <% end -%>
-      </div>
+      </React.Fragment>
     );
-<% else -%>
-    return <div />;
-<% end -%>
   }
 });
 <%= file_footer %>

lib/generators/templates/component.js.jsx.coffee

@@ -7,13 +7,9 @@
 
 <% end -%>
   render: ->
-<% if attributes.size > 0 -%>
-    `<div>
+    `<React.Fragment>
 <% attributes.each do |attribute| -%>
-      <div><%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}</div>
-<% end -%>
-    </div>`
-<% else -%>
-    `<div />`
+      <%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}
 <% end -%>
+    </React.Fragment>`
 <%= file_footer %>