import * as i4 from '@angular/cdk/overlay';
import { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';
import * as i3 from '@angular/common';
import { DOCUMENT, CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { EventEmitter, forwardRef, Component, Inject, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import * as i5 from 'ng-devui/button';
import { ButtonModule } from 'ng-devui/button';
import { __decorate, __metadata } from 'tslib';
import * as i2 from 'ng-devui/utils';
import { removeClassFromOrigin, formWithDropDown, addClassToOrigin, unshiftString, AppendToBodyDirectionsConfig, fadeInOut, WithConfig } from 'ng-devui/utils';
import { fromEvent } from 'rxjs';
import { map, filter, debounceTime } from 'rxjs/operators';
import * as i1 from 'ng-devui/i18n';

class TimePickerComponent {
    constructor(elementRef, viewContainerRef, renderer2, i18n, cdr, devConfigService, doc) {
        this.elementRef = elementRef;
        this.viewContainerRef = viewContainerRef;
        this.renderer2 = renderer2;
        this.i18n = i18n;
        this.cdr = cdr;
        this.devConfigService = devConfigService;
        this.doc = doc;
        this.appendToBodyDirections = [
            'rightDown', 'leftDown', 'rightUp', 'leftUp'
        ];
        this.autoOpen = false;
        this.showAnimation = true;
        this.splitter = ':'; // 暂不开放
        this.startAnimation = false;
        this.selectedTimeChange = new EventEmitter();
        this.dropdownPosition = 'bottom';
        // 此处使用第一第二第三列而不是时分秒是为了方便在format顺序变化（例如ss:mm）时，可以比较容易的换数组顺序
        this.firstList = [];
        this.secondList = [];
        this.thirdList = [];
        this._isOpen = false;
        this._minTimeHour = '00';
        this._minTimeMin = '00';
        this._minTimeSec = '00';
        this._maxTimeHour = '23';
        this._maxTimeMin = '59';
        this._maxTimeSec = '59';
        this._format = 'hh:mm:ss';
        this._initTimeHour = '00';
        this._initTimeMin = '00';
        this._initTimeSec = '00';
        this._illegalTimeHour = '24';
        this._illegalTimeMin = '60';
        this._illegalTimeSec = '60';
        this.correct = ['Hour', 'Min', 'Sec'];
        this.onChange = (_) => null;
        this.onTouched = () => null;
        this.onDocumentClick = ($event) => {
            if (this.elementRef.nativeElement !== $event.target &&
                (this.timePicker && !this.timePicker.nativeElement.contains($event.target))) {
                this.isOpen = false;
                this.cdr.markForCheck();
            }
        };
        this.hide = () => {
            this.isOpen = false;
        };
        this.transUserInputToTimePicker = (value) => {
            if (!value) {
                this.clearAll();
                return;
            }
            if (value === this.selectedTime || !this.validateTime(value)) {
                return;
            }
            if (this.disabled) {
                this.resetValue();
            }
            else {
                this.writeValue(value);
                this.writeModelValue(value, true);
            }
        };
        this.chooseTime = (timeObj) => {
            this.selectTime(timeObj, true);
        };
        this.confirmTime = (timeObj) => {
            this.selectTime(timeObj);
            this.hide();
        };
        this.clearAll = () => {
            if (this.disabled) {
                return;
            }
            this.writeValue(null);
            this.writeModelValue(null, true);
        };
        this.document = this.doc;
    }
    set minTime(minTime) {
        this.setCurrent('minTime', minTime);
        this.setTimeArr();
    }
    get minTime() {
        return this.getCurrent('minTime');
    }
    set maxTime(maxTime) {
        this.setCurrent('maxTime', maxTime);
        this.setTimeArr();
    }
    get maxTime() {
        return this.getCurrent('maxTime');
    }
    set format(format) {
        if (this._format !== format && format) {
            this._format = format.toLocaleLowerCase();
            this.firstList.length = 0;
            this.secondList.length = 0;
            this.thirdList.length = 0;
            setTimeout(() => {
                this.writeValue();
                this.writeModelValue(this.selectedTimeFormat, true);
            });
        }
    }
    get format() {
        return this._format;
    }
    set timePickerWidth(width) {
        if (width !== undefined) {
            this._timePickerWidth = width;
        }
    }
    get timePickerWidth() {
        return this._timePickerWidth;
    }
    set isOpen(open) {
        if (this._isOpen !== open) {
            this._isOpen = open;
            if (!open) {
                this.startAnimation = false;
                removeClassFromOrigin(this.elementRef);
                this.document.removeEventListener('click', this.onDocumentClick);
            }
            else {
                if (this.timePickerWidth !== undefined) {
                    this.originWidth = this.timePickerWidth;
                }
                else {
                    let currentOrigin;
                    if (this.origin) {
                        currentOrigin = this.origin;
                    }
                    else if (this.elementRef.nativeElement) {
                        currentOrigin = formWithDropDown(this.elementRef) || this.elementRef.nativeElement;
                    }
                    if (currentOrigin) {
                        this.originWidth = currentOrigin.offsetWidth;
                    }
                }
                setTimeout(() => {
                    this.startAnimation = true;
                    this.document.addEventListener('click', this.onDocumentClick);
                });
                addClassToOrigin(this.elementRef);
            }
        }
    }
    get isOpen() {
        return this._isOpen;
    }
    set selectedTime(time) {
        if (this.validateTime(time)) {
            this.setFormatCurrent('selectedTime', time);
        }
        else {
            this.setFormatCurrent('selectedTime', this.initTime);
        }
    }
    get selectedTime() {
        return this.getCurrent('selectedTime');
    }
    get selectedTimeFormat() {
        return this.getFormatCurrent('selectedTime');
    }
    get initTime() {
        return this.getCurrent('initTime');
    }
    get illegalTime() {
        return this.getCurrent('illegalTime');
    }
    onBlur($event) {
        this.onTouched();
        const value = this.elementRef.nativeElement.value;
        if (!this.validateTime(value)) {
            this.resetValue();
        }
    }
    ngOnChanges(changes) {
        if (changes['appendToBodyDirections']) {
            this.setTimePickerPositions();
        }
    }
    ngOnInit() {
        this.setTimePickerPositions();
        this.setI18nText();
        this.updateCdkConnectedOverlayOrigin();
        if (this.autoOpen) {
            this.toggle(true);
        }
        this.valueChanges = this.registerInputEvent();
        this.userInputSubscription = this.valueChanges.subscribe((source) => this.transUserInputToTimePicker(source));
    }
    ngOnDestroy() {
        if (this.i18nSubscription) {
            this.i18nSubscription.unsubscribe();
        }
        if (this.userInputSubscription) {
            this.userInputSubscription.unsubscribe();
        }
        this.document.removeEventListener('click', this.onDocumentClick);
    }
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    writeValue(time) {
        if (time !== undefined) {
            this.selectedTime = time;
        }
        const value = this.selectedTimeFormat || '';
        this.renderer2.setProperty(this.elementRef.nativeElement, 'value', value);
        this.setTimeArr();
    }
    registerInputEvent() {
        return fromEvent(this.elementRef.nativeElement, 'input').pipe(map((e) => {
            return e.target.value;
        }), filter(() => !this.disabled), debounceTime(300));
    }
    isMinuteInRange(minute) {
        const curTime = this.elementRef.nativeElement.value;
        const hourIndex = this.format.split(':').findIndex(t => t === 'hh');
        const curHour = hourIndex !== -1 ? curTime.split(':')[hourIndex] : null;
        // 不存在小时时直接依据最值判定
        if (!curHour) {
            return minute <= this._maxTimeMin && minute >= this._minTimeMin;
        }
        // 存在小时时，依据小时是否在临界点进行判断
        if (curHour < this._maxTimeHour && curHour > this._minTimeHour) {
            return true;
        }
        else if (curHour === this._maxTimeHour) {
            return minute <= this._maxTimeMin;
        }
        else if (curHour === this._minTimeHour) {
            return minute >= this._minTimeMin;
        }
        else {
            return true;
        }
    }
    isSecondInRange(second) {
        const curTime = this.elementRef.nativeElement.value;
        const hourIndex = this.format.split(':').findIndex(t => t === 'hh');
        const minIndex = this.format.split(':').findIndex(t => t === 'mm');
        const curHour = hourIndex !== -1 ? curTime.split(':')[hourIndex] : null;
        const curMin = minIndex !== -1 ? curTime.split(':')[minIndex] : null;
        // 当不存在分钟时，直接依据最值判定
        if (!curMin) {
            return second <= this._maxTimeSec && second >= this._minTimeSec;
        }
        // 当存在分钟时，依据分钟是否在临界点进行判断
        if (this.isMinuteInRangeNotBoundary(curHour, curMin)) {
            return true;
        }
        else if (curMin === this._maxTimeMin) {
            return second <= this._maxTimeSec;
        }
        else if (curMin === this._minTimeMin) {
            return second >= this._minTimeSec;
        }
        else {
            return true;
        }
    }
    // 判断当前的分钟是否在范围内但不在边界上
    isMinuteInRangeNotBoundary(hour, min) {
        return (hour && hour < this._maxTimeHour && hour > this._minTimeHour) // 小时在范围内
            || (min < this._maxTimeMin && min > this._minTimeMin); // 分钟在范围内
    }
    validateTime(time, type) {
        if (!time && time !== '') {
            return false;
        }
        const timeArr = time.split(':');
        if (type && timeArr.length === 1) {
            let valid;
            switch (type) {
                case 'hh':
                    valid = (time <= this._maxTimeHour && time >= this._minTimeHour);
                    break;
                case 'mm':
                    valid = this.isMinuteInRange(time);
                    break;
                case 'ss':
                    valid = this.isSecondInRange(time);
                    break;
            }
            return valid;
        }
        if (timeArr.some((t, i) => {
            return Number(t) > Number(this.maxTime.split(':')[i]) || Number(t) < Number(this.minTime.split(':')[i]);
        })) {
            return false;
        }
        if (timeArr.length !== 3) {
            if (timeArr.length === this.format.split(':').length &&
                !timeArr.some(t => t.length > 2 || t !== unshiftString(String(Number(t)), 2, '0'))) {
                return true;
            }
            else {
                return false;
            }
        }
        else if (timeArr.some(t => t !== unshiftString(String(Number(t)), 2, '0'))) {
            return false;
        }
        return true;
    }
    setI18nText() {
        this.i18nCommonText = this.i18n.getI18nText().common;
        this.i18nSubscription = this.i18n.langChange().subscribe((data) => {
            this.i18nCommonText = data.common;
        });
    }
    updateCdkConnectedOverlayOrigin() {
        let currentOrigin;
        if (this.origin) {
            currentOrigin = this.origin;
        }
        else if (this.elementRef.nativeElement) {
            currentOrigin = formWithDropDown(this.elementRef) || this.elementRef.nativeElement;
        }
        this.cdkConnectedOverlayOrigin = new CdkOverlayOrigin(currentOrigin);
    }
    toggle(clickShow) {
        if (clickShow === undefined) {
            if (this.disabled) {
                this.isOpen = false;
            }
            else {
                this.isOpen = !this.isOpen;
            }
        }
        else {
            if (this.disabled) {
                this.isOpen = false;
            }
            else {
                this.isOpen = clickShow;
            }
        }
    }
    writeModelValue(selectTimeObj, noEmit = false) {
        let selectTime;
        if (selectTimeObj && typeof selectTimeObj === 'object' && Object.prototype.hasOwnProperty.call(selectTimeObj, 'selectedTime')) {
            selectTime = selectTimeObj.selectedTime;
        }
        else {
            selectTime = selectTimeObj;
        }
        selectTime = selectTime || null;
        this.onChange(selectTime); // 这行代码能触发ngModel绑定的变量值发生变化
        if (!noEmit) {
            this.selectedTimeChange.emit(this.selectedTimeFormat);
        }
    }
    onPositionChange(position) {
        switch (position.connectionPair.overlayY) {
            case 'top':
            case 'center':
                this.dropdownPosition = 'bottom';
                break;
            case 'bottom':
                this.dropdownPosition = 'top';
        }
    }
    setTimePickerPositions() {
        if (this.appendToBodyDirections && this.appendToBodyDirections.length > 0) {
            this.pickerPositions = this.appendToBodyDirections.map(position => {
                if (typeof position === 'string') {
                    return AppendToBodyDirectionsConfig[position];
                }
                else {
                    return position;
                }
            }).filter(position => position !== undefined);
        }
        else {
            this.pickerPositions = undefined;
        }
    }
    resetValue() {
        if (this.selectedTime) {
            this.writeValue(this.selectedTime);
        }
        else {
            this.elementRef.nativeElement.value = '';
        }
    }
    setTimeArr(justScroll) {
        this.format.split(':').map((type, index) => {
            this.setSingleTimeArr(index, justScroll);
        });
    }
    setSingleTimeArr(index, justScroll) {
        const selectedTimeArr = this.selectedTime ? this.selectedTime.split(':') : this.illegalTime.split(':');
        let whichList;
        switch (index) {
            case 0:
                whichList = 'first';
                break;
            case 1:
                whichList = 'second';
                break;
            case 2:
                whichList = 'third';
                break;
        }
        const type = this.format.split(':')[index];
        const arr = ['hh', 'mm', 'ss'];
        const len = type === 'hh' ? 24 : 60;
        if (!this[`${whichList}List`] || !this[`${whichList}List`].length) {
            this[`${whichList}List`] = new Array(len).fill(0).map((item, i) => {
                const time = unshiftString(String(i), 2, '0');
                const disabled = this.disabled || !this.validateTime(time, type);
                return {
                    time,
                    active: selectedTimeArr[arr.indexOf(type)] === time,
                    type: index,
                    disabled
                };
            });
        }
        else {
            this[`${whichList}List`].map((item, i) => {
                if (!justScroll) {
                    const time = unshiftString(String(i), 2, '0');
                    const disabled = this.disabled || !this.validateTime(time, type);
                    item.active = selectedTimeArr[arr.indexOf(type)] === time;
                    item.disabled = disabled;
                }
                if (item.active && this.isOpen) {
                    this.setScroll(whichList, i, justScroll);
                }
            });
        }
        if (!this.disabled) {
            this.fixTimeInRange(this[`${whichList}List`]);
        }
    }
    // 当存在值选中的是不可选选项时，进行修正
    fixTimeInRange(list) {
        const curActive = list.find(item => item.active);
        if (curActive === null || curActive === void 0 ? void 0 : curActive.disabled) {
            this.selectTime(list.find(item => !item.disabled));
        }
    }
    setScroll(whichList, index, justScroll) {
        const scroll = (24 + 8) * index;
        const duration = (justScroll || !this.showAnimation) ? 0 : 150;
        if (this.timePicker) {
            this.scrollTo(this.timePicker.nativeElement.querySelector(`.devui-${whichList}-list`), scroll, duration);
        }
    }
    scrollTo(element, to, duration) {
        if (typeof window === 'undefined') {
            return;
        }
        if (duration <= 0) {
            element.scrollTop = to;
            return;
        }
        const difference = to - element.scrollTop;
        const perTick = (difference / duration) * 10;
        const reqAnimFrame = window['webkitRequestAnimationFrame'] ||
            window['mozRequestAnimationFrame'] ||
            window['msRequestAnimationFrame'] ||
            window['oRequestAnimationFrame'] ||
            window['requestAnimationFrame'];
        reqAnimFrame(() => {
            element.scrollTop = element.scrollTop + perTick;
            if (element.scrollTop === to) {
                return;
            }
            this.scrollTo(element, to, duration - 10);
        });
    }
    animationEnd(event) {
        if (this.isOpen && event.toState !== 'void') {
            this.setTimeArr(true);
        }
    }
    setCurrent(which, current) {
        const timeArr = current ? current.split(':') : this[which].split(':');
        this.correct.map((t, i) => {
            this[`_${which}${t}`] = timeArr[i];
        });
    }
    getCurrent(which) {
        const res = [];
        this.correct.map(t => {
            res.push(this[`_${which}${t}`]);
        });
        return res.join(':');
    }
    setFormatCurrent(which, current) {
        const timeArr = current ? current.split(':') : this[which].split(':');
        this.format.split(':').map((t, i) => {
            switch (t) {
                case 'hh':
                    this[`_${which}Hour`] = timeArr[i];
                    break;
                case 'mm':
                    this[`_${which}Min`] = timeArr[i];
                    break;
                case 'ss':
                    this[`_${which}Sec`] = timeArr[i];
                    break;
            }
        });
    }
    getFormatCurrent(which) {
        const formatArr = this.format.split(':');
        const res = [];
        formatArr.map(t => {
            switch (t) {
                case 'hh':
                    res.push(this[`_${which}Hour`]);
                    break;
                case 'mm':
                    res.push(this[`_${which}Min`]);
                    break;
                case 'ss':
                    res.push(this[`_${which}Sec`]);
                    break;
            }
        });
        return res.join(':');
    }
    selectTime(timeObj, noEmit) {
        if (timeObj !== undefined) {
            const time = timeObj.time;
            const type = timeObj.type;
            const timeArr = time.split(':');
            const curType = typeof type === 'string' ? type : this.format.split(':')[type];
            let typeArr;
            if (!this.validateTime(time, curType)) {
                return;
            }
            if (typeof type === 'number') {
                typeArr = [this.format.split(':')[type]];
            }
            else if (typeof type === 'string') {
                typeArr = [type];
            }
            else if (!type) {
                typeArr = this.format.split(':');
            }
            typeArr.map((t, i) => {
                switch (t) {
                    case 'hh':
                        this._selectedTimeHour = unshiftString(timeArr[i], 2, '0');
                        break;
                    case 'mm':
                        this._selectedTimeMin = unshiftString(timeArr[i], 2, '0');
                        break;
                    case 'ss':
                        this._selectedTimeSec = unshiftString(timeArr[i], 2, '0');
                        break;
                }
            });
        }
        this.writeValue();
        this.writeModelValue(this.selectedTimeFormat, noEmit);
    }
}
TimePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TimePickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: i1.I18nService }, { token: i0.ChangeDetectorRef }, { token: i2.DevConfigService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.0", type: TimePickerComponent, selector: "[dTimePicker]", inputs: { appendToBodyDirections: "appendToBodyDirections", disabled: "disabled", customViewTemplate: "customViewTemplate", autoOpen: "autoOpen", showAnimation: "showAnimation", minTime: "minTime", maxTime: "maxTime", format: "format", timePickerWidth: "timePickerWidth" }, outputs: { selectedTimeChange: "selectedTimeChange" }, host: { listeners: { "blur": "onBlur($event)" } }, providers: [{
            provide: NG_VALUE_ACCESSOR,
            useExisting: forwardRef(() => TimePickerComponent),
            multi: true
        }], viewQueries: [{ propertyName: "timePicker", first: true, predicate: ["timePicker"], descendants: true }], exportAs: ["timePicker"], usesOnChanges: true, ngImport: i0, template: "<ng-template\n  cdk-connected-overlay\n  [cdkConnectedOverlayOrigin]=\"cdkConnectedOverlayOrigin\"\n  [cdkConnectedOverlayWidth]=\"originWidth\"\n  [cdkConnectedOverlayPositions]=\"pickerPositions\"\n  [cdkConnectedOverlayOpen]=\"isOpen\"\n  (backdropClick)=\"isOpen = false\"\n  (positionChange)=\"onPositionChange($event)\"\n>\n  <div\n    [@fadeInOut]=\"startAnimation ? dropdownPosition : 'void'\"\n    (@fadeInOut.done)=\"animationEnd($event)\"\n    [@.disabled]=\"!showAnimation\"\n    class=\"devui-time-picker-wrapper devui-dropdown-menu\"\n    #timePicker\n  >\n    <div class=\"devui-time-picker\" [ngClass]=\"{ 'devui-time-picker-animation': showAnimation }\">\n      <ul *ngIf=\"firstList.length\" class=\"devui-time-list devui-first-list\">\n        <li\n          *ngFor=\"let item of firstList\"\n          class=\"devui-time-item devui-first-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n      <ul *ngIf=\"secondList.length\" class=\"devui-time-list devui-second-list\">\n        <li\n          *ngFor=\"let item of secondList\"\n          class=\"devui-time-item devui-second-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n      <ul *ngIf=\"thirdList.length\" class=\"devui-time-list devui-third-list\">\n        <li\n          *ngFor=\"let item of thirdList\"\n          class=\"devui-time-item devui-third-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n    </div>\n    <div class=\"devui-time-footer\">\n      <ng-container *ngIf=\"!customViewTemplate\">\n        <div class=\"devui-btn-wrapper\">\n          <d-button bsStyle=\"common\" [disabled]=\"disabled\" (btnClick)=\"confirmTime()\" bsSize=\"sm\"\n            >{{ i18nCommonText?.btnConfirm }}\n          </d-button>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"customViewTemplate\">\n        <ng-template\n          [ngTemplateOutlet]=\"customViewTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: this, chooseTime: chooseTime, clearAll: clearAll, confirmTime: confirmTime }\"\n        ></ng-template>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>\n", styles: [".devui-time-picker-wrapper{width:100%;min-width:184px;background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);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));display:block;position:static;position:initial}.devui-time-picker{display:flex;height:248px;overflow:hidden;border-bottom:1px solid #f2f2f3;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3);border-radius:2px 2px 0 0;border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0}.devui-time-picker-animation .devui-time-list{scroll-behavior:smooth}.devui-time-picker .devui-time-list{flex:1;overflow-y:hidden;overflow-x:hidden}.devui-time-picker .devui-time-list:hover{overflow-y:scroll;overflow-y:overlay;scrollbar-width:thin}.devui-time-picker .devui-time-list:not(:last-child){border-right:1px solid #f2f2f3;border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-time-picker .devui-time-list .devui-time-item{width:100%;height:24px;line-height:24px;text-align:center;cursor:pointer}.devui-time-picker .devui-time-list .devui-time-item:hover{color:#252b3a;color:var(--devui-list-item-hover-text, #252b3a);background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-time-picker .devui-time-list .devui-time-item.active{color:#252b3a;color:var(--devui-list-item-active-text, #252b3a);background-color:#f2f5fc;background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-time-picker .devui-time-list .devui-time-item.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-time-picker .devui-time-list .devui-time-item:not(:last-child){margin-bottom:8px}.devui-time-picker .devui-time-list .devui-time-item:last-child{margin-bottom:224px}.devui-time-footer{padding:8px 16px;overflow:hidden}.devui-time-footer .devui-btn-wrapper{float:right}\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: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: i5.ButtonComponent, selector: "d-button", inputs: ["id", "type", "bsStyle", "shape", "bsSize", "bsPosition", "bordered", "icon", "disabled", "showLoading", "width", "autofocus", "loadingTemplateRef"], outputs: ["btnClick"] }], animations: [
        fadeInOut
    ] });
