fix(tools): install storybook@alpha, refactor all stories [#40]

.storybook/.babelrc

@@ -1,11 +1,12 @@
 {
-  "presets": ["next/babel", "stage-0"],
+  "presets": ["next/babel"],
   "plugins": [
     [
       "module-resolver",
       {
         "root": ["./"]
       }
     ],
+    "@babel/plugin-proposal-export-default-from"
   ]
 }

.storybook/config.js

@@ -1,11 +1,37 @@
-import { configure, setAddon } from '@storybook/react';
-import infoAddon from '@storybook/addon-info';
+import { configure, addDecorator } from '@storybook/react';
+import { setDefaults } from '@storybook/addon-info';
+import { withKnobs } from '@storybook/addon-knobs';
 
-const req = require.context('../components', true, /\.stories\.js$/);
+import StoriesDecorator from 'stories/utils/StoriesDecorator';
+
+const req = require.context('../stories', true, /.js$/);
 
 function loadStories() {
   req.keys().forEach(req);
 }
 
-setAddon(infoAddon);
+addDecorator(withKnobs);
+addDecorator(StoriesDecorator);
+setDefaults({
+  inline: true,
+  styles: {
+    header: {
+      h1: {
+        margin: 0,
+        padding: 0,
+        fontSize: '25px',
+        color: '#1a9582',
+      },
+      h2: {
+        margin: 0,
+        padding: 0,
+        fontSize: '16px',
+      },
+      body: {
+        padding: 0,
+        margin: 0,
+      },
+    },
+  },
+});
 configure(loadStories, module);

.storybook/webpack.config.js

@@ -0,0 +1,6 @@
+const { definePlugin } = require('../webpack-plugins');
+
+module.exports = function(storybookBaseConfig, env, defaultConfig) {
+  defaultConfig.plugins.push(definePlugin);
+  return defaultConfig;
+};

.travis.yml

@@ -4,6 +4,7 @@ node_js:
 script:
   - npm run lint
   - npm run build
+  - npm run storybook:deploy
 after_success:
   - npm run travis-deploy-once "npm run semantic-release"
 cache:

next.config.js

@@ -2,27 +2,17 @@
 const withBundleAnalyzer = require('@zeit/next-bundle-analyzer');
 const webpack = require('webpack');
 
-const packageJson = require('./package.json');
+const { definePlugin } = require('./webpack-plugins');
 const { LOCALES } = require('./constants');
 
 const langs = Object.keys(LOCALES).join('|');
 
-const ENV = process.env.WIR_ENV || process.env.NODE_ENV || 'not-set';
-
 module.exports = withBundleAnalyzer({
   webpack(config) {
     config.plugins.push(
       ...[
         new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, new RegExp(langs)),
-        new webpack.DefinePlugin({
-          __ENV__: ENV,
-          __VERSION__: JSON.stringify(packageJson.version),
-          __PROD__: ENV === 'production',
-          __STAGING__: ENV === 'staging',
-          __DEV__: ENV === 'development',
-          __TESTING__: ENV === 'testing',
-          __DEBUG_STYLES__: process.env.DEBUG_STYLES === 'true',
-        }),
+        definePlugin,
       ]
     );
     return config;