'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const core = require('./core-859ae5a6.js');

const Calendar = class {
    constructor(hostRef) {
        core.registerInstance(this, hostRef);
        /**
         * If true, display a calendar view, otherwise show yearly
         */
        this.monthMode = true;
        this.anjCalendarDaySelect = core.createEvent(this, "anjCalendarDaySelect", 7);
    }
    onDateChange() {
        if (!this.date) {
            return;
        }
        this.month = this.adapter.month(this.date);
        this.year = this.adapter.year(this.date);
        this.setHeaderData();
        this.updateMonth();
    }
    componentWillLoad() {
        this.weekdays = this.adapter.weekdays();
        this.months = this.adapter.months();
    }
    setHeaderData() {
        this.displayYear = this.adapter.prepHeaderYear(this.date);
        this.displayDate = this.adapter.prepHeaderDate(this.date);
    }
    displayActiveDay({ detail }) {
        this.displayYear = detail.year.toString();
        this.displayDate = this.adapter.prepHeaderDate(this.adapter.newDateFromArray(detail.year, detail.month, detail.day));
    }
    toggleMonthMode({ detail }) {
        this.monthMode = detail;
        this.controlsEl.focus();
    }
    updateYear({ detail }) {
        // Make increments in year
        this.year = this.year + detail;
        // Update current date to be first of the current month in the newly selected year
        this.date = this.adapter.newDateFromArray(this.year, this.month, 1);
    }
    selectMonth({ detail }) {
        // Update current date to be first of the newly selected month in the current year
        this.date = this.adapter.newDateFromArray(this.year, detail, 1);
        this.month = detail;
        this.monthMode = true;
        this.controlsEl.focus();
    }
    updateMonth(event = 0) {
        const change = isNaN(event) ? event.detail : event;
        // Make increments in month/year
        this.month = this.month + change;
        if (this.month < 0) {
            this.month = 11;
            this.year--;
        }
        if (this.month > 11) {
            this.month = 0;
            this.year++;
        }
        // Establish date info for previous, current and following month
        const lastMonth = {
            date: this.getMonthInfo(-1),
            days: this.getDaysInMonth(-1)
        };
        const thisMonth = {
            date: this.getMonthInfo(),
            days: this.getDaysInMonth(),
            dayOfFirst: this.getDayOfFirst()
        };
        const nextMonth = {
            date: this.getMonthInfo(1),
            dayOfFirst: this.getDayOfFirst(1)
        };
        // Establish dates for display on calendar for current month, including padded days.
        const prefix = Array.from(this.createRange(lastMonth.days - thisMonth.dayOfFirst + 1, lastMonth.days, lastMonth.date));
        const currentMonthDays = Array.from(this.createRange(1, thisMonth.days, thisMonth.date));
        let postfix = [];
        if (nextMonth.dayOfFirst > 0) {
            postfix = Array.from(this.createRange(1, 7 - nextMonth.dayOfFirst, nextMonth.date));
        }
        this.days = [].concat(prefix, currentMonthDays, postfix);
        this.package = {
            adapter: this.adapter,
            year: this.year,
            months: this.months,
            month: this.month,
            days: this.days,
            date: this.date,
            weekdays: this.weekdays
        };
    }
    selectDay({ detail }) {
        const selection = this.adapter.newDateFromArray(detail.year, detail.month, detail.day);
        this.date = selection;
        this.anjCalendarDaySelect.emit(selection);
    }
    focusControls() {
        return new Promise(resolve => {
            window.setTimeout(() => {
                this.controlsEl.focus();
                resolve();
            }, 100);
        });
    }
    componentDidLoad() {
        this.onDateChange();
    }
    getDayOfFirst(varianceFromCurrentMonth = 0) {
        const evaluatedMonth = this.month + varianceFromCurrentMonth;
        return this.adapter.dayOfFirst(this.year, evaluatedMonth);
    }
    getDaysInMonth(varianceFromCurrentMonth = 0) {
        const evaluatedMonth = this.month + varianceFromCurrentMonth;
        return this.adapter.daysInMonth(this.year, evaluatedMonth);
    }
    getMonthInfo(varianceFromCurrentMonth = 0) {
        const evaluatedMonth = this.month + varianceFromCurrentMonth;
        return this.adapter.getMonthInfo(this.year, evaluatedMonth);
    }
    createRange(start, end, dateInfo) {
        const rangeArray = [];
        for (let i = start; i <= end; i++) {
            rangeArray.push({
                day: i,
                month: this.adapter.month(dateInfo),
                year: this.adapter.year(dateInfo)
            });
        }
        return rangeArray;
    }
    render() {
        if (!this.package) {
            return;
        }
        return [
            core.h("div", { class: "anj-picker-header" }, core.h("p", { class: "anj-display-year" }, this.displayYear), core.h("p", { class: "anj-display-date" }, this.displayDate)),
            core.h("div", { class: "anj-date-controls", ref: r => this.controlsEl = r, tabindex: "0" }, this.monthMode
                ? core.h("anj-date-picker-month-view", { package: this.package, rangeParams: this.rangeParams })
                : core.h("anj-date-picker-year-view", { package: this.package }))
        ];
    }
    get element() { return core.getElement(this); }
    static get watchers() { return {
        "date": ["onDateChange"]
    }; }
    static get style() { return ".sc-anj-calendar-h {\n  display: block;\n  font-size: 0.875rem;\n  font-family: var(--anj-font-family);\n  font-weight: normal;\n  line-height: 1.5;\n  outline: none;\n  background-color: var(--anj-light);\n  background-clip: border-box;\n  border: 1px solid var(--anj-highlight);\n  border-radius: 0.25rem;\n  color: var(--anj-neutral-dark);\n  width: 16rem;\n  z-index: 1060;\n}\n.sc-anj-calendar-h, .sc-anj-calendar-h::before, .sc-anj-calendar-h::after {\n  -webkit-box-sizing: border-box;\n  box-sizing: border-box;\n  outline: none;\n}\n.sc-anj-calendar-h:focus, .sc-anj-calendar-h:active, .sc-anj-calendar-h *.sc-anj-calendar:focus, .sc-anj-calendar-h *.sc-anj-calendar:active {\n  outline: none;\n}\n.sc-anj-calendar-h .anj-picker-header.sc-anj-calendar {\n  background-color: var(--anj-primary);\n  border-radius: calc(0.25rem - 1);\n  color: var(--anj-light);\n  padding: 0.75rem 0.75rem 0.75rem 1.5rem;\n}\n.sc-anj-calendar-h .anj-picker-header.sc-anj-calendar p.sc-anj-calendar {\n  margin: 0;\n}\n.sc-anj-calendar-h .anj-picker-header.sc-anj-calendar .anj-display-year.sc-anj-calendar {\n  font-size: 1.1rem;\n}\n.sc-anj-calendar-h .anj-picker-header.sc-anj-calendar .anj-display-date.sc-anj-calendar {\n  font-size: 1rem;\n  font-weight: 200;\n}\n.sc-anj-calendar-h .anj-date-controls.sc-anj-calendar {\n  outline: none;\n}"; }
};

exports.anj_calendar = Calendar;
