const React = require('react'); const { storiesOf, action, // linkTo } = require('@kadira/storybook'); const { Base, Button, Container, Checkbox, Row, Column, AddMetric, Avatar, Input, List: { ListItemDescription, ListItemHeader, ListItem, ListItemMeta, ListItemOptions, ListItemOutlet, ListItemSubTitle, ListItemTitle, ListItemView, ListItemGroupView }, MiniMetric: { MiniMetricGraph, MiniMetricMeta, MiniMetricTitle, MiniMetricSubtitle, MiniMetricView }, Modal, Notificaton, Pagination, RangeSlider, Select, SelectCustom, Tabs, Tab, Toggle, Tooltip, Widget, Radio, RadioGroup } = require('../src/'); const seed = require('./seed'); const { selectData } = seed; const styles = { base: { backgroundColor: '#FFEBEE' }, row: { backgroundColor: '#EF5350' }, column: { backgroundColor: '#B71C1C', textAlign: 'center', color: 'white' } }; storiesOf('Grid', module) .add('Row and Column', () => ( 1 2 3 )); const profile = 'https://pbs.twimg.com/profile_images/' + '641289584580493312/VBfsPlff_400x400.jpg'; storiesOf('Add Metric', module) .add('Add Metric', () => ( )) .add('Added Metric', () => ( )); storiesOf('Avatar', module) .add('Avatar Picture', () => ( )) .add('Avatar Text', () => ( )); storiesOf('Button', module) .add('With text', () => ( )).add('Secondary', () => ( )).add('Disabled', () => ( )).add('Anchor', () => (
)); 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. )); storiesOf('Modal', module) .add('Default', () => (

This is the Modal

)); storiesOf('Notificaton', module) .add('Default', () => ( This is the default content )) .add('Success', () => ( This is the success content )) .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('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, median: 15, max: 15, min: 15, }, { firstQuartile: 26, thirdQuartile: 26, median: 26, max: 26, min: 26, }, { firstQuartile: 17, thirdQuartile: 17, median: 17, max: 17, min: 17, }, { firstQuartile: 15, thirdQuartile: 25, median: 19, max: 19, min: 20, }, { firstQuartile: 19, thirdQuartile: 25, median: 21, max: 20, min: 25, }, { firstQuartile: 24, thirdQuartile: 30, median: 25, max: 26, min: 27, }, { firstQuartile: 28, thirdQuartile: 34, median: 30, max: 30, min: 30, }, { firstQuartile: 30, thirdQuartile: 45, median: 35, max: 40, min: 40, }, { firstQuartile: 20, thirdQuartile: 55, median: 45, max: 44, min: 44, }, { firstQuartile: 55, thirdQuartile: 55, median: 55, max: 55, min: 55, }, { firstQuartile: 57, thirdQuartile: 56, median: 57, max: 58, min: 57, }, { firstQuartile: 57, thirdQuartile: 56, median: 56, max: 56, min: 56, }, { firstQuartile: 60, thirdQuartile: 56, median: 60, max: 60, min: 60, }, { firstQuartile: 57, thirdQuartile: 57, median: 57, max: 57, min: 57, }, { firstQuartile: 57, thirdQuartile: 55, median: 55, max: 55, min: 55, }, { firstQuartile: 20, thirdQuartile: 45, median: 45, max: 45, min: 45, }, { firstQuartile: 15, thirdQuartile: 40, median: 30, max: 49, min: 30, }]; storiesOf('Metrics', module) .add('Mini Metric', () => ( Memory: 54% (1280/3000 MB) Memory: 54% (1280/3000 MB) Memory: 54% (1280/3000 MB) )); storiesOf('ListItem', module) .add('default', () => ( Nginx 01 4 instances Flags Metrics )) .add('collapsed', () => ( Nginx 01 4 instances Flags Metrics )) .add('headed', () => ( Nginx 01 4 instances Flags Flags Metrics )) .add('headed collapsed', () => ( Nginx 01 4 instances Flags Flags Metrics )) .add('stacked', () => ( Nginx 01 4 instances Flags Metrics )) .add('view-group', () => ( Percona 5 instances Flags percona_database Metrics percona_database 5 instances Metrics ));