__decorate([
    WithConfig(),
    __metadata("design:type", Object)
], TimePickerComponent.prototype, "showAnimation", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TimePickerComponent, decorators: [{
            type: Component,
            args: [{ selector: '[dTimePicker]', providers: [{
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => TimePickerComponent),
                            multi: true
                        }], exportAs: 'timePicker', animations: [
                        fadeInOut
                    ], template: "<ng-template\n  cdk-connected-overlay\n  [cdkConnectedOverlayOrigin]=\"cdkConnectedOverlayOrigin\"\n  [cdkConnectedOverlayWidth]=\"originWidth\"\n  [cdkConnectedOverlayPositions]=\"pickerPositions\"\n  [cdkConnectedOverlayOpen]=\"isOpen\"\n  (backdropClick)=\"isOpen = false\"\n  (positionChange)=\"onPositionChange($event)\"\n>\n  <div\n    [@fadeInOut]=\"startAnimation ? dropdownPosition : 'void'\"\n    (@fadeInOut.done)=\"animationEnd($event)\"\n    [@.disabled]=\"!showAnimation\"\n    class=\"devui-time-picker-wrapper devui-dropdown-menu\"\n    #timePicker\n  >\n    <div class=\"devui-time-picker\" [ngClass]=\"{ 'devui-time-picker-animation': showAnimation }\">\n      <ul *ngIf=\"firstList.length\" class=\"devui-time-list devui-first-list\">\n        <li\n          *ngFor=\"let item of firstList\"\n          class=\"devui-time-item devui-first-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n      <ul *ngIf=\"secondList.length\" class=\"devui-time-list devui-second-list\">\n        <li\n          *ngFor=\"let item of secondList\"\n          class=\"devui-time-item devui-second-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n      <ul *ngIf=\"thirdList.length\" class=\"devui-time-list devui-third-list\">\n        <li\n          *ngFor=\"let item of thirdList\"\n          class=\"devui-time-item devui-third-item\"\n          [ngClass]=\"{\n            active: item.active,\n            disabled: item.disabled\n          }\"\n          (click)=\"chooseTime(item)\"\n        >\n          {{ item.time }}\n        </li>\n      </ul>\n    </div>\n    <div class=\"devui-time-footer\">\n      <ng-container *ngIf=\"!customViewTemplate\">\n        <div class=\"devui-btn-wrapper\">\n          <d-button bsStyle=\"common\" [disabled]=\"disabled\" (btnClick)=\"confirmTime()\" bsSize=\"sm\"\n            >{{ i18nCommonText?.btnConfirm }}\n          </d-button>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"customViewTemplate\">\n        <ng-template\n          [ngTemplateOutlet]=\"customViewTemplate\"\n          [ngTemplateOutletContext]=\"{ $implicit: this, chooseTime: chooseTime, clearAll: clearAll, confirmTime: confirmTime }\"\n        ></ng-template>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>\n", styles: [".devui-time-picker-wrapper{width:100%;min-width:184px;background-color:#fff;background-color:var(--devui-connected-overlay-bg, #ffffff);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));display:block;position:static;position:initial}.devui-time-picker{display:flex;height:248px;overflow:hidden;border-bottom:1px solid #f2f2f3;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3);border-radius:2px 2px 0 0;border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0}.devui-time-picker-animation .devui-time-list{scroll-behavior:smooth}.devui-time-picker .devui-time-list{flex:1;overflow-y:hidden;overflow-x:hidden}.devui-time-picker .devui-time-list:hover{overflow-y:scroll;overflow-y:overlay;scrollbar-width:thin}.devui-time-picker .devui-time-list:not(:last-child){border-right:1px solid #f2f2f3;border-right:1px solid var(--devui-dividing-line, #f2f2f3)}.devui-time-picker .devui-time-list .devui-time-item{width:100%;height:24px;line-height:24px;text-align:center;cursor:pointer}.devui-time-picker .devui-time-list .devui-time-item:hover{color:#252b3a;color:var(--devui-list-item-hover-text, #252b3a);background-color:#f2f2f3;background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-time-picker .devui-time-list .devui-time-item.active{color:#252b3a;color:var(--devui-list-item-active-text, #252b3a);background-color:#f2f5fc;background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-time-picker .devui-time-list .devui-time-item.disabled{color:#cfd0d3;color:var(--devui-disabled-text, #cfd0d3);background-color:#f5f5f5;background-color:var(--devui-disabled-bg, #f5f5f5)}.devui-time-picker .devui-time-list .devui-time-item:not(:last-child){margin-bottom:8px}.devui-time-picker .devui-time-list .devui-time-item:last-child{margin-bottom:224px}.devui-time-footer{padding:8px 16px;overflow:hidden}.devui-time-footer .devui-btn-wrapper{float:right}\n"] }]
        }], ctorParameters: function () {
        return [{ type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.Renderer2 }, { type: i1.I18nService }, { type: i0.ChangeDetectorRef }, { type: i2.DevConfigService }, { type: undefined, decorators: [{
                        type: Inject,
                        args: [DOCUMENT]
                    }] }];
    }, propDecorators: { appendToBodyDirections: [{
                type: Input
            }], disabled: [{
                type: Input
            }], customViewTemplate: [{
                type: Input
            }], autoOpen: [{
                type: Input
            }], showAnimation: [{
                type: Input
            }], selectedTimeChange: [{
                type: Output
            }], timePicker: [{
                type: ViewChild,
                args: ['timePicker']
            }], minTime: [{
                type: Input
            }], maxTime: [{
                type: Input
            }], format: [{
                type: Input
            }], timePickerWidth: [{
                type: Input
            }], onBlur: [{
                type: HostListener,
                args: ['blur', ['$event']]
            }] } });

class TimePickerModule {
}
TimePickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
TimePickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.0", ngImport: i0, type: TimePickerModule, declarations: [TimePickerComponent], imports: [CommonModule,
        FormsModule,
        OverlayModule,
        ButtonModule], exports: [TimePickerComponent] });
TimePickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TimePickerModule, imports: [CommonModule,
        FormsModule,
        OverlayModule,
        ButtonModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TimePickerModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        CommonModule,
                        FormsModule,
                        OverlayModule,
                        ButtonModule
                    ],
                    exports: [
                        TimePickerComponent
                    ],
                    declarations: [
                        TimePickerComponent
                    ],
                    providers: [],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { TimePickerComponent, TimePickerModule };
//# sourceMappingURL=ng-devui-time-picker.mjs.map
