CLI templates: preact => module format

lib/cli/generators/PREACT/template/.storybook/config.js

@@ -1,9 +1,4 @@
-import { configure } from '@storybook/preact';
+import { load } from '@storybook/preact';
 
 // automatically import all files ending in *.stories.js
-const req = require.context('../stories', true, /\.stories\.js$/);
+load(require.context('../stories', true, /\.stories\.js$/), module);
-function loadStories() {
-  req.keys().forEach(filename => req(filename));
-}
-
-configure(loadStories, module);

lib/cli/generators/PREACT/template/stories/Button.stories.js

@@ -0,0 +1,19 @@
+/** @jsx h */
+import { h } from 'preact';
+import { action } from '@storybook/addon-actions';
+
+import Button from './Button';
+
+export default {
+  title: 'Button',
+};
+
+export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
+
+export const emoji = () => (
+  <Button onClick={action('clicked')}>
+    <span role="img" aria-label="so cool">
+      😀 😎 👍 💯
+    </span>
+  </Button>
+);

lib/cli/generators/PREACT/template/stories/Welcome.stories.js

@@ -0,0 +1,15 @@
+/** @jsx h */
+import { h } from 'preact';
+import { linkTo } from '@storybook/addon-links';
+
+import Welcome from './Welcome';
+
+export default {
+  title: 'Welcome',
+};
+
+export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
+
+toStorybook.story = {
+  name: 'to Storybook',
+};

lib/cli/generators/PREACT/template/stories/index.stories.js

@@ -1,21 +0,0 @@
-/** @jsx h */
-import { h } from 'preact';
-
-import { storiesOf } from '@storybook/preact';
-import { action } from '@storybook/addon-actions';
-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('Button', module)
-  .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)
-  .add('with some emoji', () => (
-    <Button onClick={action('clicked')}>
-      <span role="img" aria-label="so cool">
-        😀 😎 👍 💯
-      </span>
-    </Button>
-  ));