Merge pull request #14 from kadirahq/create-knob-to-knob

Create knob to knob
storybookjs · Sep 6, 2016 · ab156d9 · ab156d9
2 parents 07fbdca + bc39f58
commit ab156d9
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 19 deletions.
diff --git a/src/components/PropField.js b/src/components/PropField.js
@@ -33,8 +33,8 @@ const stylesheet = {
   },
   object: {
     border: '1px solid #ececec',
-    padding: '5px'
-  }
+    padding: '5px',
+  },
 };
 
 stylesheet.textarea = {

diff --git a/src/index.js b/src/index.js
@@ -20,7 +20,7 @@ function register() {
 let knobStore = {};
 const stories = {};
 
-function createKnob(name, value, type) {
+function knob(name, type, value) {
   if (knobStore[name]) {
     return knobStore[name].value;
   }
@@ -48,4 +48,4 @@ function withKnobs(storyFn) {
   };
 }
 
-export { register, createKnob, withKnobs };
+export { register, knob, withKnobs };
diff --git a/src/stories/index.js b/src/stories/index.js
@@ -1,35 +1,27 @@
 import React from 'react';
 import { storiesOf } from '@kadira/storybook';
 import { action } from '@kadira/storybook-addon-actions';
-import { createKnob, withKnobs } from '../index';
+import { knob, withKnobs } from '../index';
 import Button from './Button';
 
 storiesOf('Button', module)
   .addDecorator((story, context) => (withKnobs(story)(context)))
   .add('default view', () => (
     <Button
       onClick={ action('button clicked') }
-      style={createKnob('style', { width: '70px' }, 'object')}
+      style={knob('style', 'object', { width: '70px' })}
     >
-      {createKnob('children', 'Hello')}
-    </Button>
-  ))
-  .add('another view', () => (
-    <Button
-      onClick={ action('button clicked') }
-      style={createKnob('style', { width: '70px' }, 'object')}
-    >
-      {createKnob('children', 'Hello')}
+      {knob('children', 'string', 'Hello')}
     </Button>
   ))
   .add('default view with different knobs', () => (
     <Button
       onClick={ action('button clicked') }
-      color={createKnob('color', '#abc')}
-      width={createKnob('width(px)', 70, 'number')}
-      disabled={createKnob('disabled', false, 'boolean')}
+      color={knob('color', 'string', '#abc')}
+      width={knob('width(px)', 'number', 70)}
+      disabled={knob('disabled', 'boolean', false)}
     >
-      {createKnob('text', 'Hello')}
+      {knob('text', 'Hello')}
     </Button>
   ))
   .add('Story without any knobs', () => (