function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

/**
 *
 * Datepicker
 *
 */
import React, { useEffect, useReducer } from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
import momentPropTypes from 'react-moment-proptypes';
import 'react-dates/initialize';
import { DayPickerSingleDateController } from 'react-dates';
import { faCalendarAlt } from '@fortawesome/free-regular-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { DatePicker as StyledDatepicker } from '@buffetjs/styles';
import reducer, { initialState } from './reducer';
import Input from '../InputText';

function Datepicker(_ref) {
  var className = _ref.className,
      value = _ref.value,
      withDefaultValue = _ref.withDefaultValue,
      disabled = _ref.disabled,
      displayFormat = _ref.displayFormat,
      id = _ref.id,
      name = _ref.name,
      onChange = _ref.onChange,
      readOnly = _ref.readOnly,
      tabIndex = _ref.tabIndex,
      wait = _ref.wait;

  var _useReducer = useReducer(reducer, initialState),
      _useReducer2 = _slicedToArray(_useReducer, 2),
      state = _useReducer2[0],
      dispatch = _useReducer2[1];

  useEffect(function () {
    var date = null;
    var displayedDate = '';

    if (withDefaultValue && !value) {
      date = moment();
      displayedDate = date.format('MM/DD/YYYY');
    }

    if (!!value && moment(value).isValid()) {
      date = value._isAMomentObject === true ? value : moment(value);
      displayedDate = date.format('MM/DD/YYYY');
    }

    dispatch({
      type: 'SET_DATE',
      date: date
    });
    dispatch({
      type: 'SET_DISPLAYED_DATE',
      displayedDate: displayedDate
    });
  }, [value, withDefaultValue]);
  var timer = null;
  var date = state.date,
      displayedDate = state.displayedDate,
      isFocused = state.isFocused,
      isVisible = state.isVisible;

  var getDateValue = function getDateValue() {
    var dateValue = date ? date.format(displayFormat) : '';

    if (isVisible) {
      dateValue = displayedDate;
    }

    return dateValue;
  };

  var handleChange = function handleChange(_ref2) {
    var target = _ref2.target;
    clearTimeout(timer);
    dispatch({
      type: 'SET_IS_FOCUSED',
      isFocused: false
    });
    dispatch({
      type: 'SET_DISPLAYED_DATE',
      displayedDate: target.value
    });
    timer = setTimeout(function () {
      // Clearing the input
      if (!target.value) {
        onChange({
          target: {
            name: name,
            type: 'date',
            value: null
          }
        });
        dispatch({
          type: 'SET_DATE',
          date: null
        });
        dispatch({
          type: 'SET_DISPLAYED_DATE',
          displayedDate: ''
        });
        return;
      }

      handleDateChange(moment(target.value, 'MM/DD/YYYY'));
    }, wait);
  };

  var handleDateChange = function handleDateChange(dateValue) {
    if (moment(dateValue).isValid()) {
      onChange({
        target: {
          name: name,
          type: 'date',
          value: dateValue
        }
      });
      dispatch({
        type: 'SET_DATE',
        date: dateValue
      });
      dispatch({
        type: 'SET_DISPLAYED_DATE',
        displayedDate: dateValue.format('MM/DD/YYYY')
      });
    }
  };

  var handleDateClick = function handleDateClick(dateValue) {
    handleDateChange(dateValue);
    toggleDatepicker(false);
  };

  var handleTabClick = function handleTabClick(_ref3) {
    var keyCode = _ref3.keyCode,
        which = _ref3.which;
    var code = keyCode || which;

    if (code === 9) {
      toggleDatepicker(false);
    }
  };

  var toggleDatepicker = function toggleDatepicker(shown) {
    dispatch({
      type: 'SET_IS_VISIBLE',
      isVisible: shown
    });
    dispatch({
      type: 'SET_IS_FOCUSED',
      isFocused: shown
    });
  };

  return /*#__PURE__*/React.createElement(StyledDatepicker, {
    isOpen: isVisible,
    className: className
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Input, {
    disabled: disabled,
    type: "text",
    name: "start_date",
    id: id || name,
    value: getDateValue(),
    readOnly: readOnly,
    onChange: handleChange,
    icon: /*#__PURE__*/React.createElement(FontAwesomeIcon, {
      icon: faCalendarAlt
    }),
    onFocus: function onFocus() {
      return toggleDatepicker(true);
    },
    onClick: function onClick() {
      return toggleDatepicker(true);
    },
    onKeyDown: handleTabClick,
    tabIndex: tabIndex
  })), isFocused && /*#__PURE__*/React.createElement(DayPickerSingleDateController, {
    date: date,
    focused: true,
    numberOfMonths: 1,
    onDateChange: handleDateClick,
    onOutsideClick: function onOutsideClick() {
      return toggleDatepicker(false);
    },
    daySize: 37,
    transitionDuration: 0
  }));
}

Datepicker.defaultProps = {
  className: null,
  disabled: false,
  displayFormat: 'MMMM DD, YYYY',
  id: 'date',
  onChange: function onChange() {},
  readOnly: false,
  tabIndex: '0',
  value: null,
  wait: 600,
  withDefaultValue: false
};
Datepicker.propTypes = {
  className: PropTypes.string,
  disabled: PropTypes.bool,
  displayFormat: PropTypes.string,
  id: PropTypes.string,
  name: PropTypes.string.isRequired,
  onChange: PropTypes.func,
  readOnly: PropTypes.bool,
  tabIndex: PropTypes.string,
  value: PropTypes.oneOfType([momentPropTypes.momentObj, PropTypes.string]),
  wait: PropTypes.number,
  withDefaultValue: PropTypes.bool
};
export default Datepicker;