Merge remote-tracking branch 'origin/add-events-addon' into add-events-addon

.eslintrc.js

@@ -19,7 +19,7 @@ module.exports = {
       printWidth: 100,
       tabWidth: 2,
       bracketSpacing: true,
-      trailingComma: 'all',
+      trailingComma: 'es5',
       singleQuote: true,
     }],
     quotes: ['warn', 'single'],

addons/comments/src/manager/containers/CommentsPanel/dataStore.js

@@ -53,7 +53,7 @@ export default class DataStore {
       () => {
         this._loadUsers().then(() => this._loadComments());
       },
-      1000 * 60, // Reload for every minute
+      1000 * 60 // Reload for every minute
     );
   }
 

addons/info/example/story.js

@@ -6,7 +6,7 @@ import { action } from '@storybook/addon-actions';
 import backgrounds from 'react-storybook-addon-backgrounds';
 
 storiesOf(
-  'Button',
+  'Button'
 ).addWithInfo(
   'simple usage',
   'This is the basic usage with the button with providing a label to show the text.',
@@ -18,7 +18,7 @@ storiesOf(
         Click the "?" mark at top-right to view the info.
       </p>
     </div>
-  ),
+  )
 );
 
 storiesOf('Button').addWithInfo(
@@ -27,7 +27,7 @@ storiesOf('Button').addWithInfo(
       This is the basic usage with the button with providing a label to show the text.
     `,
   () => <Button label="The Button" onClick={action('onClick')} />,
-  { inline: true },
+  { inline: true }
 );
 
 storiesOf('Button').addWithInfo(
@@ -36,7 +36,7 @@ storiesOf('Button').addWithInfo(
       This is the basic usage with the button with providing a label to show the text.
     `,
   () => <Button label="The Button" onClick={action('onClick')} />,
-  { source: false, inline: true },
+  { source: false, inline: true }
 );
 
 storiesOf('Button').addWithInfo(
@@ -45,7 +45,7 @@ storiesOf('Button').addWithInfo(
       This is the basic usage with the button with providing a label to show the text.
     `,
   () => <Button label="The Button" onClick={action('onClick')} />,
-  { header: false, inline: true },
+  { header: false, inline: true }
 );
 
 storiesOf('Button').addWithInfo(
@@ -54,7 +54,7 @@ storiesOf('Button').addWithInfo(
       This is the basic usage with the button with providing a label to show the text.
     `,
   () => <Button label="The Button" onClick={action('onClick')} />,
-  { propTables: false, inline: true },
+  { propTables: false, inline: true }
 );
 
 storiesOf('Button').addWithInfo(
@@ -81,7 +81,7 @@ storiesOf('Button').addWithInfo(
       <br />
     </div>
   ),
-  { inline: true, propTables: [Button] },
+  { inline: true, propTables: [Button] }
 );
 
 storiesOf('Button').addWithInfo(
@@ -111,7 +111,7 @@ storiesOf('Button').addWithInfo(
         Click the "?" mark at top-right to view the info.
       </p>
     </div>
-  ),
+  )
 );
 
 storiesOf('Button').addWithInfo(
@@ -134,7 +134,7 @@ storiesOf('Button').addWithInfo(
     </p>
   </div>,
   () => <Button label="The Button" onClick={action('onClick')} />,
-  { inline: true },
+  { inline: true }
 );
 
 storiesOf('Button')
@@ -155,5 +155,5 @@ storiesOf('Button')
         };
         return stylesheet;
       },
-    },
+    }
   );

addons/info/src/components/Props.js

@@ -21,7 +21,7 @@ export default class Props extends React.Component {
       name =>
         name[0] !== '_' &&
         name !== 'children' &&
-        (!defaultProps || props[name] != defaultProps[name]),
+        (!defaultProps || props[name] != defaultProps[name])
     );
 
     const breakIntoNewLines = names.length > 3;
@@ -45,7 +45,7 @@ export default class Props extends React.Component {
             </span>}
 
           {i === names.length - 1 && (breakIntoNewLines ? <br /> : endingSpace)}
-        </span>,
+        </span>
       );
     });
 

addons/knobs/src/components/__tests__/Array.js

@@ -9,7 +9,7 @@ describe('Array', () => {
       <Array
         onChange={onChange}
         knob={{ name: 'passions', value: ['Fishing', 'Skiing'], separator: ',' }}
-      />,
+      />
     );
 
     wrapper.simulate('change', { target: { value: 'Fhishing,Skiing,Dancing' } });

addons/knobs/src/typescript.test.js

@@ -5,7 +5,7 @@ describe('TypeScript definitions', () => {
     tt.compileDirectory(
       `${__dirname}/../example/typescript`,
       fileName => fileName.match(/\.ts$/),
-      () => done(),
+      () => done()
     );
   });
 });

app/react-native/src/bin/storybook-start.js

@@ -52,6 +52,6 @@ if (!program.skipPackager) {
     ]
       .filter(x => x)
       .join(' '),
