|
1 | 1 | importReactfrom'react' |
2 | 2 |
|
3 | | -import{boolean,text,withKnobs}from'@storybook/addon-knobs' |
| 3 | +import{select,boolean,text,withKnobs}from'@storybook/addon-knobs' |
4 | 4 | import{storiesOf}from'@storybook/react' |
5 | 5 | importSideBarDecoratorfrom'./utils/SideBarDecorator' |
6 | 6 |
|
7 | | -importStepfrom'../src/containers/Tutorial/LevelPage/Level/StepDescription' |
| 7 | +importStepDescriptionfrom'../src/containers/Tutorial/LevelPage/Level/StepDescription' |
8 | 8 |
|
9 | 9 | conststepText= |
10 | 10 | 'This is a long paragraph of step text intended to wrap around the side after a short period of writing to demonstrate text wrap among other things' |
@@ -32,6 +32,15 @@ const paragraphText = `Markdown included \`code\`, *bold*, & _italics_. |
32 | 32 | storiesOf('Tutorial SideBar',module) |
33 | 33 | .addDecorator(SideBarDecorator) |
34 | 34 | .addDecorator(withKnobs) |
35 | | -.add('Step',()=><div>Step</div>) |
36 | | -// .add('Step', () => <Step text={text('text', stepText)} hide={boolean('hide', false)} />) |
37 | | -// .add('Step Markdown', () => <Step text={text('text', paragraphText)} hide={boolean('hide', false)} />) |
| 35 | +.add('Step Description',()=>( |
| 36 | +<StepDescription |
| 37 | +text={text('text',stepText)} |
| 38 | +mode={select('mode',{active:'ACTIVE',complete:'COMPLETE',incomplete:'INCOMPLETE'},'active','step')} |
| 39 | +/> |
| 40 | +)) |
| 41 | +.add('Step Markdown',()=>( |
| 42 | +<StepDescription |
| 43 | +text={text('text',paragraphText)} |
| 44 | +mode={select('mode',{active:'ACTIVE',complete:'COMPLETE',incomplete:'INCOMPLETE'},'active','step')} |
| 45 | +/> |
| 46 | +)) |