diff --git a/packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.ts b/packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.tsx
similarity index 98%
rename from packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.ts
rename to packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.tsx
index 57ba0efd677ce8..0c25c413396ea1 100644
--- a/packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.ts
+++ b/packages/fluentui/react-northstar-emotion-renderer/src/createEmotionRenderer.tsx
@@ -48,7 +48,7 @@ export function createEmotionRenderer(target?: Document): Renderer {
     // return () => sheet.flush();
     // });
 
-    return React.createElement(React.Fragment, null, props.children);
+    return <>{props.children}</>;
   };
 
   const renderRule: RendererRenderRule = (styles, param) => {