import "core-js/modules/es6.object.assign";
import "core-js/modules/web.dom.iterable";
import "core-js/modules/es6.array.iterator";
import "core-js/modules/es6.object.keys";

function _extends() { _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; }; return _extends.apply(this, arguments); }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }

import React from 'react';
import PropTypes from 'prop-types';
import DatePickerMonth from "../DatePickerMonth";
import { Icon } from "../..";
import { addDays, addMonths, getLocaleData, getStartOfWeek, getWeekdayMinInLocale, isSameDay, localizeDate, now, shouldNextMonthDisable, shouldPrevMonthDisable, subtractMonths } from "../../utils/dateUtils";
import moment from 'moment';

var DatePickerCalendar =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(DatePickerCalendar, _React$Component);

  function DatePickerCalendar() {
    var _this;

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
    _this.state = {
      date: null
    };

    _this.setDate = function (date, cb) {
      _this.setState({
        date: date
      }, cb);
    };

    _this.increaseMonth = function (event) {
      var handleMonthChange = _this.context.handleMonthChange;
      var date = _this.state.date;

      _this.setDate(addMonths(date.clone(), 1), function () {
        return handleMonthChange && handleMonthChange(event, _this.state.date);
      });
    };

    _this.decreaseMonth = function (event) {
      var handleMonthChange = _this.context.handleMonthChange;
      var date = _this.state.date;

      _this.setDate(subtractMonths(date.clone(), 1), function () {
        return handleMonthChange && handleMonthChange(event, _this.state.date);
      });
    };

    return _this;
  }

  var _proto = DatePickerCalendar.prototype;

  _proto.componentDidMount = function componentDidMount() {
    var _this$context = this.context,
        focus = _this$context.focus,
        selected = _this$context.selected;
    this.setDate(focus || selected || now());
  };

  _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState, prevContext) {
    var focus = this.context.focus;

    if (focus && !isSameDay(prevContext.focus, focus)) {
      this.setDate(focus);
    }
  };

  _proto.render = function render() {
    var _this2 = this;

    var date = this.state.date;

    var _this$props = this.props,
        locale = _this$props.locale,
        monthFormat = _this$props.monthFormat,
        nextArialLabel = _this$props.nextArialLabel,
        previousArialLabel = _this$props.previousArialLabel,
        otherProps = _objectWithoutPropertiesLoose(_this$props, ["locale", "monthFormat", "nextArialLabel", "previousArialLabel"]);

    var renderMonthName = function renderMonthName() {
      return React.createElement("div", {
        className: "cui-datepicker__navigation--current-month"
      }, localizeDate(date, locale).format(monthFormat));
    };

    var renderPreviousMonthButton = function renderPreviousMonthButton() {
      var minDate = _this2.props.minDate;
      var allPrevDaysDisabled = shouldPrevMonthDisable(date, minDate);
      return React.createElement(Icon, {
        ariaLabel: previousArialLabel,
        disabled: allPrevDaysDisabled,
        onClick: _this2.decreaseMonth,
        name: "arrow-left_16"
      });
    };

    var renderNextMonthButton = function renderNextMonthButton() {
      var maxDate = _this2.props.maxDate;
      var allNextDaysDisabled = shouldNextMonthDisable(date, maxDate);
      return React.createElement(Icon, {
        ariaLabel: nextArialLabel,
        disabled: allNextDaysDisabled,
        onClick: _this2.increaseMonth,
        name: "arrow-right_16"
      });
    };

    var header = function header() {
      var startOfWeek = getStartOfWeek(date.clone());
      var dayNames = [];
      return dayNames.concat([0, 1, 2, 3, 4, 5, 6].map(function (offset) {
        var day = addDays(localizeDate(startOfWeek, locale), offset);
        var localeData = getLocaleData(day);
        var weekDayName = getWeekdayMinInLocale(localeData, day);
        return React.createElement("div", {
          key: offset,
          className: "cui-datepicker__day--name"
        }, weekDayName);
      }));
    };

    var renderMonth = function renderMonth() {
      return React.createElement("div", {
        className: "cui-datepicker__month-container"
      }, React.createElement("div", {
        className: "cui-datepicker__header"
      }, React.createElement("div", {
        className: "cui-datepicker__navigation"
      }, renderMonthName(), React.createElement("div", {
        className: "cui-datepicker__navigation--buttons"
      }, renderPreviousMonthButton(), renderNextMonthButton())), React.createElement("div", {
        className: "cui-datepicker__day--names"
      }, header())), React.createElement(DatePickerMonth, _extends({
        day: date
      }, otherProps)));
    };

    return React.createElement("div", null, date && renderMonth());
  };

  return DatePickerCalendar;
}(React.Component);

DatePickerCalendar.displayName = 'DatePickerCalendar';
DatePickerCalendar.contextTypes = {
  focus: PropTypes.instanceOf(moment),
  handleMonthChange: PropTypes.func,
  selected: PropTypes.instanceOf(moment)
};
DatePickerCalendar.propTypes = {
  locale: PropTypes.string,
  maxDate: PropTypes.instanceOf(Date),
  minDate: PropTypes.instanceOf(Date),
  monthFormat: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
  nextArialLabel: PropTypes.string,
  previousArialLabel: PropTypes.string
};
DatePickerCalendar.defaultProps = {
  locale: 'en',
  maxDate: null,
  minDate: null,
  monthFormat: 'MMMM YYYY',
  nextArialLabel: 'next',
  previousArialLabel: 'previous'
};
export default DatePickerCalendar;