Add Storybook Knobs addon

I add a completely useless usage example in PublicFigureAvatar/stories

.storybook/addons.js

@@ -0,0 +1,2 @@
+import '@kadira/storybook/addons';
+import '@kadira/storybook-addon-knobs/register';

package.json

@@ -56,6 +56,8 @@
     "url-loader": "^0.5.7"
   },
   "devDependencies": {
+    "@kadira/storybook": "^2.5.2",
+    "@kadira/storybook-addon-knobs": "^1.4.1",
     "babel-cli": "<6.3.0",
     "babel-core": "<6.3.0",
     "babel-eslint": "^6.0.0",
@@ -121,7 +123,6 @@
     "stylelint": "^6.6.0",
     "webpack": "1.12.10",
     "webpack-dev-server": "^1.14.1",
-    "webpack-postcss-tools": "^1.1.1",
-    "@kadira/storybook": "^2.5.2"
+    "webpack-postcss-tools": "^1.1.1"
   }
 }

src/components/PublicFigureAvatar/stories.js

@@ -1,12 +1,17 @@
 import React from 'react';
 // eslint-disable-next-line no-unused-vars
 import { storiesOf, action, linkTo } from '@kadira/storybook';
+import { withKnobs, text, boolean, number } from '@kadira/storybook-addon-knobs';
 import PublicFigureAvatar from './';
 
-storiesOf('PublicFigureAvatar', module)
-    .add('pony avatar', () => (
-        <PublicFigureAvatar publicFigure={{ picture: { url: 'http://tinyurl.com/jucz8b9' } }} />
-    ))
-    .add('jake avatar', () => (
+const stories = storiesOf('PublicFigureAvatar', module);
+
+stories.addDecorator(withKnobs);
+
+stories.add('pony avatar', () => (
+    <PublicFigureAvatar publicFigure={{ picture: { url: text('image url', 'http://tinyurl.com/jucz8b9') } }} />
+));
+
+stories.add('jake avatar', () => (
     <PublicFigureAvatar publicFigure={{ picture: { url: 'http://tinyurl.com/jb286jq' } }} />
 ));