'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 _SelectBoxKnobs = require('../../forms/SelectBox/SelectBox.knobs.options');

var _SelectBoxKnobs2 = _interopRequireDefault(_SelectBoxKnobs);

var _InputTextTypeAheadKnobs = require('../../forms/InputTextTypeAhead/InputTextTypeAhead.knobs.options');

var _InputTextTypeAheadKnobs2 = _interopRequireDefault(_InputTextTypeAheadKnobs);

var _ = require('../../..');

var _2 = _interopRequireDefault(_);

var _HeaderSearch = require('./HeaderSearch.md');

var _HeaderSearch2 = _interopRequireDefault(_HeaderSearch);

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

(0, _react3.storiesOf)('molecules/HeaderSearch', module).addDecorator((0, _addonKnobs.withKnobs)({ escapeHTML: false })).add('HeaderSearch', function () {
  var options = _InputTextTypeAheadKnobs2.default.options.orgSelector;
  var withOrgDropdown = (0, _addonKnobs.boolean)('withOrgDropdown (shows OrgDropdown knobs when true)', true);
  var props = {
    placeholder: (0, _addonKnobs.text)('placeholder', 'Search Mass.gov'),
    buttonSearch: {
      onClick: (0, _addonActions.action)('Button clicked'),
      ariaLabel: (0, _addonKnobs.text)('ButtonSearch: ariaLabel', '', 'ButtonSearch'),
      text: (0, _addonKnobs.text)('ButtonSearch: text', 'Search', 'ButtonSearch'),
      usage: (0, _addonKnobs.select)('ButtonSearch: usage', {
        'primary (default)': '',
        secondary: 'secondary'
      }, '', 'ButtonSearch')
    },
    onSubmit: (0, _addonActions.action)('Form submitted'),
    onChange: (0, _addonActions.action)('Text input modified'),
    defaultText: (0, _addonKnobs.text)('defaultText', '')
  };
  if (withOrgDropdown) {
    props.orgDropdown = {
      dropdownButton: (0, _addonKnobs.object)('OrgDropdown: dropdownButton', {
        text: 'All Organizations',
        capitalized: true
      }, 'OrgDropdown'),
      inputText: (0, _addonKnobs.object)('OrgDropdown: inputText', {
        boxed: true,
        label: null,
        placeholder: 'Search an organization...',
        id: 'org-typeahead',
        options: options,
        selected: '',
        onChange: (0, _addonActions.action)('orgDropdown onChange')
      }, 'OrgDropdown')
    };
  }
  return _react2.default.createElement(_2.default, props);
}, { info: _HeaderSearch2.default }).add('HeaderSearch with postInputFilter', function () {
  var options = _InputTextTypeAheadKnobs2.default.options.orgSelector;
  var withOrgDropdown = (0, _addonKnobs.boolean)('withOrgDropdown (shows OrgDropdown knobs when true)', false);
  var selectBoxProps = {
    label: (0, _addonKnobs.text)('SelectBox: label', '', 'SelectBox'),
    stackLabel: (0, _addonKnobs.boolean)('SelectBox: stackLabel', true, 'SelectBox'),
    required: (0, _addonKnobs.boolean)('SelectBox: required', true, 'SelectBox'),
    id: (0, _addonKnobs.text)('SelectBox: id', 'distance-select', 'SelectBox'),
    options: (0, _addonKnobs.object)('SelectBox: options', _SelectBoxKnobs2.default.options.distance, 'SelectBox'),
    selected: (0, _addonKnobs.select)('SelectBox: defaultSelected', _SelectBoxKnobs2.default.options.distance.map(function (option) {
      return option.text;
    }), _SelectBoxKnobs2.default.options.distance[0].text, 'SelectBox'),
    onChangeCallback: (0, _addonActions.action)('SelectBox onChangeCallback')
  };
  var props = {
    placeholder: (0, _addonKnobs.text)('placeholder', 'Search Mass.gov'),
    buttonSearch: {
      onClick: (0, _addonActions.action)('Button clicked'),
      ariaLabel: (0, _addonKnobs.text)('ButtonSearch: ariaLabel', '', 'ButtonSearch'),
      text: (0, _addonKnobs.text)('ButtonSearch: text', 'Search', 'ButtonSearch'),
      usage: (0, _addonKnobs.select)('ButtonSearch: usage', {
        'primary (default)': '',
        secondary: 'secondary'
      }, '', 'ButtonSearch')
    },
    onSubmit: (0, _addonActions.action)('Form submitted'),
    onChange: (0, _addonActions.action)('Text input modified'),
    defaultText: (0, _addonKnobs.text)('ButtonSearch: defaultText', '', 'ButtonSearch'),
    postInputFilter: _react2.default.createElement(_index.SelectBox, selectBoxProps)
  };
  if (withOrgDropdown) {
    props.orgDropdown = {
      dropdownButton: (0, _addonKnobs.object)('OrgDropdown: dropdownButton', {
        text: 'All Organizations',
        capitalized: true
      }, 'OrgDropdown'),
      inputText: (0, _addonKnobs.object)('OrgDropdown: inputText', {
        boxed: true,
        label: null,
        placeholder: 'Search an organization...',
        id: 'org-typeahead',
        options: options,
        selected: '',
        onChange: (0, _addonActions.action)('orgDropdown onChange')
      }, 'OrgDropdown')
    };
  }
  return _react2.default.createElement(_2.default, props);
}, { info: _HeaderSearch2.default });