From cdda52d799ea9edeb135de44e02fecc9d6d8e94b Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Fri, 20 Jul 2018 10:25:45 -0700
Subject: Add ButtonGroup component

---
 .../button-group/button-group.stories.js           | 49 ++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 ui/app/components/button-group/button-group.stories.js

(limited to 'ui/app/components/button-group/button-group.stories.js')

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>
+  )
-- 
cgit