Addon-docs: Component parameter codemod (#7155)

Addon-docs: Component parameter codemod
storybookjs · Jun 22, 2019 · 4265565 · 4265565 · vercel · Jun 22, 2019
2 parents d579617 + 20522b4
commit 4265565
Show file tree

Hide file tree

Showing 35 changed files with 385 additions and 52 deletions.
diff --git a/addons/storyshots/storyshots-core/stories/required_with_context/Button.stories.js b/addons/storyshots/storyshots-core/stories/required_with_context/Button.stories.js
@@ -5,6 +5,9 @@ import { action } from '@storybook/addon-actions';
 import { Button } from '@storybook/react/demo';
 
 storiesOf('Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
   .add('with some emoji', () => (
     <Button onClick={action('clicked')}>

diff --git a/addons/storyshots/storyshots-core/stories/required_with_context/Welcome.stories.js b/addons/storyshots/storyshots-core/stories/required_with_context/Welcome.stories.js
@@ -4,4 +4,8 @@ import { storiesOf } from '@storybook/react';
 import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '@storybook/react/demo';
 
-storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
diff --git a/docs/src/new-components/basics/tooltip/Tooltip.stories.js b/docs/src/new-components/basics/tooltip/Tooltip.stories.js
@@ -16,6 +16,9 @@ const Content = styled.div`
 `;
 
 storiesOf('basics/tooltip/Tooltip', module)
+  .addParameters({
+    component: Tooltip,
+  })
   .add('basic, default', () => (
     <Tooltip hasChrome {...mockPopperProps}>
       <Content>Text</Content>

diff --git a/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js b/docs/src/new-components/basics/tooltip/TooltipLinkList.stories.js
@@ -13,6 +13,9 @@ export const links = [
 ];
 
 storiesOf('basics/tooltip/TooltipLinkList', module)
+  .addParameters({
+    component: TooltipLinkList,
+  })
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
       <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>

diff --git a/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js b/docs/src/new-components/basics/tooltip/TooltipMessage.stories.js
@@ -5,6 +5,9 @@ import WithTooltip from './WithTooltip';
 import TooltipMessage from './TooltipMessage';
 
 storiesOf('basics/tooltip/TooltipMessage', module)
+  .addParameters({
+    component: TooltipMessage,
+  })
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
       <WithTooltip placement="top" trigger="click" startOpen tooltip={storyFn()}>

diff --git a/docs/src/new-components/basics/tooltip/TooltipNote.stories.js b/docs/src/new-components/basics/tooltip/TooltipNote.stories.js
@@ -5,6 +5,9 @@ import WithTooltip from './WithTooltip';
 import TooltipNote from './TooltipNote';
 
 storiesOf('basics/tooltip/TooltipNote', module)
+  .addParameters({
+    component: TooltipNote,
+  })
   .addDecorator(storyFn => (
     <div style={{ height: '300px' }}>
       <WithTooltip hasChrome={false} placement="top" trigger="click" startOpen tooltip={storyFn()}>

diff --git a/docs/src/new-components/basics/tooltip/WithTooltip.stories.js b/docs/src/new-components/basics/tooltip/WithTooltip.stories.js
@@ -46,6 +46,9 @@ Tooltip.defaultProps = {
 };
 
 storiesOf('basics/tooltip/WithTooltip', module)
+  .addParameters({
+    component: WithTooltip,
+  })
   .addDecorator(storyFn => (
     <ViewPort>
       <BackgroundBox>

diff --git a/examples-native/crna-kitchen-sink/storybook/stories/index.js b/examples-native/crna-kitchen-sink/storybook/stories/index.js
@@ -20,15 +20,19 @@ addParameters({
   ],
 });
 
-storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />, {
+storiesOf('Welcome', module).addParameters({
+  component: Welcome
+}).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />, {
   notes: `
 # Markdown!\n
 * List Item
 * [List Item with Link](https://storybook.js.org)
 `,
 });
 
-storiesOf('Button', module)
+storiesOf('Button', module).addParameters({
+  component: Button
+})
   .addParameters({
     backgrounds: [
       { name: 'dark', value: '#222222' },

diff --git a/examples/cra-kitchen-sink/src/stories/index.stories.js b/examples/cra-kitchen-sink/src/stories/index.stories.js
@@ -24,6 +24,9 @@ const InfoButton = () => (
 );
 
 storiesOf('Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => <Button onClick={action('clicked', { depth: 1 })}>Hello Button</Button>, {
     options: { selectedPanel: 'storybook/actions/panel' },
   })

diff --git a/examples/cra-kitchen-sink/src/stories/welcome.js b/examples/cra-kitchen-sink/src/stories/welcome.js
@@ -3,4 +3,8 @@ import { Welcome } from '@storybook/react/demo';
 import { storiesOf } from '@storybook/react';
 import { linkTo } from '@storybook/addon-links';
 
-storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
diff --git a/examples/cra-react15/src/stories/index.js b/examples/cra-react15/src/stories/index.js
@@ -6,9 +6,16 @@ import { linkTo } from '@storybook/addon-links';
 
 import { Button, Welcome } from '@storybook/react/demo';
 
-storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
 
 storiesOf('Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
   .add('with some emoji', () => (
     <Button onClick={action('clicked')}>

diff --git a/examples/ember-cli/stories/addon-centered.stories.js b/examples/ember-cli/stories/addon-centered.stories.js
@@ -3,6 +3,9 @@ import { storiesOf } from '@storybook/ember';
 import Centered from '@storybook/addon-centered/ember';
 
 storiesOf('Addon|Centered', module)
+  .addParameters({
+    component: Centered,
+  })
   .addDecorator(Centered)
   .add('button', () => ({
     template: hbs`<button>A Button</button>`,

diff --git a/examples/marko-cli/src/stories/addon-actions.stories.js b/examples/marko-cli/src/stories/addon-actions.stories.js
@@ -2,6 +2,8 @@ import { storiesOf } from '@storybook/marko';
 import { action } from '@storybook/addon-actions';
 import Button from '../components/action-button/index.marko';
 
-storiesOf('Addons|Actions/Button', module).add('Simple', () =>
-  Button.renderSync({ click: action('action logged!') })
-);
+storiesOf('Addons|Actions/Button', module)
+  .addParameters({
+    component: Button,
+  })
+  .add('Simple', () => Button.renderSync({ click: action('action logged!') }));
diff --git a/examples/marko-cli/src/stories/addon-knobs.stories.js b/examples/marko-cli/src/stories/addon-knobs.stories.js
@@ -3,6 +3,9 @@ import { withKnobs, text, number } from '@storybook/addon-knobs';
 import Hello from '../components/hello/index.marko';
 
 storiesOf('Addons|Knobs/Hello', module)
+  .addParameters({
+    component: Hello,
+  })
   .addParameters({ options: { panelPosition: 'right' } })
   .addDecorator(withKnobs)
   .add('Simple', () => {

diff --git a/examples/marko-cli/src/stories/index.stories.js b/examples/marko-cli/src/stories/index.stories.js
@@ -4,12 +4,27 @@ import ClickCount from '../components/click-count/index.marko';
 import StopWatch from '../components/stop-watch/index.marko';
 import Welcome from '../components/welcome/index.marko';
 
-storiesOf('Main|Welcome', module).add('welcome', () => Welcome.renderSync({}));
+storiesOf('Main|Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('welcome', () => Welcome.renderSync({}));
 
 storiesOf('Main|Hello', module)
+  .addParameters({
+    component: Hello,
+  })
   .add('Simple', () => Hello.renderSync({ name: 'abc', age: 20 }))
   .add('with ERROR!', () => 'NOT A MARKO RENDER_RESULT');
 
-storiesOf('Main|ClickCount', module).add('Simple', () => ClickCount.renderSync({}));
+storiesOf('Main|ClickCount', module)
+  .addParameters({
+    component: ClickCount,
+  })
+  .add('Simple', () => ClickCount.renderSync({}));
 
-storiesOf('Main|StopWatch', module).add('Simple', () => StopWatch.renderSync({}));
+storiesOf('Main|StopWatch', module)
+  .addParameters({
+    component: StopWatch,
+  })
+  .add('Simple', () => StopWatch.renderSync({}));
diff --git a/examples/mithril-kitchen-sink/src/stories/addon-centered.stories.js b/examples/mithril-kitchen-sink/src/stories/addon-centered.stories.js
@@ -7,6 +7,9 @@ import Centered from '@storybook/addon-centered/mithril';
 import Button from '../Button';
 
 storiesOf('Addons|Centered', module)
+  .addParameters({
+    component: Centered,
+  })
   .addDecorator(Centered)
   .add('button', () => ({
     view: () => <Button>A button</Button>,

diff --git a/examples/mithril-kitchen-sink/src/stories/index.stories.js b/examples/mithril-kitchen-sink/src/stories/index.stories.js
@@ -7,11 +7,18 @@ import { linkTo } from '@storybook/addon-links';
 import Button from '../Button';
 import Welcome from '../Welcome';
 
-storiesOf('Welcome', module).add('to Storybook', () => ({
-  view: () => m(Welcome, { showApp: linkTo('Button') }),
-}));
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => ({
+    view: () => m(Welcome, { showApp: linkTo('Button') }),
+  }));
 
 storiesOf('Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => ({
     view: () => m(Button, { onclick: action('clicked') }, 'Hello Button'),
   }))

diff --git a/examples/official-storybook/stories/addon-a11y.stories.js b/examples/official-storybook/stories/addon-a11y.stories.js
@@ -12,6 +12,9 @@ const image = 'http://placehold.it/350x150';
 const href = 'javascript:void 0';
 
 storiesOf('Addons|A11y/BaseButton', module)
+  .addParameters({
+    component: BaseButton,
+  })
   .addParameters({ options: { selectedPanel: 'storybook/a11y/panel' } })
   .add('Default', () => <BaseButton label="" />)
   .add('Label', () => <BaseButton label={text} />)
@@ -27,6 +30,9 @@ storiesOf('Addons|A11y/BaseButton', module)
   ));
 
 storiesOf('Addons|A11y/Button', module)
+  .addParameters({
+    component: Button,
+  })
   .addParameters({ options: { selectedPanel: 'storybook/a11y/panel' } })
   .add('Default', () => <Button />)
   .add('Content', () => <Button content={text} />)
@@ -35,6 +41,9 @@ storiesOf('Addons|A11y/Button', module)
   .add('Invalid contrast', () => <Button contrast="wrong" content={text} />);
 
 storiesOf('Addons|A11y/Form', module)
+  .addParameters({
+    component: Form,
+  })
   .addParameters({ options: { selectedPanel: 'storybook/a11y/panel' } })
   .add('Without Label', () => (
     <Form.Field label="">

diff --git a/examples/official-storybook/stories/addon-info.stories.js b/examples/official-storybook/stories/addon-info.stories.js
@@ -253,6 +253,9 @@ storiesOf('Addons|Info/Options.styles', module)
   });
 
 storiesOf('Addons|Info/Options.TableComponent', module)
+  .addParameters({
+    component: TableComponent,
+  })
   .addDecorator(withInfo)
   .add('Use a custom component for the table', () => <BaseButton label="Button" />, {
     info: {

diff --git a/examples/official-storybook/stories/addon-knobs.stories.js b/examples/official-storybook/stories/addon-knobs.stories.js
@@ -42,6 +42,9 @@ let injectedItems = [];
 let injectedIsLoading = false;
 
 storiesOf('Addons|Knobs.withKnobs', module)
+  .addParameters({
+    component: withKnobs,
+  })
   .addDecorator(withKnobs)
   .add('tweaks static values', () => {
     const name = text('Name', 'Storyteller');

diff --git a/examples/official-storybook/stories/other-demo.stories.js b/examples/official-storybook/stories/other-demo.stories.js
@@ -6,11 +6,16 @@ import { linkTo } from '@storybook/addon-links';
 
 import { Button, Welcome } from '@storybook/react/demo';
 
-storiesOf('Other|Demo/Welcome', module).add('to Storybook', () => (
-  <Welcome showApp={linkTo('Button')} />
-));
+storiesOf('Other|Demo/Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
 
 storiesOf('Other|Demo/Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
   .add('with some emoji', () => (
     <Button onClick={action('clicked')}>

diff --git a/examples/preact-kitchen-sink/src/stories/addon-centered.stories.js b/examples/preact-kitchen-sink/src/stories/addon-centered.stories.js
@@ -7,5 +7,8 @@ import Centered from '@storybook/addon-centered/preact';
 import Button from '../Button';
 
 storiesOf('Addons|Centered', module)
+  .addParameters({
+    component: Centered,
+  })
   .addDecorator(Centered)
   .add('Button', () => <Button>A button</Button>);
diff --git a/examples/preact-kitchen-sink/src/stories/index.stories.js b/examples/preact-kitchen-sink/src/stories/index.stories.js
@@ -9,9 +9,16 @@ import { linkTo } from '@storybook/addon-links';
 import Welcome from '../Welcome';
 import Button from '../Button';
 
-storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
 
 storiesOf('Button', module)
+  .addParameters({
+    component: Button,
+  })
   .add('with text', () => <Button onclick={action('clicked')}>Hello Button</Button>)
   .add('with some emoji', () => (
     <Button onclick={action('clicked')}>

diff --git a/examples/svelte-kitchen-sink/src/stories/addon-centered.stories.js b/examples/svelte-kitchen-sink/src/stories/addon-centered.stories.js
@@ -5,6 +5,9 @@ import { action } from '@storybook/addon-actions';
 import Button from '../components/Button.svelte';
 
 storiesOf('Addon|Centered', module)
+  .addParameters({
+    component: Centered,
+  })
   .addDecorator(Centered)
   .add('rounded', () => ({
     Component: Button,

diff --git a/examples/vue-kitchen-sink/src/stories/addon-centered.stories.js b/examples/vue-kitchen-sink/src/stories/addon-centered.stories.js
@@ -4,6 +4,9 @@ import Centered from '@storybook/addon-centered/vue';
 import MyButton from './Button.vue';
 
 storiesOf('Addon|Centered', module)
+  .addParameters({
+    component: Centered,
+  })
   .addDecorator(Centered)
   .add('rounded', () => ({
     components: { MyButton },

diff --git a/examples/vue-kitchen-sink/src/stories/index.js b/examples/vue-kitchen-sink/src/stories/index.js
@@ -4,13 +4,21 @@ import { linkTo } from '@storybook/addon-links';
 import Welcome from './Welcome.vue';
 import App from '../App.vue';
 
-storiesOf('Welcome', module).add('Welcome', () => ({
-  render: h => h(Welcome, { props: { goToButton: linkTo('Button') } }),
-}));
+storiesOf('Welcome', module)
+  .addParameters({
+    component: Welcome,
+  })
+  .add('Welcome', () => ({
+    render: h => h(Welcome, { props: { goToButton: linkTo('Button') } }),
+  }));
 
-storiesOf('App', module).add('App', () => ({
-  render: h => h(App),
-}));
+storiesOf('App', module)
+  .addParameters({
+    component: App,
+  })
+  .add('App', () => ({
+    render: h => h(App),
+  }));
 
 storiesOf('Button', module)
   // Works if Vue.component is called in the config.js in .storybook