Merge pull request #12033 from storybookjs/fix/argstable-subcomponent…

…s-warning ArgsTable: Error when subcomponents is an array
storybookjs · Aug 14, 2020 · 2786fb3 · 2786fb3
2 parents 210bd62 + 4b5f29b
commit 2786fb3
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/addons/docs/src/blocks/ArgsTable.tsx b/addons/docs/src/blocks/ArgsTable.tsx
@@ -193,6 +193,11 @@ export const StoryTable: FC<
     }
 
     if (subcomponents) {
+      if (Array.isArray(subcomponents)) {
+        throw new Error(
+          `Unexpected subcomponents array. Expected an object whose keys are tab labels and whose values are components.`
+        );
+      }
       tabs = addComponentTabs(tabs, subcomponents, context, include, exclude);
     }
     return <TabbedArgsTable tabs={tabs} />;

diff --git a/examples/official-storybook/stories/addon-docs/array-subcomponents.stories.js b/examples/official-storybook/stories/addon-docs/array-subcomponents.stories.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import Button from '../../components/TsButton';
+
+export default {
+  title: 'Addons/Docs/Subcomponents array',
+  component: Button,
+  subcomponents: [Button],
+};
+
+export const Basic = () => <Button>Bad subcomponents</Button>;