ngx-tethys 18.2.0-next.0 → 18.2.0-next.2

package/fesm2022/ngx-tethys-date-picker.mjs

@@ -4,6 +4,7 @@ import * as i0 from '@angular/core';
 import { Injectable, inject, EventEmitter, Directive, Input, Output, Component, ChangeDetectionStrategy, InjectionToken, Pipe, ChangeDetectorRef, forwardRef, HostBinding, NgModule, ViewChild, ElementRef, PLATFORM_ID, NgZone, numberAttribute } from '@angular/core';
 import localeZhHans from '@angular/common/locales/zh-Hans';
 import { TinyDate, coerceBooleanProperty, helpers, coerceArray, isTemplateRef, isEmpty, isString, valueFunctionProp, isUndefinedOrNull, isFunction, sortRangeValue, elementMatchClosest, warnDeprecation } from 'ngx-tethys/util';
+import { useLocale, injectLocale, ThyI18nService } from 'ngx-tethys/i18n';
 import { ThyIcon, ThyIconModule } from 'ngx-tethys/icon';
 import * as i1 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
@@ -29,6 +30,7 @@ function DATE_HELPER_SERVICE_FACTORY() {
  */
 class DateHelperService {
     constructor() {
+        this.locale = useLocale();
         this.relyOnDatePipe = this instanceof DateHelperByDatePipe;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -46,7 +48,7 @@ class DateHelperByDatePipe extends DateHelperService {
         return +this.format(date, 'w');
     }
     format(date, formatStr) {
-        return date ? formatDate(date, formatStr, 'zh-Hans') : '';
+        return date ? formatDate(date, formatStr, this.locale().id) : '';
     }
     transCompatFormat(format) {
         return format && format.replace(/Y/g, 'y').replace(/D/g, 'd');
@@ -59,6 +61,7 @@ class DateHelperByDatePipe extends DateHelperService {
 class CalendarHeader {
     constructor() {
         this.dateHelper = inject(DateHelperService);
+        this.locale = injectLocale('datePicker');
         this.showSuperPreBtn = true;
         this.showSuperNextBtn = true;
         this.showPreBtn = true;
@@ -144,7 +147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
  */
 class MonthHeader extends CalendarHeader {
     getSelectors() {
-        let yearFormat = 'yyyy年';
+        let yearFormat = this.locale().yearFormat;
         return [
             {
                 className: `${this.prefixCls}-month-btn`,
@@ -154,11 +157,11 @@ class MonthHeader extends CalendarHeader {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MonthHeader, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: MonthHeader, isStandalone: true, selector: "month-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: MonthHeader, isStandalone: true, selector: "month-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MonthHeader, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'month-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'month-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
         }] });
 
 /**
@@ -175,6 +178,7 @@ class CalendarFooter {
         this.showTimePickerChange = new EventEmitter();
         this.isShowTime = false;
         this.isCanTime = false;
+        this.locale = injectLocale('datePicker');
     }
     ngOnInit() {
         this._initTimeShowMode();
@@ -225,11 +229,11 @@ class CalendarFooter {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CalendarFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: CalendarFooter, isStandalone: true, selector: "calendar-footer", inputs: { showTime: "showTime", mustShowTime: "mustShowTime", value: "value", disableTimeConfirm: ["disableTimeConfirm", "disableTimeConfirm", coerceBooleanProperty] }, outputs: { selectTime: "selectTime", clickOk: "clickOk", clickRemove: "clickRemove", showTimePickerChange: "showTimePickerChange" }, exportAs: ["calendarFooter"], usesOnChanges: true, ngImport: i0, template: "@if (isShowTime || isCanTime) {\n  <div class=\"time-picker-section\" (click)=\"$event.stopPropagation()\">\n    @if (isCanTime) {\n      <a href=\"javascript:;\" class=\"link-has-icon time-picker-set-btn\" (click)=\"changeTimeShowMode('show')\">\n        <thy-icon thyIconName=\"clock-circle\"></thy-icon>\u8BBE\u7F6E\u65F6\u95F4\n      </a>\n    }\n    @if (isShowTime) {\n      <thy-inner-time-picker\n        class=\"time-picker-wrap\"\n        [showMeridian]=\"false\"\n        [ngModel]=\"value?.nativeDate\"\n      (ngModelChange)=\"onSelectTime($event)\"></thy-inner-time-picker>\n    }\n    <div class=\"time-picker-btn-wrap\">\n      @if (!isCanTime) {\n        <button\n          [disabled]=\"disableTimeConfirm\"\n          class=\"time-picker-ok-btn\"\n          thyButton=\"primary\"\n          thySize=\"sm\"\n          (click)=\"onTimeOk()\">\n          \u786E\u5B9A\n        </button>\n      }\n      <button class=\"time-picker-clear-btn\" thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"onClear()\">\u6E05\u9664</button>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "component", type: ThyInnerTimePicker, selector: "thy-inner-time-picker", inputs: ["hourStep", "minuteStep", "secondsStep", "readonlyInput", "disabled", "mousewheel", "arrowKeys", "showSpinners", "showMeridian", "showMinutes", "showSeconds", "meridians", "min", "max", "hoursPlaceholder", "minutesPlaceholder", "secondsPlaceholder"], outputs: ["isValid"] }, { 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: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: CalendarFooter, isStandalone: true, selector: "calendar-footer", inputs: { showTime: "showTime", mustShowTime: "mustShowTime", value: "value", disableTimeConfirm: ["disableTimeConfirm", "disableTimeConfirm", coerceBooleanProperty] }, outputs: { selectTime: "selectTime", clickOk: "clickOk", clickRemove: "clickRemove", showTimePickerChange: "showTimePickerChange" }, exportAs: ["calendarFooter"], usesOnChanges: true, ngImport: i0, template: "@if (isShowTime || isCanTime) {\n  <div class=\"time-picker-section\" (click)=\"$event.stopPropagation()\">\n    @if (isCanTime) {\n      <a href=\"javascript:;\" class=\"link-has-icon time-picker-set-btn\" (click)=\"changeTimeShowMode('show')\">\n        <thy-icon thyIconName=\"clock-circle\"></thy-icon>{{ locale().setTime }}\n      </a>\n    }\n    @if (isShowTime) {\n      <thy-inner-time-picker\n        class=\"time-picker-wrap\"\n        [showMeridian]=\"false\"\n        [ngModel]=\"value?.nativeDate\"\n        (ngModelChange)=\"onSelectTime($event)\"></thy-inner-time-picker>\n    }\n    <div class=\"time-picker-btn-wrap\">\n      @if (!isCanTime) {\n        <button [disabled]=\"disableTimeConfirm\" class=\"time-picker-ok-btn\" thyButton=\"primary\" thySize=\"sm\" (click)=\"onTimeOk()\">\n          {{ locale().ok }}\n        </button>\n      }\n      <button class=\"time-picker-clear-btn\" thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"onClear()\">{{ locale().clear }}</button>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "component", type: ThyInnerTimePicker, selector: "thy-inner-time-picker", inputs: ["hourStep", "minuteStep", "secondsStep", "readonlyInput", "disabled", "mousewheel", "arrowKeys", "showSpinners", "showMeridian", "showMinutes", "showSeconds", "meridians", "min", "max", "hoursPlaceholder", "minutesPlaceholder", "secondsPlaceholder"], outputs: ["isValid"] }, { 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: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: CalendarFooter, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'calendar-footer', exportAs: 'calendarFooter', standalone: true, imports: [ThyIcon, ThyInnerTimePicker, FormsModule, ThyButton], template: "@if (isShowTime || isCanTime) {\n  <div class=\"time-picker-section\" (click)=\"$event.stopPropagation()\">\n    @if (isCanTime) {\n      <a href=\"javascript:;\" class=\"link-has-icon time-picker-set-btn\" (click)=\"changeTimeShowMode('show')\">\n        <thy-icon thyIconName=\"clock-circle\"></thy-icon>\u8BBE\u7F6E\u65F6\u95F4\n      </a>\n    }\n    @if (isShowTime) {\n      <thy-inner-time-picker\n        class=\"time-picker-wrap\"\n        [showMeridian]=\"false\"\n        [ngModel]=\"value?.nativeDate\"\n      (ngModelChange)=\"onSelectTime($event)\"></thy-inner-time-picker>\n    }\n    <div class=\"time-picker-btn-wrap\">\n      @if (!isCanTime) {\n        <button\n          [disabled]=\"disableTimeConfirm\"\n          class=\"time-picker-ok-btn\"\n          thyButton=\"primary\"\n          thySize=\"sm\"\n          (click)=\"onTimeOk()\">\n          \u786E\u5B9A\n        </button>\n      }\n      <button class=\"time-picker-clear-btn\" thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"onClear()\">\u6E05\u9664</button>\n    </div>\n  </div>\n}\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'calendar-footer', exportAs: 'calendarFooter', standalone: true, imports: [ThyIcon, ThyInnerTimePicker, FormsModule, ThyButton], template: "@if (isShowTime || isCanTime) {\n  <div class=\"time-picker-section\" (click)=\"$event.stopPropagation()\">\n    @if (isCanTime) {\n      <a href=\"javascript:;\" class=\"link-has-icon time-picker-set-btn\" (click)=\"changeTimeShowMode('show')\">\n        <thy-icon thyIconName=\"clock-circle\"></thy-icon>{{ locale().setTime }}\n      </a>\n    }\n    @if (isShowTime) {\n      <thy-inner-time-picker\n        class=\"time-picker-wrap\"\n        [showMeridian]=\"false\"\n        [ngModel]=\"value?.nativeDate\"\n        (ngModelChange)=\"onSelectTime($event)\"></thy-inner-time-picker>\n    }\n    <div class=\"time-picker-btn-wrap\">\n      @if (!isCanTime) {\n        <button [disabled]=\"disableTimeConfirm\" class=\"time-picker-ok-btn\" thyButton=\"primary\" thySize=\"sm\" (click)=\"onTimeOk()\">\n          {{ locale().ok }}\n        </button>\n      }\n      <button class=\"time-picker-clear-btn\" thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"onClear()\">{{ locale().clear }}</button>\n    </div>\n  </div>\n}\n" }]
         }], propDecorators: { showTime: [{
                 type: Input
             }], mustShowTime: [{
@@ -249,6 +253,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 type: Output
             }] } });
 
+/**
+ * @deprecated
+ */
 const DEFAULT_DATE_PICKER_CONFIG = {
     shortcutPosition: 'left',
     showShortcut: false,
@@ -292,15 +299,64 @@ const DEFAULT_DATE_PICKER_CONFIG = {
     }
 };
 const THY_DATE_PICKER_CONFIG = new InjectionToken('thy-date-picker-config');
+function useDatePickerDefaultConfig() {
+    const locale = injectLocale('datePicker');
+    return {
+        shortcutPosition: 'left',
+        showShortcut: false,
+        weekStartsOn: 1,
+        timestampPrecision: 'seconds',
+        shortcutDatePresets: () => {
+            return [
+                {
+                    title: locale().today,
+                    value: startOfDay(new Date()).getTime()
+                },
+                {
+                    title: locale().tomorrow,
+                    value: startOfDay(addDays(new Date(), 1)).getTime()
+                },
+                {
+                    title: locale().nextWeek,
+                    value: startOfWeek(addWeeks(new Date(), 1), { weekStartsOn: 1 }).getTime()
+                }
+            ];
+        },
+        shortcutRangesPresets: () => {
+            return [
+                {
+                    title: locale().lastSevenDays,
+                    value: [new TinyDate(subDays(new Date(), 6)).getTime(), new TinyDate().endOfDay().getTime()]
+                },
+                {
+                    title: locale().lastThirtyDays,
+                    value: [new TinyDate(subDays(new Date(), 29)).getTime(), new TinyDate().endOfDay().getTime()]
+                },
+                {
+                    title: locale().currentWeek,
+                    value: [
+                        new TinyDate().startOfWeek({ weekStartsOn: 1 }).getTime(),
+                        new TinyDate().endOfWeek({ weekStartsOn: 1 }).getTime()
+                    ]
+                },
+                {
+                    title: locale().currentMonth,
+                    value: [new TinyDate().startOfMonth().getTime(), new TinyDate().endOfMonth().getTime()]
+                }
+            ];
+        }
+    };
+}
 const THY_DATE_PICKER_CONFIG_PROVIDER = {
     provide: THY_DATE_PICKER_CONFIG,
-    useValue: DEFAULT_DATE_PICKER_CONFIG
+    useFactory: useDatePickerDefaultConfig,
+    deps: [ThyI18nService]
 };
 
 class ThyDatePickerConfigService {
     constructor() {
         const datePickerConfig = inject(THY_DATE_PICKER_CONFIG, { optional: true });
-        this.config = { ...DEFAULT_DATE_PICKER_CONFIG, ...datePickerConfig };
+        this.config = { ...useDatePickerDefaultConfig(), ...datePickerConfig };
     }
     get shortcutDatePresets() {
         return this.config.shortcutDatePresets;
@@ -654,6 +710,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
 class DateCarousel {
     constructor() {
         this.cdr = inject(ChangeDetectorRef);
+        this.dateHelper = inject(DateHelperService);
+        this.locale = injectLocale('datePicker');
         this.className = 'thy-date-picker-advanced-carousel';
         this.selectableData = {};
         this.selectedValue = [];
@@ -857,9 +915,10 @@ class DateCarousel {
     }
     getSelectableMonth(currentDate, preOrNextcount = 0) {
         currentDate = currentDate || this.activeDate || new TinyDate().startOfMonth();
+        // Selectable months for advanced range selector
         const cell = {
             type: 'month',
-            content: `${currentDate.addMonths(preOrNextcount).getMonth() + 1}月`,
+            content: this.dateHelper.format(currentDate.addMonths(preOrNextcount).nativeDate, this.locale().monthFormat),
             startValue: currentDate.startOfMonth().addMonths(preOrNextcount),
             endValue: currentDate.endOfMonth().addMonths(preOrNextcount),
             classMap: {}
@@ -1004,7 +1063,7 @@ class DateCarousel {
                 multi: true,
                 useExisting: forwardRef(() => DateCarousel)
             }
-        ], ngImport: i0, template: "<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u5E74\u4EFD', type: 'year', selectableData: selectableData.year }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u5B63\u5EA6', type: 'quarter', selectableData: selectableData.quarter }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u6708\u4EFD', type: 'month', selectableData: selectableData.month }\"></ng-container>\n\n<ng-template #carouselItem let-title=\"title\" let-selectableData=\"selectableData\" let-type=\"type\">\n  <div class=\"carousel-item carousel-item-{{ type }}\">\n    <p class=\"carousel-item-title\">{{ title }}</p>\n    <div class=\"carousel-item-content\">\n      <button thyButton=\"outline-default\" thySize=\"sm\" class=\"right-space\" (click)=\"prevClick(type)\">\n        <thy-icon thyIconName=\"angle-left\"></thy-icon>\n      </button>\n      @for (item of selectableData; track $index) {\n        <div\n          class=\"selectable-button right-space\"\n          (click)=\"selectDate(type, item)\"\n          (mouseenter)=\"onMouseenter($event, type, item)\"\n          (mouseleave)=\"onMouseleave($event, type, item)\"\n          [ngClass]=\"item.classMap\">\n          @if (item | showYearTip: type) {\n            <span class=\"year-tip\">{{ item?.startValue?.getYear() }}</span>\n          }\n          @if (item.isInRange && isSelected(item)) {\n            <thy-icon thyIconName=\"close\"></thy-icon>\n          }\n          @if (item.isInRange && !isSelected(item)) {\n            <thy-icon thyIconName=\"plus\"></thy-icon>\n          }\n          @if (!item.isInRange) {\n            <span>{{ item?.content }}</span>\n          }\n        </div>\n      }\n      <button thyButton=\"outline-default\" thySize=\"sm\" (click)=\"nextClick(type)\">\n        <thy-icon thyIconName=\"angle-right\"></thy-icon>\n      </button>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePickerAdvancedShowYearTipPipe, name: "showYearTip" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: locale().yearText, type: 'year', selectableData: selectableData.year }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"\n    carouselItem;\n    context: { title: locale().quarterText, type: 'quarter', selectableData: selectableData.quarter }\n  \"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"\n    carouselItem;\n    context: { title: locale().monthText, type: 'month', selectableData: selectableData.month }\n  \"></ng-container>\n\n<ng-template #carouselItem let-title=\"title\" let-selectableData=\"selectableData\" let-type=\"type\">\n  <div class=\"carousel-item carousel-item-{{ type }}\">\n    <p class=\"carousel-item-title\">{{ title }}</p>\n    <div class=\"carousel-item-content\">\n      <button thyButton=\"outline-default\" thySize=\"sm\" class=\"right-space\" (click)=\"prevClick(type)\">\n        <thy-icon thyIconName=\"angle-left\"></thy-icon>\n      </button>\n      @for (item of selectableData; track $index) {\n        <div\n          class=\"selectable-button right-space\"\n          (click)=\"selectDate(type, item)\"\n          (mouseenter)=\"onMouseenter($event, type, item)\"\n          (mouseleave)=\"onMouseleave($event, type, item)\"\n          [ngClass]=\"item.classMap\">\n          @if (item | showYearTip: type) {\n            <span class=\"year-tip\">{{ item?.startValue?.getYear() }}</span>\n          }\n          @if (item.isInRange && isSelected(item)) {\n            <thy-icon thyIconName=\"close\"></thy-icon>\n          }\n          @if (item.isInRange && !isSelected(item)) {\n            <thy-icon thyIconName=\"plus\"></thy-icon>\n          }\n          @if (!item.isInRange) {\n            <span>{{ item?.content }}</span>\n          }\n        </div>\n      }\n      <button thyButton=\"outline-default\" thySize=\"sm\" (click)=\"nextClick(type)\">\n        <thy-icon thyIconName=\"angle-right\"></thy-icon>\n      </button>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePickerAdvancedShowYearTipPipe, name: "showYearTip" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateCarousel, decorators: [{
             type: Component,
@@ -1014,7 +1073,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                             multi: true,
                             useExisting: forwardRef(() => DateCarousel)
                         }
-                    ], standalone: true, imports: [NgTemplateOutlet, ThyButton, ThyIcon, NgClass, DatePickerAdvancedShowYearTipPipe], template: "<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u5E74\u4EFD', type: 'year', selectableData: selectableData.year }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u5B63\u5EA6', type: 'quarter', selectableData: selectableData.quarter }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: '\u6708\u4EFD', type: 'month', selectableData: selectableData.month }\"></ng-container>\n\n<ng-template #carouselItem let-title=\"title\" let-selectableData=\"selectableData\" let-type=\"type\">\n  <div class=\"carousel-item carousel-item-{{ type }}\">\n    <p class=\"carousel-item-title\">{{ title }}</p>\n    <div class=\"carousel-item-content\">\n      <button thyButton=\"outline-default\" thySize=\"sm\" class=\"right-space\" (click)=\"prevClick(type)\">\n        <thy-icon thyIconName=\"angle-left\"></thy-icon>\n      </button>\n      @for (item of selectableData; track $index) {\n        <div\n          class=\"selectable-button right-space\"\n          (click)=\"selectDate(type, item)\"\n          (mouseenter)=\"onMouseenter($event, type, item)\"\n          (mouseleave)=\"onMouseleave($event, type, item)\"\n          [ngClass]=\"item.classMap\">\n          @if (item | showYearTip: type) {\n            <span class=\"year-tip\">{{ item?.startValue?.getYear() }}</span>\n          }\n          @if (item.isInRange && isSelected(item)) {\n            <thy-icon thyIconName=\"close\"></thy-icon>\n          }\n          @if (item.isInRange && !isSelected(item)) {\n            <thy-icon thyIconName=\"plus\"></thy-icon>\n          }\n          @if (!item.isInRange) {\n            <span>{{ item?.content }}</span>\n          }\n        </div>\n      }\n      <button thyButton=\"outline-default\" thySize=\"sm\" (click)=\"nextClick(type)\">\n        <thy-icon thyIconName=\"angle-right\"></thy-icon>\n      </button>\n    </div>\n  </div>\n</ng-template>\n" }]
+                    ], standalone: true, imports: [NgTemplateOutlet, ThyButton, ThyIcon, NgClass, DatePickerAdvancedShowYearTipPipe], template: "<ng-container\n  *ngTemplateOutlet=\"carouselItem; context: { title: locale().yearText, type: 'year', selectableData: selectableData.year }\"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"\n    carouselItem;\n    context: { title: locale().quarterText, type: 'quarter', selectableData: selectableData.quarter }\n  \"></ng-container>\n\n<ng-container\n  *ngTemplateOutlet=\"\n    carouselItem;\n    context: { title: locale().monthText, type: 'month', selectableData: selectableData.month }\n  \"></ng-container>\n\n<ng-template #carouselItem let-title=\"title\" let-selectableData=\"selectableData\" let-type=\"type\">\n  <div class=\"carousel-item carousel-item-{{ type }}\">\n    <p class=\"carousel-item-title\">{{ title }}</p>\n    <div class=\"carousel-item-content\">\n      <button thyButton=\"outline-default\" thySize=\"sm\" class=\"right-space\" (click)=\"prevClick(type)\">\n        <thy-icon thyIconName=\"angle-left\"></thy-icon>\n      </button>\n      @for (item of selectableData; track $index) {\n        <div\n          class=\"selectable-button right-space\"\n          (click)=\"selectDate(type, item)\"\n          (mouseenter)=\"onMouseenter($event, type, item)\"\n          (mouseleave)=\"onMouseleave($event, type, item)\"\n          [ngClass]=\"item.classMap\">\n          @if (item | showYearTip: type) {\n            <span class=\"year-tip\">{{ item?.startValue?.getYear() }}</span>\n          }\n          @if (item.isInRange && isSelected(item)) {\n            <thy-icon thyIconName=\"close\"></thy-icon>\n          }\n          @if (item.isInRange && !isSelected(item)) {\n            <thy-icon thyIconName=\"plus\"></thy-icon>\n          }\n          @if (!item.isInRange) {\n            <span>{{ item?.content }}</span>\n          }\n        </div>\n      }\n      <button thyButton=\"outline-default\" thySize=\"sm\" (click)=\"nextClick(type)\">\n        <thy-icon thyIconName=\"angle-right\"></thy-icon>\n      </button>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], propDecorators: { className: [{
                 type: HostBinding,
                 args: ['class']
@@ -1027,7 +1086,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
  */
 class DateHeader extends CalendarHeader {
     getSelectors() {
-        let yearFormat = 'yyyy年';
+        const yearFormat = this.locale().yearFormat;
+        const monthFormat = this.locale().monthFormat;
         return [
             {
                 className: `${this.prefixCls}-year-btn`,
@@ -1039,16 +1099,16 @@ class DateHeader extends CalendarHeader {
                 className: `${this.prefixCls}-month-btn`,
                 title: '',
                 onClick: () => this.changePanel('month'),
-                label: this.formatDateTime('MMM')
+                label: this.formatDateTime(monthFormat)
             }
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateHeader, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DateHeader, isStandalone: true, selector: "date-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DateHeader, isStandalone: true, selector: "date-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateHeader, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
         }] });
 
 /**
@@ -1056,6 +1116,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
  */
 class CalendarTable {
     constructor() {
+        this.locale = injectLocale('datePicker');
         this.isTemplateRef = isTemplateRef;
         this.headRow = [];
         this.bodyRows = [];
@@ -1204,7 +1265,7 @@ class DateTable extends CalendarTable {
     }
     getVeryShortWeekFormat() {
         if (this.dateHelper.relyOnDatePipe) {
-            return 'EEEEE'; // eg. 二
+            return this.prefixCls === 'thy-calendar-full' ? this.locale().fullWeekFormat : this.locale().weekFormat;
         }
         return 'dd';
     }
@@ -1302,11 +1363,11 @@ class DateTable extends CalendarTable {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateTable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DateTable, isStandalone: true, selector: "date-table", outputs: { dayHover: "dayHover" }, exportAs: ["dateTable"], usesInheritance: true, ngImport: i0, template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n  <thead>\n    <tr role=\"row\">\n      @if (showWeek) {\n        <th role=\"columnheader\" title=\"\u5468\" class=\"{{ prefixCls }}-column-header {{ prefixCls }}-week-number-header\">\n          <span class=\"{{ prefixCls }}-column-header-inner\">\u5468</span>\n        </th>\n      }\n      @for (cell of headRow; track $index) {\n        <th role=\"columnheader\" title=\"{{ cell.title }}\" class=\"{{ prefixCls }}-column-header\">\n          @if (prefixCls === 'thy-calendar') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n          @if (prefixCls === 'thy-calendar-full') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">\u5468{{ cell.content }}</span>\n          }\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody class=\"{{ prefixCls }}-tbody\">\n    @for (row of bodyRows; track $index) {\n      <tr [ngClass]=\"row.classMap\" role=\"row\">\n        @if (row.weekNum) {\n          <td role=\"gridcell\" class=\"{{ prefixCls }}-week-number-cell\">\n            {{ row.weekNum }}\n          </td>\n        }\n        @for (cell of row.dateCells; track $index) {\n          <td\n            role=\"gridcell\"\n            [ngClass]=\"cell.classMap\"\n            (click)=\"cell.isDisabled ? null : cell.onClick()\"\n            date-table-cell\n            [prefixCls]=\"prefixCls\"\n            [cell]=\"cell\"></td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DateTableCell, selector: "[date-table-cell]", inputs: ["prefixCls", "cell"], exportAs: ["dateTableCell"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DateTable, isStandalone: true, selector: "date-table", outputs: { dayHover: "dayHover" }, exportAs: ["dateTable"], usesInheritance: true, ngImport: i0, template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n  <thead>\n    <tr role=\"row\">\n      @if (showWeek) {\n        <th role=\"columnheader\" [title]=\"locale().week\" class=\"{{ prefixCls }}-column-header {{ prefixCls }}-week-number-header\">\n          <span class=\"{{ prefixCls }}-column-header-inner\">{{ locale().prefixWeek }}</span>\n        </th>\n      }\n      @for (cell of headRow; track $index) {\n        <th role=\"columnheader\" title=\"{{ cell.title }}\" class=\"{{ prefixCls }}-column-header\">\n          @if (prefixCls === 'thy-calendar') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n          @if (prefixCls === 'thy-calendar-full') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody class=\"{{ prefixCls }}-tbody\">\n    @for (row of bodyRows; track $index) {\n      <tr [ngClass]=\"row.classMap\" role=\"row\">\n        @if (row.weekNum) {\n          <td role=\"gridcell\" class=\"{{ prefixCls }}-week-number-cell\">\n            {{ row.weekNum }}\n          </td>\n        }\n        @for (cell of row.dateCells; track $index) {\n          <td\n            role=\"gridcell\"\n            [ngClass]=\"cell.classMap\"\n            (click)=\"cell.isDisabled ? null : cell.onClick()\"\n            date-table-cell\n            [prefixCls]=\"prefixCls\"\n            [cell]=\"cell\"></td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DateTableCell, selector: "[date-table-cell]", inputs: ["prefixCls", "cell"], exportAs: ["dateTableCell"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateTable, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-table', exportAs: 'dateTable', standalone: true, imports: [NgClass, DateTableCell], template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n  <thead>\n    <tr role=\"row\">\n      @if (showWeek) {\n        <th role=\"columnheader\" title=\"\u5468\" class=\"{{ prefixCls }}-column-header {{ prefixCls }}-week-number-header\">\n          <span class=\"{{ prefixCls }}-column-header-inner\">\u5468</span>\n        </th>\n      }\n      @for (cell of headRow; track $index) {\n        <th role=\"columnheader\" title=\"{{ cell.title }}\" class=\"{{ prefixCls }}-column-header\">\n          @if (prefixCls === 'thy-calendar') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n          @if (prefixCls === 'thy-calendar-full') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">\u5468{{ cell.content }}</span>\n          }\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody class=\"{{ prefixCls }}-tbody\">\n    @for (row of bodyRows; track $index) {\n      <tr [ngClass]=\"row.classMap\" role=\"row\">\n        @if (row.weekNum) {\n          <td role=\"gridcell\" class=\"{{ prefixCls }}-week-number-cell\">\n            {{ row.weekNum }}\n          </td>\n        }\n        @for (cell of row.dateCells; track $index) {\n          <td\n            role=\"gridcell\"\n            [ngClass]=\"cell.classMap\"\n            (click)=\"cell.isDisabled ? null : cell.onClick()\"\n            date-table-cell\n            [prefixCls]=\"prefixCls\"\n            [cell]=\"cell\"></td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-table', exportAs: 'dateTable', standalone: true, imports: [NgClass, DateTableCell], template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n  <thead>\n    <tr role=\"row\">\n      @if (showWeek) {\n        <th role=\"columnheader\" [title]=\"locale().week\" class=\"{{ prefixCls }}-column-header {{ prefixCls }}-week-number-header\">\n          <span class=\"{{ prefixCls }}-column-header-inner\">{{ locale().prefixWeek }}</span>\n        </th>\n      }\n      @for (cell of headRow; track $index) {\n        <th role=\"columnheader\" title=\"{{ cell.title }}\" class=\"{{ prefixCls }}-column-header\">\n          @if (prefixCls === 'thy-calendar') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n          @if (prefixCls === 'thy-calendar-full') {\n            <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.content }}</span>\n          }\n        </th>\n      }\n    </tr>\n  </thead>\n  <tbody class=\"{{ prefixCls }}-tbody\">\n    @for (row of bodyRows; track $index) {\n      <tr [ngClass]=\"row.classMap\" role=\"row\">\n        @if (row.weekNum) {\n          <td role=\"gridcell\" class=\"{{ prefixCls }}-week-number-cell\">\n            {{ row.weekNum }}\n          </td>\n        }\n        @for (cell of row.dateCells; track $index) {\n          <td\n            role=\"gridcell\"\n            [ngClass]=\"cell.classMap\"\n            (click)=\"cell.isDisabled ? null : cell.onClick()\"\n            date-table-cell\n            [prefixCls]=\"prefixCls\"\n            [cell]=\"cell\"></td>\n        }\n      </tr>\n    }\n  </tbody>\n</table>\n" }]
         }], ctorParameters: () => [], propDecorators: { dayHover: [{
                 type: Output
             }] } });
@@ -1341,11 +1402,11 @@ class DecadeHeader extends CalendarHeader {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DecadeHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DecadeHeader, isStandalone: true, selector: "decade-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DecadeHeader, isStandalone: true, selector: "decade-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DecadeHeader, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'decade-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'decade-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [] });
 
 /**
@@ -1452,8 +1513,9 @@ class MonthTable extends CalendarTable {
             };
             for (let colIndex = 0; colIndex < this.MAX_COL; colIndex++) {
                 const month = this.activeDate.setMonth(monthValue);
+                const monthFormat = this.locale().zhMonthFormat;
                 const isDisabled = this.disabledDate ? this.disabledDate(this.activeDate.setMonth(monthValue).nativeDate) : false;
-                const content = this.dateHelper.format(month.nativeDate, 'MMMM');
+                const content = this.dateHelper.format(month.nativeDate, monthFormat);
                 const cell = {
                     trackByIndex: colIndex,
                     value: month.nativeDate,
@@ -1541,11 +1603,11 @@ class YearHeader extends CalendarHeader {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: YearHeader, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: YearHeader, isStandalone: true, selector: "year-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: YearHeader, isStandalone: true, selector: "year-header", usesInheritance: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: YearHeader, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'year-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      title=\"\u4E0A\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a class=\"{{ prefixCls }}-prev-month-btn\" [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"previous()\" title=\"\u4E0A\u6708\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a class=\"{{ prefixCls }}-next-month-btn\" [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\" role=\"button\" (click)=\"next()\" title=\"\u4E0B\u4E2A\u6708\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      title=\"\u4E0B\u4E00\u5E74\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'year-header', standalone: true, imports: [NgClass, ThyIcon], template: "<div class=\"{{ prefixCls }}-header\">\n  <div style=\"position: relative\">\n    <a\n      class=\"{{ prefixCls }}-prev-year-btn\"\n      [ngClass]=\"showSuperPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superPrevious()\"\n      [title]=\"locale().previousYear\">\n      <thy-icon thyIconName=\"angle-double-left\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-prev-month-btn\"\n      [ngClass]=\"showPreBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"previous()\"\n      [title]=\"locale().previousMonth\">\n      <thy-icon thyIconName=\"angle-left\"></thy-icon>\n    </a>\n\n    <span class=\"{{ prefixCls }}-my-select\">\n      @for (selector of selectors; track $index) {\n        <a class=\"{{ selector.className }}\" role=\"button\" (click)=\"selectorClick($event, selector)\" title=\"{{ selector.title || null }}\">\n          {{ selector.label }}\n        </a>\n      }\n    </span>\n\n    <a\n      class=\"{{ prefixCls }}-next-month-btn\"\n      [ngClass]=\"showNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"next()\"\n      [title]=\"locale().nextMonth\">\n      <thy-icon thyIconName=\"angle-right\"></thy-icon>\n    </a>\n    <a\n      class=\"{{ prefixCls }}-next-year-btn\"\n      [ngClass]=\"showSuperNextBtn ? 'd-block' : 'd-none'\"\n      role=\"button\"\n      (click)=\"superNext()\"\n      [title]=\"locale().nextYear\">\n      <thy-icon thyIconName=\"angle-double-right\"></thy-icon>\n    </a>\n  </div>\n</div>\n" }]
         }] });
 
 /**
@@ -1742,6 +1804,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
 class InnerPopup {
     constructor() {
         this.dateHelper = inject(DateHelperService);
+        this.locale = injectLocale('datePicker');
         this.className = true;
         this._showDateRangeInput = false;
         this.panelModeChange = new EventEmitter();
@@ -1852,7 +1915,7 @@ class InnerPopup {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: InnerPopup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: InnerPopup, isStandalone: true, selector: "inner-popup", inputs: { showWeek: "showWeek", isRange: "isRange", activeDate: "activeDate", rangeActiveDate: "rangeActiveDate", enablePrev: "enablePrev", enableNext: "enableNext", disabledDate: "disabledDate", dateRender: "dateRender", selectedValue: "selectedValue", hoverValue: "hoverValue", panelMode: "panelMode", showDateRangeInput: ["showDateRangeInput", "showDateRangeInput", coerceBooleanProperty], partType: "partType", endPanelMode: "endPanelMode", value: "value" }, outputs: { panelModeChange: "panelModeChange", headerChange: "headerChange", selectDate: "selectDate", dayHover: "dayHover" }, host: { properties: { "class.thy-calendar-picker-inner-popup": "this.className", "class.thy-calendar-picker-inner-popup-with-range-input": "this._showDateRangeInput" } }, exportAs: ["innerPopup"], usesOnChanges: true, ngImport: i0, template: "@if (showDateRangeInput) {\n  <div class=\"{{ prefixCls }}-picker-inner-popup-range-input\">\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[0])\" placeholder=\"\u5F00\u59CB\u65E5\u671F\" />\n    <span class=\"split\"></span>\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[1])\" placeholder=\"\u7ED3\u675F\u65E5\u671F\" />\n  </div>\n}\n@switch (panelMode) {\n  @case ('decade') {\n    <div class=\"{{ prefixCls }}-decade\">\n      <decade-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'decade')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'decade')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </decade-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <decade-table [value]=\"value\" [activeDate]=\"activeDate\" (valueChange)=\"onChooseDecade($event)\"></decade-table>\n      </div>\n    </div>\n  }\n  @case ('year') {\n    <div class=\"{{ prefixCls }}-year\">\n      <year-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'year')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'year')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </year-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <year-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseYear($event)\"\n          [selectedValue]=\"selectedValue\">\n        </year-table>\n      </div>\n    </div>\n  }\n  @case ('month') {\n    <div class=\"{{ prefixCls }}-month\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <month-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseMonth($event)\"\n          [selectedValue]=\"selectedValue\">\n        </month-table>\n      </div>\n    </div>\n  }\n  @case ('quarter') {\n    <div class=\"{{ prefixCls }}-quarter\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <quarter-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseQuarter($event)\"\n          [selectedValue]=\"selectedValue\">\n        </quarter-table>\n      </div>\n    </div>\n  }\n  @default {\n    <date-header\n      [(value)]=\"activeDate\"\n      [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'date')\"\n      [showSuperNextBtn]=\"enableSuperPrevNext('next', 'date')\"\n      [showPreBtn]=\"enablePrevNext('prev', 'date')\"\n      [showNextBtn]=\"enablePrevNext('next', 'date')\"\n      (panelModeChange)=\"panelModeChange.emit($event)\"\n    (valueChange)=\"headerChange.emit($event)\"></date-header>\n    <div class=\"{{ prefixCls }}-body\">\n      <date-table\n        [showWeek]=\"showWeek\"\n        [value]=\"value\"\n        [activeDate]=\"activeDate\"\n        (valueChange)=\"onSelectDate($event)\"\n        showWeekNumber=\"false\"\n        [disabledDate]=\"disabledDate\"\n        [cellRender]=\"dateRender\"\n        [selectedValue]=\"selectedValue\"\n        [hoverValue]=\"hoverValue\"\n      (dayHover)=\"dayHover.emit($event)\"></date-table>\n    </div>\n  }\n}\n", dependencies: [{ kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "component", type: DecadeHeader, selector: "decade-header" }, { kind: "component", type: DecadeTable, selector: "decade-table", exportAs: ["decadeTable"] }, { kind: "component", type: YearHeader, selector: "year-header" }, { kind: "component", type: YearTable, selector: "year-table", outputs: ["decadePanelShow"] }, { kind: "component", type: MonthHeader, selector: "month-header" }, { kind: "component", type: MonthTable, selector: "month-table", exportAs: ["monthTable"] }, { kind: "component", type: QuarterTable, selector: "quarter-table", exportAs: ["quarterTable"] }, { kind: "component", type: DateHeader, selector: "date-header" }, { kind: "component", type: DateTable, selector: "date-table", outputs: ["dayHover"], exportAs: ["dateTable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: InnerPopup, isStandalone: true, selector: "inner-popup", inputs: { showWeek: "showWeek", isRange: "isRange", activeDate: "activeDate", rangeActiveDate: "rangeActiveDate", enablePrev: "enablePrev", enableNext: "enableNext", disabledDate: "disabledDate", dateRender: "dateRender", selectedValue: "selectedValue", hoverValue: "hoverValue", panelMode: "panelMode", showDateRangeInput: ["showDateRangeInput", "showDateRangeInput", coerceBooleanProperty], partType: "partType", endPanelMode: "endPanelMode", value: "value" }, outputs: { panelModeChange: "panelModeChange", headerChange: "headerChange", selectDate: "selectDate", dayHover: "dayHover" }, host: { properties: { "class.thy-calendar-picker-inner-popup": "this.className", "class.thy-calendar-picker-inner-popup-with-range-input": "this._showDateRangeInput" } }, exportAs: ["innerPopup"], usesOnChanges: true, ngImport: i0, template: "@if (showDateRangeInput) {\n  <div class=\"{{ prefixCls }}-picker-inner-popup-range-input\">\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[0])\" [placeholder]=\"locale().startDate\" />\n    <span class=\"split\"></span>\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[1])\" [placeholder]=\"locale().endDate\" />\n  </div>\n}\n@switch (panelMode) {\n  @case ('decade') {\n    <div class=\"{{ prefixCls }}-decade\">\n      <decade-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'decade')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'decade')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </decade-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <decade-table [value]=\"value\" [activeDate]=\"activeDate\" (valueChange)=\"onChooseDecade($event)\"></decade-table>\n      </div>\n    </div>\n  }\n  @case ('year') {\n    <div class=\"{{ prefixCls }}-year\">\n      <year-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'year')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'year')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </year-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <year-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseYear($event)\"\n          [selectedValue]=\"selectedValue\">\n        </year-table>\n      </div>\n    </div>\n  }\n  @case ('month') {\n    <div class=\"{{ prefixCls }}-month\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <month-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseMonth($event)\"\n          [selectedValue]=\"selectedValue\">\n        </month-table>\n      </div>\n    </div>\n  }\n  @case ('quarter') {\n    <div class=\"{{ prefixCls }}-quarter\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <quarter-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseQuarter($event)\"\n          [selectedValue]=\"selectedValue\">\n        </quarter-table>\n      </div>\n    </div>\n  }\n  @default {\n    <date-header\n      [(value)]=\"activeDate\"\n      [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'date')\"\n      [showSuperNextBtn]=\"enableSuperPrevNext('next', 'date')\"\n      [showPreBtn]=\"enablePrevNext('prev', 'date')\"\n      [showNextBtn]=\"enablePrevNext('next', 'date')\"\n      (panelModeChange)=\"panelModeChange.emit($event)\"\n      (valueChange)=\"headerChange.emit($event)\"></date-header>\n    <div class=\"{{ prefixCls }}-body\">\n      <date-table\n        [showWeek]=\"showWeek\"\n        [value]=\"value\"\n        [activeDate]=\"activeDate\"\n        (valueChange)=\"onSelectDate($event)\"\n        showWeekNumber=\"false\"\n        [disabledDate]=\"disabledDate\"\n        [cellRender]=\"dateRender\"\n        [selectedValue]=\"selectedValue\"\n        [hoverValue]=\"hoverValue\"\n        (dayHover)=\"dayHover.emit($event)\"></date-table>\n    </div>\n  }\n}\n", dependencies: [{ kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "component", type: DecadeHeader, selector: "decade-header" }, { kind: "component", type: DecadeTable, selector: "decade-table", exportAs: ["decadeTable"] }, { kind: "component", type: YearHeader, selector: "year-header" }, { kind: "component", type: YearTable, selector: "year-table", outputs: ["decadePanelShow"] }, { kind: "component", type: MonthHeader, selector: "month-header" }, { kind: "component", type: MonthTable, selector: "month-table", exportAs: ["monthTable"] }, { kind: "component", type: QuarterTable, selector: "quarter-table", exportAs: ["quarterTable"] }, { kind: "component", type: DateHeader, selector: "date-header" }, { kind: "component", type: DateTable, selector: "date-table", outputs: ["dayHover"], exportAs: ["dateTable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: InnerPopup, decorators: [{
             type: Component,
@@ -1867,7 +1930,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                         QuarterTable,
                         DateHeader,
                         DateTable
-                    ], template: "@if (showDateRangeInput) {\n  <div class=\"{{ prefixCls }}-picker-inner-popup-range-input\">\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[0])\" placeholder=\"\u5F00\u59CB\u65E5\u671F\" />\n    <span class=\"split\"></span>\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[1])\" placeholder=\"\u7ED3\u675F\u65E5\u671F\" />\n  </div>\n}\n@switch (panelMode) {\n  @case ('decade') {\n    <div class=\"{{ prefixCls }}-decade\">\n      <decade-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'decade')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'decade')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </decade-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <decade-table [value]=\"value\" [activeDate]=\"activeDate\" (valueChange)=\"onChooseDecade($event)\"></decade-table>\n      </div>\n    </div>\n  }\n  @case ('year') {\n    <div class=\"{{ prefixCls }}-year\">\n      <year-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'year')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'year')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </year-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <year-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseYear($event)\"\n          [selectedValue]=\"selectedValue\">\n        </year-table>\n      </div>\n    </div>\n  }\n  @case ('month') {\n    <div class=\"{{ prefixCls }}-month\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <month-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseMonth($event)\"\n          [selectedValue]=\"selectedValue\">\n        </month-table>\n      </div>\n    </div>\n  }\n  @case ('quarter') {\n    <div class=\"{{ prefixCls }}-quarter\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <quarter-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseQuarter($event)\"\n          [selectedValue]=\"selectedValue\">\n        </quarter-table>\n      </div>\n    </div>\n  }\n  @default {\n    <date-header\n      [(value)]=\"activeDate\"\n      [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'date')\"\n      [showSuperNextBtn]=\"enableSuperPrevNext('next', 'date')\"\n      [showPreBtn]=\"enablePrevNext('prev', 'date')\"\n      [showNextBtn]=\"enablePrevNext('next', 'date')\"\n      (panelModeChange)=\"panelModeChange.emit($event)\"\n    (valueChange)=\"headerChange.emit($event)\"></date-header>\n    <div class=\"{{ prefixCls }}-body\">\n      <date-table\n        [showWeek]=\"showWeek\"\n        [value]=\"value\"\n        [activeDate]=\"activeDate\"\n        (valueChange)=\"onSelectDate($event)\"\n        showWeekNumber=\"false\"\n        [disabledDate]=\"disabledDate\"\n        [cellRender]=\"dateRender\"\n        [selectedValue]=\"selectedValue\"\n        [hoverValue]=\"hoverValue\"\n      (dayHover)=\"dayHover.emit($event)\"></date-table>\n    </div>\n  }\n}\n" }]
+                    ], template: "@if (showDateRangeInput) {\n  <div class=\"{{ prefixCls }}-picker-inner-popup-range-input\">\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[0])\" [placeholder]=\"locale().startDate\" />\n    <span class=\"split\"></span>\n    <input thyInput thySize=\"sm\" [value]=\"getReadableValue(selectedValue[1])\" [placeholder]=\"locale().endDate\" />\n  </div>\n}\n@switch (panelMode) {\n  @case ('decade') {\n    <div class=\"{{ prefixCls }}-decade\">\n      <decade-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'decade')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'decade')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </decade-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <decade-table [value]=\"value\" [activeDate]=\"activeDate\" (valueChange)=\"onChooseDecade($event)\"></decade-table>\n      </div>\n    </div>\n  }\n  @case ('year') {\n    <div class=\"{{ prefixCls }}-year\">\n      <year-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'year')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'year')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </year-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <year-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseYear($event)\"\n          [selectedValue]=\"selectedValue\">\n        </year-table>\n      </div>\n    </div>\n  }\n  @case ('month') {\n    <div class=\"{{ prefixCls }}-month\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <month-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseMonth($event)\"\n          [selectedValue]=\"selectedValue\">\n        </month-table>\n      </div>\n    </div>\n  }\n  @case ('quarter') {\n    <div class=\"{{ prefixCls }}-quarter\">\n      <month-header\n        [(value)]=\"activeDate\"\n        [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'month')\"\n        [showSuperNextBtn]=\"enableSuperPrevNext('next', 'month')\"\n        [showNextBtn]=\"false\"\n        [showPreBtn]=\"false\"\n        (panelModeChange)=\"panelModeChange.emit($event)\"\n        (valueChange)=\"headerChange.emit($event)\">\n      </month-header>\n      <div class=\"{{ prefixCls }}-body\">\n        <quarter-table\n          [value]=\"value\"\n          [activeDate]=\"activeDate\"\n          [disabledDate]=\"disabledDate\"\n          (valueChange)=\"onChooseQuarter($event)\"\n          [selectedValue]=\"selectedValue\">\n        </quarter-table>\n      </div>\n    </div>\n  }\n  @default {\n    <date-header\n      [(value)]=\"activeDate\"\n      [showSuperPreBtn]=\"enableSuperPrevNext('prev', 'date')\"\n      [showSuperNextBtn]=\"enableSuperPrevNext('next', 'date')\"\n      [showPreBtn]=\"enablePrevNext('prev', 'date')\"\n      [showNextBtn]=\"enablePrevNext('next', 'date')\"\n      (panelModeChange)=\"panelModeChange.emit($event)\"\n      (valueChange)=\"headerChange.emit($event)\"></date-header>\n    <div class=\"{{ prefixCls }}-body\">\n      <date-table\n        [showWeek]=\"showWeek\"\n        [value]=\"value\"\n        [activeDate]=\"activeDate\"\n        (valueChange)=\"onSelectDate($event)\"\n        showWeekNumber=\"false\"\n        [disabledDate]=\"disabledDate\"\n        [cellRender]=\"dateRender\"\n        [selectedValue]=\"selectedValue\"\n        [hoverValue]=\"hoverValue\"\n        (dayHover)=\"dayHover.emit($event)\"></date-table>\n    </div>\n  }\n}\n" }]
         }], propDecorators: { className: [{
                 type: HostBinding,
                 args: ['class.thy-calendar-picker-inner-popup']
@@ -1922,6 +1985,7 @@ class DatePopup {
     constructor() {
         this.cdr = inject(ChangeDetectorRef);
         this.datePickerConfigService = inject(ThyDatePickerConfigService);
+        this.locale = injectLocale('datePicker');
         this.panelModeChange = new EventEmitter();
         this.calendarChange = new EventEmitter();
         this.valueChange = new EventEmitter();
@@ -2388,11 +2452,11 @@ class DatePopup {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DatePopup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DatePopup, isStandalone: true, selector: "date-popup", inputs: { isRange: "isRange", showWeek: "showWeek", format: "format", disabledDate: "disabledDate", minDate: "minDate", maxDate: "maxDate", showToday: "showToday", showTime: "showTime", mustShowTime: "mustShowTime", dateRender: "dateRender", className: "className", panelMode: "panelMode", value: "value", defaultPickerValue: "defaultPickerValue", showShortcut: "showShortcut", shortcutPresets: "shortcutPresets", shortcutPosition: "shortcutPosition", flexible: "flexible", flexibleDateGranularity: "flexibleDateGranularity", timestampPrecision: "timestampPrecision" }, outputs: { panelModeChange: "panelModeChange", calendarChange: "calendarChange", valueChange: "valueChange", resultOk: "resultOk", showTimePickerChange: "showTimePickerChange", dateValueChange: "dateValueChange" }, exportAs: ["datePopup"], usesOnChanges: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-picker-container {{ className }}\">\n  <div\n    class=\"{{ prefixCls }} {{ showWeek ? prefixCls + '-week-number' : '' }}\n     {{ isRange ? prefixCls + '-range' : '' }} {{ prefixCls }}-picker-shortcut-{{ shortcutPosition === 'left' ? 'left' : 'bottom' }}\">\n    @if (showShortcut) {\n      <div class=\"{{ prefixCls }}-picker-shortcut\">\n        @for (item of innerShortcutPresets; track $index) {\n          <div class=\"{{ prefixCls }}-picker-shortcut-item\" [class.disabled]=\"item.disabled\" (click)=\"shortcutSetValue(item)\">\n            {{ item.title }}\n          </div>\n        }\n      </div>\n    }\n    <div class=\"{{ prefixCls }}-panel\">\n      <div class=\"{{ prefixCls }}-date-panel\">\n        @if (flexible) {\n          <div class=\"{{ prefixCls }}-date-panel-flexible\">\n            <div class=\"{{ prefixCls }}-date-panel-flexible-tab\">\n              <thy-nav thyType=\"pulled\" thySize=\"sm\">\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'advanced'\" (click)=\"selectTab('advanced')\"\n                  >\u9AD8\u7EA7\u9009\u9879</a\n                >\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'custom'\" (click)=\"selectTab('custom')\"\n                  >\u81EA\u5B9A\u4E49</a\n                >\n              </thy-nav>\n              <button thyButtonIcon=\"sweep\" thySize=\"sm\" class=\"clear-date-button\" (click)=\"clearFlexibleValue()\"></button>\n            </div>\n            <ng-container>\n              <div class=\"{{ prefixCls }}-date-panel-advanced\" [hidden]=\"flexibleActiveTab !== 'advanced'\">\n                <date-carousel\n                  name=\"dateCarousel\"\n                  (ngModelChange)=\"changeValueFromAdvancedSelect($event)\"\n                  [(ngModel)]=\"advancedSelectedValue\"\n                  [activeDate]=\"selectedValue[0]\"></date-carousel>\n              </div>\n            </ng-container>\n            <div [hidden]=\"flexibleActiveTab !== 'custom'\">\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          </div>\n        } @else {\n          @if (isRange) {\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'left' }\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'right' }\"></ng-container>\n          } @else {\n            <div>\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          }\n          @if (!isRange) {\n            <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #tplInnerPopup let-partType=\"partType\">\n  <inner-popup\n    [showWeek]=\"showWeek\"\n    [isRange]=\"isRange\"\n    [panelMode]=\"getPanelMode(panelMode, partType)\"\n    [endPanelMode]=\"getPanelMode(endPanelMode, partType)\"\n    [partType]=\"partType\"\n    [showDateRangeInput]=\"flexible && flexibleActiveTab === 'custom'\"\n    (panelModeChange)=\"onPanelModeChange($event, partType)\"\n    [value]=\"getValueBySelector(partType)\"\n    [selectedValue]=\"selectedValue\"\n    [activeDate]=\"getActiveDate(partType)\"\n    [rangeActiveDate]=\"activeDate\"\n    [disabledDate]=\"disabledDate\"\n    [dateRender]=\"dateRender\"\n    [hoverValue]=\"hoverValue\"\n    [enablePrev]=\"enablePrevNext('prev', partType)\"\n    [enableNext]=\"enablePrevNext('next', partType)\"\n    (dayHover)=\"onDayHover($event)\"\n    (selectDate)=\"changeValueFromSelect($event, partType)\"\n    (headerChange)=\"onHeaderChange($event, partType)\"></inner-popup>\n</ng-template>\n\n<ng-template #tplFooter>\n  <calendar-footer\n    [showTime]=\"showTime\"\n    [mustShowTime]=\"mustShowTime\"\n    [value]=\"value\"\n    [disableTimeConfirm]=\"disableTimeConfirm\"\n    (showTimePickerChange)=\"onShowTimePickerChange($event)\"\n    (selectTime)=\"onSelectTime($event)\"\n    (clickOk)=\"onClickOk()\"\n    (clickRemove)=\"onClickRemove()\"></calendar-footer>\n</ng-template>\n\n<!-- Single ONLY -->\n\n<!-- Range ONLY -->\n<ng-template #tplRangePart let-partType=\"partType\">\n  <div class=\"{{ prefixCls }}-range-part {{ prefixCls }}-range-{{ partType }}\">\n    <div style=\"outline: none\">\n      <ng-container *ngTemplateOutlet=\"tplInnerPopup; context: { partType: partType }\"></ng-container>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: ThyNav, selector: "thy-nav", inputs: ["thyType", "thySize", "thyHorizontal", "thyVertical", "thyFill", "thyResponsive", "thyInsideClosable", "thyExtra"] }, { kind: "directive", type: ThyNavItemDirective, selector: "[thyNavLink],[thyNavItem]", inputs: ["thyNavItemActive", "thyNavLinkActive", "thyNavItemDisabled"] }, { kind: "component", type: ThyButtonIcon, selector: "thy-button-icon,[thy-button-icon],[thyButtonIcon]", inputs: ["thySize", "thyIcon", "thyButtonIcon", "thyShape", "thyLight", "thyActive", "thyTheme", "thyColor"] }, { kind: "component", type: DateCarousel, selector: "date-carousel", inputs: ["activeDate"] }, { 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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InnerPopup, selector: "inner-popup", inputs: ["showWeek", "isRange", "activeDate", "rangeActiveDate", "enablePrev", "enableNext", "disabledDate", "dateRender", "selectedValue", "hoverValue", "panelMode", "showDateRangeInput", "partType", "endPanelMode", "value"], outputs: ["panelModeChange", "headerChange", "selectDate", "dayHover"], exportAs: ["innerPopup"] }, { kind: "component", type: CalendarFooter, selector: "calendar-footer", inputs: ["showTime", "mustShowTime", "value", "disableTimeConfirm"], outputs: ["selectTime", "clickOk", "clickRemove", "showTimePickerChange"], exportAs: ["calendarFooter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: DatePopup, isStandalone: true, selector: "date-popup", inputs: { isRange: "isRange", showWeek: "showWeek", format: "format", disabledDate: "disabledDate", minDate: "minDate", maxDate: "maxDate", showToday: "showToday", showTime: "showTime", mustShowTime: "mustShowTime", dateRender: "dateRender", className: "className", panelMode: "panelMode", value: "value", defaultPickerValue: "defaultPickerValue", showShortcut: "showShortcut", shortcutPresets: "shortcutPresets", shortcutPosition: "shortcutPosition", flexible: "flexible", flexibleDateGranularity: "flexibleDateGranularity", timestampPrecision: "timestampPrecision" }, outputs: { panelModeChange: "panelModeChange", calendarChange: "calendarChange", valueChange: "valueChange", resultOk: "resultOk", showTimePickerChange: "showTimePickerChange", dateValueChange: "dateValueChange" }, exportAs: ["datePopup"], usesOnChanges: true, ngImport: i0, template: "<div class=\"{{ prefixCls }}-picker-container {{ className }}\">\n  <div\n    class=\"{{ prefixCls }} {{ showWeek ? prefixCls + '-week-number' : '' }}\n     {{ isRange ? prefixCls + '-range' : '' }} {{ prefixCls }}-picker-shortcut-{{ shortcutPosition === 'left' ? 'left' : 'bottom' }}\">\n    @if (showShortcut) {\n      <div class=\"{{ prefixCls }}-picker-shortcut\">\n        @for (item of innerShortcutPresets; track $index) {\n          <div class=\"{{ prefixCls }}-picker-shortcut-item\" [class.disabled]=\"item.disabled\" (click)=\"shortcutSetValue(item)\">\n            {{ item.title }}\n          </div>\n        }\n      </div>\n    }\n    <div class=\"{{ prefixCls }}-panel\">\n      <div class=\"{{ prefixCls }}-date-panel\">\n        @if (flexible) {\n          <div class=\"{{ prefixCls }}-date-panel-flexible\">\n            <div class=\"{{ prefixCls }}-date-panel-flexible-tab\">\n              <thy-nav thyType=\"pulled\" thySize=\"sm\">\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'advanced'\" (click)=\"selectTab('advanced')\">{{\n                  locale().advance\n                }}</a>\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'custom'\" (click)=\"selectTab('custom')\">{{\n                  locale().custom\n                }}</a>\n              </thy-nav>\n              <button thyButtonIcon=\"sweep\" thySize=\"sm\" class=\"clear-date-button\" (click)=\"clearFlexibleValue()\"></button>\n            </div>\n            <ng-container>\n              <div class=\"{{ prefixCls }}-date-panel-advanced\" [hidden]=\"flexibleActiveTab !== 'advanced'\">\n                <date-carousel\n                  name=\"dateCarousel\"\n                  (ngModelChange)=\"changeValueFromAdvancedSelect($event)\"\n                  [(ngModel)]=\"advancedSelectedValue\"\n                  [activeDate]=\"selectedValue[0]\"></date-carousel>\n              </div>\n            </ng-container>\n            <div [hidden]=\"flexibleActiveTab !== 'custom'\">\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          </div>\n        } @else {\n          @if (isRange) {\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'left' }\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'right' }\"></ng-container>\n          } @else {\n            <div>\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          }\n          @if (!isRange) {\n            <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #tplInnerPopup let-partType=\"partType\">\n  <inner-popup\n    [showWeek]=\"showWeek\"\n    [isRange]=\"isRange\"\n    [panelMode]=\"getPanelMode(panelMode, partType)\"\n    [endPanelMode]=\"getPanelMode(endPanelMode, partType)\"\n    [partType]=\"partType\"\n    [showDateRangeInput]=\"flexible && flexibleActiveTab === 'custom'\"\n    (panelModeChange)=\"onPanelModeChange($event, partType)\"\n    [value]=\"getValueBySelector(partType)\"\n    [selectedValue]=\"selectedValue\"\n    [activeDate]=\"getActiveDate(partType)\"\n    [rangeActiveDate]=\"activeDate\"\n    [disabledDate]=\"disabledDate\"\n    [dateRender]=\"dateRender\"\n    [hoverValue]=\"hoverValue\"\n    [enablePrev]=\"enablePrevNext('prev', partType)\"\n    [enableNext]=\"enablePrevNext('next', partType)\"\n    (dayHover)=\"onDayHover($event)\"\n    (selectDate)=\"changeValueFromSelect($event, partType)\"\n    (headerChange)=\"onHeaderChange($event, partType)\"></inner-popup>\n</ng-template>\n\n<ng-template #tplFooter>\n  <calendar-footer\n    [showTime]=\"showTime\"\n    [mustShowTime]=\"mustShowTime\"\n    [value]=\"value\"\n    [disableTimeConfirm]=\"disableTimeConfirm\"\n    (showTimePickerChange)=\"onShowTimePickerChange($event)\"\n    (selectTime)=\"onSelectTime($event)\"\n    (clickOk)=\"onClickOk()\"\n    (clickRemove)=\"onClickRemove()\"></calendar-footer>\n</ng-template>\n\n<!-- Single ONLY -->\n\n<!-- Range ONLY -->\n<ng-template #tplRangePart let-partType=\"partType\">\n  <div class=\"{{ prefixCls }}-range-part {{ prefixCls }}-range-{{ partType }}\">\n    <div style=\"outline: none\">\n      <ng-container *ngTemplateOutlet=\"tplInnerPopup; context: { partType: partType }\"></ng-container>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: ThyNav, selector: "thy-nav", inputs: ["thyType", "thySize", "thyHorizontal", "thyVertical", "thyFill", "thyResponsive", "thyInsideClosable", "thyExtra"] }, { kind: "directive", type: ThyNavItemDirective, selector: "[thyNavLink],[thyNavItem]", inputs: ["thyNavItemActive", "thyNavLinkActive", "thyNavItemDisabled"] }, { kind: "component", type: ThyButtonIcon, selector: "thy-button-icon,[thy-button-icon],[thyButtonIcon]", inputs: ["thySize", "thyIcon", "thyButtonIcon", "thyShape", "thyLight", "thyActive", "thyTheme", "thyColor"] }, { kind: "component", type: DateCarousel, selector: "date-carousel", inputs: ["activeDate"] }, { 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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InnerPopup, selector: "inner-popup", inputs: ["showWeek", "isRange", "activeDate", "rangeActiveDate", "enablePrev", "enableNext", "disabledDate", "dateRender", "selectedValue", "hoverValue", "panelMode", "showDateRangeInput", "partType", "endPanelMode", "value"], outputs: ["panelModeChange", "headerChange", "selectDate", "dayHover"], exportAs: ["innerPopup"] }, { kind: "component", type: CalendarFooter, selector: "calendar-footer", inputs: ["showTime", "mustShowTime", "value", "disableTimeConfirm"], outputs: ["selectTime", "clickOk", "clickRemove", "showTimePickerChange"], exportAs: ["calendarFooter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DatePopup, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-popup', exportAs: 'datePopup', standalone: true, imports: [ThyNav, ThyNavItemDirective, ThyButtonIcon, DateCarousel, FormsModule, NgTemplateOutlet, InnerPopup, CalendarFooter], template: "<div class=\"{{ prefixCls }}-picker-container {{ className }}\">\n  <div\n    class=\"{{ prefixCls }} {{ showWeek ? prefixCls + '-week-number' : '' }}\n     {{ isRange ? prefixCls + '-range' : '' }} {{ prefixCls }}-picker-shortcut-{{ shortcutPosition === 'left' ? 'left' : 'bottom' }}\">\n    @if (showShortcut) {\n      <div class=\"{{ prefixCls }}-picker-shortcut\">\n        @for (item of innerShortcutPresets; track $index) {\n          <div class=\"{{ prefixCls }}-picker-shortcut-item\" [class.disabled]=\"item.disabled\" (click)=\"shortcutSetValue(item)\">\n            {{ item.title }}\n          </div>\n        }\n      </div>\n    }\n    <div class=\"{{ prefixCls }}-panel\">\n      <div class=\"{{ prefixCls }}-date-panel\">\n        @if (flexible) {\n          <div class=\"{{ prefixCls }}-date-panel-flexible\">\n            <div class=\"{{ prefixCls }}-date-panel-flexible-tab\">\n              <thy-nav thyType=\"pulled\" thySize=\"sm\">\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'advanced'\" (click)=\"selectTab('advanced')\"\n                  >\u9AD8\u7EA7\u9009\u9879</a\n                >\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'custom'\" (click)=\"selectTab('custom')\"\n                  >\u81EA\u5B9A\u4E49</a\n                >\n              </thy-nav>\n              <button thyButtonIcon=\"sweep\" thySize=\"sm\" class=\"clear-date-button\" (click)=\"clearFlexibleValue()\"></button>\n            </div>\n            <ng-container>\n              <div class=\"{{ prefixCls }}-date-panel-advanced\" [hidden]=\"flexibleActiveTab !== 'advanced'\">\n                <date-carousel\n                  name=\"dateCarousel\"\n                  (ngModelChange)=\"changeValueFromAdvancedSelect($event)\"\n                  [(ngModel)]=\"advancedSelectedValue\"\n                  [activeDate]=\"selectedValue[0]\"></date-carousel>\n              </div>\n            </ng-container>\n            <div [hidden]=\"flexibleActiveTab !== 'custom'\">\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          </div>\n        } @else {\n          @if (isRange) {\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'left' }\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'right' }\"></ng-container>\n          } @else {\n            <div>\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          }\n          @if (!isRange) {\n            <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #tplInnerPopup let-partType=\"partType\">\n  <inner-popup\n    [showWeek]=\"showWeek\"\n    [isRange]=\"isRange\"\n    [panelMode]=\"getPanelMode(panelMode, partType)\"\n    [endPanelMode]=\"getPanelMode(endPanelMode, partType)\"\n    [partType]=\"partType\"\n    [showDateRangeInput]=\"flexible && flexibleActiveTab === 'custom'\"\n    (panelModeChange)=\"onPanelModeChange($event, partType)\"\n    [value]=\"getValueBySelector(partType)\"\n    [selectedValue]=\"selectedValue\"\n    [activeDate]=\"getActiveDate(partType)\"\n    [rangeActiveDate]=\"activeDate\"\n    [disabledDate]=\"disabledDate\"\n    [dateRender]=\"dateRender\"\n    [hoverValue]=\"hoverValue\"\n    [enablePrev]=\"enablePrevNext('prev', partType)\"\n    [enableNext]=\"enablePrevNext('next', partType)\"\n    (dayHover)=\"onDayHover($event)\"\n    (selectDate)=\"changeValueFromSelect($event, partType)\"\n    (headerChange)=\"onHeaderChange($event, partType)\"></inner-popup>\n</ng-template>\n\n<ng-template #tplFooter>\n  <calendar-footer\n    [showTime]=\"showTime\"\n    [mustShowTime]=\"mustShowTime\"\n    [value]=\"value\"\n    [disableTimeConfirm]=\"disableTimeConfirm\"\n    (showTimePickerChange)=\"onShowTimePickerChange($event)\"\n    (selectTime)=\"onSelectTime($event)\"\n    (clickOk)=\"onClickOk()\"\n    (clickRemove)=\"onClickRemove()\"></calendar-footer>\n</ng-template>\n\n<!-- Single ONLY -->\n\n<!-- Range ONLY -->\n<ng-template #tplRangePart let-partType=\"partType\">\n  <div class=\"{{ prefixCls }}-range-part {{ prefixCls }}-range-{{ partType }}\">\n    <div style=\"outline: none\">\n      <ng-container *ngTemplateOutlet=\"tplInnerPopup; context: { partType: partType }\"></ng-container>\n    </div>\n  </div>\n</ng-template>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'date-popup', exportAs: 'datePopup', standalone: true, imports: [ThyNav, ThyNavItemDirective, ThyButtonIcon, DateCarousel, FormsModule, NgTemplateOutlet, InnerPopup, CalendarFooter], template: "<div class=\"{{ prefixCls }}-picker-container {{ className }}\">\n  <div\n    class=\"{{ prefixCls }} {{ showWeek ? prefixCls + '-week-number' : '' }}\n     {{ isRange ? prefixCls + '-range' : '' }} {{ prefixCls }}-picker-shortcut-{{ shortcutPosition === 'left' ? 'left' : 'bottom' }}\">\n    @if (showShortcut) {\n      <div class=\"{{ prefixCls }}-picker-shortcut\">\n        @for (item of innerShortcutPresets; track $index) {\n          <div class=\"{{ prefixCls }}-picker-shortcut-item\" [class.disabled]=\"item.disabled\" (click)=\"shortcutSetValue(item)\">\n            {{ item.title }}\n          </div>\n        }\n      </div>\n    }\n    <div class=\"{{ prefixCls }}-panel\">\n      <div class=\"{{ prefixCls }}-date-panel\">\n        @if (flexible) {\n          <div class=\"{{ prefixCls }}-date-panel-flexible\">\n            <div class=\"{{ prefixCls }}-date-panel-flexible-tab\">\n              <thy-nav thyType=\"pulled\" thySize=\"sm\">\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'advanced'\" (click)=\"selectTab('advanced')\">{{\n                  locale().advance\n                }}</a>\n                <a href=\"javascript:;\" thyNavLink [thyNavLinkActive]=\"flexibleActiveTab === 'custom'\" (click)=\"selectTab('custom')\">{{\n                  locale().custom\n                }}</a>\n              </thy-nav>\n              <button thyButtonIcon=\"sweep\" thySize=\"sm\" class=\"clear-date-button\" (click)=\"clearFlexibleValue()\"></button>\n            </div>\n            <ng-container>\n              <div class=\"{{ prefixCls }}-date-panel-advanced\" [hidden]=\"flexibleActiveTab !== 'advanced'\">\n                <date-carousel\n                  name=\"dateCarousel\"\n                  (ngModelChange)=\"changeValueFromAdvancedSelect($event)\"\n                  [(ngModel)]=\"advancedSelectedValue\"\n                  [activeDate]=\"selectedValue[0]\"></date-carousel>\n              </div>\n            </ng-container>\n            <div [hidden]=\"flexibleActiveTab !== 'custom'\">\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          </div>\n        } @else {\n          @if (isRange) {\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'left' }\"></ng-container>\n            <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'right' }\"></ng-container>\n          } @else {\n            <div>\n              <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n            </div>\n          }\n          @if (!isRange) {\n            <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n          }\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #tplInnerPopup let-partType=\"partType\">\n  <inner-popup\n    [showWeek]=\"showWeek\"\n    [isRange]=\"isRange\"\n    [panelMode]=\"getPanelMode(panelMode, partType)\"\n    [endPanelMode]=\"getPanelMode(endPanelMode, partType)\"\n    [partType]=\"partType\"\n    [showDateRangeInput]=\"flexible && flexibleActiveTab === 'custom'\"\n    (panelModeChange)=\"onPanelModeChange($event, partType)\"\n    [value]=\"getValueBySelector(partType)\"\n    [selectedValue]=\"selectedValue\"\n    [activeDate]=\"getActiveDate(partType)\"\n    [rangeActiveDate]=\"activeDate\"\n    [disabledDate]=\"disabledDate\"\n    [dateRender]=\"dateRender\"\n    [hoverValue]=\"hoverValue\"\n    [enablePrev]=\"enablePrevNext('prev', partType)\"\n    [enableNext]=\"enablePrevNext('next', partType)\"\n    (dayHover)=\"onDayHover($event)\"\n    (selectDate)=\"changeValueFromSelect($event, partType)\"\n    (headerChange)=\"onHeaderChange($event, partType)\"></inner-popup>\n</ng-template>\n\n<ng-template #tplFooter>\n  <calendar-footer\n    [showTime]=\"showTime\"\n    [mustShowTime]=\"mustShowTime\"\n    [value]=\"value\"\n    [disableTimeConfirm]=\"disableTimeConfirm\"\n    (showTimePickerChange)=\"onShowTimePickerChange($event)\"\n    (selectTime)=\"onSelectTime($event)\"\n    (clickOk)=\"onClickOk()\"\n    (clickRemove)=\"onClickRemove()\"></calendar-footer>\n</ng-template>\n\n<!-- Single ONLY -->\n\n<!-- Range ONLY -->\n<ng-template #tplRangePart let-partType=\"partType\">\n  <div class=\"{{ prefixCls }}-range-part {{ prefixCls }}-range-{{ partType }}\">\n    <div style=\"outline: none\">\n      <ng-container *ngTemplateOutlet=\"tplInnerPopup; context: { partType: partType }\"></ng-container>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], propDecorators: { isRange: [{
                 type: Input
             }], showWeek: [{
@@ -2859,6 +2923,7 @@ class AbstractPickerComponent extends TabIndexDisabledControlValueAccessorMixin
     constructor() {
         super();
         this.cdr = inject(ChangeDetectorRef);
+        this.locale = injectLocale('datePicker');
         this._panelMode = 'date';
         this.datePickerConfigService = inject(ThyDatePickerConfigService);
         /**
@@ -3042,7 +3107,7 @@ class AbstractPickerComponent extends TabIndexDisabledControlValueAccessorMixin
     }
     setDefaultPlaceHolder() {
         if (!this.isCustomPlaceHolder) {
-            this.thyPlaceHolder = this.isRange ? ['开始日期', '结束日期'] : '请选择日期';
+            this.thyPlaceHolder = this.isRange ? [this.locale().startDate, this.locale().endDate] : this.locale().placeholder;
         }
         this.cdr.markForCheck();
     }
@@ -3238,7 +3303,7 @@ class BasePicker extends AbstractPickerComponent {
                 year: 'yyyy',
                 quarter: 'yyyy-qqq',
                 month: 'yyyy-MM',
-                week: 'yyyy-ww周',
+                week: this.locale().weekThFormat,
                 date: this.thyShowTime ? 'yyyy-MM-dd HH:mm' : 'yyyy-MM-dd'
             };
             this.thyFormat = this.flexible ? inputFormats['date'] : inputFormats[value];
@@ -4025,5 +4090,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractPickerComponent, BasePicker, CalendarFooter, CalendarHeader, DATE_HELPER_SERVICE_FACTORY, DEFAULT_DATE_PICKER_CONFIG, DateCarousel, DateHeader, DateHelperByDatePipe, DateHelperService, DatePickerAdvancedShowYearTipPipe, DatePickerRequiredValidator, DatePopup, DateTable, DateTableCell, DecadeHeader, DecadeTable, InnerPopup, LibPackerModule, MonthHeader, MonthTable, PickerDirective, QuarterTable, RangePickerRequiredValidator, THY_DATE_PICKER_CONFIG, THY_DATE_PICKER_CONFIG_PROVIDER, ThyDatePicker, ThyDatePickerConfigService, ThyDatePickerDirective, ThyDatePickerFormatPipe, ThyDatePickerFormatStringPipe, ThyDatePickerModule, ThyMonthPicker, ThyPicker, ThyQuarterPicker, ThyQuarterPickerFormatPipe, ThyRangePicker, ThyRangePickerDirective, ThyWeekPicker, ThyYearPicker, YearHeader, YearTable };
+export { AbstractPickerComponent, BasePicker, CalendarFooter, CalendarHeader, DATE_HELPER_SERVICE_FACTORY, DEFAULT_DATE_PICKER_CONFIG, DateCarousel, DateHeader, DateHelperByDatePipe, DateHelperService, DatePickerAdvancedShowYearTipPipe, DatePickerRequiredValidator, DatePopup, DateTable, DateTableCell, DecadeHeader, DecadeTable, InnerPopup, LibPackerModule, MonthHeader, MonthTable, PickerDirective, QuarterTable, RangePickerRequiredValidator, THY_DATE_PICKER_CONFIG, THY_DATE_PICKER_CONFIG_PROVIDER, ThyDatePicker, ThyDatePickerConfigService, ThyDatePickerDirective, ThyDatePickerFormatPipe, ThyDatePickerFormatStringPipe, ThyDatePickerModule, ThyMonthPicker, ThyPicker, ThyQuarterPicker, ThyQuarterPickerFormatPipe, ThyRangePicker, ThyRangePickerDirective, ThyWeekPicker, ThyYearPicker, YearHeader, YearTable, useDatePickerDefaultConfig };
 //# sourceMappingURL=ngx-tethys-date-picker.mjs.map