text: "use strict";
  Object.defineProperty(exports, "__esModule", { value: true });
  var tslib_1 = require("tslib");
  var React = require("react");
  var Utilities_1 = require("../../Utilities");
  var FocusZone_1 = require("../../FocusZone");
  var DateMath_1 = require("../../utilities/dateMath/DateMath");
  var Icon_1 = require("../../Icon");
  var stylesImport = require("./Calendar.scss");
  var styles = stylesImport;
  var CalendarMonth = /** @class */ (function (_super) {
      tslib_1.__extends(CalendarMonth, _super);
      function CalendarMonth(props) {
          var _this = _super.call(this, props) || this;
          _this._onKeyDown = function (callback, ev) {
              if (ev.which === 13 /* enter */) {
                  callback();
              }
          };
          _this._onSelectNextYear = function () {
              var _a = _this.props, navigatedDate = _a.navigatedDate, onNavigateDate = _a.onNavigateDate;
              onNavigateDate(DateMath_1.addYears(navigatedDate, 1), false);
          };
          _this._onSelectNextYearKeyDown = function (ev) {
              if (ev.which === 13 /* enter */) {
                  _this._onKeyDown(_this._onSelectNextYear, ev);
              }
          };
          _this._onSelectPrevYear = function () {
              var _a = _this.props, navigatedDate = _a.navigatedDate, onNavigateDate = _a.onNavigateDate;
              onNavigateDate(DateMath_1.addYears(navigatedDate, -1), false);
          };
          _this._onSelectPrevYearKeyDown = function (ev) {
              if (ev.which === 13 /* enter */) {
                  _this._onKeyDown(_this._onSelectPrevYear, ev);
              }
          };
          _this._onSelectMonthKeyDown = function (index) {
              return function (ev) { return _this._onKeyDown(function () { return _this._onSelectMonth(index); }, ev); };
          };
          _this._onSelectMonth = function (newMonth) {
              var _a = _this.props, navigatedDate = _a.navigatedDate, onNavigateDate = _a.onNavigateDate, onHeaderSelect = _a.onHeaderSelect;
              // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked
              if (onHeaderSelect) {
                  onHeaderSelect(true);
              }
              onNavigateDate(DateMath_1.setMonth(navigatedDate, newMonth), true);
          };
          _this._onHeaderSelect = function () {
              var onHeaderSelect = _this.props.onHeaderSelect;
              if (onHeaderSelect) {
                  onHeaderSelect(true);
              }
          };
          _this._onHeaderKeyDown = function (ev) {
              var onHeaderSelect = _this.props.onHeaderSelect;
              if (onHeaderSelect && (ev.which === 13 /* enter */ || ev.which === 32 /* space */)) {
                  onHeaderSelect(true);
              }
          };
          _this._selectMonthCallbacks = [];
          props.strings.shortMonths.map(function (month, index) {
              _this._selectMonthCallbacks[index] = _this._onSelectMonth.bind(_this, index);
          });
          _this._isCurrentMonth = _this._isCurrentMonth.bind(_this);
          _this._onSelectNextYear = _this._onSelectNextYear.bind(_this);
          _this._onSelectPrevYear = _this._onSelectPrevYear.bind(_this);
          _this._onSelectMonth = _this._onSelectMonth.bind(_this);
          return _this;
      }
      CalendarMonth.prototype.render = function () {
          var _this = this;
          var _a = this.props, navigatedDate = _a.navigatedDate, selectedDate = _a.selectedDate, strings = _a.strings, today = _a.today, highlightCurrentMonth = _a.highlightCurrentMonth, highlightSelectedMonth = _a.highlightSelectedMonth, navigationIcons = _a.navigationIcons, dateTimeFormatter = _a.dateTimeFormatter, minDate = _a.minDate, maxDate = _a.maxDate;
          var leftNavigationIcon = navigationIcons.leftNavigation;
          var rightNavigationIcon = navigationIcons.rightNavigation;
          // determine if previous/next years are in bounds
          var isPrevYearInBounds = minDate ? DateMath_1.compareDatePart(minDate, DateMath_1.getYearStart(navigatedDate)) < 0 : true;
          var isNextYearInBounds = maxDate ? DateMath_1.compareDatePart(DateMath_1.getYearEnd(navigatedDate), maxDate) < 0 : true;
          return (React.createElement("div", { className: Utilities_1.css('ms-DatePicker-monthPicker', styles.monthPicker) },
              React.createElement("div", { className: Utilities_1.css('ms-DatePicker-header', styles.header) },
                  this.props.onHeaderSelect ?
                      React.createElement("div", { className: Utilities_1.css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear, styles.headerToggleView), onClick: this._onHeaderSelect, onKeyDown: this._onHeaderKeyDown, "aria-label": dateTimeFormatter.formatYear(navigatedDate), role: 'button', tabIndex: 0 }, dateTimeFormatter.formatYear(navigatedDate))
                      :
                          React.createElement("div", { className: Utilities_1.css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }, dateTimeFormatter.formatYear(navigatedDate)),
                  React.createElement("div", { className: Utilities_1.css('ms-DatePicker-yearComponents', styles.yearComponents) },
                      React.createElement("div", { className: Utilities_1.css('ms-DatePicker-navContainer', styles.navContainer) },
                          React.createElement("button", { className: Utilities_1.css('ms-DatePicker-prevYear js-prevYear', styles.prevYear, (_b = {},
                                  _b['ms-DatePicker-prevYear--disabled ' + styles.prevYearIsDisabled] = !isPrevYearInBounds,
                                  _b)), disabled: !isPrevYearInBounds, onClick: isPrevYearInBounds ? this._onSelectPrevYear : undefined, onKeyDown: isPrevYearInBounds ? this._onSelectPrevYearKeyDown : undefined, "aria-label": strings.prevYearAriaLabel ? strings.prevYearAriaLabel + ' ' + dateTimeFormatter.formatYear(DateMath_1.addYears(navigatedDate, -1)) : undefined, role: 'button' },
                              React.createElement(Icon_1.Icon, { iconName: Utilities_1.getRTL() ? rightNavigationIcon : leftNavigationIcon })),
                          React.createElement("button", { className: Utilities_1.css('ms-DatePicker-nextYear js-nextYear', styles.nextYear, (_c = {},
                                  _c['ms-DatePicker-nextYear--disabled ' + styles.nextYearIsDisabled] = !isNextYearInBounds,
                                  _c)), disabled: !isNextYearInBounds, onClick: isNextYearInBounds ? this._onSelectNextYear : undefined, onKeyDown: isNextYearInBounds ? this._onSelectNextYearKeyDown : undefined, "aria-label": strings.nextYearAriaLabel ? strings.nextYearAriaLabel + ' ' + dateTimeFormatter.formatYear(DateMath_1.addYears(navigatedDate, 1)) : undefined, role: 'button' },
                              React.createElement(Icon_1.Icon, { iconName: Utilities_1.getRTL() ? leftNavigationIcon : rightNavigationIcon }))))),
              React.createElement(FocusZone_1.FocusZone, null,
                  React.createElement("div", { className: Utilities_1.css('ms-DatePicker-optionGrid', styles.optionGrid), role: 'grid' }, strings.shortMonths.map(function (month, index) {
                      var indexedMonth = DateMath_1.setMonth(navigatedDate, index);
                      var isCurrentMonth = _this._isCurrentMonth(index, navigatedDate.getFullYear(), today);
                      var isNavigatedMonth = navigatedDate.getMonth() === index;
                      var isSelectedMonth = selectedDate.getMonth() === index;
                      var isSelectedYear = selectedDate.getFullYear() === navigatedDate.getFullYear();
                      var isInBounds = (minDate ? DateMath_1.compareDatePart(minDate, DateMath_1.getMonthEnd(indexedMonth)) < 1 : true) &&
                          (maxDate ? DateMath_1.compareDatePart(DateMath_1.getMonthStart(indexedMonth), maxDate) < 1 : true);
                      return React.createElement("button", { role: 'gridcell', className: Utilities_1.css('ms-DatePicker-monthOption', styles.monthOption, (_a = {},
                              _a['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth] = highlightCurrentMonth && isCurrentMonth,
                              _a['ms-DatePicker-day--highlighted ' + styles.monthIsHighlighted] = (highlightCurrentMonth || highlightSelectedMonth) &&
                                  isSelectedMonth && isSelectedYear,
                              _a['ms-DatePicker-monthOption--disabled ' + styles.monthOptionIsDisabled] = !isInBounds,
                              _a)), disabled: !isInBounds, key: index, onClick: isInBounds ? _this._selectMonthCallbacks[index] : undefined, onKeyDown: isInBounds ? _this._onSelectMonthKeyDown(index) : undefined, "aria-label": dateTimeFormatter.formatMonthYear(indexedMonth, strings), "aria-selected": isCurrentMonth || isNavigatedMonth, "data-is-focusable": isInBounds ? true : undefined, ref: isNavigatedMonth ? 'navigatedMonth' : undefined }, month);
                      var _a;
                  })))));
          var _b, _c;
      };
      CalendarMonth.prototype.focus = function () {
          if (this.refs.navigatedMonth) {
              this.refs.navigatedMonth.tabIndex = 0;
              this.refs.navigatedMonth.focus();
          }
      };
      CalendarMonth.prototype._isCurrentMonth = function (month, year, today) {
          return today.getFullYear() === year && today.getMonth() === month;
      };
      return CalendarMonth;
  }(Utilities_1.BaseComponent));
  exports.CalendarMonth = CalendarMonth;
  //# sourceMappingURL=CalendarMonth.js.map