var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { h } from '@stencil/core';
import { MapToComponentField, VegaSlimmer } from 'vega-slimmer/core';
import { CalendarDate, MonthPeriod } from '../../../../../helpers/calendar';
import { VegaInternalIconManager } from '../../../../../helpers/icon/internal-icon-manager';
import { Icons } from '../../../assets/icons';
import { DomNodeSubjectObserverFactory } from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
import { createEnterKeyHandlerToTriggerClick } from '../../../../../utils/accessibility';
import { VegaDropdownClick, VegaDropdownHide, VegaDropdownShow, } from '../../../../../helpers/event-manager/event-id/vega-event-id';
import { MonthNames } from '../../constants';
export class VegaDatePickerCalendarYearMonthSwitcherRenderer extends VegaSlimmer {
  render() {
    const canRender = !this.isDualMonths || this.showYearMonthDropdowns;
    return (canRender && (h("vega-flex", { justifyContent: 'center' },
      this.showYearMonthDropdowns
        ? this.renderMonthDropdownSwitcher()
        : this.renderCurrentMonth(),
      this.showYearMonthDropdowns
        ? this.renderYearDropdownSwitcher()
        : this.renderCurrentYear())));
  }
  getMonthDropdownOptions() {
    const currentYear = this.currentPeriod.current.year;
    return MonthNames.map((month, index) => {
      return {
        key: `${index}`,
        label: this.translationSlimmer.t(month),
        disabled: this.isDisabledMonth(currentYear, index + 1),
      };
    });
  }
  isDisabledMonth(year, month) {
    var _a, _b, _c, _d;
    const startMonth = (_a = this.minCalendarDate) === null || _a === void 0 ? void 0 : _a.month;
    const startYear = (_b = this.minCalendarDate) === null || _b === void 0 ? void 0 : _b.year;
    const endMonth = (_c = this.maxCalendarDate) === null || _c === void 0 ? void 0 : _c.month;
    const endYear = (_d = this.maxCalendarDate) === null || _d === void 0 ? void 0 : _d.year;
    return (year < startYear ||
      year > endYear ||
      (year === startYear && startMonth > month) ||
      (year === endYear && endMonth < month));
  }
  getYearDropdownOptions() {
    var _a, _b, _c, _d;
    const currentYear = new Date().getFullYear();
    const startYear = ((_a = this.minCalendarDate) === null || _a === void 0 ? void 0 : _a.year) ||
      Math.min(((_b = this.maxCalendarDate) === null || _b === void 0 ? void 0 : _b.year) || currentYear, currentYear) -
        VegaDatePickerCalendarYearMonthSwitcherRenderer.DEFAULT_MINIMUM_DROPDOWN_YEAR_BEFORE_CURRENT_YEAR;
    const endYear = ((_c = this.maxCalendarDate) === null || _c === void 0 ? void 0 : _c.year) ||
      Math.max(((_d = this.minCalendarDate) === null || _d === void 0 ? void 0 : _d.year) || currentYear, currentYear) +
        VegaDatePickerCalendarYearMonthSwitcherRenderer.DEFAULT_MINIMUM_DROPDOWN_YEAR_AFTER_CURRENT_YEAR;
    const years = [];
    for (let year = startYear; year <= endYear; year++) {
      years.push({ key: String(year), label: String(year) });
    }
    return years;
  }
  renderMonthDropdownSwitcher() {
    const { month } = this.currentPeriod.current;
    const monthIndex = month - 1;
    return (h("vega-dropdown", { trigger: "click", selectType: "single", source: this.getMonthDropdownOptions(), selectedSourceKey: monthIndex.toString(), "max-height": "300", isScreenPosition: this.yearMonthDropdownProps.isScreenPosition, ref: (node) => {
        this.onDropdownShowOrHide(node);
        DomNodeSubjectObserverFactory.addUniqueObserverToNode(node, VegaDropdownClick, (payload) => {
          const selectedMonth = parseInt(payload.detail);
          this.setDateBasedOnSelectedMonth(selectedMonth);
        });
      } }, this.renderCurrentMonth()));
  }
  renderYearDropdownSwitcher() {
    const { year } = this.currentPeriod.current;
    return (h("vega-dropdown", { trigger: "click", selectType: "single", source: this.getYearDropdownOptions(), selectedSourceKey: year.toString(), "max-height": "300", isScreenPosition: this.yearMonthDropdownProps.isScreenPosition, ref: (node) => {
        this.onDropdownShowOrHide(node);
        DomNodeSubjectObserverFactory.addUniqueObserverToNode(node, VegaDropdownClick, (payload) => {
          this.setDateBasedOnSelectedYear(parseInt(payload.detail));
        });
      } }, this.renderCurrentYear()));
  }
  /**
   * Control ui when dropdown shows or closes
   *
   * @param {HTMLVegaDropdownElement} dropdown - Month or year dropdown
   */
  onDropdownShowOrHide(dropdown) {
    DomNodeSubjectObserverFactory.addUniqueObserverToNode(dropdown, VegaDropdownShow, async () => {
      dropdown.classList.add('active');
    });
    DomNodeSubjectObserverFactory.addUniqueObserverToNode(dropdown, VegaDropdownHide, () => {
      const parentElement = dropdown.closest('.calendar');
      if (parentElement) {
        const dropdown = parentElement.querySelector('vega-dropdown.active');
        dropdown && dropdown.classList.remove('active');
      }
    });
  }
  renderCurrentMonth() {
    const label = this.translationSlimmer.t(this.currentPeriod.current.getMonthName());
    return this.size === 'small' && this.showYearMonthDropdowns ? (h("vega-button-link", { class: "small-month-item-name", size: "small", label: label })) : (h("div", { class: "month-item-name", role: this.showYearMonthDropdowns ? 'button' : undefined, tabIndex: this.showYearMonthDropdowns ? 0 : undefined, "aria-label": this.showYearMonthDropdowns ? label : undefined, onKeyDown: this.showYearMonthDropdowns ? createEnterKeyHandlerToTriggerClick() : undefined },
      h("span", null, label),
      this.renderDropdownSwitchIcon()));
  }
  renderCurrentYear() {
    const label = this.currentPeriod.current.year.toString();
    return this.size === 'small' && this.showYearMonthDropdowns ? (h("vega-button-link", { class: "small-month-item-year", size: "small", label: label })) : (h("div", { class: "month-item-year", role: this.showYearMonthDropdowns ? 'button' : undefined, tabIndex: this.showYearMonthDropdowns ? 0 : undefined, "aria-label": this.showYearMonthDropdowns ? label : undefined, onKeyDown: this.showYearMonthDropdowns ? createEnterKeyHandlerToTriggerClick() : undefined },
      h("span", null, label),
      this.renderDropdownSwitchIcon()));
  }
  renderDropdownSwitchIcon() {
    return (this.showYearMonthDropdowns && (h("vega-icon", { icon: VegaInternalIconManager.getIconKey('caret-down'), color: 'text-link' })));
  }
  setDateBasedOnSelectedMonth(monthIndex) {
    const { year } = this.currentPeriod.current;
    const date = new Date(year, monthIndex, 1);
    const newPeriod = new MonthPeriod(CalendarDate.from(date));
    this.currentPeriodController.updateCalendarPeriod(newPeriod);
  }
  setDateBasedOnSelectedYear(year) {
    const { month } = this.currentPeriod.current;
    const startMonthIndex = month - 1;
    const date = new Date(year, startMonthIndex, 1);
    const newPeriod = new MonthPeriod(CalendarDate.from(date));
    this.currentPeriodController.updateCalendarPeriod(newPeriod);
  }
}
(() => {
  VegaInternalIconManager.register({
    'caret-down': Icons['caret-down'],
  });
})();
VegaDatePickerCalendarYearMonthSwitcherRenderer.DEFAULT_MINIMUM_DROPDOWN_YEAR_BEFORE_CURRENT_YEAR = 10;
VegaDatePickerCalendarYearMonthSwitcherRenderer.DEFAULT_MINIMUM_DROPDOWN_YEAR_AFTER_CURRENT_YEAR = 10;
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "currentPeriodController", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "showYearMonthDropdowns", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "translationSlimmer", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "minCalendarDate", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "maxCalendarDate", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "yearMonthDropdownProps", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "currentPeriod", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "size", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "mode", void 0);
__decorate([
  MapToComponentField()
], VegaDatePickerCalendarYearMonthSwitcherRenderer.prototype, "isDualMonths", void 0);
