'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 = require('./index');

var _index3 = _interopRequireDefault(_index2);

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

var _InputTextTypeAheadKnobs2 = _interopRequireDefault(_InputTextTypeAheadKnobs);

var _TabsKnobs = require('../../molecules/Tabs/Tabs.knobs.options');

var _TabsKnobs2 = _interopRequireDefault(_TabsKnobs);

var _FilterBox = require('../FilterBox/FilterBox.props');

var _FilterBox2 = _interopRequireDefault(_FilterBox);

var _ButtonKnobs = require('../../atoms/buttons/Button/Button.knobs.options');

var _ButtonKnobs2 = _interopRequireDefault(_ButtonKnobs);

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

var _SelectBoxKnobs2 = _interopRequireDefault(_SelectBoxKnobs);

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

// import knob options for child patterns
(0, _react3.storiesOf)('organisms/SearchBanner', module).addDecorator((0, _addonKnobs.withKnobs)({ escapeHTML: false })).add('SearchBanner', function () {
  var options = _InputTextTypeAheadKnobs2.default.options.orgSelector;
  var withOrgDropdown = (0, _addonKnobs.boolean)('withOrgDropdown', true);
  var withFilterBox = (0, _addonKnobs.boolean)('withFilterBox', true);
  var DesktopHidden = (0, _addonKnobs.boolean)('SearchBanner: filterDesktopHidden', false);
  var withTabs = (0, _addonKnobs.boolean)('withTabs', true);
  var props = {
    searchBox: {
      placeholder: (0, _addonKnobs.text)('SearchBanner searchBox: placeholder', 'Search Mass.gov', 'SearchBox'),
      buttonSearch: {
        onClick: function onClick(e) {
          (0, _addonActions.action)('SearchBanner searchBox, buttonSearch clicked')(e);
          e.preventDefault();
        },
        ariaLabel: (0, _addonKnobs.text)('SearchBanner searchBox, buttonSearch: ariaLabel', 'Search', 'SearchBox'),
        text: (0, _addonKnobs.text)('SearchBanner searchBox, buttonSearch: text', 'Search', 'SearchBox')
      },
      onSubmit: (0, _addonActions.action)('SearchBanner searchBox onSubmit'),
      onChange: (0, _addonActions.action)('SearchBanner searchBox onChange'),
      defaultText: (0, _addonKnobs.text)('SearchBanner searchBox: defaultText', '', 'SearchBox')
    }
  };
  if (withTabs) {
    var tabs = (0, _addonKnobs.object)('tabs', _TabsKnobs2.default.tabValues, 'Tabs');
    var selectedTab = (0, _addonKnobs.select)('tabs selectedTab', _TabsKnobs2.default.tabValues.map(function (tab) {
      return tab.value;
    }), 'all', 'Tabs');
    props.tabs = {
      tabs: tabs,
      handleClick: (0, _addonActions.action)('SearchBanner tab clicked'),
      selectedTab: selectedTab
    };
  }
  if (withOrgDropdown) {
    var dropdownButton = (0, _addonKnobs.object)('searchBox, orgDropdown: dropdownButton', {
      text: 'All Organizations',
      capitalized: true
    }, 'Dropdown');
    var inputText = (0, _addonKnobs.object)('searchBox, orgDropdown: inputText', {
      boxed: true,
      label: null,
      placeholder: 'Search an organization...',
      id: 'org-typeahead',
      options: options,
      selected: '',
      onChange: (0, _addonActions.action)('SearchBanner searchBox.orgDropdown.onChange')
    }, 'Dropdown');
    props.searchBox.orgDropdown = {
      dropdownButton: dropdownButton,
      inputText: inputText
    };
  }
  if (withFilterBox) {
    props.toggleButtonOnClick = (0, _addonActions.action)('SearchBanner toggleButtonOnClick');
    props.filterBoxExpanded = (0, _addonKnobs.boolean)('SearchBanner filterBox Expanded?', true, 'FilterBox');
    props.filterDesktopHidden = DesktopHidden;
    props.filterToggleText = (0, _addonKnobs.text)('SearchBanner filterToggleText', 'More Filters', 'FilterBox');
    var organization = {
      label: (0, _addonKnobs.text)('filterBox organization label', 'State organization', 'FilterBox'),
      id: (0, _addonKnobs.text)('filterBox organization id', 'state-organization', 'FilterBox'),
      options: (0, _addonKnobs.object)('filterBox organization options', _InputTextTypeAheadKnobs2.default.options.orgSelector, 'FilterBox'),
      selected: (0, _addonKnobs.select)('filterBox organization defaultSelected', [''].concat(_InputTextTypeAheadKnobs2.default.options.orgSelector.map(function (option) {
        return option.text;
      })), '', 'FilterBox'),
      placeholder: (0, _addonKnobs.text)('filterBox organization placeholder', 'All Organizations', 'FilterBox'),
      onChange: (0, _addonActions.action)('filterBox organization typeahead onChange')
    };
    var pressType = {
      label: (0, _addonKnobs.text)('filterBox pressType label', 'Filter by Type', 'FilterBox'),
      id: (0, _addonKnobs.text)('filterBox pressType id', 'press-type', 'FilterBox'),
      options: (0, _addonKnobs.object)('filterBox pressType options', _InputTextTypeAheadKnobs2.default.options.pressTypes, 'FilterBox'),
      selected: (0, _addonKnobs.select)('filterBox pressType defaultSelected', [''].concat(_InputTextTypeAheadKnobs2.default.options.pressTypes.map(function (option) {
        return option.text;
      })), '', 'FilterBox'),
      placeholder: (0, _addonKnobs.text)('filterBox pressType placeholder', 'All Types', 'FilterBox'),
      onChange: (0, _addonActions.action)('SearchBanner filterBox pressType.typeAhead.onChange')
    };
    var dateRange = {
      label: (0, _addonKnobs.text)('filterBox dateRange label', 'Date range', 'FilterBox'),
      startDate: (0, _addonKnobs.object)('filterBox dateRange startDate', _FilterBox2.default.startDate, 'FilterBox'),
      endDate: (0, _addonKnobs.object)('filterBox dateRange endDate', _FilterBox2.default.endDate, 'FilterBox')
    };
    props.filterBox = {
      filterDesktopHidden: DesktopHidden,
      active: (0, _addonKnobs.boolean)('filterBox active', true, 'FilterBox'),
      action: (0, _addonKnobs.text)('filterBox action', '#', 'FilterBox'),
      id: (0, _addonKnobs.text)('filterBox id', 'filter-box', 'FilterBox'),
      fields: [{
        class: 'ma__filter-box__organizations ma__filter-box--desktop-hidden',
        component: _react2.default.createElement(_index.InputTextTypeAhead, organization)
      }, {
        class: 'ma__filter-box__type',
        component: _react2.default.createElement(_index.InputTextTypeAhead, pressType)
      }, {
        class: 'ma__filter-box__date',
        component: _react2.default.createElement(_index.DateRange, dateRange)
      }],
      submitButton: {
        text: (0, _addonKnobs.text)('filterBox submitButton text', 'Submit', 'FilterBox'),
        type: (0, _addonKnobs.select)('filterBox submitButton type', _ButtonKnobs2.default.type, 'submit', 'FilterBox'),
        size: (0, _addonKnobs.select)('filterBox submitButton size', _ButtonKnobs2.default.size, null, 'FilterBox'),
        theme: (0, _addonKnobs.select)('filterBox submitButton theme', _ButtonKnobs2.default.theme, '', 'FilterBox'),
        usage: (0, _addonKnobs.select)('filterBox submitButton usage', _ButtonKnobs2.default.usage, '', 'FilterBox'),
        outline: (0, _addonKnobs.boolean)('filterBox submitButton outline', false, 'FilterBox'),
        onClick: (0, _addonActions.action)('SearchBanner filterBox submitButton.onClick')
      },
      clearButton: {
        text: (0, _addonKnobs.text)('filterBox clearButton text', 'Clear all filters', 'FilterBox'),
        info: (0, _addonKnobs.text)('filterBox clearButton aria-label', 'Clear all filters', 'FilterBox'),
        onClearCallback: (0, _addonActions.action)('SearchBanner filterBox clearButton onClearCallback', 'FilterBox')
      }
    };
    if (dateRange) {
      dateRange.startDate.defaultDate = new Date(dateRange.startDate.defaultDate);
      dateRange.endDate.defaultDate = new Date(dateRange.endDate.defaultDate);
    }
  }
  return _react2.default.createElement(_index3.default, props);
})
// second story
.add('SearchBanner with postInputFilter', function () {
  var options = _InputTextTypeAheadKnobs2.default.options.orgSelector;
  var withOrgDropdown = (0, _addonKnobs.boolean)('withOrgDropdown', false);
  var withFilterBox = (0, _addonKnobs.boolean)('withFilterBox', true);
  var DesktopHidden = (0, _addonKnobs.boolean)('SearchBanner: filterDesktopHidden', false);
  var withTabs = (0, _addonKnobs.boolean)('withTabs', false);
  var selectBoxProps = {
    label: (0, _addonKnobs.text)('selectBox label', '', 'Post Input Filter: SelectBox'),
    stackLabel: (0, _addonKnobs.boolean)('selectBox stackLabel', true, 'Post Input Filter: SelectBox'),
    required: (0, _addonKnobs.boolean)('selectBox required', true, 'Post Input Filter: SelectBox'),
    id: (0, _addonKnobs.text)('selectBox id', 'distance-select', 'Post Input Filter: SelectBox'),
    options: (0, _addonKnobs.object)('selectBox options', _SelectBoxKnobs2.default.options.distance, 'Post Input Filter: SelectBox'),
    selected: (0, _addonKnobs.select)('selectBox defaultSelected', _SelectBoxKnobs2.default.options.distance.map(function (option) {
      return option.text;
    }), _SelectBoxKnobs2.default.options.distance[0].text, 'Post Input Filter: SelectBox'),
    onChangeCallback: (0, _addonActions.action)('SelectBox onChangeCallback')
  };
  var props = {
    searchBox: {
      placeholder: (0, _addonKnobs.text)('SearchBanner searchBox: placeholder', 'Search Mass.gov', 'SearchBox'),
      buttonSearch: {
        onClick: function onClick(e) {
          (0, _addonActions.action)('SearchBanner searchBox, buttonSearch clicked')(e);
          e.preventDefault();
        },
        ariaLabel: (0, _addonKnobs.text)('SearchBanner searchBox, buttonSearch: ariaLabel', 'Search', 'SearchBox'),
        text: (0, _addonKnobs.text)('SearchBanner searchBox, buttonSearch: text', 'Search', 'SearchBox')
      },
      onSubmit: (0, _addonActions.action)('SearchBanner searchBox onSubmit'),
      onChange: (0, _addonActions.action)('SearchBanner searchBox onChange'),
      defaultText: (0, _addonKnobs.text)('SearchBanner searchBox: defaultText', '', 'SearchBox'),
      postInputFilter: _react2.default.createElement(_index.SelectBox, selectBoxProps)
    }

  };
  if (withTabs) {
    var tabs = (0, _addonKnobs.object)('tabs', _TabsKnobs2.default.tabValues, 'Tabs');
    var selectedTab = (0, _addonKnobs.select)('tabs selectedTab', _TabsKnobs2.default.tabValues.map(function (tab) {
      return tab.value;
    }), 'all', 'Tabs');
    props.tabs = {
      tabs: tabs,
      handleClick: (0, _addonActions.action)('SearchBanner tab clicked'),
      selectedTab: selectedTab
    };
  }
  if (withOrgDropdown) {
    var dropdownButton = (0, _addonKnobs.object)('searchBox, orgDropdown: dropdownButton', {
      text: 'All Organizations',
      capitalized: true
    }, 'Dropdown');
    var inputText = (0, _addonKnobs.object)('searchBox, orgDropdown: inputText', {
      boxed: true,
      label: null,
      placeholder: 'Search an organization...',
      id: 'org-typeahead',
      options: options,
      selected: '',
      onChange: (0, _addonActions.action)('SearchBanner searchBox.orgDropdown.onChange')
    }, 'Dropdown');
    props.searchBox.orgDropdown = {
      dropdownButton: dropdownButton,
      inputText: inputText
    };
  }
  if (withFilterBox) {
    props.toggleButtonOnClick = (0, _addonActions.action)('SearchBanner toggleButtonOnClick');
    props.filterBoxExpanded = (0, _addonKnobs.boolean)('SearchBanner filterBox Expanded?', true, 'FilterBox');
    props.filterDesktopHidden = DesktopHidden;
    props.filterToggleText = (0, _addonKnobs.text)('SearchBanner filterToggleText', 'More Filters', 'FilterBox');
    var postInputFilter = {
      label: (0, _addonKnobs.text)('filterBox topic label', 'Distance Radius', 'FilterBox'),
      stackLabel: (0, _addonKnobs.boolean)('filterBox topic stackLabel', true, 'FilterBox'),
      id: 'distance-select',
      options: (0, _addonKnobs.object)('filterBox topic options', _SelectBoxKnobs2.default.options.distance, 'FilterBox'),
      required: (0, _addonKnobs.boolean)('filterBox topic required', true, 'FilterBox')
    };
    var typeOfCare = {
      label: (0, _addonKnobs.text)('filterBox topic label', 'Type of Care', 'FilterBox'),
      stackLabel: (0, _addonKnobs.boolean)('filterBox topic stackLabel', true, 'FilterBox'),
      id: 'topic',
      options: (0, _addonKnobs.object)('filterBox topic options', _SelectBoxKnobs2.default.options.typeOfCare, 'FilterBox'),
      required: (0, _addonKnobs.boolean)('filterBox topic required', true, 'FilterBox')
    };
    props.filterBox = {
      filterDesktopHidden: DesktopHidden,
      active: (0, _addonKnobs.boolean)('SearchBanner filterBox: active', true, 'FilterBox'),
      action: (0, _addonKnobs.text)('SearchBanner filterBox: action', '#', 'FilterBox'),
      fields: [{
        class: 'ma__filter-box__postInputFilter ma__filter-box--desktop-hidden',
        component: _react2.default.createElement(_index.SelectBox, postInputFilter)
      }, {
        class: 'ma__filter-box__type',
        component: _react2.default.createElement(_index.SelectBox, typeOfCare)
      }],
      submitButton: {
        text: (0, _addonKnobs.text)('filterBox submitButton text', 'Submit', 'FilterBox'),
        type: (0, _addonKnobs.select)('filterBox submitButton type', _ButtonKnobs2.default.type, 'submit', 'FilterBox'),
        size: (0, _addonKnobs.select)('filterBox submitButton size', _ButtonKnobs2.default.size, null, 'FilterBox'),
        theme: (0, _addonKnobs.select)('filterBox submitButton theme', _ButtonKnobs2.default.theme, '', 'FilterBox'),
        usage: (0, _addonKnobs.select)('filterBox submitButton usage', _ButtonKnobs2.default.usage, '', 'FilterBox'),
        outline: (0, _addonKnobs.boolean)('filterBox submitButton outline', false, 'FilterBox'),
        onClick: (0, _addonActions.action)('SearchBanner filterBox submitButton.onClick')
      },
      clearButton: {
        text: (0, _addonKnobs.text)('filterBox clearButton text', 'Clear all filters', 'FilterBox'),
        info: (0, _addonKnobs.text)('filterBox clearButton aria-label', 'Clear all filters', 'FilterBox'),
        onClearCallback: (0, _addonActions.action)('SearchBanner filterBox clearButton onClearCallback', 'FilterBox')
      }
    };
    if (props.filterBox.dateRange) {
      props.filterBox.dateRange.startDate.defaultDate = new Date(props.filterBox.dateRange.startDate.defaultDate);
      props.filterBox.dateRange.endDate.defaultDate = new Date(props.filterBox.dateRange.endDate.defaultDate);
    }
  }
  return _react2.default.createElement(_index3.default, props);
});