allowing component directories to contain there own stories for storybook. A component directory should now contain index.js, story.js and readme.md

ui/.storybook/config.js

@@ -1,6 +1,9 @@
 const { configure } = require('@kadira/storybook');
 
+const req = require.context('../src/components', true, /story.js$/)
+
 function loadStories() {
+  req.keys().forEach((filename) => req(filename));
   require('../stories');
 }
 

ui/src/components/button/story.js

@@ -0,0 +1,27 @@
+const React = require('react');
+const {
+  storiesOf
+} = require('@kadira/storybook');
+
+const Button = require('./');
+
+storiesOf('Button', module)
+  .add('With text', () => (
+    <Button>
+      Inspire the lazy
+    </Button>
+  )).add('Secondary', () => (
+    <Button secondary>
+      Inspire the brave
+    </Button>
+  )).add('Disabled', () => (
+    <Button disabled>
+      Inspire the liars
+    </Button>
+  )).add('Anchor', () => (
+    <div>
+      <Button href='#'>
+        Inspire the anchor
+      </Button>
+    </div>
+  ));

ui/stories/index.js

@@ -7,7 +7,7 @@ const {
 
 const {
   Base,
-  Button,
+  // Button,
   Container,
   Checkbox,
   Row,
@@ -178,26 +178,26 @@ storiesOf('Avatar', module)
     </Base>
   ));
 
-storiesOf('Button', module)
+// storiesOf('Button', module)
-  .add('With text', () => (
+//   .add('With text', () => (
-    <Button>
+//     <Button>
-      Inspire the lazy
+//       Inspire the lazy
-    </Button>
+//     </Button>
-  )).add('Secondary', () => (
+//   )).add('Secondary', () => (
-    <Button secondary>
+//     <Button secondary>
-      Inspire the brave
+//       Inspire the brave
-    </Button>
+//     </Button>
-  )).add('Disabled', () => (
+//   )).add('Disabled', () => (
-    <Button disabled>
+//     <Button disabled>
-      Inspire the liars
+//       Inspire the liars
-    </Button>
+//     </Button>
-  )).add('Anchor', () => (
+//   )).add('Anchor', () => (
-    <div>
+//     <div>
-      <Button href='#'>
+//       <Button href='#'>
-        Inspire the anchor
+//         Inspire the anchor
-      </Button>
+//       </Button>
-    </div>
+//     </div>
-  ));
+//   ));
 
 storiesOf('Checkbox', module)
   .add('Default', () => (