@storybook/codemod 7.3.2 → 7.4.0-alpha.1

package/src/transforms/__testfixtures__/mdx-to-csf/plaintext.output.snapshot

@@ -1,11 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`mdx-to-csf transforms correctly using "plaintext.input.js" data 1`] = `
-"import React from 'react';
-export default {};
-export const Plaintext = () => 'Plain text';
-
-Plaintext.story = {
-  name: 'plaintext',
-};"
-`;

package/src/transforms/__testfixtures__/mdx-to-csf/story-function.input.mdx

@@ -1,10 +0,0 @@
-import { Story, Meta } from '@storybook/addon-docs';
-
-<Story name="function" height="100px">
-  {() => {
-    const btn = document.createElement('button');
-    btn.innerHTML = 'Hello Button';
-    btn.addEventListener('click', action('Click'));
-    return btn;
-  }}
-</Story>;

package/src/transforms/__testfixtures__/mdx-to-csf/story-function.output.snapshot

@@ -1,18 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`mdx-to-csf transforms correctly using "story-function.input.js" data 1`] = `
-"import React from 'react';
-export default {};
-
-export const Function = () => {
-  const btn = document.createElement('button');
-  btn.innerHTML = 'Hello Button';
-  btn.addEventListener('click', action('Click'));
-  return btn;
-};
-
-Function.story = {
-  name: 'function',
-  height: '100px',
-};"
-`;

package/src/transforms/__testfixtures__/mdx-to-csf/story-parameters.input.mdx

@@ -1,18 +0,0 @@
-import Button from './Button';
-import { storiesOf } from '@storybook/react';
-import { Meta, Story } from '@storybook/addon-docs';
-
-<Meta title='Button' />
-
-<Story
-  name='with story parameters'
-  parameters={{
-    header: false,
-    inline: true,
-  }}><Button label='The Button' /></Story>
-
-<Story
-  name='foo'
-  parameters={{
-    bar: 1,
-  }}><Button label='Foo' /></Story>

package/src/transforms/__testfixtures__/mdx-to-csf/story-parameters.output.snapshot

@@ -1,32 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`mdx-to-csf transforms correctly using "story-parameters.input.js" data 1`] = `
-"import React from 'react';
-import Button from './Button';
-import { storiesOf } from '@storybook/react';
-
-export default {
-  title: 'Button',
-};
-
-export const WithStoryParameters = () => <Button label=\\"The Button\\" />;
-
-WithStoryParameters.story = {
-  name: 'with story parameters',
-
-  parameters: {
-    header: false,
-    inline: true,
-  },
-};
-
-export const Foo = () => <Button label=\\"Foo\\" />;
-
-Foo.story = {
-  name: 'foo',
-
-  parameters: {
-    bar: 1,
-  },
-};"
-`;

package/src/transforms/__testfixtures__/mdx-to-csf/story-refs.input.mdx

@@ -1,22 +0,0 @@
-import { Story, Meta } from '@storybook/addon-docs';
-import { action } from '@storybook/addon-actions';
-import { Button } from '@storybook/react/demo';
-
-<Meta
-  title="Addons|Docs/mdx"
-  component={Button}
-  decorators={[storyFn => <div style={{ backgroundColor: 'yellow' }}>{storyFn()}</div>]}
-  parameters={{ notes: 'component notes' }}
-/>
-
-## Getting into details
-
-<Story name="solo story">
-  <Button onClick={action('clicked')}>solo</Button>
-</Story>
-
-<Source name="hello story" />
-
-## Configurable height
-
-<Story id="basics-button--all-buttons" height="400px" />

package/src/transforms/__testfixtures__/mdx-to-csf/story-refs.output.snapshot

@@ -1,34 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`mdx-to-csf transforms correctly using "story-refs.input.js" data 1`] = `
-"import React from 'react';
-import { action } from '@storybook/addon-actions';
-import { Button } from '@storybook/react/demo';
-
-export default {
-  title: 'Addons|Docs/mdx',
-  component: Button,
-
-  decorators: [
-    (storyFn) => (
-      <div
-        style={{
-          backgroundColor: 'yellow',
-        }}
-      >
-        {storyFn()}
-      </div>
-    ),
-  ],
-
-  parameters: {
-    notes: 'component notes',
-  },
-};
-
-export const SoloStory = () => <Button onClick={action('clicked')}>solo</Button>;
-
-SoloStory.story = {
-  name: 'solo story',
-};"
-`;

