feat(Template): allow template functions to return a React element

Author: VonD

src/components/Template.js

@@ -27,16 +27,22 @@ function Template(props) {
   }
 
   const otherProps = omit(props, keys(Template.propTypes));
-  const isElement = React.isValidElement(content);
+
+  if (React.isValidElement(content)) {
+    return (
+      <div
+        {...otherProps}
+        className={props.cssClass}
+      >{content}</div>
+    );
+  }
 
   return (
     <div
       {...otherProps}
       className={props.cssClass}
-      dangerouslySetInnerHTML={isElement ? null : {__html: content}}
-    >
-      {isElement ? content : null}
-    </div>
+      dangerouslySetInnerHTML={{__html: content}}
+    />
   );
 }
 

src/components/__tests__/Template-test.js

@@ -54,7 +54,7 @@ describe('Template', () => {
       const out = renderer.getRenderOutput();
 
       const content = 'it also works with functions';
-      expect(out).toEqualJSX(<div className={undefined} dangerouslySetInnerHTML={null}><p>{content}</p></div>);
+      expect(out).toEqualJSX(<div className={undefined}><p>{content}</p></div>);
     });
 
     it('can configure compilation options', () => {