import React from 'react';
import { storiesOf } from '@storybook/react-native';

import { Checkbox } from './Checkbox';

storiesOf('Components/Molecules/Checkbox', module)
  .add('Default', () => <Checkbox />)
  .add('Checked', () => <Checkbox checked />)
  .add('Disabled', () => (
    <>
      <Checkbox mb="md" disabled />
      <Checkbox checked disabled />
    </>
  ))
  .add('Theme colors', () => (
    <>
      <Checkbox mb="md" color="pink.500" checked />
      <Checkbox mb="md" color="red.500" checked />
      <Checkbox mb="md" color="yellow.600" checked />
      <Checkbox mb="md" uncheckedColor="brown.500" color="brown.500" />
      <Checkbox mb="md" uncheckedColor="teal.300" color="teal.300" />
      <Checkbox uncheckedColor="lightblue.900" color="lightblue.900" />
    </>
  ));