-    { async: true },
+    { async: true }
   );
 }

app/react-native/src/index.js

@@ -16,10 +16,10 @@ import { linkTo as deprecatedLinkTo } from '@storybook/addon-links';
 
 export const action = deprecate(
   deprecatedAction,
-  '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions',
+  '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions'
 );
 
 export const linkTo = deprecate(
   deprecatedLinkTo,
-  '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links',
+  '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links'
 );

app/react-native/src/preview/story_kind.js

@@ -23,7 +23,7 @@ export default class StoryKindApi {
         const _fn = () => decorated(context);
         return decorator(_fn, context);
       },
-      fn,
+      fn
     );
   }
 }

app/react-native/src/server/addons.js

@@ -4,5 +4,5 @@ import '@storybook/addon-links/register';
 
 deprecate(
   () => {},
-  '@storybook/react-native/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/',
+  '@storybook/react-native/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/'
 )();

app/react-native/src/server/middleware.js

@@ -57,7 +57,7 @@ export default function({ projectDir, configDir, ...options }) {
       getIndexHtml(publicPath, {
         manualId: options.manualId,
         secured: options.secured,
-      }),
+      })
     );
   });
 

app/react/addons.js

@@ -4,5 +4,5 @@ import '@storybook/addon-links/register';
 
 deprecate(
   () => {},
-  '@storybook/react/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/',
+  '@storybook/react/addons is deprecated. See https://storybooks.js.org/docs/react-storybook/addons/using-addons/'
 )();

app/react/src/client/index.js

@@ -13,10 +13,10 @@ import { linkTo as deprecatedLinkTo } from '@storybook/addon-links';
 
 export const action = deprecate(
   deprecatedAction,
-  '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions',
+  '@storybook/react action is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-actions'
 );
 
 export const linkTo = deprecate(
   deprecatedLinkTo,
-  '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links',
+  '@storybook/react linkTo is deprecated. See: https://github.com/storybooks/storybook/tree/master/packages/addon-links'
 );

app/react/src/client/preview/client_api.js

@@ -64,7 +64,7 @@ export default class ClientApi {
 
       const fn = decorators.reduce(
         (decorated, decorator) => context => decorator(() => decorated(context), context),
-        getStory,
+        getStory
       );
 
       // Add the fully decorated getStory function.

app/react/src/server/build.js

@@ -35,7 +35,7 @@ if (program.enableDb || program.dbPath) {
       'Error: the experimental local database addon is no longer bundled with',
       'react-storybook. Please remove these flags (-d,--db-path,--enable-db)',
       'from the command or npm script and try again.',
-    ].join(' '),
+    ].join(' ')
   );
   process.exit(1);
 }

app/react/src/server/index.js

@@ -23,12 +23,12 @@ program
   .option('-c, --config-dir [dir-name]', 'Directory where to load Storybook configurations from')
   .option(
     '--https',
-    'Serve Storybook over HTTPS. Note: You must provide your own certificate information.',
+    'Serve Storybook over HTTPS. Note: You must provide your own certificate information.'
   )
   .option(
     '--ssl-ca <ca>',
     'Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)',
-    parseList,
+    parseList
   )
   .option('--ssl-cert <cert>', 'Provide an SSL certificate. (Required with --https)')
   .option('--ssl-key <key>', 'Provide an SSL key. (Required with --https)')
@@ -44,7 +44,7 @@ if (program.enableDb || program.dbPath) {
       'Error: the experimental local database addon is no longer bundled with',
       'react-storybook. Please remove these flags (-d,--db-path,--enable-db)',
       'from the command or npm script and try again.',
-    ].join(' '),
+    ].join(' ')
   );
   process.exit(1);
 }

lib/cli/generators/METEOR/index.js

@@ -26,7 +26,7 @@ module.exports = Promise.all([
       presetReactVersion,
       presetStage1Version,
       rootSlashImportVersion,
-    ],
+    ]
   ) => {
     mergeDirs(path.resolve(__dirname, 'template/'), '.', 'overwrite');
 
@@ -75,5 +75,5 @@ module.exports = Promise.all([
     }
 
     helpers.writePackageJson(packageJson);
-  },
+  }
 );

lib/codemod/src/transforms/__tests__/update-organisation-name.test.js

@@ -4,5 +4,5 @@ defineTest(
   __dirname,
   'update-organisation-name',
   null,
-  'update-organisation-name/update-organisation-name',
+  'update-organisation-name/update-organisation-name'
 );

lib/ui/README.md

