'use strict';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _react3 = require('@storybook/react');

var _addonKnobs = require('@storybook/addon-knobs');

var _addonActions = require('@storybook/addon-actions');

var _index = require('./index');

var _index2 = _interopRequireDefault(_index);

var _SelectBoxKnobs = require('./SelectBox.knobs.options');

var _SelectBoxKnobs2 = _interopRequireDefault(_SelectBoxKnobs);

var _SelectBox = require('./SelectBox.md');

var _SelectBox2 = _interopRequireDefault(_SelectBox);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

(0, _react3.storiesOf)('forms|atoms', module).addDecorator((0, _addonKnobs.withKnobs)({ escapeHTML: false })).add('SelectBox', function () {
  var props = {
    label: (0, _addonKnobs.text)('label', 'Color Scheme:'),
    stackLabel: (0, _addonKnobs.boolean)('stackLabel', false),
    required: (0, _addonKnobs.boolean)('required', true),
    id: (0, _addonKnobs.text)('id', 'color-select'),
    options: (0, _addonKnobs.object)('options', _SelectBoxKnobs2.default.options.colors),
    selected: (0, _addonKnobs.select)('defaultSelected', _SelectBoxKnobs2.default.options.colors.map(function (option) {
      return option.text;
    }), _SelectBoxKnobs2.default.options.colors[0].text),
    onChangeCallback: (0, _addonActions.action)('SelectBox onChangeCallback')
  };
  props.className = (0, _addonKnobs.text)('className', !props.required ? 'ma__select-box js-dropdown ma__select-box--optional' : 'ma__select-box js-dropdown');
  return _react2.default.createElement(_index2.default, props);
}, { info: _SelectBox2.default });