var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

import React from 'react';

import { storiesOf } from '@storybook/react';
import { withKnobs } from '@storybook/addon-knobs';
import { text, boolean, select, array, color } from '@storybook/addon-knobs/react';
import { action } from '@storybook/addon-actions';

import InputCheckBox from './index';
import inputCheckBoxDocs from './InputCheckBox.md';

import Icon from '../../base/Icon';
import { svgOptions } from '../../base/Icon/Icon.knob.options';

storiesOf('forms|atoms', module).addDecorator(withKnobs({ escapeHTML: false })).add('InputCheckBox', function () {
  var props = {
    id: text('id', 'input-checkbox'),
    value: text('value', 'select-all'),
    label: text('label', 'Apply to all'),
    defaultValue: text('defaultValue', 'select-all'),
    onChange: action('onChange'),
    onKeyDown: action('onKeyDown'),
    disabled: boolean('disabled', false),
    required: boolean('required', false),
    errorMsg: text('errorMsg', 'You are required to check this box.'),
    labelText: text('labelText', 'Checkbox Input'),
    classes: array('classes', [])
  };
  var iconProps = {
    name: select('icon.name', svgOptions),
    svgWidth: 20,
    svgHeight: 20,
    fill: color('icon.color', '#388557')
  };
  return React.createElement(InputCheckBox, _extends({}, props, { icon: React.createElement(Icon, iconProps) }));
}, { info: inputCheckBoxDocs });