@ng-nest/ui 15.0.19 → 16.0.0

package/fesm2015/ng-nest-ui-time-picker.mjs

@@ -1,818 +0,0 @@
-import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, HostBinding, HostListener, NgModule } from '@angular/core';
-import { __decorate } from 'tslib';
-import { XWithConfig, XInputBoolean, XInputNumber, XDataConvert, XIsChange, XIsFunction, XIsEmpty, XIsNull, reqAnimFrame, XConnectBaseAnimation, XIsDate, XIsNumber, XIsString, XClearClass } from '@ng-nest/ui/core';
-import { XControlValueAccessor, XValueAccessor, XBaseFormModule } from '@ng-nest/ui/base-form';
-import { Subject } from 'rxjs';
-import { map, takeUntil } from 'rxjs/operators';
-import * as i1 from '@ng-nest/ui/i18n';
-import { XI18nModule } from '@ng-nest/ui/i18n';
-import * as i2 from '@angular/common';
-import { DatePipe, CommonModule } from '@angular/common';
-import * as i3 from '@ng-nest/ui/button';
-import { XButtonModule } from '@ng-nest/ui/button';
-import * as i5 from '@angular/forms';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i4 from '@ng-nest/ui/list';
-import { XListModule } from '@ng-nest/ui/list';
-import * as i1$1 from '@ng-nest/ui/portal';
-import { XPortalConnectedPosition, XPortalModule } from '@ng-nest/ui/portal';
-import * as i3$1 from '@angular/cdk/overlay';
-import * as i6 from '@ng-nest/ui/input';
-import { XInputModule } from '@ng-nest/ui/input';
-import { XIconModule } from '@ng-nest/ui/icon';
-
-/**
- * TimePicker
- * @selector x-time-picker
- * @decorator component
- */
-const XTimePickerPrefix = 'x-time-picker';
-const X_CONFIG_NAME = 'timePicker';
-/**
- * TimePicker Property
- */
-class XTimePickerProperty extends XControlValueAccessor {
-    constructor() {
-        super(...arguments);
-        /**
-         * @zh_CN 时间类型
-         * @en_US Time type
-         */
-        this.type = 'time';
-        /**
-         * @zh_CN 快捷选择按钮，支持此刻以及自定义
-         * @en_US Quick selection button, support now and custom
-         */
-        this.preset = [];
-        /**
-         * @zh_CN 节点点击的事件
-         * @en_US Node click event
-         */
-        this.nodeEmit = new EventEmitter();
-    }
-}
-/** @nocollapse */ XTimePickerProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTimePickerProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: XTimePickerProperty, selector: "ng-component", inputs: { type: "type", format: "format", placement: "placement", size: "size", use12Hours: "use12Hours", bordered: "bordered", hourStep: "hourStep", minuteStep: "minuteStep", secondStep: "secondStep", preset: "preset", disabledTime: "disabledTime" }, outputs: { nodeEmit: "nodeEmit" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
-__decorate([
-    XWithConfig(X_CONFIG_NAME, 'HH:mm:ss')
-], XTimePickerProperty.prototype, "format", void 0);
-__decorate([
-    XWithConfig(X_CONFIG_NAME, 'bottom-start')
-], XTimePickerProperty.prototype, "placement", void 0);
-__decorate([
-    XWithConfig(X_CONFIG_NAME, 'medium')
-], XTimePickerProperty.prototype, "size", void 0);
-__decorate([
-    XInputBoolean(),
-    XWithConfig(X_CONFIG_NAME, false)
-], XTimePickerProperty.prototype, "use12Hours", void 0);
-__decorate([
-    XInputBoolean(),
-    XWithConfig(X_CONFIG_NAME, true)
-], XTimePickerProperty.prototype, "bordered", void 0);
-__decorate([
-    XInputNumber(),
-    XWithConfig(X_CONFIG_NAME, 1)
-], XTimePickerProperty.prototype, "hourStep", void 0);
-__decorate([
-    XInputNumber(),
-    XWithConfig(X_CONFIG_NAME, 1)
-], XTimePickerProperty.prototype, "minuteStep", void 0);
-__decorate([
-    XInputNumber(),
-    XWithConfig(X_CONFIG_NAME, 1)
-], XTimePickerProperty.prototype, "secondStep", void 0);
-__decorate([
-    XDataConvert()
-], XTimePickerProperty.prototype, "preset", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerProperty, decorators: [{
-            type: Component,
-            args: [{ template: '' }]
-        }], propDecorators: { type: [{
-                type: Input
-            }], format: [{
-                type: Input
-            }], placement: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }], use12Hours: [{
-                type: Input
-            }], bordered: [{
-                type: Input
-            }], hourStep: [{
-                type: Input
-            }], minuteStep: [{
-                type: Input
-            }], secondStep: [{
-                type: Input
-            }], preset: [{
-                type: Input
-            }], disabledTime: [{
-                type: Input
-            }], nodeEmit: [{
-                type: Output
-            }] } });
-/**
- * TimePickerPortal
- * @selector x-time-picker-portal
- * @decorator component
- */
-const XTimePickerPortalPrefix = 'x-time-picker-portal';
-/**
- * TimePickerFrame
- * @selector x-time-picker-frame
- * @decorator component
- */
-const XTimePickerFramePrefix = 'x-time-picker-frame';
-
-class XTimePickerFrameComponent {
-    constructor(cdr, i18n) {
-        this.cdr = cdr;
-        this.i18n = i18n;
-        this.type = 'time';
-        this.hourStep = 1;
-        this.minuteStep = 1;
-        this.secondStep = 1;
-        this.defaultNow = true;
-        this.nodeEmit = new EventEmitter();
-        this.use12Hour = 'am';
-        this.scrollAnimating = {};
-        this.hourData = [];
-        this.minuteData = [];
-        this.secondData = [];
-        this.use12HoursData = [];
-        this.locale = {};
-        this.isInit = false;
-        this._unSubject = new Subject();
-    }
-    ngOnChanges(changes) {
-        const { value, disabledTimeParam } = changes;
-        if (XIsChange(value)) {
-            // this.setDataInit();
-            this.init();
-            this.setScrollTop(true);
-        }
-        XIsChange(disabledTimeParam) && this.setDataInit();
-    }
-    ngOnInit() {
-        this.setDataInit();
-        this.init();
-        this.i18n.localeChange
-            .pipe(map((x) => x.timePicker), takeUntil(this._unSubject))
-            .subscribe((x) => {
-            this.locale = x;
-            if (this.use12Hours) {
-                this.setUse12HoursData();
-            }
-            this.cdr.markForCheck();
-        });
-    }
-    ngAfterViewInit() {
-        this.setScrollTop();
-    }
-    setDataInit() {
-        this.setHourData();
-        this.setMinuteData();
-        this.setSecondData();
-        this.setUse12HoursData();
-    }
-    setDisabled(type, num) {
-        if (this.disabledTime && XIsFunction(this.disabledTime)) {
-            const disabledMap = this.disabledTime(this.disabledTimeParam);
-            const { disabledHours, disabledMinutes, disabledSeconds } = disabledMap;
-            let disabledNums = [];
-            if (type === 'hours') {
-                disabledNums = disabledHours ? disabledHours() : [];
-            }
-            else if (type === 'minutes') {
-                disabledNums = disabledMinutes ? disabledMinutes() : [];
-            }
-            else if (type === 'seconds') {
-                disabledNums = disabledSeconds ? disabledSeconds() : [];
-            }
-            return disabledNums.includes(num);
-        }
-        return false;
-    }
-    setHourData() {
-        let length = this.use12Hours ? 12 : 24;
-        this.hourData = Array.from({ length: Math.ceil(length / this.hourStep) }).map((_, i) => {
-            if (this.use12Hours && i === 0) {
-                i = 12;
-                return {
-                    disabled: this.setDisabled('hours', i),
-                    label: this.prefixZero(i, 2),
-                    id: i
-                };
-            }
-            else {
-                const num = i * this.hourStep;
-                return {
-                    disabled: this.setDisabled('hours', num),
-                    label: this.prefixZero(num, 2),
-                    id: num
-                };
-            }
-        });
-    }
-    setMinuteData() {
-        this.minuteData = Array.from({ length: Math.ceil(60 / this.minuteStep) }).map((_, i) => {
-            const num = i * this.minuteStep;
-            return {
-                disabled: this.setDisabled('minutes', num),
-                label: this.prefixZero(num, 2),
-                id: num
-            };
-        });
-    }
-    setSecondData() {
-        this.secondData = Array.from({ length: Math.ceil(60 / this.secondStep) }).map((_, i) => {
-            const num = i * this.secondStep;
-            return {
-                disabled: this.setDisabled('seconds', num),
-                label: this.prefixZero(num, 2),
-                id: num
-            };
-        });
-    }
-    setUse12HoursData() {
-        this.use12HoursData = [
-            {
-                id: 'am',
-                label: this.locale.am
-            },
-            {
-                id: 'pm',
-                label: this.locale.pm
-            }
-        ];
-    }
-    init() {
-        if (!XIsEmpty(this.value)) {
-            this.setDefault();
-            this.setTime(this.model);
-        }
-        else {
-            if (this.defaultNow) {
-                this.model = this.setNow();
-            }
-            else {
-                this.hour = null;
-                this.minute = null;
-                this.second = null;
-            }
-        }
-        this.cdr.detectChanges();
-    }
-    setDefault() {
-        this.model = new Date(this.value);
-    }
-    setNow() {
-        const def = new Date('1970-01-01');
-        const now = new Date();
-        return new Date(def.getFullYear(), def.getMonth(), def.getDate(), now.getHours(), now.getMinutes(), now.getSeconds());
-    }
-    setZero() {
-        const def = new Date('1970-01-01');
-        return new Date(def.getFullYear(), def.getMonth(), def.getDate(), 0, 0, 0);
-    }
-    setTime(date) {
-        if (this.use12Hours) {
-            let hour = date.getHours();
-            if (hour > 12) {
-                this.hour = hour - 12;
-                this.use12Hour = 'pm';
-            }
-            else if (hour === 12) {
-                this.hour = 12;
-                this.use12Hour = 'pm';
-            }
-            else {
-                this.hour = hour === 0 ? 12 : hour;
-                this.use12Hour = 'am';
-            }
-        }
-        else {
-            this.hour = date.getHours();
-        }
-        this.minute = date.getMinutes();
-        this.second = date.getSeconds();
-    }
-    prefixZero(num, n) {
-        return (Array(n).join('0') + num).slice(-n);
-    }
-    setScrollTop(animating = false) {
-        var _a, _b, _c, _d;
-        this.selected('hour', (_a = this.hourRef) === null || _a === void 0 ? void 0 : _a.nativeElement, this.hour, animating);
-        this.selected('minute', (_b = this.minuteRef) === null || _b === void 0 ? void 0 : _b.nativeElement, this.minute, animating);
-        this.selected('second', (_c = this.secondRef) === null || _c === void 0 ? void 0 : _c.nativeElement, this.second, animating);
-        this.selected('use12Hour', (_d = this.use12HoursRef) === null || _d === void 0 ? void 0 : _d.nativeElement, this.use12Hour, animating);
-    }
-    selected(type, ele, num, animating = false) {
-        if (!ele || XIsNull(num))
-            return;
-        if (this.scrollAnimating[ele.className])
-            return;
-        let len = Number(num);
-        switch (type) {
-            case 'hour':
-                len = this.hourData.findIndex((x) => x.id === num);
-                break;
-            case 'minute':
-                len = this.minuteData.findIndex((x) => x.id === num);
-                break;
-            case 'second':
-                len = this.secondData.findIndex((x) => x.id === num);
-                break;
-            case 'use12Hour':
-                len = this.use12HoursData.findIndex((x) => x.id === num);
-                break;
-        }
-        let current = ele.querySelector(`.x-list x-list-option:nth-child(${len + 1})`);
-        if (current) {
-            if (animating) {
-                this.scrollTo(ele, current.offsetTop, 120);
-            }
-            else {
-                ele.scrollTop = current.offsetTop;
-            }
-        }
-    }
-    isLastItem(data, item) {
-        return data.indexOf(item) === data.length - 1;
-    }
-    itemClick(type) {
-        if (XIsEmpty(this.model)) {
-            this.model = this.setZero();
-        }
-        switch (type) {
-            case 'minute':
-                this.model.setMinutes(this.minute);
-                break;
-            case 'second':
-                this.model.setSeconds(this.second);
-                break;
-            case 'hour':
-                if (this.use12Hours) {
-                    if (this.use12Hour === 'pm' && this.hour !== 12) {
-                        this.model.setHours(this.hour + 12);
-                    }
-                    else if (this.use12Hour === 'am' && this.hour === 12) {
-                        this.model.setHours(0);
-                    }
-                    else {
-                        this.model.setHours(this.hour);
-                    }
-                }
-                else {
-                    this.model.setHours(this.hour);
-                }
-                break;
-            case 'use12Hours':
-                if (this.use12Hour === 'pm' && this.hour !== 12) {
-                    this.model.setHours(this.hour + 12);
-                }
-                else if (this.use12Hour === 'am' && this.hour === 12) {
-                    this.model.setHours(0);
-                }
-                else {
-                    this.model.setHours(this.hour);
-                }
-                break;
-        }
-        this.setScrollTop(true);
-        this.nodeEmit.emit(this.model);
-        this.cdr.detectChanges();
-    }
-    scrollTo(element, to, duration) {
-        const clsName = element.className;
-        const difference = to - element.scrollTop;
-        const perTick = (difference / duration) * 10;
-        this.scrollAnimating[clsName] = true;
-        reqAnimFrame(() => {
-            element.scrollTop = element.scrollTop + perTick;
-            if (element.scrollTop === to || duration <= 0) {
-                this.scrollAnimating[clsName] = false;
-                return;
-            }
-            else {
-                this.scrollTo(element, to, duration - 10);
-            }
-        });
-    }
-}
-/** @nocollapse */ XTimePickerFrameComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerFrameComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.XI18nService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTimePickerFrameComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: XTimePickerFrameComponent, selector: "x-time-picker-frame", inputs: { type: "type", value: "value", use12Hours: "use12Hours", hourStep: "hourStep", minuteStep: "minuteStep", secondStep: "secondStep", defaultNow: "defaultNow", disabledTime: "disabledTime", disabledTimeParam: "disabledTimeParam" }, outputs: { nodeEmit: "nodeEmit" }, viewQueries: [{ propertyName: "hourRef", first: true, predicate: ["hourRef"], descendants: true }, { propertyName: "minuteRef", first: true, predicate: ["minuteRef"], descendants: true }, { propertyName: "secondRef", first: true, predicate: ["secondRef"], descendants: true }, { propertyName: "use12HoursRef", first: true, predicate: ["use12HoursRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"x-time-picker-frame\">\r\n  <div class=\"x-time-picker-frame-hour\" #hourRef>\r\n    <x-list [data]=\"hourData\" [(ngModel)]=\"hour\" (nodeClick)=\"itemClick('hour')\"></x-list>\r\n  </div>\r\n  <div class=\"x-time-picker-frame-minute\" #minuteRef *ngIf=\"type !== 'hour'\">\r\n    <x-list [data]=\"minuteData\" [(ngModel)]=\"minute\" (nodeClick)=\"itemClick('minute')\"></x-list>\r\n  </div>\r\n  <div class=\"x-time-picker-frame-second\" #secondRef *ngIf=\"type === 'time'\">\r\n    <x-list [data]=\"secondData\" [(ngModel)]=\"second\" (nodeClick)=\"itemClick('second')\"></x-list>\r\n  </div>\r\n  <div *ngIf=\"use12Hours\" class=\"x-time-picker-frame-use12Hours\" #use12HoursRef>\r\n    <x-list [data]=\"use12HoursData\" [(ngModel)]=\"use12Hour\" (nodeClick)=\"itemClick('use12Hours')\"></x-list>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.x-time-picker-frame{margin:0;padding:0;margin:.0625rem 0;display:block;height:100%}.x-time-picker-frame>div:not(:first-child){border-left:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-time-picker-frame-hour,.x-time-picker-frame-minute,.x-time-picker-frame-second,.x-time-picker-frame-use12Hours{position:relative;float:left;overflow:hidden;width:3.625rem;max-height:15rem;padding-bottom:calc(var(--x-border-width) * 2 + 13.125rem)}.x-time-picker-frame-hour:hover,.x-time-picker-frame-minute:hover,.x-time-picker-frame-second:hover,.x-time-picker-frame-use12Hours:hover{overflow-y:auto}.x-time-picker-frame-hour>x-list>.x-list,.x-time-picker-frame-minute>x-list>.x-list,.x-time-picker-frame-second>x-list>.x-list,.x-time-picker-frame-use12Hours>x-list>.x-list{width:3.625rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option,.x-time-picker-frame-minute>x-list>.x-list>x-list-option,.x-time-picker-frame-second>x-list>.x-list>x-list-option,.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option{min-width:3.625rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-minute>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-second>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option>.x-list-option{padding-left:.6rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-minute>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-second>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option>.x-list-option:not(:first-child){margin-top:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.XListComponent, selector: "x-list" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerFrameComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTimePickerFramePrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"x-time-picker-frame\">\r\n  <div class=\"x-time-picker-frame-hour\" #hourRef>\r\n    <x-list [data]=\"hourData\" [(ngModel)]=\"hour\" (nodeClick)=\"itemClick('hour')\"></x-list>\r\n  </div>\r\n  <div class=\"x-time-picker-frame-minute\" #minuteRef *ngIf=\"type !== 'hour'\">\r\n    <x-list [data]=\"minuteData\" [(ngModel)]=\"minute\" (nodeClick)=\"itemClick('minute')\"></x-list>\r\n  </div>\r\n  <div class=\"x-time-picker-frame-second\" #secondRef *ngIf=\"type === 'time'\">\r\n    <x-list [data]=\"secondData\" [(ngModel)]=\"second\" (nodeClick)=\"itemClick('second')\"></x-list>\r\n  </div>\r\n  <div *ngIf=\"use12Hours\" class=\"x-time-picker-frame-use12Hours\" #use12HoursRef>\r\n    <x-list [data]=\"use12HoursData\" [(ngModel)]=\"use12Hour\" (nodeClick)=\"itemClick('use12Hours')\"></x-list>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.x-time-picker-frame{margin:0;padding:0;margin:.0625rem 0;display:block;height:100%}.x-time-picker-frame>div:not(:first-child){border-left:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-time-picker-frame-hour,.x-time-picker-frame-minute,.x-time-picker-frame-second,.x-time-picker-frame-use12Hours{position:relative;float:left;overflow:hidden;width:3.625rem;max-height:15rem;padding-bottom:calc(var(--x-border-width) * 2 + 13.125rem)}.x-time-picker-frame-hour:hover,.x-time-picker-frame-minute:hover,.x-time-picker-frame-second:hover,.x-time-picker-frame-use12Hours:hover{overflow-y:auto}.x-time-picker-frame-hour>x-list>.x-list,.x-time-picker-frame-minute>x-list>.x-list,.x-time-picker-frame-second>x-list>.x-list,.x-time-picker-frame-use12Hours>x-list>.x-list{width:3.625rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option,.x-time-picker-frame-minute>x-list>.x-list>x-list-option,.x-time-picker-frame-second>x-list>.x-list>x-list-option,.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option{min-width:3.625rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-minute>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-second>x-list>.x-list>x-list-option>.x-list-option,.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option>.x-list-option{padding-left:.6rem}.x-time-picker-frame-hour>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-minute>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-second>x-list>.x-list>x-list-option>.x-list-option:not(:first-child),.x-time-picker-frame-use12Hours>x-list>.x-list>x-list-option>.x-list-option:not(:first-child){margin-top:0}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.XI18nService }]; }, propDecorators: { type: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], use12Hours: [{
-                type: Input
-            }], hourStep: [{
-                type: Input
-            }], minuteStep: [{
-                type: Input
-            }], secondStep: [{
-                type: Input
-            }], defaultNow: [{
-                type: Input
-            }], disabledTime: [{
-                type: Input
-            }], disabledTimeParam: [{
-                type: Input
-            }], nodeEmit: [{
-                type: Output
-            }], hourRef: [{
-                type: ViewChild,
-                args: ['hourRef']
-            }], minuteRef: [{
-                type: ViewChild,
-                args: ['minuteRef']
-            }], secondRef: [{
-                type: ViewChild,
-                args: ['secondRef']
-            }], use12HoursRef: [{
-                type: ViewChild,
-                args: ['use12HoursRef']
-            }] } });
-
-class XTimePickerPortalComponent {
-    constructor(renderer, cdr, i18n) {
-        this.renderer = renderer;
-        this.cdr = cdr;
-        this.i18n = i18n;
-        this.type = 'time';
-        this.preset = [];
-        this.locale = {};
-        this._unSubject = new Subject();
-    }
-    done(event) {
-        this.animating(false);
-        event.toState === 'void' && this.destroyPortal();
-    }
-    start() {
-        this.animating(true);
-    }
-    ngOnInit() {
-        this.valueChange.pipe(takeUntil(this._unSubject)).subscribe((x) => {
-            this.value = x;
-        });
-        this.positionChange.pipe(takeUntil(this._unSubject)).subscribe((x) => {
-            this.placement = x;
-            this.cdr.detectChanges();
-        });
-        this.i18n.localeChange
-            .pipe(map((x) => x.timePicker), takeUntil(this._unSubject))
-            .subscribe((x) => {
-            this.locale = x;
-            this.cdr.markForCheck();
-        });
-    }
-    ngOnDestroy() {
-        this._unSubject.next();
-        this._unSubject.unsubscribe();
-    }
-    stopPropagation(event) {
-        event.stopPropagation();
-    }
-    onPresetFunc(item) {
-        let date = item.func();
-        this.valueChange.next(date);
-        this.nodeEmit(date);
-    }
-    onNow() {
-        let date = new Date();
-        this.valueChange.next(date);
-        this.nodeEmit(date);
-    }
-}
-/** @nocollapse */ XTimePickerPortalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerPortalComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.XI18nService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTimePickerPortalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: XTimePickerPortalComponent, selector: "x-time-picker-portal", host: { listeners: { "@x-connect-base-animation.done": "done($event)", "@x-connect-base-animation.start": "start($event)" }, properties: { "@x-connect-base-animation": "this.placement" } }, ngImport: i0, template: "<div class=\"x-time-picker-portal\" (click)=\"inputCom.inputFocus(); stopPropagation($event)\">\r\n  <x-time-picker-frame\r\n    [type]=\"type\"\r\n    [value]=\"value\"\r\n    [use12Hours]=\"use12Hours\"\r\n    [hourStep]=\"hourStep\"\r\n    [minuteStep]=\"minuteStep\"\r\n    [secondStep]=\"secondStep\"\r\n    [disabledTime]=\"disabledTime\"\r\n    (nodeEmit)=\"nodeEmit($event)\"\r\n  ></x-time-picker-frame>\r\n  <div *ngIf=\"preset\" class=\"x-time-picker-portal-preset\">\r\n    <ng-container *ngFor=\"let item of preset\">\r\n      <x-button type=\"text\" *ngIf=\"!item.func && item.id === 'now'\" (click)=\"onNow()\">{{ locale.now }}</x-button>\r\n      <x-button type=\"text\" *ngIf=\"item.func\" (click)=\"onPresetFunc(item)\">{{ item.label }}</x-button>\r\n    </ng-container>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.x-time-picker-portal{display:flex;flex-direction:column;height:100%;font-size:var(--x-font-size);color:var(--x-text);border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow) var(--x-box-shadow-light-color);background-color:var(--x-background)}.x-time-picker-portal-preset{display:flex;align-items:center;justify-content:center;border-top:var(--x-border-width) solid var(--x-border)}.x-time-picker-portal-preset>x-button{flex:1}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.XButtonComponent, selector: "x-button" }, { kind: "component", type: XTimePickerFrameComponent, selector: "x-time-picker-frame", inputs: ["type", "value", "use12Hours", "hourStep", "minuteStep", "secondStep", "defaultNow", "disabledTime", "disabledTimeParam"], outputs: ["nodeEmit"] }], animations: [XConnectBaseAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerPortalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTimePickerPortalPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XConnectBaseAnimation], template: "<div class=\"x-time-picker-portal\" (click)=\"inputCom.inputFocus(); stopPropagation($event)\">\r\n  <x-time-picker-frame\r\n    [type]=\"type\"\r\n    [value]=\"value\"\r\n    [use12Hours]=\"use12Hours\"\r\n    [hourStep]=\"hourStep\"\r\n    [minuteStep]=\"minuteStep\"\r\n    [secondStep]=\"secondStep\"\r\n    [disabledTime]=\"disabledTime\"\r\n    (nodeEmit)=\"nodeEmit($event)\"\r\n  ></x-time-picker-frame>\r\n  <div *ngIf=\"preset\" class=\"x-time-picker-portal-preset\">\r\n    <ng-container *ngFor=\"let item of preset\">\r\n      <x-button type=\"text\" *ngIf=\"!item.func && item.id === 'now'\" (click)=\"onNow()\">{{ locale.now }}</x-button>\r\n      <x-button type=\"text\" *ngIf=\"item.func\" (click)=\"onPresetFunc(item)\">{{ item.label }}</x-button>\r\n    </ng-container>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.x-time-picker-portal{display:flex;flex-direction:column;height:100%;font-size:var(--x-font-size);color:var(--x-text);border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow) var(--x-box-shadow-light-color);background-color:var(--x-background)}.x-time-picker-portal-preset{display:flex;align-items:center;justify-content:center;border-top:var(--x-border-width) solid var(--x-border)}.x-time-picker-portal-preset>x-button{flex:1}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i1.XI18nService }]; }, propDecorators: { placement: [{
-                type: HostBinding,
-                args: ['@x-connect-base-animation']
-            }], done: [{
-                type: HostListener,
-                args: ['@x-connect-base-animation.done', ['$event']]
-            }], start: [{
-                type: HostListener,
-                args: ['@x-connect-base-animation.start', ['$event']]
-            }] } });
-
-class XTimePickerComponent extends XTimePickerProperty {
-    constructor(renderer, elementRef, cdr, portalService, viewContainerRef, datePipe, overlay, i18n) {
-        super();
-        this.renderer = renderer;
-        this.elementRef = elementRef;
-        this.cdr = cdr;
-        this.portalService = portalService;
-        this.viewContainerRef = viewContainerRef;
-        this.datePipe = datePipe;
-        this.overlay = overlay;
-        this.i18n = i18n;
-        this.readonly = true;
-        this.clearable = false;
-        this.enter = false;
-        this.animating = false;
-        this.displayValue = '';
-        this.icon = 'fto-clock';
-        this.maxNodes = 8;
-        this.protalTobottom = true;
-        this.valueChange = new Subject();
-        this.dataChange = new Subject();
-        this.positionChange = new Subject();
-        this.closeSubject = new Subject();
-        this.valueType = 'date';
-        this.locale = {};
-        this._unSubject = new Subject();
-    }
-    writeValue(value) {
-        if (XIsDate(value)) {
-            this.value = value.getTime();
-            this.valueType = 'date';
-        }
-        else if (XIsNumber(value)) {
-            this.value = value;
-            this.valueType = 'number';
-        }
-        else if (XIsString(value)) {
-            this.value = new Date(value).getTime();
-            this.valueType = 'string';
-        }
-        else if (XIsEmpty(value)) {
-            this.value = '';
-        }
-        this.setDisplayValue(this.value);
-        this.valueChange.next(this.value);
-        this.cdr.detectChanges();
-    }
-    get getPlaceholder() {
-        if (this.placeholder)
-            return this.placeholder;
-        if (this.type === 'time') {
-            return this.locale.selectTime;
-        }
-        else if (this.type === 'hour') {
-            return this.locale.selectHour;
-        }
-        else if (this.type === 'minute') {
-            return this.locale.selectMinute;
-        }
-        else {
-            return this.locale.selectTime;
-        }
-    }
-    ngOnInit() {
-        this.setFlex(this.datePicker.nativeElement, this.renderer, this.justify, this.align, this.direction);
-        this.setFormat();
-        this.setClassMap();
-        this.setSubject();
-    }
-    ngAfterViewInit() {
-        this.setPortal();
-    }
-    ngOnDestroy() {
-        this._unSubject.next();
-        this._unSubject.unsubscribe();
-    }
-    setClassMap() {
-        XClearClass(this.labelMap);
-        this.labelMap[`x-text-align-${this.labelAlign}`] = this.labelAlign ? true : false;
-    }
-    setFormat() {
-        if (this.format === 'HH:mm:ss') {
-            if (this.type === 'hour') {
-                this.format = 'HH';
-            }
-            else if (this.type === 'minute') {
-                this.format = 'HH:mm';
-            }
-        }
-    }
-    setSubject() {
-        this.closeSubject.pipe(takeUntil(this._unSubject)).subscribe(() => {
-            this.closePortal();
-        });
-        this.i18n.localeChange
-            .pipe(map((x) => x.timePicker), takeUntil(this._unSubject))
-            .subscribe((x) => {
-            this.locale = x;
-            if (this.use12Hours) {
-                this.setDisplayValue(this.value);
-            }
-            this.cdr.markForCheck();
-        });
-    }
-    menter() {
-        if (this.disabled)
-            return;
-        this.enter = true;
-        if (!XIsEmpty(this.value)) {
-            this.icon = '';
-            this.clearable = true;
-            this.cdr.detectChanges();
-        }
-    }
-    mleave() {
-        if (this.disabled)
-            return;
-        this.enter = false;
-        if (this.clearable) {
-            this.icon = 'fto-clock';
-            this.clearable = false;
-            this.cdr.detectChanges();
-        }
-    }
-    clearEmit() {
-        this.value = '';
-        this.displayValue = '';
-        this.mleave();
-        this.valueChange.next(this.value);
-        if (this.onChange)
-            this.onChange(this.value);
-    }
-    portalAttached() {
-        var _a, _b;
-        return (_b = (_a = this.portal) === null || _a === void 0 ? void 0 : _a.overlayRef) === null || _b === void 0 ? void 0 : _b.hasAttached();
-    }
-    closePortal() {
-        var _a, _b;
-        if (this.portalAttached()) {
-            (_b = (_a = this.portal) === null || _a === void 0 ? void 0 : _a.overlayRef) === null || _b === void 0 ? void 0 : _b.detach();
-            this.active = false;
-            this.cdr.detectChanges();
-            return true;
-        }
-        return false;
-    }
-    destroyPortal() {
-        var _a, _b;
-        (_b = (_a = this.portal) === null || _a === void 0 ? void 0 : _a.overlayRef) === null || _b === void 0 ? void 0 : _b.dispose();
-    }
-    showPortal() {
-        var _a;
-        if (this.disabled || this.animating)
-            return;
-        this.active = true;
-        const config = {
-            backdropClass: '',
-            positionStrategy: this.setPlacement(),
-            scrollStrategy: this.overlay.scrollStrategies.reposition()
-        };
-        this.setPosition(config);
-        this.portal = this.portalService.attach({
-            content: XTimePickerPortalComponent,
-            viewContainerRef: this.viewContainerRef,
-            overlayConfig: config
-        });
-        (_a = this.portal.overlayRef) === null || _a === void 0 ? void 0 : _a.outsidePointerEvents().pipe(takeUntil(this._unSubject)).subscribe(() => {
-            this.closeSubject.next();
-        });
-        this.setInstance();
-    }
-    setPosition(config) {
-        let position = config.positionStrategy;
-        position.positionChanges.pipe(takeUntil(this._unSubject)).subscribe((pos) => {
-            const place = XPortalConnectedPosition.get(pos.connectionPair);
-            place !== this.placement && this.positionChange.next(place);
-        });
-    }
-    setInstance() {
-        var _a;
-        let componentRef = (_a = this.portal) === null || _a === void 0 ? void 0 : _a.componentRef;
-        if (!componentRef)
-            return;
-        Object.assign(componentRef.instance, {
-            type: this.type,
-            value: this.value,
-            placement: this.placement,
-            valueChange: this.valueChange,
-            positionChange: this.positionChange,
-            inputCom: this.inputCom,
-            use12Hours: this.use12Hours,
-            hourStep: this.hourStep,
-            minuteStep: this.minuteStep,
-            secondStep: this.secondStep,
-            preset: this.preset,
-            disabledTime: this.disabledTime,
-            closePortal: () => this.closeSubject.next(),
-            destroyPortal: () => this.destroyPortal(),
-            nodeEmit: (node) => this.onNodeClick(node),
-            animating: (ing) => (this.animating = ing)
-        });
-        componentRef.changeDetectorRef.detectChanges();
-    }
-    onNodeClick(date) {
-        this.value = this.setValue(date);
-        this.setDisplayValue(date);
-        this.cdr.detectChanges();
-        if (this.onChange)
-            this.onChange(this.value);
-        this.formControlValidator();
-        this.nodeEmit.emit(this.value);
-    }
-    setValue(value) {
-        return ['date', 'string'].includes(this.valueType) ? new Date(value) : value.getTime();
-    }
-    setDisplayValue(date) {
-        if (!date)
-            return;
-        if (this.use12Hours) {
-            let dt = new Date(date);
-            let hour = dt.getHours();
-            let suffix = hour >= 12 ? this.locale.pm : this.locale.am;
-            this.displayValue = `${this.datePipe.transform(dt.setHours(hour === 0 ? 12 : hour > 12 ? hour - 12 : hour), this.format)} ${suffix}`;
-        }
-        else {
-            this.displayValue = this.datePipe.transform(date, this.format);
-        }
-    }
-    setPlacement() {
-        return this.portalService.setPlacement({
-            elementRef: this.inputCom.inputRef,
-            placement: [this.placement, 'bottom-start', 'bottom-end', 'top-start', 'top-end'],
-            transformOriginOn: 'x-time-picker-portal'
-        });
-    }
-    setPortal() {
-        var _a;
-        if (this.portalAttached()) {
-            (_a = this.portal.overlayRef) === null || _a === void 0 ? void 0 : _a.updatePositionStrategy(this.setPlacement());
-        }
-    }
-    formControlChanges() {
-        this.ngOnInit();
-        this.cdr.detectChanges();
-    }
-}
-/** @nocollapse */ XTimePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.XPortalService }, { token: i0.ViewContainerRef }, { token: i2.DatePipe }, { token: i3$1.Overlay }, { token: i1.XI18nService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ XTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: XTimePickerComponent, selector: "x-time-picker", providers: [XValueAccessor(XTimePickerComponent), DatePipe], viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["datePicker"], descendants: true, static: true }, { propertyName: "inputCom", first: true, predicate: ["inputCom"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #datePicker class=\"x-time-picker\">\r\n  <div class=\"x-time-picker-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label\"\r\n      [labelWidth]=\"labelWidth\"\r\n      [labelAlign]=\"labelAlign\"\r\n      [justify]=\"justify\"\r\n      [align]=\"align\"\r\n      [direction]=\"direction\"\r\n      [disabled]=\"disabled\"\r\n      [required]=\"required\"\r\n      [validator]=\"validator\"\r\n      [icon]=\"icon\"\r\n      [placeholder]=\"getPlaceholder\"\r\n      [readonly]=\"readonly\"\r\n      [clearable]=\"clearable\"\r\n      [(ngModel)]=\"displayValue\"\r\n      [valueTpl]=\"valueTpl\"\r\n      [valueTplContext]=\"valueTplContext\"\r\n      [size]=\"size\"\r\n      [bordered]=\"bordered\"\r\n      [before]=\"before\"\r\n      [after]=\"after\"\r\n      [pattern]=\"pattern\"\r\n      [message]=\"message\"\r\n      [pointer]=\"true\"\r\n      [(active)]=\"active\"\r\n      (clearEmit)=\"clearEmit()\"\r\n      (xClick)=\"showPortal()\"\r\n      (xMouseenter)=\"menter()\"\r\n      (xMouseleave)=\"mleave()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-time-picker{display:inline-block;width:12rem}.x-time-picker{margin:0;padding:0;width:100%}.x-time-picker x-input{width:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.XInputComponent, selector: "x-input" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: `${XTimePickerPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XTimePickerComponent), DatePipe], template: "<div #datePicker class=\"x-time-picker\">\r\n  <div class=\"x-time-picker-row\">\r\n    <x-input\r\n      #inputCom\r\n      type=\"text\"\r\n      [label]=\"label\"\r\n      [labelWidth]=\"labelWidth\"\r\n      [labelAlign]=\"labelAlign\"\r\n      [justify]=\"justify\"\r\n      [align]=\"align\"\r\n      [direction]=\"direction\"\r\n      [disabled]=\"disabled\"\r\n      [required]=\"required\"\r\n      [validator]=\"validator\"\r\n      [icon]=\"icon\"\r\n      [placeholder]=\"getPlaceholder\"\r\n      [readonly]=\"readonly\"\r\n      [clearable]=\"clearable\"\r\n      [(ngModel)]=\"displayValue\"\r\n      [valueTpl]=\"valueTpl\"\r\n      [valueTplContext]=\"valueTplContext\"\r\n      [size]=\"size\"\r\n      [bordered]=\"bordered\"\r\n      [before]=\"before\"\r\n      [after]=\"after\"\r\n      [pattern]=\"pattern\"\r\n      [message]=\"message\"\r\n      [pointer]=\"true\"\r\n      [(active)]=\"active\"\r\n      (clearEmit)=\"clearEmit()\"\r\n      (xClick)=\"showPortal()\"\r\n      (xMouseenter)=\"menter()\"\r\n      (xMouseleave)=\"mleave()\"\r\n    ></x-input>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";x-time-picker{display:inline-block;width:12rem}.x-time-picker{margin:0;padding:0;width:100%}.x-time-picker x-input{width:100%}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.XPortalService }, { type: i0.ViewContainerRef }, { type: i2.DatePipe }, { type: i3$1.Overlay }, { type: i1.XI18nService }]; }, propDecorators: { datePicker: [{
-                type: ViewChild,
-                args: ['datePicker', { static: true }]
-            }], inputCom: [{
-                type: ViewChild,
-                args: ['inputCom', { static: true }]
-            }] } });
-
-class XTimePickerModule {
-}
-/** @nocollapse */ XTimePickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ XTimePickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerModule, declarations: [XTimePickerComponent, XTimePickerPortalComponent, XTimePickerFrameComponent, XTimePickerProperty], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        XPortalModule,
-        XInputModule,
-        XListModule,
-        XButtonModule,
-        XIconModule,
-        XBaseFormModule,
-        XI18nModule], exports: [XTimePickerComponent, XTimePickerPortalComponent, XTimePickerFrameComponent] });
-/** @nocollapse */ XTimePickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerModule, imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        XPortalModule,
-        XInputModule,
-        XListModule,
-        XButtonModule,
-        XIconModule,
-        XBaseFormModule,
-        XI18nModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: XTimePickerModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [XTimePickerComponent, XTimePickerPortalComponent, XTimePickerFrameComponent, XTimePickerProperty],
-                    exports: [XTimePickerComponent, XTimePickerPortalComponent, XTimePickerFrameComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        XPortalModule,
-                        XInputModule,
-                        XListModule,
-                        XButtonModule,
-                        XIconModule,
-                        XBaseFormModule,
-                        XI18nModule
-                    ]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { XTimePickerComponent, XTimePickerFrameComponent, XTimePickerFramePrefix, XTimePickerModule, XTimePickerPortalComponent, XTimePickerPortalPrefix, XTimePickerPrefix, XTimePickerProperty };
-//# sourceMappingURL=ng-nest-ui-time-picker.mjs.map