import { ChangeDetectorRef, Component, ElementRef, EventEmitter, forwardRef, Input, Output, Renderer2 } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { I18nService } from 'ng-devui/i18n';
import { DatePickerConfigService as DatePickerConfig } from '../date-picker.config.service';
import { SelectDateRangeChangeReason } from '../date-range-change-event-args.model';
import { DatepickerComponent as SingleDatepickerComponent } from '../datepicker.component';
import * as i0 from "@angular/core";
import * as i1 from "../date-picker.config.service";
import * as i2 from "ng-devui/i18n";
import * as i3 from "@angular/common";
import * as i4 from "@angular/forms";
import * as i5 from "ng-devui/button";
export class TwoDatepickerSingleComponent extends SingleDatepickerComponent {
    constructor(elementRef, renderer, datePickerConfig, changeDetectorRef, i18n) {
        super(elementRef, renderer, datePickerConfig, changeDetectorRef, i18n);
        this.elementRef = elementRef;
        this.renderer = renderer;
        this.datePickerConfig = datePickerConfig;
        this.changeDetectorRef = changeDetectorRef;
        this.i18n = i18n;
        this.selectedRange = Array(2);
        this.rangePicker = false;
        this.isAuxiliary = false;
        this.currentCalendars = Array(2);
        this.hoverOnDate = new EventEmitter();
        this.rangeSelected = new EventEmitter();
        this.rangeSelecting = new EventEmitter();
        this.syncPickerPair = new EventEmitter();
        this.consolidateTime = new EventEmitter();
        this.setI18nText();
    }
    ngOnInit() {
        [this.rangeStart, this.rangeEnd] = this.selectedRange;
        if (!this.isAuxiliary && !this.rangeStart) {
            // 主面板，未选择开始日期的情况
            this.onSelectDateChanged();
            this.onDisplayWeeksChange();
            this.initDatePicker();
        }
        else if (this.isAuxiliary && !this.rangeEnd) {
            // 副面板，未选择结束日期的情况
            this.onSelectDateChanged();
            this.initDatePicker();
            this.onNextMonth('init');
            this.selectedDate = new Date(this.currentYear, this.currentMonthIndex);
        }
        else if (!this.isAuxiliary && this.rangeStart) {
            // 主面板，已选择开始日期的情况
            this.selectedDate = this.rangeStart;
            super.ngOnInit();
        }
        else if (this.isAuxiliary && this.rangeEnd) {
            // 副面板，已选择结束日期的情况
            const rangeStart = this.convertDate(this.rangeStart);
            const rangeEnd = this.convertDate(this.rangeEnd);
            this.currentYear = rangeEnd.getFullYear();
            this.currentMonthIndex = rangeEnd.getMonth();
            this.selectedDate = this.rangeEnd;
            super.ngOnInit();
            // 处理选择的日期范围开始和结束在同一个月的情况
            if (rangeStart && rangeEnd && rangeStart.getFullYear() === rangeEnd.getFullYear() &&
                rangeStart.getMonth() === rangeEnd.getMonth()) {
                this.onNextMonth('init');
            }
            this.selectedDate = new Date(this.currentYear, this.currentMonthIndex);
        }
        if (!this.selectedRange.every(curDate => !!curDate)) {
            this.selectingRange = true;
        }
        this.availableMonths = this.onDisplayMonthsChange();
        this.notifyCalenderChange();
    }
    /*
    **  @param invocation:调用时机
    */
    onSelectDate($event, date, invocation) {
        if ($event.stopPropagation) {
            $event.stopPropagation();
        }
        if (invocation !== 'init') {
            if (this.isDisabledDay(date)) {
                $event.preventDefault();
                return;
            }
            this.selectRange(date);
        }
    }
    emitHoverDate($event, date) {
        if (this.selectingRange && date.getTime() <= this.maxDate.getTime() && date.getTime() >= this.minDate.getTime()) {
            this.hoverOnDate.emit(date);
        }
    }
    selectSingle(date) {
        if (date) {
            const ensureRange = this.ensureRangeValueOrder([this.rangeStart, this.rangeEnd]);
            this.rangeChange(ensureRange);
        }
    }
    convertDate(date) {
        return date ? this.dateConverter.parse(date) : null;
    }
    selectRange(date, passive = false) {
        if (this.whichOpen === 'start') {
            if (!this.rangeEnd) {
                this.rangeEnd = null;
                this.selectingRange = true;
            }
            else {
                this.selectingRange = false;
            }
            if (!passive) {
                this.rangeStart = this.convertDate(date);
                this.selectSingle(date);
                this.rangeSelecting.emit(this.rangeStart);
            }
        }
        else if (this.whichOpen === 'end') {
            if (this.rangeStart && this.rangeEnd || (!this.rangeStart && !this.rangeEnd)) {
                this.selectingRange = false;
            }
            else {
                this.selectingRange = true;
                if (!this.rangeStart) {
                    this.rangeStart = null;
                }
                if (!this.rangeEnd) {
                    this.rangeEnd = null;
                }
            }
            if (!passive) {
                this.rangeEnd = this.convertDate(date);
                this.selectSingle(date);
                this.rangeSelecting.emit(this.rangeEnd);
            }
        }
    }
    rangeChange(range) {
        [this.rangeStart, this.rangeEnd] = this.selectedRange = range;
        this.notifyValueChange(range);
    }
    writeValue(selectedRange) {
        this.selectedRange = selectedRange;
    }
    notifyValueChange(selectedRange) {
        this.onChange(selectedRange);
        this.rangeSelected.emit({
            reason: SelectDateRangeChangeReason.date,
            selectedRange: selectedRange
        });
    }
    isSelectDay(date) {
        let rangeSource = this.selectedRange;
        if (this.selectingRange) {
            rangeSource = [this.rangeStart || this.rangeEnd, this.previewEnd];
        }
        if ((!Array.isArray(rangeSource))) {
            return;
        }
        return rangeSource.some((selectedDate) => {
            if (!selectedDate || !date) {
                return false;
            }
            return (date.getFullYear() === selectedDate.getFullYear() &&
                date.getMonth() === selectedDate.getMonth() &&
                date.getDate() === selectedDate.getDate());
        });
    }
    isBetweenDay(date) {
        if (Array.isArray(this.selectedRange) && this.selectedRange.every(day => !!day)) {
            const index = this.selectedRange.findIndex(day => {
                return date.getFullYear() === day.getFullYear() &&
                    date.getMonth() === day.getMonth() &&
                    date.getDate() === day.getDate();
            });
            return ['devui-day-start', 'devui-day-end'][index];
        }
        else {
            return;
        }
    }
    ngOnChanges(changes) {
        if (Object.prototype.hasOwnProperty.call(changes, 'selectedRange')) {
            [this.rangeStart, this.rangeEnd] = changes['selectedRange'].currentValue;
            if (this.rangeStart && this.rangeEnd) {
                this.selectingRange = false;
            }
        }
    }
    isInRange(date) {
        let rangeStart = this.rangeStart;
        let rangeEnd = this.rangeEnd;
        if (this.selectingRange) {
            if (rangeEnd) {
                rangeStart = this.previewEnd;
            }
            else if (rangeStart) {
                rangeEnd = this.previewEnd;
            }
        }
        date = (new Date(date)).getTime();
        return date < Math.max((new Date(rangeStart)).getTime(), (new Date(rangeEnd)).getTime())
            && date > Math.min((new Date(rangeStart)).getTime(), (new Date(rangeEnd)).getTime());
    }
    ensureRangeValueOrder(dateRange) {
        if (Array.isArray(dateRange) && dateRange.length === 2 && dateRange.every(curDate => !!curDate)) {
            if (dateRange[0].getTime() > dateRange[1].getTime()) {
                if (this.whichOpen === 'start') {
                    return [dateRange[0], null];
                }
                else {
                    return [null, dateRange[1]];
                }
            }
        }
        return dateRange;
    }
    onNextMonth(invocation) {
        if (this.hasNextMonth() || invocation === 'init') {
            let maxDateInRange;
            if (invocation === 'init') {
                maxDateInRange = this.selectedRange.reduce((start, end) => new Date(end) > new Date(start) ? end : start);
            }
            super.onNextMonth(maxDateInRange, 'init');
            this.notifyCalenderChange();
        }
    }
    hasNextMonth() {
        let hasNextMonth = true;
        // 副面板只用考虑maxDate的影响
        // 主面板同时考虑maxDate和日历的影响
        // minDate的影响在super.hasNextMonth()中有计算
        if (!this.isAuxiliary && this.currentCalendars[0] && this.currentCalendars[1]) {
            hasNextMonth = this.isBeforeMoreThanOneMonth(this.currentCalendars[0], this.currentCalendars[1]);
        }
        return hasNextMonth && super.hasNextMonth();
    }
    onPreMonth() {
        if (this.hasPreMonth()) {
            super.onPreMonth();
            this.notifyCalenderChange();
        }
    }
    hasPreMonth() {
        let hasPrevMonth = true;
        // 主面板只用考虑minDate的影响
        // 副面板同时考虑minDate和日历的影响
        // minDate的影响在super.hasPreMonth()中有计算
        if (this.isAuxiliary && this.currentCalendars[0] && this.currentCalendars[1]) {
            hasPrevMonth = this.isAfterMoreThanOneMonth(this.currentCalendars[1], this.currentCalendars[0]);
        }
        return hasPrevMonth && super.hasPreMonth();
    }
    hasPreYearOption() {
        let hasPrevYear = true;
        if (this.openChooseYear) {
            if (!this.isAuxiliary) {
                hasPrevYear = this.nowMinYear > this.minDate.getFullYear();
            }
            else {
                hasPrevYear = this.nowMinYear > this.minDate.getFullYear() &&
                    this.isBeforeMoreThanOneYear(this.currentCalendars[0], { year: this.nowMinYear, month: this.currentCalendars[1].month });
            }
        }
        else if (this.currentCalendars[0] && this.currentCalendars[1]) {
            // 主面板只用考虑minDate的影响
            if (!this.isAuxiliary) {
                hasPrevYear = this.currentCalendars[0].year > this.minDate.getFullYear();
            }
            else { // 副面板同时考虑minDate和日历的影响
                hasPrevYear = this.currentCalendars[1].year > this.minDate.getFullYear() &&
                    this.isBeforeMoreThanOneYear(this.currentCalendars[0], this.currentCalendars[1]);
            }
        }
        return hasPrevYear;
    }
    hasNextYearOption() {
        let hasNextYear = true;
        if (this.openChooseYear) {
            if (this.isAuxiliary) {
                hasNextYear = this.nowMaxYear < this.maxDate.getFullYear();
            }
            else {
                hasNextYear = this.nowMaxYear < this.maxDate.getFullYear() &&
                    this.isAfterMoreThanOneYear(this.currentCalendars[1], { year: this.nowMaxYear, month: this.currentCalendars[0].month });
            }
        }
        else if (this.currentCalendars[0] && this.currentCalendars[1]) {
            // 副面板只用考虑maxDate的影响
            if (this.isAuxiliary) {
                hasNextYear = this.currentCalendars[1].year < this.maxDate.getFullYear();
            }
            else { // 主面板同时考虑maxDate和日历的影响
                hasNextYear = this.currentCalendars[0].year < this.maxDate.getFullYear() &&
                    this.isAfterMoreThanOneYear(this.currentCalendars[1], this.currentCalendars[0]);
            }
        }
        return hasNextYear;
    }
    onPreYear() {
        if (!this.hasPreYearOption()) {
            return;
        }
        if (this.openChooseYear) {
            if (this.nowMinYear - this._yearNumber >= this.minDate.getFullYear()) {
                this.nowMaxYear = this.nowMinYear - 1;
                this.nowMinYear = this.nowMinYear - this._yearNumber;
            }
            else {
                this.nowMaxYear = this.nowMinYear - 1;
                this.nowMinYear = this.minDate.getFullYear();
            }
            this.onYearRangeChange();
        }
        else {
            this.onSelectYear(Number(this.currentYear) - 1);
        }
        this.notifyCalenderChange();
    }
    onNextYear() {
        if (!this.hasNextYearOption()) {
            return;
        }
        if (this.openChooseYear) {
            if (this.nowMaxYear + this._yearNumber <= this.maxDate.getFullYear()) {
                this.nowMinYear = this.nowMaxYear + 1;
                this.nowMaxYear = this.nowMaxYear + this._yearNumber;
            }
            else {
                this.nowMinYear = this.nowMaxYear + 1;
                this.nowMaxYear = this.maxDate.getFullYear();
            }
            this.onYearRangeChange();
        }
        else {
            this.onSelectYear(Number(this.currentYear) + 1);
        }
        this.notifyCalenderChange();
    }
    isBeforeMoreThanOneMonth(dateA, dateB) {
        if (dateA.year > dateB.year) {
            return false;
        }
        if (dateA.year === dateB.year && dateB.month <= dateA.month + 1) {
            return false;
        }
        // 处理A日期为B日期前一年12月同时B日期为1月的特殊情况
        return !(dateB.year - dateA.year === 1 && dateA.month === 11 && dateB.month === 0);
    }
    isAfterMoreThanOneMonth(dateA, dateB) {
        if (dateA.year < dateB.year) {
            return false;
        }
        if (dateA.year === dateB.year && dateB.month + 1 >= dateA.month) {
            return false;
        }
        // 处理A日期为B日期后一年1月同时B日期为12月的特殊情况
        return !(dateA.year - dateB.year === 1 && dateA.month === 0 && dateB.month === 11);
    }
    isBeforeMoreThanOneYear(dateA, dateB) {
        if (dateA.year >= dateB.year) {
            return false;
        }
        // 处理B日期比A日期大1年同时A日期月份大于B日期月份的情况
        return !(dateB.year - dateA.year === 1 && dateA.month >= dateB.month);
    }
    isAfterMoreThanOneYear(dateA, dateB) {
        if (dateA.year <= dateB.year) {
            return false;
        }
        // 处理A日期比B日期大1年同时A日期月份小于B日期月份的情况
        return (!(dateA.year - dateB.year === 1 && dateA.month <= dateB.month));
    }
    isYearDisable(year) {
        if (this.isAuxiliary) {
            // 先判定主面板是否比附面板小一年以上，是的话disabled为false;
            return !(this.isBeforeMoreThanOneYear(this.currentCalendars[0], { year: year + 1, month: this.currentCalendars[1].month }) ||
                // 主附面板在同一年时，判断主附面板月是否在临界值；
                (this.currentCalendars[0].year === year && this.currentCalendars[0].month !== 11));
        }
        else {
            return !(this.isAfterMoreThanOneYear(this.currentCalendars[1], { year: year - 1, month: this.currentCalendars[0].month }) ||
                (this.currentCalendars[1].year === year && this.currentCalendars[1].month !== 0));
        }
    }
    isMonthDisable(month) {
        if (this.isAuxiliary) {
            return !this.isBeforeMoreThanOneMonth(this.currentCalendars[0], { year: this.currentCalendars[1].year, month: parseInt(month, 10) - 1 + 1 });
        }
        else {
            return !this.isAfterMoreThanOneMonth(this.currentCalendars[1], { year: this.currentCalendars[0].year, month: parseInt(month, 10) - 1 - 1 });
        }
    }
    onSelectMonth(month) {
        if (month.disabled || this.isMonthDisable(month.title)) {
            return;
        }
        this.currentMonthIndex = month.index;
        this.onDisplayWeeksChange();
        this.openChooseMonth = false;
        this.isAuxiliary ? this.currentCalendars[1].month = this.currentMonthIndex : this.currentCalendars[0].month = this.currentMonthIndex;
    }
    onSelectYear(year, $event) {
        if ($event) {
            $event.stopPropagation();
        }
        const yearDisabled = typeof year === 'object' ? year.disabled : false;
        const yearTitle = typeof year === 'object' ? year.title : year;
        if (yearDisabled || this.isYearDisable(year.title)) {
            return;
        }
        this.currentYear = yearTitle;
        this.onDisplayWeeksChange();
        this.availableMonths = this.onDisplayMonthsChange();
        this.openChooseYear = false;
        if (!$event) {
            this.isAuxiliary ? this.currentCalendars[1].year = this.currentYear : this.currentCalendars[0].year = this.currentYear;
            return;
        }
        this.openChooseMonth = true;
        if (this.isAuxiliary) {
            this.currentCalendars[1].year = this.currentYear;
            this.currentCalendars[1].month = 11;
            this.currentMonthIndex = 11;
        }
        else {
            this.currentCalendars[0].year = this.currentYear;
            this.currentCalendars[0].month = 0;
            this.currentMonthIndex = 0;
        }
    }
    notifyCalenderChange() {
        this.syncPickerPair.emit({
            year: this.currentYear,
            month: this.currentMonthIndex
        });
    }
    confirmTime() {
        this.consolidateTime.emit();
    }
    onSelectDateChanged() {
        let date = this.selectedDate || new Date();
        if (date.getTime() < this.minDate.getTime()) {
            date = this.minDate;
        }
        if (date.getTime() > this.maxDate.getTime()) {
            date = this.maxDate;
        }
        if (!this.isAuxiliary && this.rangeEnd && !this.rangeStart) {
            date = new Date(this.rangeEnd);
            date.setMonth(date.getMonth() - 1);
        }
        this.selectedDate = this.selectedDate || date;
        this.currentYear = date.getFullYear();
        this.currentMonthIndex = date.getMonth();
    }
}
TwoDatepickerSingleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TwoDatepickerSingleComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.DatePickerConfigService }, { token: i0.ChangeDetectorRef }, { token: i2.I18nService }], target: i0.ɵɵFactoryTarget.Component });
TwoDatepickerSingleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: TwoDatepickerSingleComponent, selector: "d-two-datepicker-single", inputs: { selectedRange: "selectedRange", rangePicker: "rangePicker", isAuxiliary: "isAuxiliary", currentCalendars: "currentCalendars", whichOpen: "whichOpen" }, outputs: { hoverOnDate: "hoverOnDate", rangeSelected: "rangeSelected", rangeSelecting: "rangeSelecting", syncPickerPair: "syncPickerPair", consolidateTime: "consolidateTime" }, providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => TwoDatepickerSingleComponent),
            multi: true,
        }
    ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"devui-month-view {{ cssClass }}\">\n  <table class=\"devui-table devui-month-view-table\">\n    <thead>\n      <tr class=\"devui-calender-header\">\n        <td>\n          <a\n            class=\"devui-btn-link\"\n            aria-hidden=\"true\"\n            (click)=\"onPreYear()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasPreYearOption() }\"\n          >\n            <svg\n              width=\"10px\"\n              height=\"10px\"\n              viewBox=\"0 0 10 10\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-1.000000, -1.000000)\">\n                  <path\n                    d=\"M11,1.83333333 L11,10.1666667 L7,7.38833333 L7,10.1666667 L1,6 L7,1.83333333 L7,4.61033333 L11,1.83333333 Z\"\n                  ></path>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td>\n          <a\n            *ngIf=\"!openChooseYear && !openChooseMonth\"\n            class=\"devui-btn-link devui-btn-left\"\n            aria-hidden=\"true\"\n            (click)=\"onPreMonth()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasPreMonth() }\"\n          >\n            <svg\n              width=\"6px\"\n              height=\"10px\"\n              viewBox=\"0 0 6 10\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-3.000000, -1.000000)\">\n                  <polygon\n                    transform=\"translate(6.000000, 6.000000) rotate(-90.000000) translate(-6.000000, -6.000000) \"\n                    points=\"6 3 10.1666667 9 1.83333333 9\"\n                  ></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td colspan=\"3\" class=\"devui-dropdown\">\n          <span class=\"devui-date-title\" (click)=\"toggle($event, 'year')\">{{ i18nText?.yearDisplay(currentYear) }}</span>\n          <span class=\"devui-date-title\" (click)=\"toggle($event, 'month')\">{{ (i18nText?.monthsOfYear)[currentMonthIndex] }}</span>\n          <ul class=\"devui-monthOption text-center\" [style.display]=\"openChooseMonth ? 'block' : 'none'\">\n            <li\n              *ngFor=\"let month of availableMonths\"\n              [ngClass]=\"{ active: currentMonthIndex == month.index, disabled: month.disabled || isMonthDisable(month.title) }\"\n              (click)=\"onSelectMonth(month)\"\n            >\n              {{ month.title }}\n            </li>\n          </ul>\n          <ul class=\"devui-yearOption text-center\" [style.display]=\"openChooseYear ? 'block' : 'none'\">\n            <li\n              *ngFor=\"let item of yearOptions\"\n              [ngClass]=\"{ active: currentYear == item.title, disabled: item.disabled || isYearDisable(item.title) }\"\n              (click)=\"onSelectYear(item, $event)\"\n            >\n              {{ item.title }}\n            </li>\n          </ul>\n        </td>\n        <td>\n          <a\n            *ngIf=\"!openChooseYear && !openChooseMonth\"\n            class=\"devui-btn-link devui-btn-right\"\n            aria-hidden=\"true\"\n            (click)=\"onNextMonth()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasNextMonth() }\"\n          >\n            <svg\n              width=\"6px\"\n              height=\"9px\"\n              viewBox=\"0 0 6 9\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-3.000000, -2.000000)\">\n                  <polygon\n                    transform=\"translate(6.000000, 6.166667) scale(-1, 1) rotate(-90.000000) translate(-6.000000, -6.166667) \"\n                    points=\"6 3.16666667 10.1666667 9.16666667 1.83333333 9.16666667\"\n                  ></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td>\n          <a\n            class=\"devui-btn-link\"\n            aria-hidden=\"true\"\n            (click)=\"onNextYear()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasNextYearOption() }\"\n          >\n            <svg\n              width=\"10px\"\n              height=\"9px\"\n              viewBox=\"0 0 10 9\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-1.000000, -2.000000)\">\n                  <polygon points=\"5 4.77777778 5 2 11 6.16666667 5 10.3333333 5 7.55555556 1 10.3333333 1 2\"></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n      </tr>\n      <tr class=\"small text-center devui-week-header\">\n        <td *ngFor=\"let item of i18nText?.daysOfWeek\">{{ item }}</td>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let week of displayWeeks\">\n        <td\n          *ngFor=\"let day of week\"\n          class=\"devui-day {{ isBetweenDay(day.date) }}\"\n          [ngClass]=\"{\n            'devui-out-of-month': !day.inMonth,\n            'devui-in-month-day': day.inMonth,\n            active: isSelectDay(day.date),\n            disabled: isDisabledDay(day.date),\n            'devui-in-range': isInRange(day.date),\n            'devui-today': day.isToday\n          }\"\n          (click)=\"onSelectDate($event, day.date)\"\n          (mouseover)=\"emitHoverDate($event, day.date)\"\n        >\n          <div class=\"devui-calendar-date\">{{ day.day }}</div>\n        </td>\n      </tr>\n    </tbody>\n    <tfoot>\n      <tr class=\"time-picker-view\" *ngIf=\"showTime\">\n        <ng-container *ngIf=\"!customViewTemplate\">\n          <td colspan=\"4\">\n            <div class=\"devui-timepicker\" *ngIf=\"showTime\" [ngClass]=\"{ 'devui-timepicker-disabled': isDisabledTime() }\">\n              <div class=\"devui-time\">\n                <input [ngModel]=\"currentHour\" (keydown)=\"fixTime($event, 'h')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('h')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('h')\"></div>\n                </div>\n              </div>\n              <div class=\"devui-time\">\n                <input class=\"devui-minutes\" [ngModel]=\"currentMinute\" (keydown)=\"fixTime($event, 'm')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('m')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('m')\"></div>\n                </div>\n              </div>\n              <div class=\"devui-time\">\n                <input class=\"devui-seconds\" [ngModel]=\"currentSecond\" (keydown)=\"fixTime($event, 's')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('s')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('s')\"></div>\n                </div>\n              </div>\n            </div>\n          </td>\n          <td colspan=\"3\" *ngIf=\"isAuxiliary\">\n            <div class=\"devui-btn-wrapper\">\n              <d-button bsStyle=\"common\" [disabled]=\"!rangeStart || !rangeEnd || disabled\" (btnClick)=\"confirmTime()\" bsSize=\"sm\">\n                {{ i18nCommonText?.btnConfirm }}\n              </d-button>\n            </div>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</div>\n", styles: [".devui-font-size-base{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:12px;font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5}.devui-font-size-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px);font-weight:700;line-height:1.5}.devui-font-size-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px);font-weight:700;line-height:1.5}.devui-font-size-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;line-height:1.5}.devui-date-header{height:38px}.devui-month-view{background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);font-size:12px;font-size:var(--devui-font-size, 12px);width:240px;text-align:center;box-shadow:0 4px 8px #252b3a33;box-shadow:var(--devui-shadow-length-connected-overlay, 0 4px 8px 0) var(--devui-shadow, rgba(37, 43, 58, .2));border-radius:2px;border-radius:var(--devui-border-radius, 2px);position:relative}.devui-month-view .devui-month-view-table{margin-bottom:0;background:#ffffff;background:var(--devui-connected-overlay-bg, #ffffff);table-layout:fixed;border-collapse:collapse;width:100%}.devui-month-view .devui-date-title{font-weight:700;cursor:pointer;font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-month-view .devui-date-title:hover{color:#7693f5;color:var(--devui-brand-hover, #7693f5)}.devui-month-view .devui-btn-link{text-decoration:none;cursor:pointer;display:block}.devui-month-view .devui-btn-link.devui-year-month-disabled{cursor:not-allowed}.devui-month-view .devui-btn-link.devui-year-month-disabled svg path,.devui-month-view .devui-btn-link.devui-year-month-disabled svg polygon{fill:#cfd0d3;fill:var(--devui-disabled-text, #cfd0d3)}.devui-month-view .devui-btn-link svg path,.devui-month-view .devui-btn-link svg polygon{fill:#575d6c;fill:var(--devui-text-weak, #575d6c)}.devui-month-view .devui-btn-link:not(.devui-year-month-disabled):hover svg path,.devui-month-view .devui-btn-link:not(.devui-year-month-disabled):hover svg polygon{fill:#252b3a;fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-month-view .date-select{border:none;background:transparent;outline:none;-moz-appearance:none;-webkit-appearance:none;appearance:none}.devui-month-view .devui-week-header{cursor:default;margin-bottom:16px}.devui-month-view .devui-week-header td{width:32px;height:24px;line-height:24px;color:#252b3a;color:var(--devui-text, #252b3a);border:none}.devui-month-view .devui-day:not(.disabled){cursor:pointer;font-size:12px;font-size:var(--devui-font-size, 12px);color:#dfe1e6;color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-month-view .devui-day.disabled{cursor:not-allowed}.devui-calendar-date{display:block;margin:0 3px;width:20px;height:20px;padding:0;line-height:20px;background:transparent;text-align:center;font-size:12px;font-size:var(--devui-font-size, 12px);color:#252b3a;color:var(--devui-text, #252b3a)}.devui-month-view .devui-out-of-month .devui-calendar-date{opacity:.8;background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);color:#d7d8da;color:var(--devui-line, #d7d8da)}.devui-month-view .devui-out-of-month:not(.disabled):hover .devui-calendar-date{background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-month-view .devui-minutes:before{content:\":\";text-align:center;position:absolute;margin-left:-13px}.devui-month-view .devui-seconds:before{content:\":\";text-align:center;position:absolute;margin-left:-13px}.devui-yearOption,.devui-monthOption{width:240px;height:195px;position:absolute;left:-68px;top:30px;background:#ffffff;background:var(--devui-base-bg, #ffffff);z-index:1}.devui-yearOption li,.devui-monthOption li{width:60px;height:68px;line-height:68px;text-align:center;display:inline-block;background:#ffffff;background:var(--devui-base-bg, #ffffff);border-radius:2px;border-radius:var(--devui-border-radius, 2px)}.devui-yearOption li:hover,.devui-monthOption li:hover{background:#f2f2f3;background:var(--devui-list-item-hover-bg, #f2f2f3);color:#252b3a;color:var(--devui-list-item-hover-text, #252b3a);cursor:pointer}.devui-yearOption li.active:not(.disabled),.devui-monthOption li.active:not(.disabled){color:#252b3a;color:var(--devui-list-item-active-text, #252b3a);background-color:#f2f5fc;background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-yearOption li.active:not(.disabled):hover,.devui-monthOption li.active:not(.disabled):hover{background-color:#f2f5fc;background-color:var(--devui-list-item-active-hover-bg, #f2f5fc)}.devui-yearOption li.disabled,.devui-monthOption li.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.devui-month-view .devui-timepicker{background:#f5f5f5;background:var(--devui-area, #f5f5f5);display:flex;justify-content:space-evenly}.devui-month-view .devui-timepicker input{outline:0;border:0;background:#f5f5f5;background:var(--devui-area, #f5f5f5);color:#252b3a;color:var(--devui-text, #252b3a);width:30px;padding:0 0 0 3px;height:30px;text-align:center}.devui-month-view .devui-timepicker.devui-timepicker-disabled{background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-timepicker.devui-timepicker-disabled input{cursor:not-allowed;color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-timepicker .devui-time{position:relative;display:inline-block;width:40px}.devui-month-view .devui-timepicker .devui-time:not(:first-child):before{content:\":\"}.devui-month-view .devui-table>tbody>tr>td{vertical-align:middle;padding:4px;border-top:none;border-radius:2px;border-radius:var(--devui-border-radius, 2px)}.devui-month-view .devui-table>tbody>tr>td.devui-day-start{border-radius:2px 0 0 2px;border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-month-view .devui-table>tbody>tr>td.devui-day-end{border-radius:0 2px 2px 0;border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-month-view .devui-table>tbody>tr>td:not(.disabled){border-top:none;background:#ffffff;background:var(--devui-connected-overlay-bg, #ffffff)}.devui-month-view .devui-table>tbody>tr>td.devui-day:hover:not(.active):not(.disabled):not(.devui-out-of-month){background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled).active:hover{background-color:#f2f5fc;background-color:var(--devui-list-item-active-hover-bg, #f2f5fc)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled).active:hover>.devui-calendar-date{color:#fff;color:var(--devui-light-text, #ffffff)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled):not(.active):not(.devui-out-of-month):not(:hover).devui-today .devui-calendar-date{color:#5e7ce0;color:var(--devui-brand, #5e7ce0);font-weight:700}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);cursor:not-allowed}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled .devui-calendar-date{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled:not(.active){background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled.active{background-color:#dfe1e6;background-color:var(--devui-disabled-line, #dfe1e6)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day:not(.disabled).active{background:#f2f5fc;background:var(--devui-list-item-active-bg, #f2f5fc)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day:not(.disabled).active>.devui-calendar-date{color:#fff;color:var(--devui-light-text, #ffffff)}.devui-month-view .devui-table>thead>tr>td{vertical-align:middle;line-height:1.5;padding:4px}.devui-noSelect{-webkit-user-select:none;-moz-user-select:none;user-select:none}.devui-month-view .devui-month-view-table td{border-bottom:none}.devui-month-view .devui-table tfoot,.devui-custom-area{border-top:1px solid #f5f5f5;border-top:1px solid var(--devui-area, #f5f5f5)}.devui-month-view tfoot td{padding:10px;vertical-align:middle;border-top:none}.devui-dropdown-menu{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-btn-wrapper{margin-top:0}.devui-btn-nav{display:none;position:absolute;right:9px;top:0;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none}.devui-btn-nav .btn-up,.devui-btn-nav .btn-down{position:absolute;width:0;height:0;border:6px solid}.devui-btn-nav .btn-up{padding-top:2px;padding-bottom:1px;border-color:transparent transparent #252b3a transparent;border-color:transparent transparent var(--devui-text, #252b3a) transparent}.devui-btn-nav .btn-up:hover{border-color:transparent transparent #252b3a transparent;border-color:transparent transparent var(--devui-icon-fill-active, #252b3a) transparent}.devui-btn-nav .btn-down{top:16px;padding-bottom:4px;border-color:#252b3a transparent transparent transparent;border-color:var(--devui-text, #252b3a) transparent transparent transparent}.devui-btn-nav .btn-down:hover{border-color:#252b3a transparent transparent transparent;border-color:var(--devui-icon-fill-active, #252b3a) transparent transparent transparent}.devui-time input[type=number]::-webkit-inner-spin-button,.devui-time input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.devui-time input[type=number]{-moz-appearance:textfield}.devui-time:hover .devui-btn-nav{display:block}:host ::ng-deep .cdk-overlay-pane d-datepicker.devui-dropdown-menu{padding:0}:host .devui-form-control{padding-right:0}.devui-month-view{box-shadow:none}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range:not(.active):not(.disabled){background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:#252b3a;color:var(--devui-text, #252b3a);border-radius:0}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range:not(.active):not(.disabled):hover{background-color:#e9edfa;background-color:var(--devui-range-item-hover-bg, #e9edfa)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range.disabled:not(.active){background-color:#f2f2f3;background-color:var(--devui-dividing-line, #f2f2f3);opacity:.8;color:#252b3a;color:var(--devui-text, #252b3a)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.active.disabled{background-color:#f2f2f3;background-color:var(--devui-dividing-line, #f2f2f3)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.active.disabled .devui-calendar-date{opacity:.8}.devui-month-view .devui-in-month-day.devui-in-range.disabled:not(.active) .devui-calendar-date{color:#252b3a;color:var(--devui-text, #252b3a);cursor:not-allowed}.devui-month-view .devui-day.devui-out-of-month.active:hover .devui-calendar-date{background-color:transparent;color:#71757f;color:var(--devui-icon-text, #71757f)}.devui-month-view .devui-day.devui-out-of-month.active.disabled{background-color:transparent}tr.devui-calender-header{height:38px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.devui-month-view .devui-btn-link.devui-btn-right{transform:scale(1);display:inline-block;line-height:1}.devui-monthOption,.devui-yearOption{white-space:normal}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ButtonComponent, selector: "d-button", inputs: ["id", "type", "bsStyle", "shape", "bsSize", "bsPosition", "bordered", "icon", "disabled", "showLoading", "width", "autofocus", "loadingTemplateRef"], outputs: ["btnClick"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TwoDatepickerSingleComponent, decorators: [{
            type: Component,
            args: [{ selector: 'd-two-datepicker-single', providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => TwoDatepickerSingleComponent),
                            multi: true,
                        }
                    ], template: "<div class=\"devui-month-view {{ cssClass }}\">\n  <table class=\"devui-table devui-month-view-table\">\n    <thead>\n      <tr class=\"devui-calender-header\">\n        <td>\n          <a\n            class=\"devui-btn-link\"\n            aria-hidden=\"true\"\n            (click)=\"onPreYear()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasPreYearOption() }\"\n          >\n            <svg\n              width=\"10px\"\n              height=\"10px\"\n              viewBox=\"0 0 10 10\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-1.000000, -1.000000)\">\n                  <path\n                    d=\"M11,1.83333333 L11,10.1666667 L7,7.38833333 L7,10.1666667 L1,6 L7,1.83333333 L7,4.61033333 L11,1.83333333 Z\"\n                  ></path>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td>\n          <a\n            *ngIf=\"!openChooseYear && !openChooseMonth\"\n            class=\"devui-btn-link devui-btn-left\"\n            aria-hidden=\"true\"\n            (click)=\"onPreMonth()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasPreMonth() }\"\n          >\n            <svg\n              width=\"6px\"\n              height=\"10px\"\n              viewBox=\"0 0 6 10\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-3.000000, -1.000000)\">\n                  <polygon\n                    transform=\"translate(6.000000, 6.000000) rotate(-90.000000) translate(-6.000000, -6.000000) \"\n                    points=\"6 3 10.1666667 9 1.83333333 9\"\n                  ></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td colspan=\"3\" class=\"devui-dropdown\">\n          <span class=\"devui-date-title\" (click)=\"toggle($event, 'year')\">{{ i18nText?.yearDisplay(currentYear) }}</span>\n          <span class=\"devui-date-title\" (click)=\"toggle($event, 'month')\">{{ (i18nText?.monthsOfYear)[currentMonthIndex] }}</span>\n          <ul class=\"devui-monthOption text-center\" [style.display]=\"openChooseMonth ? 'block' : 'none'\">\n            <li\n              *ngFor=\"let month of availableMonths\"\n              [ngClass]=\"{ active: currentMonthIndex == month.index, disabled: month.disabled || isMonthDisable(month.title) }\"\n              (click)=\"onSelectMonth(month)\"\n            >\n              {{ month.title }}\n            </li>\n          </ul>\n          <ul class=\"devui-yearOption text-center\" [style.display]=\"openChooseYear ? 'block' : 'none'\">\n            <li\n              *ngFor=\"let item of yearOptions\"\n              [ngClass]=\"{ active: currentYear == item.title, disabled: item.disabled || isYearDisable(item.title) }\"\n              (click)=\"onSelectYear(item, $event)\"\n            >\n              {{ item.title }}\n            </li>\n          </ul>\n        </td>\n        <td>\n          <a\n            *ngIf=\"!openChooseYear && !openChooseMonth\"\n            class=\"devui-btn-link devui-btn-right\"\n            aria-hidden=\"true\"\n            (click)=\"onNextMonth()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasNextMonth() }\"\n          >\n            <svg\n              width=\"6px\"\n              height=\"9px\"\n              viewBox=\"0 0 6 9\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-3.000000, -2.000000)\">\n                  <polygon\n                    transform=\"translate(6.000000, 6.166667) scale(-1, 1) rotate(-90.000000) translate(-6.000000, -6.166667) \"\n                    points=\"6 3.16666667 10.1666667 9.16666667 1.83333333 9.16666667\"\n                  ></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n        <td>\n          <a\n            class=\"devui-btn-link\"\n            aria-hidden=\"true\"\n            (click)=\"onNextYear()\"\n            [ngClass]=\"{ 'devui-year-month-disabled': !hasNextYearOption() }\"\n          >\n            <svg\n              width=\"10px\"\n              height=\"9px\"\n              viewBox=\"0 0 10 9\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n            >\n              <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                <g transform=\"translate(-1.000000, -2.000000)\">\n                  <polygon points=\"5 4.77777778 5 2 11 6.16666667 5 10.3333333 5 7.55555556 1 10.3333333 1 2\"></polygon>\n                </g>\n              </g>\n            </svg>\n          </a>\n        </td>\n      </tr>\n      <tr class=\"small text-center devui-week-header\">\n        <td *ngFor=\"let item of i18nText?.daysOfWeek\">{{ item }}</td>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let week of displayWeeks\">\n        <td\n          *ngFor=\"let day of week\"\n          class=\"devui-day {{ isBetweenDay(day.date) }}\"\n          [ngClass]=\"{\n            'devui-out-of-month': !day.inMonth,\n            'devui-in-month-day': day.inMonth,\n            active: isSelectDay(day.date),\n            disabled: isDisabledDay(day.date),\n            'devui-in-range': isInRange(day.date),\n            'devui-today': day.isToday\n          }\"\n          (click)=\"onSelectDate($event, day.date)\"\n          (mouseover)=\"emitHoverDate($event, day.date)\"\n        >\n          <div class=\"devui-calendar-date\">{{ day.day }}</div>\n        </td>\n      </tr>\n    </tbody>\n    <tfoot>\n      <tr class=\"time-picker-view\" *ngIf=\"showTime\">\n        <ng-container *ngIf=\"!customViewTemplate\">\n          <td colspan=\"4\">\n            <div class=\"devui-timepicker\" *ngIf=\"showTime\" [ngClass]=\"{ 'devui-timepicker-disabled': isDisabledTime() }\">\n              <div class=\"devui-time\">\n                <input [ngModel]=\"currentHour\" (keydown)=\"fixTime($event, 'h')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('h')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('h')\"></div>\n                </div>\n              </div>\n              <div class=\"devui-time\">\n                <input class=\"devui-minutes\" [ngModel]=\"currentMinute\" (keydown)=\"fixTime($event, 'm')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('m')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('m')\"></div>\n                </div>\n              </div>\n              <div class=\"devui-time\">\n                <input class=\"devui-seconds\" [ngModel]=\"currentSecond\" (keydown)=\"fixTime($event, 's')\" [disabled]=\"isDisabledTime()\" />\n                <div class=\"devui-btn-nav\" *ngIf=\"!isDisabledTime()\">\n                  <div class=\"btn-up\" (click)=\"timeUp('s')\"></div>\n                  <div class=\"btn-down\" (click)=\"timeDown('s')\"></div>\n                </div>\n              </div>\n            </div>\n          </td>\n          <td colspan=\"3\" *ngIf=\"isAuxiliary\">\n            <div class=\"devui-btn-wrapper\">\n              <d-button bsStyle=\"common\" [disabled]=\"!rangeStart || !rangeEnd || disabled\" (btnClick)=\"confirmTime()\" bsSize=\"sm\">\n                {{ i18nCommonText?.btnConfirm }}\n              </d-button>\n            </div>\n          </td>\n        </ng-container>\n      </tr>\n    </tfoot>\n  </table>\n</div>\n", styles: [".devui-font-size-base{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:12px;font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5}.devui-font-size-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:18px;font-size:var(--devui-font-size-modal-title, 18px);font-weight:700;line-height:1.5}.devui-font-size-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:16px;font-size:var(--devui-font-size-page-title, 16px);font-weight:700;line-height:1.5}.devui-font-size-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:14px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;line-height:1.5}.devui-date-header{height:38px}.devui-month-view{background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);font-size:12px;font-size:var(--devui-font-size, 12px);width:240px;text-align:center;box-shadow:0 4px 8px #252b3a33;box-shadow:var(--devui-shadow-length-connected-overlay, 0 4px 8px 0) var(--devui-shadow, rgba(37, 43, 58, .2));border-radius:2px;border-radius:var(--devui-border-radius, 2px);position:relative}.devui-month-view .devui-month-view-table{margin-bottom:0;background:#ffffff;background:var(--devui-connected-overlay-bg, #ffffff);table-layout:fixed;border-collapse:collapse;width:100%}.devui-month-view .devui-date-title{font-weight:700;cursor:pointer;font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-month-view .devui-date-title:hover{color:#7693f5;color:var(--devui-brand-hover, #7693f5)}.devui-month-view .devui-btn-link{text-decoration:none;cursor:pointer;display:block}.devui-month-view .devui-btn-link.devui-year-month-disabled{cursor:not-allowed}.devui-month-view .devui-btn-link.devui-year-month-disabled svg path,.devui-month-view .devui-btn-link.devui-year-month-disabled svg polygon{fill:#cfd0d3;fill:var(--devui-disabled-text, #cfd0d3)}.devui-month-view .devui-btn-link svg path,.devui-month-view .devui-btn-link svg polygon{fill:#575d6c;fill:var(--devui-text-weak, #575d6c)}.devui-month-view .devui-btn-link:not(.devui-year-month-disabled):hover svg path,.devui-month-view .devui-btn-link:not(.devui-year-month-disabled):hover svg polygon{fill:#252b3a;fill:var(--devui-icon-fill-active-hover, #252b3a)}.devui-month-view .date-select{border:none;background:transparent;outline:none;-moz-appearance:none;-webkit-appearance:none;appearance:none}.devui-month-view .devui-week-header{cursor:default;margin-bottom:16px}.devui-month-view .devui-week-header td{width:32px;height:24px;line-height:24px;color:#252b3a;color:var(--devui-text, #252b3a);border:none}.devui-month-view .devui-day:not(.disabled){cursor:pointer;font-size:12px;font-size:var(--devui-font-size, 12px);color:#dfe1e6;color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-month-view .devui-day.disabled{cursor:not-allowed}.devui-calendar-date{display:block;margin:0 3px;width:20px;height:20px;padding:0;line-height:20px;background:transparent;text-align:center;font-size:12px;font-size:var(--devui-font-size, 12px);color:#252b3a;color:var(--devui-text, #252b3a)}.devui-month-view .devui-out-of-month .devui-calendar-date{opacity:.8;background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);color:#d7d8da;color:var(--devui-line, #d7d8da)}.devui-month-view .devui-out-of-month:not(.disabled):hover .devui-calendar-date{background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-month-view .devui-minutes:before{content:\":\";text-align:center;position:absolute;margin-left:-13px}.devui-month-view .devui-seconds:before{content:\":\";text-align:center;position:absolute;margin-left:-13px}.devui-yearOption,.devui-monthOption{width:240px;height:195px;position:absolute;left:-68px;top:30px;background:#ffffff;background:var(--devui-base-bg, #ffffff);z-index:1}.devui-yearOption li,.devui-monthOption li{width:60px;height:68px;line-height:68px;text-align:center;display:inline-block;background:#ffffff;background:var(--devui-base-bg, #ffffff);border-radius:2px;border-radius:var(--devui-border-radius, 2px)}.devui-yearOption li:hover,.devui-monthOption li:hover{background:#f2f2f3;background:var(--devui-list-item-hover-bg, #f2f2f3);color:#252b3a;color:var(--devui-list-item-hover-text, #252b3a);cursor:pointer}.devui-yearOption li.active:not(.disabled),.devui-monthOption li.active:not(.disabled){color:#252b3a;color:var(--devui-list-item-active-text, #252b3a);background-color:#f2f5fc;background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-yearOption li.active:not(.disabled):hover,.devui-monthOption li.active:not(.disabled):hover{background-color:#f2f5fc;background-color:var(--devui-list-item-active-hover-bg, #f2f5fc)}.devui-yearOption li.disabled,.devui-monthOption li.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.devui-month-view .devui-timepicker{background:#f5f5f5;background:var(--devui-area, #f5f5f5);display:flex;justify-content:space-evenly}.devui-month-view .devui-timepicker input{outline:0;border:0;background:#f5f5f5;background:var(--devui-area, #f5f5f5);color:#252b3a;color:var(--devui-text, #252b3a);width:30px;padding:0 0 0 3px;height:30px;text-align:center}.devui-month-view .devui-timepicker.devui-timepicker-disabled{background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-timepicker.devui-timepicker-disabled input{cursor:not-allowed;color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-timepicker .devui-time{position:relative;display:inline-block;width:40px}.devui-month-view .devui-timepicker .devui-time:not(:first-child):before{content:\":\"}.devui-month-view .devui-table>tbody>tr>td{vertical-align:middle;padding:4px;border-top:none;border-radius:2px;border-radius:var(--devui-border-radius, 2px)}.devui-month-view .devui-table>tbody>tr>td.devui-day-start{border-radius:2px 0 0 2px;border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-month-view .devui-table>tbody>tr>td.devui-day-end{border-radius:0 2px 2px 0;border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-month-view .devui-table>tbody>tr>td:not(.disabled){border-top:none;background:#ffffff;background:var(--devui-connected-overlay-bg, #ffffff)}.devui-month-view .devui-table>tbody>tr>td.devui-day:hover:not(.active):not(.disabled):not(.devui-out-of-month){background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled).active:hover{background-color:#f2f5fc;background-color:var(--devui-list-item-active-hover-bg, #f2f5fc)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled).active:hover>.devui-calendar-date{color:#fff;color:var(--devui-light-text, #ffffff)}.devui-month-view .devui-table>tbody>tr>td.devui-day:not(.disabled):not(.active):not(.devui-out-of-month):not(:hover).devui-today .devui-calendar-date{color:#5e7ce0;color:var(--devui-brand, #5e7ce0);font-weight:700}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);cursor:not-allowed}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled .devui-calendar-date{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled:not(.active){background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.disabled.active{background-color:#dfe1e6;background-color:var(--devui-disabled-line, #dfe1e6)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day:not(.disabled).active{background:#f2f5fc;background:var(--devui-list-item-active-bg, #f2f5fc)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day:not(.disabled).active>.devui-calendar-date{color:#fff;color:var(--devui-light-text, #ffffff)}.devui-month-view .devui-table>thead>tr>td{vertical-align:middle;line-height:1.5;padding:4px}.devui-noSelect{-webkit-user-select:none;-moz-user-select:none;user-select:none}.devui-month-view .devui-month-view-table td{border-bottom:none}.devui-month-view .devui-table tfoot,.devui-custom-area{border-top:1px solid #f5f5f5;border-top:1px solid var(--devui-area, #f5f5f5)}.devui-month-view tfoot td{padding:10px;vertical-align:middle;border-top:none}.devui-dropdown-menu{font-size:12px;font-size:var(--devui-font-size, 12px)}.devui-btn-wrapper{margin-top:0}.devui-btn-nav{display:none;position:absolute;right:9px;top:0;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none}.devui-btn-nav .btn-up,.devui-btn-nav .btn-down{position:absolute;width:0;height:0;border:6px solid}.devui-btn-nav .btn-up{padding-top:2px;padding-bottom:1px;border-color:transparent transparent #252b3a transparent;border-color:transparent transparent var(--devui-text, #252b3a) transparent}.devui-btn-nav .btn-up:hover{border-color:transparent transparent #252b3a transparent;border-color:transparent transparent var(--devui-icon-fill-active, #252b3a) transparent}.devui-btn-nav .btn-down{top:16px;padding-bottom:4px;border-color:#252b3a transparent transparent transparent;border-color:var(--devui-text, #252b3a) transparent transparent transparent}.devui-btn-nav .btn-down:hover{border-color:#252b3a transparent transparent transparent;border-color:var(--devui-icon-fill-active, #252b3a) transparent transparent transparent}.devui-time input[type=number]::-webkit-inner-spin-button,.devui-time input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.devui-time input[type=number]{-moz-appearance:textfield}.devui-time:hover .devui-btn-nav{display:block}:host ::ng-deep .cdk-overlay-pane d-datepicker.devui-dropdown-menu{padding:0}:host .devui-form-control{padding-right:0}.devui-month-view{box-shadow:none}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range:not(.active):not(.disabled){background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:#252b3a;color:var(--devui-text, #252b3a);border-radius:0}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range:not(.active):not(.disabled):hover{background-color:#e9edfa;background-color:var(--devui-range-item-hover-bg, #e9edfa)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.devui-in-range.disabled:not(.active){background-color:#f2f2f3;background-color:var(--devui-dividing-line, #f2f2f3);opacity:.8;color:#252b3a;color:var(--devui-text, #252b3a)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.active.disabled{background-color:#f2f2f3;background-color:var(--devui-dividing-line, #f2f2f3)}.devui-month-view .devui-table>tbody>tr>td.devui-in-month-day.active.disabled .devui-calendar-date{opacity:.8}.devui-month-view .devui-in-month-day.devui-in-range.disabled:not(.active) .devui-calendar-date{color:#252b3a;color:var(--devui-text, #252b3a);cursor:not-allowed}.devui-month-view .devui-day.devui-out-of-month.active:hover .devui-calendar-date{background-color:transparent;color:#71757f;color:var(--devui-icon-text, #71757f)}.devui-month-view .devui-day.devui-out-of-month.active.disabled{background-color:transparent}tr.devui-calender-header{height:38px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.devui-month-view .devui-btn-link.devui-btn-right{transform:scale(1);display:inline-block;line-height:1}.devui-monthOption,.devui-yearOption{white-space:normal}\n"] }]
        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.DatePickerConfigService }, { type: i0.ChangeDetectorRef }, { type: i2.I18nService }]; }, propDecorators: { selectedRange: [{
                type: Input
            }], rangePicker: [{
                type: Input
            }], isAuxiliary: [{
                type: Input
            }], currentCalendars: [{
                type: Input
            }], whichOpen: [{
                type: Input
            }], hoverOnDate: [{
                type: Output
            }], rangeSelected: [{
                type: Output
            }], rangeSelecting: [{
                type: Output
            }], syncPickerPair: [{
                type: Output
            }], consolidateTime: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 