@@ -10,6 +10,8 @@ Storybook UI the core UI of [storybook](https://storybooks.js.org).
 It's a React based UI which you can initialize with a simple function.
 You can configure it by providing a provider API.
 
+## Table of Contents
+
 ![Storybook UI Demo](./docs/storybook-ui-demo.png)
 
 ## Usage

lib/ui/src/modules/api/actions/api.js

@@ -73,7 +73,7 @@ export default {
 
   jumpToStory({ clientStore }, direction) {
     clientStore.update(state =>
-      jumpToStory(state.stories, state.selectedKind, state.selectedStory, direction),
+      jumpToStory(state.stories, state.selectedKind, state.selectedStory, direction)
     );
   },
 

lib/ui/src/modules/ui/components/down_panel/index.test.js

@@ -20,7 +20,7 @@ describe('manager.ui.components.down_panel.index', () => {
     const onPanelSelect = () => 'onPanelSelect';
 
     const wrapper = shallow(
-      <DownPanel panels={panels} onPanelSelect={onPanelSelect} selectedPanel={'test2'} />,
+      <DownPanel panels={panels} onPanelSelect={onPanelSelect} selectedPanel={'test2'} />
     );
 
     expect(wrapper.find('#test1').parent()).toHaveStyle('display', 'none');
@@ -38,7 +38,7 @@ describe('manager.ui.components.down_panel.index', () => {
     const onPanelSelect = jest.fn();
     const preventDefault = jest.fn();
     const wrapper = shallow(
-      <DownPanel panels={panels} onPanelSelect={onPanelSelect} selectedPanel={'test1'} />,
+      <DownPanel panels={panels} onPanelSelect={onPanelSelect} selectedPanel={'test1'} />
     );
     wrapper.find('a').simulate('click', { preventDefault });
 

lib/ui/src/modules/ui/components/layout/index.test.js

@@ -13,7 +13,7 @@ describe('manager.ui.components.layout.index', () => {
           leftPanel={() => 'LeftPanel'}
           downPanel={() => 'DownPanel'}
           preview={() => 'Preview'}
-        />,
+        />
       );
 
       const markup = wrap.html();
@@ -31,7 +31,7 @@ describe('manager.ui.components.layout.index', () => {
           leftPanel={() => 'LeftPanel'}
           downPanel={() => 'DownPanel'}
           preview={() => 'Preview'}
-        />,
+        />
       );
 
       const markup = wrap.html();
@@ -51,7 +51,7 @@ describe('manager.ui.components.layout.index', () => {
           leftPanel={() => 'LeftPanel'}
           downPanel={() => 'DownPanel'}
           preview={() => 'Preview'}
-        />,
+        />
       );
 
       const markup = wrap.html();
@@ -71,7 +71,7 @@ describe('manager.ui.components.layout.index', () => {
           leftPanel={() => 'LeftPanel'}
           downPanel={() => 'DownPanel'}
           preview={() => 'Preview'}
-        />,
+        />
       );
 
       const markup = wrap.html();

lib/ui/src/modules/ui/components/left_panel/index.test.js

@@ -10,7 +10,7 @@ describe('manager.ui.components.left_panel.index', () => {
     const openShortcutsHelp = jest.fn();
     const storyFilter = 'xxxxx';
     const wrap = shallow(
-      <LeftPanel openShortcutsHelp={openShortcutsHelp} storyFilter={storyFilter} />,
+      <LeftPanel openShortcutsHelp={openShortcutsHelp} storyFilter={storyFilter} />
     );
 
     const header = wrap.find(Header).first();
@@ -27,7 +27,7 @@ describe('manager.ui.components.left_panel.index', () => {
     const selectedStory = 'bb';
     const stories = [{ kind: 'kk', stories: ['bb'] }];
     const wrap = shallow(
-      <LeftPanel stories={stories} selectedKind={selectedKind} selectedStory={selectedStory} />,
+      <LeftPanel stories={stories} selectedKind={selectedKind} selectedStory={selectedStory} />
     );
 
     const header = wrap.find(Stories).first();

lib/ui/src/modules/ui/components/left_panel/stories.test.js

@@ -29,12 +29,7 @@ describe('manager.ui.components.left_panel.stories', () => {
       const data = [{ kind: 'a', stories: ['a1', 'a2'] }, { kind: 'b', stories: ['b1', 'b2'] }];
       const onSelectStory = jest.fn();
       const wrap = shallow(
-        <Stories
-          stories={data}
-          selectedKind="b"
-          selectedStory="b2"
-          onSelectStory={onSelectStory}
-        />,
+        <Stories stories={data} selectedKind="b" selectedStory="b2" onSelectStory={onSelectStory} />
       );
 
       const kind = wrap.find('a').filterWhere(el => el.text() === 'a').last();
@@ -47,12 +42,7 @@ describe('manager.ui.components.left_panel.stories', () => {
       const data = [{ kind: 'a', stories: ['a1', 'a2'] }, { kind: 'b', stories: ['b1', 'b2'] }];
       const onSelectStory = jest.fn();
       const wrap = shallow(
-        <Stories
-          stories={data}
-          selectedKind="b"
-          selectedStory="b2"
-          onSelectStory={onSelectStory}
-        />,
+        <Stories stories={data} selectedKind="b" selectedStory="b2" onSelectStory={onSelectStory} />
       );
 
       const kind = wrap.find('a').filterWhere(el => el.text() === 'b1').last();