-
-
Notifications
You must be signed in to change notification settings - Fork 9.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1832 from storybooks/ndelangen/restructure-knobs
Refactor knobs - no longer include all runtimes
- Loading branch information
Showing
12 changed files
with
176 additions
and
82 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| module.exports = require('./dist/react'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| import KnobManager from './KnobManager'; | ||
|
|
||
| export const manager = new KnobManager(); | ||
|
|
||
| export function knob(name, options) { | ||
| return manager.knob(name, options); | ||
| } | ||
|
|
||
| export function text(name, value) { | ||
| return manager.knob(name, { type: 'text', value }); | ||
| } | ||
|
|
||
| export function boolean(name, value) { | ||
| return manager.knob(name, { type: 'boolean', value }); | ||
| } | ||
|
|
||
| export function number(name, value, options = {}) { | ||
| const defaults = { | ||
| range: false, | ||
| min: 0, | ||
| max: 10, | ||
| step: 1, | ||
| }; | ||
|
|
||
| const mergedOptions = { ...defaults, ...options }; | ||
|
|
||
| const finalOptions = { | ||
| ...mergedOptions, | ||
| type: 'number', | ||
| value, | ||
| }; | ||
|
|
||
| return manager.knob(name, finalOptions); | ||
| } | ||
|
|
||
| export function color(name, value) { | ||
| return manager.knob(name, { type: 'color', value }); | ||
| } | ||
|
|
||
| export function object(name, value) { | ||
| return manager.knob(name, { type: 'object', value }); | ||
| } | ||
|
|
||
| export function select(name, options, value) { | ||
| return manager.knob(name, { type: 'select', options, value }); | ||
| } | ||
|
|
||
| export function array(name, value, separator = ',') { | ||
| return manager.knob(name, { type: 'array', value, separator }); | ||
| } | ||
|
|
||
| export function date(name, value = new Date()) { | ||
| const proxyValue = value ? value.getTime() : null; | ||
| return manager.knob(name, { type: 'date', value: proxyValue }); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,31 @@ | ||
| import React from 'react'; | ||
| import addons from '@storybook/addons'; | ||
|
|
||
| import WrapStory from './WrapStory'; | ||
|
|
||
| /** | ||
| * Handles a react story | ||
| */ | ||
| import { knob, text, boolean, number, color, object, array, date, select, manager } from '../base'; | ||
|
|
||
| export { knob, text, boolean, number, color, object, array, date, select }; | ||
|
|
||
| export const reactHandler = (channel, knobStore) => getStory => context => { | ||
| const initialContent = getStory(context); | ||
| const props = { context, storyFn: getStory, channel, knobStore, initialContent }; | ||
| return <WrapStory {...props} />; | ||
| }; | ||
|
|
||
| function wrapperKnobs(options) { | ||
| const channel = addons.getChannel(); | ||
| manager.setChannel(channel); | ||
|
|
||
| if (options) channel.emit('addon:knobs:setOptions', options); | ||
|
|
||
| return reactHandler(channel, manager.knobStore); | ||
| } | ||
|
|
||
| export function withKnobs(storyFn, context) { | ||
| return wrapperKnobs()(storyFn)(context); | ||
| } | ||
|
|
||
| export function withKnobsOptions(options = {}) { | ||
| return (storyFn, context) => wrapperKnobs(options)(storyFn)(context); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| module.exports = require('./dist/vue'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 10 additions & 1 deletion
11
examples/crna-kitchen-sink/storybook/stories/Knobs/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.