diff options
author | Alexander Tseung <alextsg@gmail.com> | 2018-07-21 01:25:45 +0800 |
---|---|---|
committer | Alexander Tseung <alextsg@gmail.com> | 2018-07-24 00:23:43 +0800 |
commit | cdda52d799ea9edeb135de44e02fecc9d6d8e94b (patch) | |
tree | 05aa2ffd128eb715934233b5063da2bd0a83a422 /ui/app/components/button-group/button-group.stories.js | |
parent | 6d04c80302736133b0e741aa51719d0802cd8a2f (diff) | |
download | tangerine-wallet-browser-cdda52d799ea9edeb135de44e02fecc9d6d8e94b.tar.gz tangerine-wallet-browser-cdda52d799ea9edeb135de44e02fecc9d6d8e94b.tar.zst tangerine-wallet-browser-cdda52d799ea9edeb135de44e02fecc9d6d8e94b.zip |
Add ButtonGroup component
Diffstat (limited to 'ui/app/components/button-group/button-group.stories.js')
-rw-r--r-- | ui/app/components/button-group/button-group.stories.js | 49 |
1 files changed, 49 insertions, 0 deletions
diff --git a/ui/app/components/button-group/button-group.stories.js b/ui/app/components/button-group/button-group.stories.js new file mode 100644 index 000000000..14e1a7e49 --- /dev/null +++ b/ui/app/components/button-group/button-group.stories.js @@ -0,0 +1,49 @@ +import React from 'react' +import { storiesOf } from '@storybook/react' +import { action } from '@storybook/addon-actions' +import ButtonGroup from './' +import Button from '../button' +import { text, boolean } from '@storybook/addon-knobs/react' + +storiesOf('ButtonGroup', module) + .add('with Buttons', () => + <ButtonGroup + style={{ width: '300px' }} + disabled={boolean('Disabled', false)} + defaultActiveButtonIndex={1} + > + <Button + onClick={action('cheap')} + > + {text('Button1', 'Cheap')} + </Button> + <Button + onClick={action('average')} + > + {text('Button2', 'Average')} + </Button> + <Button + onClick={action('fast')} + > + {text('Button3', 'Fast')} + </Button> + </ButtonGroup> + ) + .add('with a disabled Button', () => + <ButtonGroup + style={{ width: '300px' }} + disabled={boolean('Disabled', false)} + > + <Button + onClick={action('enabled')} + > + {text('Button1', 'Enabled')} + </Button> + <Button + onClick={action('disabled')} + disabled + > + {text('Button2', 'Disabled')} + </Button> + </ButtonGroup> + ) |