naive-ui 2.21.4 → 2.23.1

package/es/date-picker/src/DatePicker.d.ts

@@ -1,7 +1,8 @@
 import { PropType, ExtractPropTypes, Ref } from 'vue';
 import { FollowerPlacement } from 'vueuc';
 import type { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
-import type { OnUpdateValue, Value, IsDateDisabled, IsTimeDisabled, Shortcuts, FirstDayOfWeek } from './interface';
+import { DatePickerType } from './config';
+import type { OnUpdateValue, Value, IsDateDisabled, IsTimeDisabled, Shortcuts, FirstDayOfWeek, DefaultTime } from './interface';
 declare const datePickerProps: {
     readonly to: {
         type: PropType<string | boolean | HTMLElement>;
@@ -17,6 +18,7 @@ declare const datePickerProps: {
         readonly type: PropType<Value | null>;
         readonly default: null;
     };
+    readonly defaultTime: PropType<DefaultTime>;
     readonly disabled: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;
@@ -28,7 +30,7 @@ declare const datePickerProps: {
     readonly value: PropType<Value | null>;
     readonly size: PropType<"small" | "medium" | "large">;
     readonly type: {
-        readonly type: PropType<"date" | "datetime" | "month" | "year" | "daterange" | "datetimerange">;
+        readonly type: PropType<DatePickerType>;
         readonly default: "date";
     };
     readonly separator: StringConstructor;
@@ -108,12 +110,14 @@ declare const datePickerProps: {
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -717,12 +721,14 @@ declare const datePickerProps: {
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -1326,12 +1332,14 @@ declare const datePickerProps: {
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -1906,6 +1914,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<Value | null>;
         readonly default: null;
     };
+    readonly defaultTime: PropType<DefaultTime>;
     readonly disabled: {
         readonly type: PropType<boolean | undefined>;
         readonly default: undefined;
@@ -1917,7 +1926,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly value: PropType<Value | null>;
     readonly size: PropType<"small" | "medium" | "large">;
     readonly type: {
-        readonly type: PropType<"date" | "datetime" | "month" | "year" | "daterange" | "datetimerange">;
+        readonly type: PropType<DatePickerType>;
         readonly default: "date";
     };
     readonly separator: StringConstructor;
@@ -1997,12 +2006,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -2606,12 +2617,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -3215,12 +3228,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -3990,12 +4005,14 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingDatetimerange: string;
             calendarLeftPaddingMonth: string;
             calendarLeftPaddingYear: string;
+            calendarLeftPaddingQuarter: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
             calendarRightPaddingDatetimerange: string;
             calendarRightPaddingMonth: string;
             calendarRightPaddingYear: string;
+            calendarRightPaddingQuarter: string;
         };
         peers: {
             Input: import("../../_mixins").Theme<"Input", {
@@ -4899,6 +4916,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly clearable?: unknown;
     readonly updateValueOnClose?: unknown;
     readonly defaultValue?: unknown;
+    readonly defaultTime?: unknown;
     readonly disabled?: unknown;
     readonly placement?: unknown;
     readonly value?: unknown;
@@ -4931,7 +4949,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly themeOverrides?: unknown;
     readonly builtinThemeOverrides?: unknown;
 } & {
-    type: "date" | "datetime" | "month" | "year" | "daterange" | "datetimerange";
+    type: DatePickerType;
     placement: FollowerPlacement;
     clearable: boolean;
     defaultValue: Value | null;
@@ -4997,12 +5015,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -5606,12 +5626,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -6215,12 +6237,14 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingDatetimerange: string;
         calendarLeftPaddingMonth: string;
         calendarLeftPaddingYear: string;
+        calendarLeftPaddingQuarter: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
         calendarRightPaddingDatetimerange: string;
         calendarRightPaddingMonth: string;
         calendarRightPaddingYear: string;
+        calendarRightPaddingQuarter: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -6786,6 +6810,7 @@ declare const _default: import("vue").DefineComponent<{
     onUpdateValue?: MaybeArray<OnUpdateValue> | undefined;
     isDateDisabled?: IsDateDisabled | undefined;
     actions?: ("clear" | "confirm" | "now")[] | undefined;
+    defaultTime?: DefaultTime | undefined;
     startPlaceholder?: string | undefined;
     endPlaceholder?: string | undefined;
     timeFormat?: string | undefined;
@@ -6793,7 +6818,7 @@ declare const _default: import("vue").DefineComponent<{
     isTimeDisabled?: IsTimeDisabled | undefined;
     ranges?: Record<string, [number, number]> | undefined;
 }>, {
-    type: "date" | "datetime" | "month" | "year" | "daterange" | "datetimerange";
+    type: DatePickerType;
     show: boolean | undefined;
     disabled: boolean | undefined;
     onChange: MaybeArray<OnUpdateValue>;

package/es/date-picker/src/DatePicker.js

@@ -12,7 +12,7 @@ import { warn, call, useAdjustedTo, createKey } from '../../_utils';
 import { datePickerLight } from '../styles';
 import { strictParse } from './utils';
 import { uniCalendarValidation, dualCalendarValidation } from './validation-utils';
-import { MONTH_ITEM_HEIGHT, START_YEAR, DATE_FORMAT } from './config';
+import { MONTH_ITEM_HEIGHT, START_YEAR } from './config';
 import { datePickerInjectionKey } from './interface';
 import DatetimePanel from './panel/datetime';
 import DatetimerangePanel from './panel/datetimerange';
@@ -26,7 +26,7 @@ const datePickerProps = Object.assign(Object.assign({}, useTheme.props), { to: u
     }, clearable: Boolean, updateValueOnClose: Boolean, defaultValue: {
         type: [Number, Array],
         default: null
-    }, disabled: {
+    }, defaultTime: [Number, String, Array], disabled: {
         type: Boolean,
         default: undefined
     }, placement: {
@@ -101,6 +101,8 @@ export default defineComponent({
                         return localeRef.value.monthPlaceholder;
                     case 'year':
                         return localeRef.value.yearPlaceholder;
+                    case 'quarter':
+                        return localeRef.value.quarterPlaceholder;
                     default:
                         return '';
                 }
@@ -138,7 +140,23 @@ export default defineComponent({
             }
         });
         const mergedFormatRef = computed(() => {
-            return props.format || DATE_FORMAT[props.type];
+            const { format } = props;
+            if (format)
+                return format;
+            switch (props.type) {
+                case 'date':
+                case 'daterange':
+                    return localeRef.value.dateFormat;
+                case 'datetime':
+                case 'datetimerange':
+                    return localeRef.value.dateTimeFormat;
+                case 'year':
+                    return localeRef.value.yearTypeFormat;
+                case 'month':
+                    return localeRef.value.monthTypeFormat;
+                case 'quarter':
+                    return localeRef.value.quarterFormat;
+            }
         });
         const mergedActionsRef = computed(() => {
             const { actions, type } = props;
@@ -163,6 +181,9 @@ export default defineComponent({
                 case 'year': {
                     return ['clear', 'now'];
                 }
+                case 'quarter': {
+                    return ['clear', 'now', 'confirm'];
+                }
                 default: {
                     warn('data-picker', "The type is wrong, n-date-picker's type only supports `date`, `datetime`, `daterange` and `datetimerange`.");
                     break;
@@ -245,7 +266,7 @@ export default defineComponent({
                 disableUpdateOnClose
             });
         }
-        function scrollYearMonth(value) {
+        function scrollPickerColumns(value) {
             if (!panelInstRef.value)
                 return;
             const { monthScrollRef, yearScrollRef } = panelInstRef.value;
@@ -391,8 +412,9 @@ export default defineComponent({
             if (mergedDisabledRef.value || mergedShowRef.value)
                 return;
             doUpdateShow(true);
-            if (props.type === 'month' || props.type === 'year') {
-                void nextTick(scrollYearMonth);
+            const { type } = props;
+            if (type === 'month' || type === 'year' || type === 'quarter') {
+                void nextTick(scrollPickerColumns);
             }
         }
         function closeCalendar({ returnFocus, disableUpdateOnClose }) {
@@ -428,7 +450,7 @@ export default defineComponent({
         // use pending value to do validation
         const uniVaidation = uniCalendarValidation(props, pendingValueRef);
         const dualValidation = dualCalendarValidation(props, pendingValueRef);
-        provide(datePickerInjectionKey, Object.assign(Object.assign(Object.assign({ scrollYearMonth,
+        provide(datePickerInjectionKey, Object.assign(Object.assign(Object.assign({ scrollPickerColumns,
             mergedClsPrefixRef, mergedThemeRef: themeRef, timePickerSizeRef,
             localeRef,
             dateLocaleRef, firstDayOfWeekRef: toRef(props, 'firstDayOfWeek'), isDateDisabledRef: toRef(props, 'isDateDisabled'), rangesRef: toRef(props, 'ranges'), closeOnSelectRef: toRef(props, 'closeOnSelect'), updateValueOnCloseRef: toRef(props, 'updateValueOnClose') }, uniVaidation), dualValidation), { datePickerSlots: slots }));
@@ -564,7 +586,8 @@ export default defineComponent({
             active: this.mergedShow,
             actions: this.actions,
             shortcuts: this.shortcuts,
-            style: this.cssVars
+            style: this.cssVars,
+            defaultTime: this.defaultTime
         };
         const { mergedClsPrefix } = this;
         return (h("div", { ref: "triggerElRef", class: [
@@ -593,7 +616,7 @@ export default defineComponent({
                     h(VFollower, { show: this.mergedShow, containerClass: this.namespace, to: this.adjustedTo, teleportDisabled: this.adjustedTo === useAdjustedTo.tdkey, placement: "bottom-start" }, {
                         default: () => (h(Transition, { name: "fade-in-scale-up-transition", appear: this.isMounted }, {
                             default: () => this.mergedShow
-                                ? withDirectives(this.type === 'datetime' ? (h(DatetimePanel, Object.assign({}, commonPanelProps))) : this.type === 'daterange' ? (h(DaterangePanel, Object.assign({}, commonPanelProps))) : this.type === 'datetimerange' ? (h(DatetimerangePanel, Object.assign({}, commonPanelProps))) : this.type === 'month' ? (h(MonthPanel, Object.assign({}, commonPanelProps, { type: "month", key: "month" }))) : this.type === 'year' ? (h(MonthPanel, Object.assign({}, commonPanelProps, { type: "year", key: "year" }))) : (h(DatePanel, Object.assign({}, commonPanelProps))), [[clickoutside, this.handleClickOutside]])
+                                ? withDirectives(this.type === 'datetime' ? (h(DatetimePanel, Object.assign({}, commonPanelProps))) : this.type === 'daterange' ? (h(DaterangePanel, Object.assign({}, commonPanelProps))) : this.type === 'datetimerange' ? (h(DatetimerangePanel, Object.assign({}, commonPanelProps))) : this.type === 'month' ? (h(MonthPanel, Object.assign({}, commonPanelProps, { type: "month", key: "month" }))) : this.type === 'year' ? (h(MonthPanel, Object.assign({}, commonPanelProps, { type: "year", key: "year" }))) : this.type === 'quarter' ? (h(MonthPanel, Object.assign({}, commonPanelProps, { type: "quarter", key: "quarter" }))) : (h(DatePanel, Object.assign({}, commonPanelProps))), [[clickoutside, this.handleClickOutside]])
                                 : null
                         }))
                     })

package/es/date-picker/src/config.d.ts

@@ -1,11 +1,3 @@
 export declare const START_YEAR = 1901;
 export declare const MONTH_ITEM_HEIGHT = 40;
-export declare const DATE_FORMAT: {
-    date: string;
-    datetime: string;
-    daterange: string;
-    datetimerange: string;
-    month: string;
-    year: string;
-};
-export declare type DatePickerType = keyof typeof DATE_FORMAT;
+export declare type DatePickerType = 'date' | 'datetime' | 'daterange' | 'datetimerange' | 'month' | 'year' | 'quarter';

package/es/date-picker/src/config.js

@@ -1,11 +1,3 @@
 export const START_YEAR = 1901;
 // TODO: we need to remove it to make height customizable
 export const MONTH_ITEM_HEIGHT = 40;
-export const DATE_FORMAT = {
-    date: 'yyyy-MM-dd',
-    datetime: 'yyyy-MM-dd HH:mm:ss',
-    daterange: 'yyyy-MM-dd',
-    datetimerange: 'yyyy-MM-dd HH:mm:ss',
-    month: 'yyyy-MM',
-    year: 'yyyy'
-};

package/es/date-picker/src/interface.d.ts

@@ -7,6 +7,7 @@ import { MergedTheme } from '../../_mixins';
 import { DatePickerTheme } from '../styles/light';
 import { uniCalendarValidation, dualCalendarValidation } from './validation-utils';
 export declare type Value = number | [number, number];
+export declare type DefaultTime = string | [string | undefined, string | undefined];
 export declare type Shortcuts = Record<string, number | (() => number)> | Record<string, [number, number] | (() => [number, number])>;
 export declare type OnUpdateValue = (value: number & (number | null) & [number, number] & ([number, number] | null)) => void;
 export declare type OnUpdateValueImpl = (value: Value | null) => void;
@@ -34,7 +35,7 @@ export declare type DatePickerInjection = {
     updateValueOnCloseRef: Ref<boolean>;
     firstDayOfWeekRef: Ref<FirstDayOfWeek | undefined>;
     datePickerSlots: Slots;
-    scrollYearMonth: (value?: number) => void;
+    scrollPickerColumns: (value?: number) => void;
 } & ReturnType<typeof uniCalendarValidation> & ReturnType<typeof dualCalendarValidation>;
 export declare const datePickerInjectionKey: InjectionKey<DatePickerInjection>;
 export declare type IsDateDisabled = IsSingleDateDisabled | IsRangeDateDisabled;

package/es/date-picker/src/panel/date.d.ts

@@ -4,19 +4,17 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: () => string[];
     };
     readonly active: BooleanConstructor;
-    readonly dateFormat: {
-        readonly type: StringConstructor;
-        readonly default: "yyyy-MM-dd";
-    };
+    readonly dateFormat: StringConstructor;
     readonly timeFormat: {
         readonly type: StringConstructor;
-        readonly default: "HH:mm:ss";
+        readonly value: "HH:mm:ss";
     };
     readonly value: {
         readonly type: import("vue").PropType<import("../interface").Value | null>;
         readonly default: null;
     };
     readonly shortcuts: import("vue").PropType<import("../interface").Shortcuts>;
+    readonly defaultTime: import("vue").PropType<import("../interface").DefaultTime>;
     readonly onConfirm: FunctionConstructor;
     readonly onClose: import("vue").PropType<import("../interface").OnClose>;
     readonly onTabOut: FunctionConstructor;
@@ -25,7 +23,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly required: true;
     };
 }, {
-    handleDateClick: (dateItem: import("../utils").DateItem | import("../utils").MonthItem | import("../utils").YearItem) => void;
+    handleDateClick: (dateItem: import("../utils").DateItem | import("../utils").MonthItem | import("../utils").YearItem | import("../utils").QuarterItem) => void;
     handleDateInputBlur: () => void;
     handleDateInput: (value: string) => void;
     handleTimePickerChange: (value: number | null) => void;
@@ -208,12 +206,14 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingDatetimerange: string;
             calendarLeftPaddingMonth: string;
             calendarLeftPaddingYear: string;
+            calendarLeftPaddingQuarter: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
             calendarRightPaddingDatetimerange: string;
             calendarRightPaddingMonth: string;
             calendarRightPaddingYear: string;
+            calendarRightPaddingQuarter: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -1070,6 +1070,11 @@ declare const _default: import("vue").DefineComponent<{
         yearFormat: string;
         monthFormat: string;
         dayFormat: string;
+        yearTypeFormat: string;
+        monthTypeFormat: string;
+        dateFormat: string;
+        dateTimeFormat: string;
+        quarterFormat: string;
         clear: string;
         now: string;
         confirm: string;
@@ -1079,6 +1084,7 @@ declare const _default: import("vue").DefineComponent<{
         datetimePlaceholder: string;
         monthPlaceholder: string;
         yearPlaceholder: string;
+        quarterPlaceholder: string;
         startDatePlaceholder: string;
         endDatePlaceholder: string;
         startDatetimePlaceholder: string;
@@ -1112,6 +1118,7 @@ declare const _default: import("vue").DefineComponent<{
     dateArray: import("vue").ComputedRef<import("../utils").DateItem[]>;
     monthArray: import("vue").ComputedRef<import("../utils").MonthItem[]>;
     yearArray: import("vue").ComputedRef<import("../utils").YearItem[]>;
+    quarterArray: import("vue").ComputedRef<import("../utils").QuarterItem[]>;
     calendarYear: import("vue").ComputedRef<string>;
     calendarMonth: import("vue").ComputedRef<string>;
     weekdays: import("vue").ComputedRef<string[]>;
@@ -1131,6 +1138,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly timeFormat?: unknown;
     readonly value?: unknown;
     readonly shortcuts?: unknown;
+    readonly defaultTime?: unknown;
     readonly onConfirm?: unknown;
     readonly onClose?: unknown;
     readonly onTabOut?: unknown;
@@ -1138,21 +1146,20 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     value: import("../interface").Value | null;
     active: boolean;
-    dateFormat: string;
     onUpdateValue: import("../interface").OnPanelUpdateValue;
     actions: string[];
-    timeFormat: string;
 } & {
+    dateFormat?: string | undefined;
     onTabOut?: Function | undefined;
     onClose?: import("../interface").OnClose | undefined;
     onConfirm?: Function | undefined;
+    defaultTime?: import("../interface").DefaultTime | undefined;
+    timeFormat?: string | undefined;
     shortcuts?: import("../interface").Shortcuts | undefined;
 }>, {
     value: import("../interface").Value | null;
     active: boolean;
-    dateFormat: string;
     actions: string[];
-    timeFormat: string;
 }>;
 /**
  * Date Panel

package/es/date-picker/src/panel/date.js

@@ -2,7 +2,7 @@ import { h, defineComponent, renderSlot, watchEffect } from 'vue';
 import { NButton, NxButton } from '../../../button';
 import { BackwardIcon, FastBackwardIcon, ForwardIcon, FastForwardIcon } from '../../../_internal/icons';
 import { NBaseFocusDetector } from '../../../_internal';
-import { useCalendar } from './use-calendar';
+import { useCalendar, useCalendarProps } from './use-calendar';
 import { warnOnce } from '../../../_utils';
 /**
  * Date Panel
@@ -12,7 +12,7 @@ import { warnOnce } from '../../../_utils';
  */
 export default defineComponent({
     name: 'DatePanel',
-    props: useCalendar.props,
+    props: useCalendarProps,
     setup(props) {
         if (process.env.NODE_ENV !== 'production') {
             watchEffect(() => {

package/es/date-picker/src/panel/daterange.d.ts

@@ -4,19 +4,17 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: () => string[];
     };
     readonly active: BooleanConstructor;
-    readonly dateFormat: {
-        readonly type: StringConstructor;
-        readonly default: "yyyy-MM-dd";
-    };
+    readonly dateFormat: StringConstructor;
     readonly timeFormat: {
         readonly type: StringConstructor;
-        readonly default: "HH:mm:ss";
+        readonly value: "HH:mm:ss";
     };
     readonly value: {
         readonly type: import("vue").PropType<import("../interface").Value | null>;
         readonly default: null;
     };
     readonly shortcuts: import("vue").PropType<import("../interface").Shortcuts>;
+    readonly defaultTime: import("vue").PropType<import("../interface").DefaultTime>;
     readonly onConfirm: FunctionConstructor;
     readonly onClose: import("vue").PropType<import("../interface").OnClose>;
     readonly onTabOut: FunctionConstructor;
@@ -206,12 +204,14 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingDatetimerange: string;
             calendarLeftPaddingMonth: string;
             calendarLeftPaddingYear: string;
+            calendarLeftPaddingQuarter: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
             calendarRightPaddingDatetimerange: string;
             calendarRightPaddingMonth: string;
             calendarRightPaddingYear: string;
+            calendarRightPaddingQuarter: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -1068,6 +1068,11 @@ declare const _default: import("vue").DefineComponent<{
         yearFormat: string;
         monthFormat: string;
         dayFormat: string;
+        yearTypeFormat: string;
+        monthTypeFormat: string;
+        dateFormat: string;
+        dateTimeFormat: string;
+        quarterFormat: string;
         clear: string;
         now: string;
         confirm: string;
@@ -1077,6 +1082,7 @@ declare const _default: import("vue").DefineComponent<{
         datetimePlaceholder: string;
         monthPlaceholder: string;
         yearPlaceholder: string;
+        quarterPlaceholder: string;
         startDatePlaceholder: string;
         endDatePlaceholder: string;
         startDatetimePlaceholder: string;
@@ -1131,6 +1137,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly timeFormat?: unknown;
     readonly value?: unknown;
     readonly shortcuts?: unknown;
+    readonly defaultTime?: unknown;
     readonly onConfirm?: unknown;
     readonly onClose?: unknown;
     readonly onTabOut?: unknown;
@@ -1138,20 +1145,19 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     value: import("../interface").Value | null;
     active: boolean;
-    dateFormat: string;
     onUpdateValue: import("../interface").OnPanelUpdateValue;
     actions: unknown[];
-    timeFormat: string;
 } & {
+    dateFormat?: string | undefined;
     onTabOut?: Function | undefined;
     onClose?: import("../interface").OnClose | undefined;
     onConfirm?: Function | undefined;
+    defaultTime?: import("../interface").DefaultTime | undefined;
+    timeFormat?: string | undefined;
     shortcuts?: import("../interface").Shortcuts | undefined;
 }>, {
     value: import("../interface").Value | null;
     active: boolean;
-    dateFormat: string;
     actions: unknown[];
-    timeFormat: string;
 }>;
 export default _default;

package/es/date-picker/src/panel/daterange.js

@@ -2,11 +2,11 @@ import { defineComponent, h, renderSlot, watchEffect } from 'vue';
 import { NButton, NxButton } from '../../../button';
 import { BackwardIcon, FastBackwardIcon, ForwardIcon, FastForwardIcon } from '../../../_internal/icons';
 import { NBaseFocusDetector } from '../../../_internal';
-import { useDualCalendar } from './use-dual-calendar';
+import { useDualCalendar, useDualCalendarProps } from './use-dual-calendar';
 import { warnOnce } from '../../../_utils';
 export default defineComponent({
     name: 'DateRangePanel',
-    props: useDualCalendar.props,
+    props: useDualCalendarProps,
     setup(props) {
         if (process.env.NODE_ENV !== 'production') {
             watchEffect(() => {