From 8f2e140cbe2674ad7d4fbc4441c8d4cd3294c49a Mon Sep 17 00:00:00 2001 From: Alex Windett Date: Wed, 11 Jan 2017 14:22:28 +0000 Subject: [PATCH] moving stories to directory folders --- ui/src/components/checkbox/story.js | 18 ++ ui/src/components/close/story.js | 20 ++ ui/src/components/input/story.js | 35 +++ ui/src/components/modal/story.js | 17 ++ ui/src/components/notification/story.js | 34 +++ ui/src/components/pagination/story.js | 20 ++ ui/src/components/radio-group/story.js | 27 +++ ui/src/components/radio/story.js | 20 ++ ui/src/components/range-slider/story.js | 12 ++ ui/src/components/select-custom/story.js | 28 +++ ui/src/components/select/story.js | 26 +++ ui/src/components/tabs/story.js | 20 ++ ui/src/components/toggle/story.js | 30 +++ ui/src/components/tooltip/story.js | 29 +++ ui/src/components/widget/story.js | 24 +++ ui/stories/index.js | 261 ----------------------- 16 files changed, 360 insertions(+), 261 deletions(-) create mode 100644 ui/src/components/checkbox/story.js create mode 100644 ui/src/components/close/story.js create mode 100644 ui/src/components/input/story.js create mode 100644 ui/src/components/modal/story.js create mode 100644 ui/src/components/notification/story.js create mode 100644 ui/src/components/pagination/story.js create mode 100644 ui/src/components/radio-group/story.js create mode 100644 ui/src/components/radio/story.js create mode 100644 ui/src/components/range-slider/story.js create mode 100644 ui/src/components/select-custom/story.js create mode 100644 ui/src/components/select/story.js create mode 100644 ui/src/components/tabs/story.js create mode 100644 ui/src/components/toggle/story.js create mode 100644 ui/src/components/tooltip/story.js create mode 100644 ui/src/components/widget/story.js diff --git a/ui/src/components/checkbox/story.js b/ui/src/components/checkbox/story.js new file mode 100644 index 00000000..bdbebdab --- /dev/null +++ b/ui/src/components/checkbox/story.js @@ -0,0 +1,18 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Checkbox = require('./'); + +storiesOf('Checkbox', module) + .add('Default', () => ( + + )) + .add('Checked', () => ( + + )) + .add('Disabled', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/close/story.js b/ui/src/components/close/story.js new file mode 100644 index 00000000..2776d6e2 --- /dev/null +++ b/ui/src/components/close/story.js @@ -0,0 +1,20 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Base = require('../base'); +const Close = require('./'); + +storiesOf('Close', module) + .add('Default', () => ( + + + + )); \ No newline at end of file diff --git a/ui/src/components/input/story.js b/ui/src/components/input/story.js new file mode 100644 index 00000000..af8538db --- /dev/null +++ b/ui/src/components/input/story.js @@ -0,0 +1,35 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Base= require('../base'); +const Input = require('./'); + +storiesOf('Input', module) + .add('Default', () => ( + + + + )) + .add('type=email', () => ( + + + We'll never share your email with anyone else. + + + )) + .add('Error', () => ( + + + + )); \ No newline at end of file diff --git a/ui/src/components/modal/story.js b/ui/src/components/modal/story.js new file mode 100644 index 00000000..74a142fc --- /dev/null +++ b/ui/src/components/modal/story.js @@ -0,0 +1,17 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Base= require('../base'); +const Modal = require('./'); + +storiesOf('Modal', module) + .add('Default', () => ( + + +

This is the Modal

+
+ + )); \ No newline at end of file diff --git a/ui/src/components/notification/story.js b/ui/src/components/notification/story.js new file mode 100644 index 00000000..5c126b90 --- /dev/null +++ b/ui/src/components/notification/story.js @@ -0,0 +1,34 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Base= require('../base'); +const Notificaton = require('./'); + +storiesOf('Notificaton', module) + .add('Default', () => ( + + + This is the default content + + + )) + .add('Success', () => ( + + + This is a success notification that is closable + + + )) + .add('Alert', () => ( + + + This is the alert content + + + )); \ No newline at end of file diff --git a/ui/src/components/pagination/story.js b/ui/src/components/pagination/story.js new file mode 100644 index 00000000..284fb49e --- /dev/null +++ b/ui/src/components/pagination/story.js @@ -0,0 +1,20 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Pagination = require('./'); + +storiesOf('Pagination', module) + .add('Default', () => ( + + + « + Previous + + 1 + 2 + 3 + + )); \ No newline at end of file diff --git a/ui/src/components/radio-group/story.js b/ui/src/components/radio-group/story.js new file mode 100644 index 00000000..09d7b34f --- /dev/null +++ b/ui/src/components/radio-group/story.js @@ -0,0 +1,27 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Base= require('../base'); +const RadioGroup = require('./'); +const Radio = require('./item'); + + +storiesOf('Radio Group', module) + .add('Default', () => ( + + + + Video killed the radio star + + + Video killed the radio star + + + Video killed the radio star + + + + )); \ No newline at end of file diff --git a/ui/src/components/radio/story.js b/ui/src/components/radio/story.js new file mode 100644 index 00000000..ed9697ad --- /dev/null +++ b/ui/src/components/radio/story.js @@ -0,0 +1,20 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Radio = require('./'); + +storiesOf('Radio', module) + .add('Default', () => ( + + Video killed the radio star + + )) + .add('Checked', () => ( + + )) + .add('Disabled', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/range-slider/story.js b/ui/src/components/range-slider/story.js new file mode 100644 index 00000000..21e479f5 --- /dev/null +++ b/ui/src/components/range-slider/story.js @@ -0,0 +1,12 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const RangeSlider = require('./'); + +storiesOf('Range Slider', module) + .add('Default', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/select-custom/story.js b/ui/src/components/select-custom/story.js new file mode 100644 index 00000000..7763f7fa --- /dev/null +++ b/ui/src/components/select-custom/story.js @@ -0,0 +1,28 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const { + selectData +} = require('../../shared/fake-data'); + +const SelectCustom = require('./'); + +storiesOf('Select Custom', module) + .add('Default', () => ( + + )) + .add('Multiple', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/select/story.js b/ui/src/components/select/story.js new file mode 100644 index 00000000..871941c3 --- /dev/null +++ b/ui/src/components/select/story.js @@ -0,0 +1,26 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Select = require('./'); + +storiesOf('Select', module) + .add('Default', () => ( + + )) + .add('multiple', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/tabs/story.js b/ui/src/components/tabs/story.js new file mode 100644 index 00000000..f23bb076 --- /dev/null +++ b/ui/src/components/tabs/story.js @@ -0,0 +1,20 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Tabs = require('./'); +const Tab = require('./tab'); + +storiesOf('Tabs', module) + .add('Default', () => ( + + +

Containers

+
+ +

User

+
+
+ )); \ No newline at end of file diff --git a/ui/src/components/toggle/story.js b/ui/src/components/toggle/story.js new file mode 100644 index 00000000..6af792bc --- /dev/null +++ b/ui/src/components/toggle/story.js @@ -0,0 +1,30 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Toggle = require('./'); + +storiesOf('Toggle', module) + .add('default', () => ( + + )) + .add('checked', () => ( + + )) + .add('no props', () => ( + + )); \ No newline at end of file diff --git a/ui/src/components/tooltip/story.js b/ui/src/components/tooltip/story.js new file mode 100644 index 00000000..260d6120 --- /dev/null +++ b/ui/src/components/tooltip/story.js @@ -0,0 +1,29 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Tooltip = require('./'); + +storiesOf('Tooltip', module) + .add('default', () => ( + +
  • One
  • +
  • Two
  • +
  • Three
  • +
    + )) + .add('custom position', () => { + const arrowPosition = { + left: '90%', + bottom: '100%' + }; + return ( + +
  • One
  • +
  • Two
  • +
  • Three
  • +
    + ); + }); \ No newline at end of file diff --git a/ui/src/components/widget/story.js b/ui/src/components/widget/story.js new file mode 100644 index 00000000..a2fbe982 --- /dev/null +++ b/ui/src/components/widget/story.js @@ -0,0 +1,24 @@ +const React = require('react'); + +const { + storiesOf +} = require('@kadira/storybook'); + +const Widget = require('./'); + +storiesOf('Widget', module) + .add('single', () => ( + + england flag +

    Some text

    +
    + )); \ No newline at end of file diff --git a/ui/stories/index.js b/ui/stories/index.js index ed0100c8..f49080cb 100644 --- a/ui/stories/index.js +++ b/ui/stories/index.js @@ -8,10 +8,8 @@ const { const { Base, Container, - Checkbox, Row, Column, - Close, AddMetric: { AddMetricButton, AddMetricDescription, @@ -19,7 +17,6 @@ const { AddMetricTile, AddMetricTitle }, - Input, List: { ListItemDescription, ListItemHeader, @@ -39,27 +36,8 @@ const { MiniMetricSubtitle, MiniMetricView }, - Modal, - Notificaton, - Pagination, - RangeSlider, - Select, - SelectCustom, - Tabs, - Tab, - Toggle, - Tooltip, - Widget, - Radio, - RadioGroup } = require('../src/'); -const fakeData = require('../src/shared/fake-data'); - -const { - selectData -} = fakeData; - const styles = { base: { backgroundColor: '#FFEBEE' @@ -148,245 +126,6 @@ storiesOf('Add Metric', module) )); -storiesOf('Checkbox', module) - .add('Default', () => ( - - )) - .add('Checked', () => ( - - )) - .add('Disabled', () => ( - - )); - -storiesOf('Radio', module) - .add('Default', () => ( - - Video killed the radio star - - )) - .add('Checked', () => ( - - )) - .add('Disabled', () => ( - - )); - -storiesOf('Input', module) - .add('Default', () => ( - - - - )) - .add('type=email', () => ( - - - We'll never share your email with anyone else. - - - )) - .add('Error', () => ( - - - - )); - -storiesOf('Modal', module) - .add('Default', () => ( - -

    This is the Modal

    -
    - )); - -storiesOf('Notificaton', module) - .add('Default', () => ( - - - This is the default content - - - )) - .add('Success', () => ( - - - This is a success notification that is closable - - - )) - .add('Alert', () => ( - - - This is the alert content - - - )); - -storiesOf('Pagination', module) - .add('Default', () => ( - - - « - Previous - - 1 - 2 - 3 - - )); - -storiesOf('Radio Group', module) - .add('Default', () => ( - - - Video killed the radio star - - - Video killed the radio star - - - Video killed the radio star - - - )); - -storiesOf('RangeSlider', module) - .add('Default', () => ( - - )); - -storiesOf('Select', module) - .add('Default', () => ( - - )) - .add('multiple', () => ( - - )); - -storiesOf('Select Custom', module) - .add('Default', () => ( - - )) - .add('Multiple', () => ( - - )); - -storiesOf('Tabs', module) - .add('Default', () => ( - - -

    Containers

    -
    - -

    User

    -
    -
    - )); - -storiesOf('Close', module) - .add('Default', () => ( - - - - )); - -storiesOf('Toggle', module) - .add('default', () => ( - - )) - .add('checked', () => ( - - )) - .add('no props', () => ( - - )); - -storiesOf('Tooltip', module) - .add('default', () => ( - -
  • One
  • -
  • Two
  • -
  • Three
  • -
    - )) - .add('custom position', () => { - const arrowPosition = { - left: '90%', - bottom: '100%' - }; - return ( - -
  • One
  • -
  • Two
  • -
  • Three
  • -
    - ); - }); - -storiesOf('Widget', module) - .add('single', () => ( - - england flag -

    Some text

    -
    - )); - const minMetricData = [{ firstQuartile: 15, thirdQuartile: 15,