package/src/transforms/__testfixtures__/move-builtin-addons/default.input.js

@@ -1,2 +0,0 @@
-/* eslint-disable */
-import { storyOf, action, linkTo } from '@storybook/react';

package/src/transforms/__testfixtures__/move-builtin-addons/default.output.snapshot

@@ -1,8 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`move-builtin-addons transforms correctly using "default.input.js" data 1`] = `
-"/* eslint-disable */
-import { storyOf } from '@storybook/react';
-import { linkTo } from '@storybook/addon-links';
-import { action } from '@storybook/addon-actions';"
-`;

package/src/transforms/__testfixtures__/move-builtin-addons/with-no-change.input.js

@@ -1,3 +0,0 @@
-/* eslint-disable */
-import { action } from '@kadira/storybook-addons';
-import { storyOf } from '@storybook/react';

package/src/transforms/__testfixtures__/move-builtin-addons/with-no-change.output.snapshot

@@ -1,7 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`move-builtin-addons transforms correctly using "with-no-change.input.js" data 1`] = `
-"/* eslint-disable */
-import { action } from '@kadira/storybook-addons';
-import { storyOf } from '@storybook/react';"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/basic.input.js

@@ -1,18 +0,0 @@
-/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-import { storiesOf, configure } from '@storybook/react';
-import { action } from '@storybook/addon-actions';
-
-storiesOf('Button', module)
-  .add('story1', () => <Button label="Story 1" />)
-  .add('second story', () => <Button label="Story 2" onClick={action('click')} />)
-  .add('complex story', () => (
-    <div>
-      <Button label="The Button" onClick={action('onClick')} />
-      <br />
-    </div>
-  ))
-  .add('w/punctuation', () => <Button label="Story 2" onClick={action('click')} />)
-  .add('Start Case', () => <Button label="Story 2" onClick={action('click')} />);

package/src/transforms/__testfixtures__/storiesof-to-csf/basic.output.snapshot

@@ -1,45 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "basic.input.js" data 1`] = `
-"/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-import { configure } from '@storybook/react';
-import { action } from '@storybook/addon-actions';
-
-export default {
-  title: 'Button',
-};
-
-export const Story1 = () => <Button label=\\"Story 1\\" />;
-
-Story1.story = {
-  name: 'story1',
-};
-
-export const SecondStory = () => <Button label=\\"Story 2\\" onClick={action('click')} />;
-
-SecondStory.story = {
-  name: 'second story',
-};
-
-export const ComplexStory = () => (
-  <div>
-    <Button label=\\"The Button\\" onClick={action('onClick')} />
-    <br />
-  </div>
-);
-
-ComplexStory.story = {
-  name: 'complex story',
-};
-
-export const WPunctuation = () => <Button label=\\"Story 2\\" onClick={action('click')} />;
-
-WPunctuation.story = {
-  name: 'w/punctuation',
-};
-
-export const StartCase = () => <Button label=\\"Story 2\\" onClick={action('click')} />;"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/collision.input.js

@@ -1,11 +0,0 @@
-export const Foo = 1;
-const Bar = 1;
-const _Bar = 1;
-const Baz = 1;
-const __Baz = 1;
-
-storiesOf('foo', module)
-  .add('foo', () => <button />)
-  .add('bar', () => <button />)
-  .add('_baz', () => <button />)
-  .add('baz', () => <button />);

package/src/transforms/__testfixtures__/storiesof-to-csf/collision.output.snapshot

@@ -1,38 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "collision.input.js" data 1`] = `
-"export const Foo = 1;
-const Bar = 1;
-const _Bar = 1;
-const Baz = 1;
-const __Baz = 1;
-
-export default {
-  title: 'foo',
-  excludeStories: ['Foo'],
-};
-
-export const _Foo = () => <button />;
-
-_Foo.story = {
-  name: 'foo',
-};
-
-export const __Bar = () => <button />;
-
-__Bar.story = {
-  name: 'bar',
-};
-
-export const _Baz = () => <button />;
-
-_Baz.story = {
-  name: '_baz',
-};
-
-export const ___Baz = () => <button />;
-
-___Baz.story = {
-  name: 'baz',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/const.input.js

@@ -1 +0,0 @@
-storiesOf('bar', module).add('const', () => <button />);

package/src/transforms/__testfixtures__/storiesof-to-csf/const.output.snapshot

@@ -1,13 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "const.input.js" data 1`] = `
-"export default {
-  title: 'bar',
-};
-
-export const Const = () => <button />;
-
-Const.story = {
-  name: 'const',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/decorators.input.js

@@ -1,9 +0,0 @@
-/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-// This isn't a valid story, but it tests the `import { comp } from ...` case
-storiesOf('Some.Button', module)
-  .addDecorator(withKnobs)
-  .addDecorator((storyFn) => <div className="foo">{storyFn}</div>)
-  .add('with decorator', () => <Button label="The Button" />);

package/src/transforms/__testfixtures__/storiesof-to-csf/decorators.output.snapshot

@@ -1,18 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "decorators.input.js" data 1`] = `
-"/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-export default {
-  title: 'Some.Button',
-  decorators: [withKnobs, (storyFn) => <div className=\\"foo\\">{storyFn}</div>],
-};
-
-export const WithDecorator = () => <Button label=\\"The Button\\" />;
-
-WithDecorator.story = {
-  name: 'with decorator',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/default.input.js

@@ -1,7 +0,0 @@
-/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-import { storiesOf } from '@storybook/react';
-
-storiesOf('Button', module).add('default', () => <Button label="Story 1" />);

package/src/transforms/__testfixtures__/storiesof-to-csf/default.output.snapshot

@@ -1,17 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "default.input.js" data 1`] = `
-"/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-export default {
-  title: 'Button',
-};
-
-export const Default = () => <Button label=\\"Story 1\\" />;
-
-Default.story = {
-  name: 'default',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/digit.input.js

@@ -1 +0,0 @@
-storiesOf('bar', module).add('1', () => <button />);

package/src/transforms/__testfixtures__/storiesof-to-csf/digit.output.js

@@ -1,5 +0,0 @@
-export default {
-  title: 'bar',
-};
-
-export const _1 = () => <button />;

package/src/transforms/__testfixtures__/storiesof-to-csf/digit.output.snapshot

@@ -1,9 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "digit.input.js" data 1`] = `
-"export default {
-  title: 'bar',
-};
-
-export const _1 = () => <button />;"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/export-destructuring.input.js

@@ -1,11 +0,0 @@
-/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import ComponentRow from './ComponentRow';
-import * as SpecRowStories from './SpecRow.stories';
-
-export const { actions } = SpecRowStories;
-
-storiesOf('ComponentRow', module).add('pending', () => (
-  <ComponentRow snapshots={snapshots.pending} buildNumber={2} {...actions} />
-));

package/src/transforms/__testfixtures__/storiesof-to-csf/export-destructuring.output.snapshot

@@ -1,23 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "export-destructuring.input.js" data 1`] = `
-"/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import ComponentRow from './ComponentRow';
-import * as SpecRowStories from './SpecRow.stories';
-
-export const { actions } = SpecRowStories;
-
-export default {
-  title: 'ComponentRow',
-  excludeStories: ['actions'],
-};
-
-export const Pending = () => (
-  <ComponentRow snapshots={snapshots.pending} buildNumber={2} {...actions} />
-);
-
-Pending.story = {
-  name: 'pending',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/export-function.input.js

@@ -1,12 +0,0 @@
-/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import ComponentItem from './ComponentItem';
-
-export function someHelper() {
-  return 5;
-}
-
-storiesOf('ComponentItem', module)
-  .addDecorator((storyFn) => <div style={{ margin: '1rem' }}>{storyFn()}</div>)
-  .add('loading', () => <ComponentItem loading />);

package/src/transforms/__testfixtures__/storiesof-to-csf/export-function.output.snapshot

@@ -1,23 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "export-function.input.js" data 1`] = `
-"/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import ComponentItem from './ComponentItem';
-
-export function someHelper() {
-  return 5;
-}
-
-export default {
-  title: 'ComponentItem',
-  decorators: [(storyFn) => <div style={{ margin: '1rem' }}>{storyFn()}</div>],
-  excludeStories: ['someHelper'],
-};
-
-export const Loading = () => <ComponentItem loading />;
-
-Loading.story = {
-  name: 'loading',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/export-names.input.js

@@ -1,14 +0,0 @@
-/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import FlexCenter from './FlexCenter';
-import { specs, urls } from './LiveView.stories';
-import { ignoredRegions } from './IgnoredRegions.stories';
-
-export { specs, urls, ignoredRegions };
-
-storiesOf('FlexCenter', module).add('2:1', () => (
-  <FlexCenter width={200} height={100} style={{ background: 'papayawhip' }}>
-    <div style={{ padding: 30, background: 'hotpink' }}>2:1</div>
-  </FlexCenter>
-));

package/src/transforms/__testfixtures__/storiesof-to-csf/export-names.output.snapshot

@@ -1,26 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "export-names.input.js" data 1`] = `
-"/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import FlexCenter from './FlexCenter';
-import { specs, urls } from './LiveView.stories';
-import { ignoredRegions } from './IgnoredRegions.stories';
-
-export { specs, urls, ignoredRegions };
-
-export default {
-  title: 'FlexCenter',
-  excludeStories: ['specs', 'urls', 'ignoredRegions'],
-};
-
-export const _21 = () => (
-  <FlexCenter width={200} height={100} style={{ background: 'papayawhip' }}>
-    <div style={{ padding: 30, background: 'hotpink' }}>2:1</div>
-  </FlexCenter>
-);
-
-_21.story = {
-  name: '2:1',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/exports.input.js

@@ -1,2 +0,0 @@
-export const foo = 1;
-storiesOf('bar', module).add('baz', () => <button />);

package/src/transforms/__testfixtures__/storiesof-to-csf/exports.output.snapshot

@@ -1,16 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "exports.input.js" data 1`] = `
-"export const foo = 1;
-
-export default {
-  title: 'bar',
-  excludeStories: ['foo'],
-};
-
-export const Baz = () => <button />;
-
-Baz.story = {
-  name: 'baz',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/module.input.js

@@ -1,12 +0,0 @@
-/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-import { storiesOf } from '@storybook/react';
-
-export default {
-  title: 'foo',
-};
-
-const bar = 1;
-
-storiesOf('foo', module).add('bar', () => <Button />);

package/src/transforms/__testfixtures__/storiesof-to-csf/module.output.snapshot

@@ -1,16 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "module.input.js" data 1`] = `
-"/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-import { storiesOf } from '@storybook/react';
-
-export default {
-  title: 'foo',
-};
-
-const bar = 1;
-
-storiesOf('foo', module).add('bar', () => <Button />);"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/multi.input.js

@@ -1,14 +0,0 @@
-/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-// If we have multiple storiesOf calls, export multiple defaults. It's not valid
-// JS but will still save the user time in converting.
-
-storiesOf('Button1', module)
-  .add('story1', () => <Button label="Button1.1" />)
-  .add('story2', () => <Button label="Button1.2" />);
-
-storiesOf('Button2', module)
-  .add('story1', () => <Button label="Button2.1" />)
-  .add('story2', () => <Button label="Button2.2" />);

package/src/transforms/__testfixtures__/storiesof-to-csf/multi.output.snapshot

@@ -1,39 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "multi.input.js" data 1`] = `
-"/* eslint-disable */
-import React from 'react';
-import Button from './Button';
-
-export default {
-  title: 'Button1',
-};
-
-export const Story1 = () => <Button label=\\"Button1.1\\" />;
-
-Story1.story = {
-  name: 'story1',
-};
-
-export const Story2 = () => <Button label=\\"Button1.2\\" />;
-
-Story2.story = {
-  name: 'story2',
-};
-
-export default {
-  title: 'Button2',
-};
-
-export const _Story1 = () => <Button label=\\"Button2.1\\" />;
-
-_Story1.story = {
-  name: 'story1',
-};
-
-export const _Story2 = () => <Button label=\\"Button2.2\\" />;
-
-_Story2.story = {
-  name: 'story2',
-};"
-`;

package/src/transforms/__testfixtures__/storiesof-to-csf/parameters-as-var.input.js

@@ -1,8 +0,0 @@
-/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import { storiesOf } from '@storybook/react';
-import Canvas from './Canvas';
-
-const CHROMATIC_DELAY = { chromatic: { delay: 500 } };
-
-storiesOf('Canvas', module).add('loading', () => <Canvas loading />, CHROMATIC_DELAY);

package/src/transforms/__testfixtures__/storiesof-to-csf/parameters-as-var.output.snapshot

@@ -1,20 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`storiesof-to-csf transforms correctly using "parameters-as-var.input.js" data 1`] = `
-"/* eslint-disable import/no-extraneous-dependencies */
-import React from 'react';
-import Canvas from './Canvas';
-
-const CHROMATIC_DELAY = { chromatic: { delay: 500 } };
-
-export default {
-  title: 'Canvas',
-};
-
-export const Loading = () => <Canvas loading />;
-
-Loading.story = {
-  name: 'loading',
-  parameters: CHROMATIC_DELAY,
-};"
-`;