Merge pull request #3882 from sanpoChew/preact-tabs-fix

Fix addons panel when using preact
storybookjs · Jul 18, 2018 · 9211dcb · 9211dcb
2 parents ea3d6d5 + 5a7a6ec
commit 9211dcb
Showing 1 changed file with 17 additions and 14 deletions.
diff --git a/lib/components/src/tabs/tabs.js b/lib/components/src/tabs/tabs.js
@@ -143,20 +143,23 @@ export const panelProps = {
 
 export const Tabs = ({ children, selected, onSelect, absolute, bordered }) => {
   const list = React.Children.toArray(children).map(
-    ({ props: { title, id, children: content } }, index) => ({
-      active: selected ? id === selected : index === 0,
-      title,
-      id,
-      render:
-        typeof content === 'function'
-          ? content
-          : // eslint-disable-next-line react/prop-types
-            ({ active }) => (
-              <VisuallyHidden active={active} role="tabpanel">
-                {content}
-              </VisuallyHidden>
-            ),
-    })
+    ({ props: { title, id, children: childrenOfChild } }, index) => {
+      const content = Array.isArray(childrenOfChild) ? childrenOfChild[0] : childrenOfChild;
+      return {
+        active: selected ? id === selected : index === 0,
+        title,
+        id,
+        render:
+          typeof content === 'function'
+            ? content
+            : // eslint-disable-next-line react/prop-types
+              ({ active }) => (
+                <VisuallyHidden active={active} role="tabpanel">
+                  {content}
+                </VisuallyHidden>
+              ),
+      };
+    }
   );
 
   return list.length ? (