import React from 'react';
import { storiesOf } from '@storybook/react';
import { action } from '@storybook/addon-actions';
import Toggle from './index'
import {
  text,
  boolean,
  number,
  object,
  array,
  date,
  color,
  button,
  select
} from '@storybook/addon-knobs/react';
import { withInfo } from '@storybook/addon-info';
import { linkTo } from '@storybook/addon-links'


storiesOf('Toggle', module)
  .add('Toggle Initial Selection',
  	withInfo('provide themeColor prop to change the color')(
  		() => (
  		<Toggle
		    onChange={action('onChange')}
        items={[{id:1,label:'here'},{id:2,label:'there'},{id:3,label:'overHere'}]}
		    selected={{id:1,label:'here'}}
        themeColor={color('themeColor','#deaded')}
  		/>
  	)
  ))
  .add('Toggle no Initial selection',
    withInfo('info text')(
      () => (
      <Toggle
        onChange={action('onChange')}
        items={[{id:1,label:'here'},{id:2,label:'there'},{id:3,label:'overHere'}]}
        themeColor={color('themeColor','#deaded')}
      />
    )
  ))
