@ng-nest/ui 20.3.4 → 20.3.6

package/fesm2022/ng-nest-ui-calendar.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, output, Component, inject, signal, computed, effect, ChangeDetectionStrategy, ViewEncapsulation, NgModule } from '@angular/core';
+import { input, output, Component, inject, linkedSignal, signal, computed, effect, ChangeDetectionStrategy, ViewEncapsulation, NgModule } from '@angular/core';
 import { XPropertyFunction, XIsEmpty } from '@ng-nest/ui/core';
 import { DatePipe, LowerCasePipe, NgClass, NgTemplateOutlet } from '@angular/common';
 import { XI18nService, zh_CN } from '@ng-nest/ui/i18n';
@@ -61,6 +61,17 @@ class XCalendarProperty extends XPropertyFunction(X_CALENDAR_CONFIG_NAME) {
          *
          */
         this.displayType = input('calendar', ...(ngDevMode ? [{ debugName: "displayType" }] : []));
+        /**
+         * @zh_CN 指定初始显示的日期
+         * @en_US Specify the initially displayed date
+         * @example
+         *
+         * ```html
+         * <x-calendar [value]="new Date(2020, 1, 22)"></x-calendar>
+         * ```
+         *
+         */
+        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
         /**
          * @zh_CN 头部显示模版
          * @en_US Head display template
@@ -113,12 +124,12 @@ class XCalendarProperty extends XPropertyFunction(X_CALENDAR_CONFIG_NAME) {
         this.rangeChange = output();
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XCalendarProperty, isStandalone: true, selector: "x-calendar-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, headerLeftTemp: { classPropertyName: "headerLeftTemp", publicName: "headerLeftTemp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XCalendarProperty, isStandalone: true, selector: "x-calendar-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, headerLeftTemp: { classPropertyName: "headerLeftTemp", publicName: "headerLeftTemp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XCalendarPrefix}-property`, template: '' }]
-        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }], displayType: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayType", required: false }] }], headerLeftTemp: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLeftTemp", required: false }] }], dateChange: [{ type: i0.Output, args: ["dateChange"] }], rangeChange: [{ type: i0.Output, args: ["rangeChange"] }] } });
+        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }], displayType: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayType", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], headerLeftTemp: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLeftTemp", required: false }] }], dateChange: [{ type: i0.Output, args: ["dateChange"] }], rangeChange: [{ type: i0.Output, args: ["rangeChange"] }] } });
 
 class XCalendarComponent extends XCalendarProperty {
     constructor() {
@@ -126,8 +137,8 @@ class XCalendarComponent extends XCalendarProperty {
         this.datePipe = inject(DatePipe);
         this.lowerCasePipe = inject(LowerCasePipe);
         this.i18n = inject(XI18nService);
-        this.datetime = signal(new Date(), ...(ngDevMode ? [{ debugName: "datetime" }] : []));
-        this.activatedDate = signal(new Date(), ...(ngDevMode ? [{ debugName: "activatedDate" }] : []));
+        this.datetime = linkedSignal(() => this.value() ?? new Date(), ...(ngDevMode ? [{ debugName: "datetime" }] : []));
+        this.activatedDate = linkedSignal(() => this.value() ?? new Date(), ...(ngDevMode ? [{ debugName: "activatedDate" }] : []));
         this.radioDataBase = [
             { label: '', id: 'month' },
             { label: '', id: 'year' }
@@ -149,8 +160,9 @@ class XCalendarComponent extends XCalendarProperty {
             let dt = {};
             for (let key in this.data()) {
                 let month = this.datePipe.transform(key, 'yyyy-MM');
+                let items = this.toItems(this.data()[key]);
                 let value = '';
-                this.data()[key].forEach((x) => {
+                items.forEach((x) => {
                     value += `${x.id}${x.label} <br/>`;
                 });
                 let item = { id: key, label: value };
@@ -190,13 +202,59 @@ class XCalendarComponent extends XCalendarProperty {
         this.rangeChange.emit(range);
     }
     getDate(date) {
-        return this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd')];
+        return this.toItems(this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd')]);
     }
     getMonth(date) {
-        return this.monthData()?.[this.datePipe.transform(date, 'yyyy-MM')];
+        return this.monthData()?.[this.datePipe.transform(date, 'yyyy-MM')] ?? [];
+    }
+    getCellClass(date) {
+        const value = this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd')];
+        const node = !Array.isArray(value) ? value : undefined;
+        const items = this.toItems(value);
+        const classes = [...(node?.class ? [node.class] : []), ...items.map((x) => x.class).filter((x) => !!x)];
+        return classes.join(' ');
+    }
+    getCellStyle(date) {
+        const value = this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd')];
+        const node = !Array.isArray(value) ? value : undefined;
+        const style = { ...(node?.style || {}) };
+        this.toItems(value).forEach((x) => {
+            if (x.style)
+                Object.assign(style, x.style);
+        });
+        return style;
+    }
+    getMonthClass(date) {
+        return this.getNodesClass(this.getMonth(date));
+    }
+    getMonthStyle(date) {
+        return this.getNodesStyle(this.getMonth(date));
+    }
+    toItems(value) {
+        if (!value)
+            return [];
+        if (Array.isArray(value))
+            return value;
+        return value.list ?? [];
+    }
+    getNodesClass(nodes) {
+        if (!nodes || nodes.length === 0)
+            return '';
+        return nodes
+            .map((x) => x.class)
+            .filter((x) => !!x)
+            .join(' ');
+    }
+    getNodesStyle(nodes) {
+        const style = {};
+        nodes?.forEach((x) => {
+            if (x.style)
+                Object.assign(style, x.style);
+        });
+        return style;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XCalendarComponent, isStandalone: true, selector: "x-calendar", providers: [DatePipe, LowerCasePipe], usesInheritance: true, ngImport: i0, template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-date\" [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\">\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-month\" [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\">\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XLinkComponent, selector: "x-link" }, { kind: "directive", type: XTooltipDirective, selector: "[x-tooltip], x-tooltip" }, { kind: "component", type: XRadioComponent, selector: "x-radio" }, { kind: "component", type: XDatePickerComponent, selector: "x-date-picker" }, { kind: "component", type: XPickerDateComponent, selector: "x-picker-date" }, { kind: "component", type: XPickerMonthComponent, selector: "x-picker-month" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XCalendarComponent, isStandalone: true, selector: "x-calendar", providers: [DatePipe, LowerCasePipe], usesInheritance: true, ngImport: i0, template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-date\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\"\r\n    [class]=\"getCellClass(date)\"\r\n    [style]=\"getCellStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-month\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\"\r\n    [class]=\"getMonthClass(date)\"\r\n    [style]=\"getMonthStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XLinkComponent, selector: "x-link" }, { kind: "directive", type: XTooltipDirective, selector: "[x-tooltip], x-tooltip" }, { kind: "component", type: XRadioComponent, selector: "x-radio" }, { kind: "component", type: XDatePickerComponent, selector: "x-date-picker" }, { kind: "component", type: XPickerDateComponent, selector: "x-picker-date" }, { kind: "component", type: XPickerMonthComponent, selector: "x-picker-month" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarComponent, decorators: [{
             type: Component,
@@ -213,7 +271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
                         XPickerMonthComponent,
                         XButtonComponent,
                         XButtonsComponent
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DatePipe, LowerCasePipe], template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-date\" [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\">\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-month\" [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\">\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [DatePipe, LowerCasePipe], template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-date\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\"\r\n    [class]=\"getCellClass(date)\"\r\n    [style]=\"getCellStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-month\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\"\r\n    [class]=\"getMonthClass(date)\"\r\n    [style]=\"getMonthStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"] }]
         }], ctorParameters: () => [] });
 
 class XCalendarModule {

package/fesm2022/ng-nest-ui-calendar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-nest-ui-calendar.mjs","sources":["../../../../lib/ng-nest/ui/calendar/calendar.property.ts","../../../../lib/ng-nest/ui/calendar/calendar.component.ts","../../../../lib/ng-nest/ui/calendar/calendar.component.html","../../../../lib/ng-nest/ui/calendar/calendar.module.ts","../../../../lib/ng-nest/ui/calendar/ng-nest-ui-calendar.ts"],"sourcesContent":["import { XPropertyFunction } from '@ng-nest/ui/core';\r\nimport { Component, TemplateRef, input, output } from '@angular/core';\r\nimport type { XIdentityProperty } from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Calendar\r\n * @selector x-calendar\r\n * @decorator component\r\n */\r\nexport const XCalendarPrefix = 'x-calendar';\r\nconst X_CALENDAR_CONFIG_NAME = 'calendar';\r\n\r\n/**\r\n * Calendar Property\r\n */\r\n@Component({ selector: `${XCalendarPrefix}-property`, template: '' })\r\nexport class XCalendarProperty extends XPropertyFunction(X_CALENDAR_CONFIG_NAME) {\r\n  /**\r\n   * @zh_CN 事务数据对象\r\n   * @en_US Transaction data object\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar [data]=\"{ '2020-2-22': [{id: '1',label: '1'}], '2020-2-24': [{id: '2, label: '2'}] }\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly data = input<XCalendarData>({});\r\n  /**\r\n   * @zh_CN 显示模式\r\n   * @en_US Display mode\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar model=\"month\"></x-calendar>\r\n   * <x-calendar model=\"year\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly model = input<XCalendarModel>('month');\r\n  /**\r\n   * @zh_CN 显示类型\r\n   * @en_US Display type\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar displayType=\"calendar\"></x-calendar>\r\n   * <x-calendar displayType=\"card\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly displayType = input<XCalendarType>('calendar');\r\n  /**\r\n   * @zh_CN 头部显示模版\r\n   * @en_US Head display template\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar [headerLeftTemp]=\"headerLeftTemp\"></x-calendar>\r\n   * <ng-template #headerLeftTemp> custom title </ng-template>\r\n   * ```\r\n   *\r\n   */\r\n  readonly headerLeftTemp = input<TemplateRef<any>>();\r\n  /**\r\n   * @zh_CN 选择日期变化的事件\r\n   * @en_US Select the event of the date change\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar (dateChange)=\"onDateChange($event)\"></x-calendar>\r\n   * ```\r\n   *\r\n   * ```typescript\r\n   * ...\r\n   * onDateChange(date: Date) {\r\n   *   console.log(date)\r\n   * }\r\n   * ...\r\n   * ```\r\n   *\r\n   */\r\n  readonly dateChange = output<Date>();\r\n  /**\r\n   * @zh_CN 日期范围变化的事件\r\n   * @en_US Date range change event\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar (rangeChange)=\"onRangeChange($event)\"></x-calendar>\r\n   * ```\r\n   *\r\n   * ```typescript\r\n   * ...\r\n   * onRangeChange(dates: Date[]) {\r\n   *   console.log(dates)\r\n   * }\r\n   * ...\r\n   * ```\r\n   *\r\n   */\r\n  readonly rangeChange = output<Date[]>();\r\n}\r\n\r\n/**\r\n * @zh_CN Calendar 数据对象\r\n * @en_US Calendar data object\r\n */\r\nexport interface XCalendarData {\r\n  /**\r\n   * key-value\r\n   * { \"2020-2-22\": [{id:\"1\",label:\"1\"}] }\r\n   */\r\n  [property: string]: XCalendarNode[];\r\n}\r\n\r\n/**\r\n * @zh_CN Calendar 数据对象\r\n * @en_US Calendar data object\r\n */\r\nexport interface XCalendarNode extends XIdentityProperty {}\r\n\r\n/**\r\n * @zh_CN 显示模式\r\n * @en_US Display mode\r\n */\r\nexport type XCalendarModel = 'month' | 'year';\r\n\r\n/**\r\n * @zh_CN 显示类型\r\n * @en_US Display type\r\n */\r\nexport type XCalendarType = 'calendar' | 'card';\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy, inject, computed, signal, effect } from '@angular/core';\r\nimport { XCalendarPrefix, XCalendarProperty } from './calendar.property';\r\nimport { XIsEmpty } from '@ng-nest/ui/core';\r\nimport { DatePipe, LowerCasePipe, NgClass, NgTemplateOutlet } from '@angular/common';\r\nimport { XI18nService, zh_CN } from '@ng-nest/ui/i18n';\r\nimport { XLinkComponent } from '@ng-nest/ui/link';\r\nimport { XDatePickerComponent, XPickerDateComponent, XPickerMonthComponent } from '@ng-nest/ui/date-picker';\r\nimport { XButtonComponent, XButtonsComponent } from '@ng-nest/ui/button';\r\nimport { XRadioComponent } from '@ng-nest/ui/radio';\r\nimport { XTooltipDirective } from '@ng-nest/ui/tooltip';\r\nimport { map } from 'rxjs/operators';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { toSignal } from '@angular/core/rxjs-interop';\r\nimport type { XCalendarNode } from './calendar.property';\r\nimport type { XI18nCalendar } from '@ng-nest/ui/i18n';\r\n\r\n@Component({\r\n  selector: `${XCalendarPrefix}`,\r\n  imports: [\r\n    NgClass,\r\n    NgTemplateOutlet,\r\n    DatePipe,\r\n    FormsModule,\r\n    XLinkComponent,\r\n    XTooltipDirective,\r\n    XRadioComponent,\r\n    XDatePickerComponent,\r\n    XPickerDateComponent,\r\n    XPickerMonthComponent,\r\n    XButtonComponent,\r\n    XButtonsComponent\r\n  ],\r\n  templateUrl: './calendar.component.html',\r\n  styleUrls: ['./calendar.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [DatePipe, LowerCasePipe]\r\n})\r\nexport class XCalendarComponent extends XCalendarProperty {\r\n  private datePipe = inject(DatePipe);\r\n  private lowerCasePipe = inject(LowerCasePipe);\r\n  private i18n = inject(XI18nService);\r\n  datetime = signal(new Date());\r\n  activatedDate = signal(new Date());\r\n  radioDataBase = [\r\n    { label: '', id: 'month' },\r\n    { label: '', id: 'year' }\r\n  ];\r\n  modelSignal = signal(this.model());\r\n\r\n  locale = toSignal(this.i18n.localeChange.pipe(map((x) => x.calendar as XI18nCalendar)), {\r\n    initialValue: zh_CN.calendar\r\n  });\r\n  radioData = computed(() => {\r\n    return this.radioDataBase.map((x) => {\r\n      x.label = (this.locale() as any)[x.id];\r\n      return x;\r\n    });\r\n  });\r\n  classMap = computed(() => ({\r\n    [`${XCalendarPrefix}-${this.displayType()}`]: !XIsEmpty(this.displayType())\r\n  }));\r\n  monthData = computed(() => {\r\n    let dt: { [property: string]: XCalendarNode[] } = {};\r\n    for (let key in this.data()) {\r\n      let month = this.datePipe.transform(key, 'yyyy-MM') as string;\r\n      let value = '';\r\n      this.data()[key].forEach((x) => {\r\n        value += `${x.id}${x.label} <br/>`;\r\n      });\r\n      let item = { id: key, label: value };\r\n      if (dt[month]) {\r\n        dt[month] = [...dt[month], item];\r\n      } else {\r\n        dt[month] = [item];\r\n      }\r\n    }\r\n\r\n    return dt;\r\n  });\r\n\r\n  constructor() {\r\n    super();\r\n    effect(() => {\r\n      this.modelSignal.set(this.model());\r\n    });\r\n  }\r\n\r\n  action(next: number) {\r\n    let datetime = new Date(this.datetime().getTime());\r\n    if (this.modelSignal() === 'month') {\r\n      datetime.setMonth(datetime.getMonth() + next);\r\n    } else if (this.modelSignal() === 'year') {\r\n      datetime.setFullYear(datetime.getFullYear() + next);\r\n    }\r\n    this.datetime.set(datetime);\r\n  }\r\n\r\n  getLocaleMonth(date: Date) {\r\n    return (this.locale() as any)[this.lowerCasePipe.transform(this.datePipe.transform(date, 'LLLL') as string)];\r\n  }\r\n\r\n  dateOnChange(date: Date) {\r\n    if (this.datePipe.transform(date, 'yyyy-MM-dd') !== this.datePipe.transform(this.activatedDate(), 'yyyy-MM-dd')) {\r\n      this.activatedDate.set(date);\r\n      this.dateChange.emit(this.activatedDate());\r\n    }\r\n  }\r\n\r\n  rangeOnChange(range: Date[]) {\r\n    this.rangeChange.emit(range);\r\n  }\r\n\r\n  getDate(date: Date): XCalendarNode[] {\r\n    return this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd') as string];\r\n  }\r\n\r\n  getMonth(date: Date): XCalendarNode[] {\r\n    return this.monthData()?.[this.datePipe.transform(date, 'yyyy-MM') as string];\r\n  }\r\n}\r\n","<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-date\" [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\">\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-month\" [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\">\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { XCalendarComponent } from './calendar.component';\r\n\r\n@NgModule({\r\n  exports: [XCalendarComponent],\r\n  imports: [XCalendarComponent]\r\n})\r\nexport class XCalendarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-nest-ui-calendar.mjs","sources":["../../../../lib/ng-nest/ui/calendar/calendar.property.ts","../../../../lib/ng-nest/ui/calendar/calendar.component.ts","../../../../lib/ng-nest/ui/calendar/calendar.component.html","../../../../lib/ng-nest/ui/calendar/calendar.module.ts","../../../../lib/ng-nest/ui/calendar/ng-nest-ui-calendar.ts"],"sourcesContent":["import { XPropertyFunction } from '@ng-nest/ui/core';\r\nimport { Component, TemplateRef, input, output } from '@angular/core';\r\nimport type { XIdentityProperty } from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Calendar\r\n * @selector x-calendar\r\n * @decorator component\r\n */\r\nexport const XCalendarPrefix = 'x-calendar';\r\nconst X_CALENDAR_CONFIG_NAME = 'calendar';\r\n\r\n/**\r\n * Calendar Property\r\n */\r\n@Component({ selector: `${XCalendarPrefix}-property`, template: '' })\r\nexport class XCalendarProperty extends XPropertyFunction(X_CALENDAR_CONFIG_NAME) {\r\n  /**\r\n   * @zh_CN 事务数据对象\r\n   * @en_US Transaction data object\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar [data]=\"{ '2020-2-22': [{id: '1',label: '1'}], '2020-2-24': [{id: '2, label: '2'}] }\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly data = input<XCalendarData>({});\r\n  /**\r\n   * @zh_CN 显示模式\r\n   * @en_US Display mode\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar model=\"month\"></x-calendar>\r\n   * <x-calendar model=\"year\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly model = input<XCalendarModel>('month');\r\n  /**\r\n   * @zh_CN 显示类型\r\n   * @en_US Display type\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar displayType=\"calendar\"></x-calendar>\r\n   * <x-calendar displayType=\"card\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly displayType = input<XCalendarType>('calendar');\r\n  /**\r\n   * @zh_CN 指定初始显示的日期\r\n   * @en_US Specify the initially displayed date\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar [value]=\"new Date(2020, 1, 22)\"></x-calendar>\r\n   * ```\r\n   *\r\n   */\r\n  readonly value = input<Date>();\r\n  /**\r\n   * @zh_CN 头部显示模版\r\n   * @en_US Head display template\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar [headerLeftTemp]=\"headerLeftTemp\"></x-calendar>\r\n   * <ng-template #headerLeftTemp> custom title </ng-template>\r\n   * ```\r\n   *\r\n   */\r\n  readonly headerLeftTemp = input<TemplateRef<any>>();\r\n  /**\r\n   * @zh_CN 选择日期变化的事件\r\n   * @en_US Select the event of the date change\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar (dateChange)=\"onDateChange($event)\"></x-calendar>\r\n   * ```\r\n   *\r\n   * ```typescript\r\n   * ...\r\n   * onDateChange(date: Date) {\r\n   *   console.log(date)\r\n   * }\r\n   * ...\r\n   * ```\r\n   *\r\n   */\r\n  readonly dateChange = output<Date>();\r\n  /**\r\n   * @zh_CN 日期范围变化的事件\r\n   * @en_US Date range change event\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-calendar (rangeChange)=\"onRangeChange($event)\"></x-calendar>\r\n   * ```\r\n   *\r\n   * ```typescript\r\n   * ...\r\n   * onRangeChange(dates: Date[]) {\r\n   *   console.log(dates)\r\n   * }\r\n   * ...\r\n   * ```\r\n   *\r\n   */\r\n  readonly rangeChange = output<Date[]>();\r\n}\r\n\r\n/**\r\n * @zh_CN Calendar 数据对象\r\n * @en_US Calendar data object\r\n */\r\nexport interface XCalendarData {\r\n  /**\r\n   * @zh_CN key 为日期(例如 \"2020-2-22\")，value 支持两种格式：\r\n   * 1. 数组格式：[{ id:\"1\", label:\"1\" }]\r\n   * 2. 对象格式：{ class: \"\", style: {}, list: [{ id:\"1\", label:\"1\" }] }\r\n   * @en_US key is a date (e.g. \"2020-2-22\"), value supports two formats:\r\n   * 1. array format: [{ id:\"1\", label:\"1\" }]\r\n   * 2. object format: { class: \"\", style: {}, list: [{ id:\"1\", label:\"1\" }] }\r\n   */\r\n  [property: string]: XCalendarDataItem;\r\n}\r\n\r\n/**\r\n * @zh_CN Calendar 日历对象\r\n * @en_US Calendar date object\r\n */\r\nexport type XCalendarDataItem = XCalendarNodeItem[] | XCalendarNode;\r\n\r\n/**\r\n * @zh_CN Calendar 日期对象（对象格式）\r\n * @en_US Calendar date object (object format)\r\n */\r\nexport interface XCalendarNode {\r\n  /**\r\n   * @zh_CN 作用于该日期单元格的自定义 class\r\n   * @en_US Custom class applied to the date cell\r\n   */\r\n  class?: string;\r\n  /**\r\n   * @zh_CN 作用于该日期单元格的自定义样式\r\n   * @en_US Custom style applied to the date cell\r\n   */\r\n  style?: { [klass: string]: any };\r\n  /**\r\n   * @zh_CN 节点中的列表数据\r\n   * @en_US List data in the node\r\n   */\r\n  list?: XCalendarNodeItem[];\r\n}\r\n\r\n/**\r\n * @zh_CN Calendar 节点数据\r\n * @en_US Calendar node data\r\n */\r\nexport interface XCalendarNodeItem extends XIdentityProperty {\r\n  /**\r\n   * @zh_CN 自定义 class，作用于该节点\r\n   * @en_US Custom class applied to the node\r\n   */\r\n  class?: string;\r\n  /**\r\n   * @zh_CN 自定义样式，作用于该节点\r\n   * @en_US Custom style applied to the node\r\n   */\r\n  style?: { [klass: string]: any };\r\n}\r\n\r\n/**\r\n * @zh_CN 显示模式\r\n * @en_US Display mode\r\n */\r\nexport type XCalendarModel = 'month' | 'year';\r\n\r\n/**\r\n * @zh_CN 显示类型\r\n * @en_US Display type\r\n */\r\nexport type XCalendarType = 'calendar' | 'card';\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy, inject, computed, signal, effect, linkedSignal } from '@angular/core';\r\nimport { XCalendarPrefix, XCalendarProperty } from './calendar.property';\r\nimport { XIsEmpty } from '@ng-nest/ui/core';\r\nimport { DatePipe, LowerCasePipe, NgClass, NgTemplateOutlet } from '@angular/common';\r\nimport { XI18nService, zh_CN } from '@ng-nest/ui/i18n';\r\nimport { XLinkComponent } from '@ng-nest/ui/link';\r\nimport { XDatePickerComponent, XPickerDateComponent, XPickerMonthComponent } from '@ng-nest/ui/date-picker';\r\nimport { XButtonComponent, XButtonsComponent } from '@ng-nest/ui/button';\r\nimport { XRadioComponent } from '@ng-nest/ui/radio';\r\nimport { XTooltipDirective } from '@ng-nest/ui/tooltip';\r\nimport { map } from 'rxjs/operators';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { toSignal } from '@angular/core/rxjs-interop';\r\nimport type { XCalendarNode, XCalendarNodeItem } from './calendar.property';\r\nimport type { XI18nCalendar } from '@ng-nest/ui/i18n';\r\n\r\n@Component({\r\n  selector: `${XCalendarPrefix}`,\r\n  imports: [\r\n    NgClass,\r\n    NgTemplateOutlet,\r\n    DatePipe,\r\n    FormsModule,\r\n    XLinkComponent,\r\n    XTooltipDirective,\r\n    XRadioComponent,\r\n    XDatePickerComponent,\r\n    XPickerDateComponent,\r\n    XPickerMonthComponent,\r\n    XButtonComponent,\r\n    XButtonsComponent\r\n  ],\r\n  templateUrl: './calendar.component.html',\r\n  styleUrls: ['./calendar.component.scss'],\r\n  encapsulation: ViewEncapsulation.None,\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [DatePipe, LowerCasePipe]\r\n})\r\nexport class XCalendarComponent extends XCalendarProperty {\r\n  private datePipe = inject(DatePipe);\r\n  private lowerCasePipe = inject(LowerCasePipe);\r\n  private i18n = inject(XI18nService);\r\n  datetime = linkedSignal<Date>(() => this.value() ?? new Date());\r\n  activatedDate = linkedSignal<Date>(() => this.value() ?? new Date());\r\n  radioDataBase = [\r\n    { label: '', id: 'month' },\r\n    { label: '', id: 'year' }\r\n  ];\r\n  modelSignal = signal(this.model());\r\n\r\n  locale = toSignal(this.i18n.localeChange.pipe(map((x) => x.calendar as XI18nCalendar)), {\r\n    initialValue: zh_CN.calendar\r\n  });\r\n  radioData = computed(() => {\r\n    return this.radioDataBase.map((x) => {\r\n      x.label = (this.locale() as any)[x.id];\r\n      return x;\r\n    });\r\n  });\r\n  classMap = computed(() => ({\r\n    [`${XCalendarPrefix}-${this.displayType()}`]: !XIsEmpty(this.displayType())\r\n  }));\r\n  monthData = computed(() => {\r\n    let dt: { [property: string]: XCalendarNodeItem[] } = {};\r\n    for (let key in this.data()) {\r\n      let month = this.datePipe.transform(key, 'yyyy-MM') as string;\r\n      let items = this.toItems(this.data()[key]);\r\n      let value = '';\r\n      items.forEach((x) => {\r\n        value += `${x.id}${x.label} <br/>`;\r\n      });\r\n      let item = { id: key, label: value } as XCalendarNodeItem;\r\n      if (dt[month]) {\r\n        dt[month] = [...dt[month], item];\r\n      } else {\r\n        dt[month] = [item];\r\n      }\r\n    }\r\n\r\n    return dt;\r\n  });\r\n\r\n  constructor() {\r\n    super();\r\n    effect(() => {\r\n      this.modelSignal.set(this.model());\r\n    });\r\n  }\r\n\r\n  action(next: number) {\r\n    let datetime = new Date(this.datetime().getTime());\r\n    if (this.modelSignal() === 'month') {\r\n      datetime.setMonth(datetime.getMonth() + next);\r\n    } else if (this.modelSignal() === 'year') {\r\n      datetime.setFullYear(datetime.getFullYear() + next);\r\n    }\r\n    this.datetime.set(datetime);\r\n  }\r\n\r\n  getLocaleMonth(date: Date) {\r\n    return (this.locale() as any)[this.lowerCasePipe.transform(this.datePipe.transform(date, 'LLLL') as string)];\r\n  }\r\n\r\n  dateOnChange(date: Date) {\r\n    if (this.datePipe.transform(date, 'yyyy-MM-dd') !== this.datePipe.transform(this.activatedDate(), 'yyyy-MM-dd')) {\r\n      this.activatedDate.set(date);\r\n      this.dateChange.emit(this.activatedDate());\r\n    }\r\n  }\r\n\r\n  rangeOnChange(range: Date[]) {\r\n    this.rangeChange.emit(range);\r\n  }\r\n\r\n  getDate(date: Date): XCalendarNodeItem[] {\r\n    return this.toItems(this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd') as string]);\r\n  }\r\n\r\n  getMonth(date: Date): XCalendarNodeItem[] {\r\n    return this.monthData()?.[this.datePipe.transform(date, 'yyyy-MM') as string] ?? [];\r\n  }\r\n\r\n  getCellClass(date: Date): string {\r\n    const value = this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd') as string];\r\n    const node = !Array.isArray(value) ? value : undefined;\r\n    const items = this.toItems(value);\r\n    const classes = [...(node?.class ? [node.class] : []), ...items.map((x) => x.class).filter((x) => !!x)];\r\n    return classes.join(' ');\r\n  }\r\n\r\n  getCellStyle(date: Date): { [klass: string]: any } {\r\n    const value = this.data()?.[this.datePipe.transform(date, 'yyyy-MM-dd') as string];\r\n    const node = !Array.isArray(value) ? value : undefined;\r\n    const style: { [klass: string]: any } = { ...(node?.style || {}) };\r\n    this.toItems(value).forEach((x) => {\r\n      if (x.style) Object.assign(style, x.style);\r\n    });\r\n    return style;\r\n  }\r\n\r\n  getMonthClass(date: Date): string {\r\n    return this.getNodesClass(this.getMonth(date));\r\n  }\r\n\r\n  getMonthStyle(date: Date): { [klass: string]: any } {\r\n    return this.getNodesStyle(this.getMonth(date));\r\n  }\r\n\r\n  private toItems(value?: XCalendarNodeItem[] | XCalendarNode): XCalendarNodeItem[] {\r\n    if (!value) return [];\r\n    if (Array.isArray(value)) return value;\r\n    return value.list ?? [];\r\n  }\r\n\r\n  private getNodesClass(nodes?: XCalendarNodeItem[]): string {\r\n    if (!nodes || nodes.length === 0) return '';\r\n    return nodes\r\n      .map((x) => x.class)\r\n      .filter((x) => !!x)\r\n      .join(' ');\r\n  }\r\n\r\n  private getNodesStyle(nodes?: XCalendarNodeItem[]): { [klass: string]: any } {\r\n    const style: { [klass: string]: any } = {};\r\n    nodes?.forEach((x) => {\r\n      if (x.style) Object.assign(style, x.style);\r\n    });\r\n    return style;\r\n  }\r\n}\r\n","<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-date\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\"\r\n    [class]=\"getCellClass(date)\"\r\n    [style]=\"getCellStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div\r\n    class=\"x-calendar-month\"\r\n    [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\"\r\n    [class]=\"getMonthClass(date)\"\r\n    [style]=\"getMonthStyle(date)\"\r\n  >\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { XCalendarComponent } from './calendar.component';\r\n\r\n@NgModule({\r\n  exports: [XCalendarComponent],\r\n  imports: [XCalendarComponent]\r\n})\r\nexport class XCalendarModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-nest-ui-date-picker.mjs

@@ -1305,7 +1305,7 @@ class XPickerMonthComponent extends XPickerMonthProperty {
         }
         this.dates.set(dates);
         this.chunkDates.set(XChunk(dates, 4));
-        if (this.dates.length > 0) {
+        if (dates.length > 0) {
             this.rangeChange.emit([dates[0].date, dates[dates.length - 1].date]);
         }
     }
@@ -1543,7 +1543,7 @@ class XPickerQuarterComponent extends XPickerQuarterProperty {
         }
         this.dates.set(dates);
         this.chunkDates.set(XChunk(dates, 4));
-        if (this.dates.length > 0) {
+        if (dates.length > 0) {
             this.rangeChange.emit([dates[0].date, dates[dates.length - 1].date]);
         }
     }