naive-ui 2.30.6 → 2.31.0

package/lib/data-table/src/TableParts/BodyRadio.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const vue_1 = require("vue");
+const radio_1 = require("../../../radio");
+const interface_1 = require("../interface");
+// Extract the radio to avoid useless rendering in table body
+exports.default = (0, vue_1.defineComponent)({
+    name: 'DataTableBodyRadio',
+    props: {
+        rowKey: {
+            type: [String, Number],
+            required: true
+        },
+        disabled: {
+            type: Boolean,
+            required: true
+        },
+        onUpdateChecked: {
+            type: Function,
+            required: true
+        }
+    },
+    setup(props) {
+        const { mergedCheckedRowKeySetRef, componentId
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+         } = (0, vue_1.inject)(interface_1.dataTableInjectionKey);
+        return () => {
+            const { rowKey } = props;
+            return ((0, vue_1.h)(radio_1.NRadio, { name: componentId, disabled: props.disabled, checked: mergedCheckedRowKeySetRef.value.has(rowKey), onUpdateChecked: props.onUpdateChecked }));
+        };
+    }
+});

package/lib/data-table/src/TableParts/Header.js

@@ -111,9 +111,9 @@ exports.default = (0, vue_1.defineComponent)({
                             handleColHeaderClick(e, column);
                         }
                         : undefined },
-                    column.type === 'selection' ? ((0, vue_1.h)(vue_1.Fragment, null,
+                    column.type === 'selection' ? (column.multiple !== false ? ((0, vue_1.h)(vue_1.Fragment, null,
                         (0, vue_1.h)(checkbox_1.NCheckbox, { key: currentPage, privateInsideTable: true, checked: allRowsChecked, indeterminate: someRowsChecked, disabled: headerCheckboxDisabled, onUpdateChecked: handleCheckboxUpdateChecked }),
-                        checkOptions ? ((0, vue_1.h)(SelectionMenu_1.default, { clsPrefix: mergedClsPrefix })) : null)) : ellipsis === true || (ellipsis && !ellipsis.tooltip) ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-data-table-th__ellipsis` }, renderTitle(column))) // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
+                        checkOptions ? ((0, vue_1.h)(SelectionMenu_1.default, { clsPrefix: mergedClsPrefix })) : null)) : null) : ellipsis === true || (ellipsis && !ellipsis.tooltip) ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-data-table-th__ellipsis` }, renderTitle(column))) // eslint-disable-next-line @typescript-eslint/prefer-optional-chain
                         : ellipsis && typeof ellipsis === 'object' ? ((0, vue_1.h)(ellipsis_1.NEllipsis, Object.assign({}, ellipsis, { theme: mergedTheme.peers.Ellipsis, themeOverrides: mergedTheme.peerOverrides.Ellipsis }), {
                             default: () => renderTitle(column)
                         })) : (renderTitle(column)),

package/lib/data-table/src/interface.d.ts

@@ -82,6 +82,7 @@ export declare type TableBaseColumn<T = InternalRowData> = {
 } & CommonColumnInfo<T>;
 export declare type TableSelectionColumn<T = InternalRowData> = {
     type: 'selection';
+    multiple?: boolean;
     disabled?: (row: T) => boolean;
     options?: DataTableSelectionOptions;
     sorter?: never;
@@ -169,7 +170,7 @@ export interface DataTableInjection {
     deriveNextSorter: (sorter: SortState | null) => void;
     doUncheckAll: (checkWholeTable?: boolean) => void;
     doCheckAll: (checkWholeTable?: boolean) => void;
-    doCheck: (rowKey: RowKey | RowKey[]) => void;
+    doCheck: (rowKey: RowKey | RowKey[], single: boolean) => void;
     doUncheck: (rowKey: RowKey | RowKey[]) => void;
     handleTableHeaderScroll: (e: Event) => void;
     handleTableBodyScroll: (e: Event) => void;

package/lib/data-table/src/use-check.d.ts

@@ -16,6 +16,6 @@ export declare function useCheck(props: DataTableSetupProps, data: {
     doUpdateCheckedRowKeys: (keys: RowKey[]) => void;
     doCheckAll: (checkWholeTable?: boolean) => void;
     doUncheckAll: (checkWholeTable?: boolean) => void;
-    doCheck: (rowKey: RowKey | RowKey[]) => void;
+    doCheck: (rowKey: RowKey | RowKey[], single?: boolean) => void;
     doUncheck: (rowKey: RowKey | RowKey[]) => void;
 };

package/lib/data-table/src/use-check.js

@@ -8,10 +8,18 @@ function useCheck(props, data) {
     const { paginatedDataRef, treeMateRef, selectionColumnRef } = data;
     const uncontrolledCheckedRowKeysRef = (0, vue_1.ref)(props.defaultCheckedRowKeys);
     const mergedCheckState = (0, vue_1.computed)(() => {
+        var _a;
         const { checkedRowKeys } = props;
-        return treeMateRef.value.getCheckedKeys(checkedRowKeys === undefined
+        const sourceKeys = checkedRowKeys === undefined
             ? uncontrolledCheckedRowKeysRef.value
-            : checkedRowKeys, {
+            : checkedRowKeys;
+        if (((_a = selectionColumnRef.value) === null || _a === void 0 ? void 0 : _a.multiple) === false) {
+            return {
+                checkedKeys: sourceKeys.slice(0, 1),
+                indeterminateKeys: []
+            };
+        }
+        return treeMateRef.value.getCheckedKeys(sourceKeys, {
             cascade: props.cascade,
             allowNotLoaded: props.allowCheckingNotLoaded
         });
@@ -69,9 +77,13 @@ function useCheck(props, data) {
             (0, _utils_1.call)(onCheckedRowKeysChange, keys, rows);
         uncontrolledCheckedRowKeysRef.value = keys;
     }
-    function doCheck(rowKey) {
+    function doCheck(rowKey, single = false) {
         if (props.loading)
             return;
+        if (single) {
+            doUpdateCheckedRowKeys(Array.isArray(rowKey) ? rowKey.slice(0, 1) : [rowKey]);
+            return;
+        }
         doUpdateCheckedRowKeys(treeMateRef.value.check(rowKey, mergedCheckedRowKeysRef.value, {
             cascade: props.cascade,
             allowNotLoaded: props.allowCheckingNotLoaded

package/lib/date-picker/index.d.ts

@@ -1,3 +1,3 @@
-export { default as NDatePicker } from './src/DatePicker';
+export { default as NDatePicker, datePickerProps } from './src/DatePicker';
 export type { DatePickerProps } from './src/DatePicker';
 export type { DatePickerInst } from './src/interface';

package/lib/date-picker/index.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NDatePicker = void 0;
+exports.datePickerProps = exports.NDatePicker = void 0;
 var DatePicker_1 = require("./src/DatePicker");
 Object.defineProperty(exports, "NDatePicker", { enumerable: true, get: function () { return __importDefault(DatePicker_1).default; } });
+Object.defineProperty(exports, "datePickerProps", { enumerable: true, get: function () { return DatePicker_1.datePickerProps; } });

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

@@ -5,7 +5,7 @@ import type { FormValidationStatus } from '../../form/src/interface';
 import type { MaybeArray, ExtractPublicPropTypes } from '../../_utils';
 import { DatePickerType } from './config';
 import type { OnUpdateValue, Value, IsDateDisabled, IsTimeDisabled, Shortcuts, FirstDayOfWeek, DefaultTime, FormattedValue, OnUpdateFormattedValue } from './interface';
-declare const datePickerProps: {
+export declare const datePickerProps: {
     readonly to: {
         type: PropType<string | boolean | HTMLElement>;
         default: undefined;
@@ -121,6 +121,8 @@ declare const datePickerProps: {
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -129,6 +131,8 @@ declare const datePickerProps: {
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -735,6 +739,8 @@ declare const datePickerProps: {
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -743,6 +749,8 @@ declare const datePickerProps: {
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -1349,6 +1357,8 @@ declare const datePickerProps: {
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -1357,6 +1367,8 @@ declare const datePickerProps: {
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -2032,6 +2044,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -2040,6 +2054,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -2646,6 +2662,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -2654,6 +2672,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -3260,6 +3280,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -3268,6 +3290,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -4120,6 +4144,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -4128,6 +4154,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../_mixins").Theme<"Input", {
@@ -5148,6 +5176,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -5156,6 +5186,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -5762,6 +5794,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -5770,6 +5804,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;
@@ -6376,6 +6412,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarLeftPaddingYear: string;
         calendarLeftPaddingQuarter: string;
         calendarLeftPaddingMonthrange: string;
+        calendarLeftPaddingQuarterrange: string;
+        calendarLeftPaddingYearrange: string;
         calendarRightPaddingDate: string;
         calendarRightPaddingDatetime: string;
         calendarRightPaddingDaterange: string;
@@ -6384,6 +6422,8 @@ declare const _default: import("vue").DefineComponent<{
         calendarRightPaddingYear: string;
         calendarRightPaddingQuarter: string;
         calendarRightPaddingMonthrange: string;
+        calendarRightPaddingQuarterrange: string;
+        calendarRightPaddingYearrange: string;
     }, {
         Input: import("../../_mixins").Theme<"Input", {
             countTextColor: string;

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

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.datePickerProps = void 0;
 const vue_1 = require("vue");
 const vueuc_1 = require("vueuc");
 const vdirs_1 = require("vdirs");
@@ -25,7 +26,7 @@ const daterange_1 = __importDefault(require("./panel/daterange"));
 const month_1 = __importDefault(require("./panel/month"));
 const monthrange_1 = __importDefault(require("./panel/monthrange"));
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-const datePickerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { to: _utils_1.useAdjustedTo.propTo, bordered: {
+exports.datePickerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { to: _utils_1.useAdjustedTo.propTo, bordered: {
         type: Boolean,
         default: undefined
     }, clearable: Boolean, updateValueOnClose: Boolean, defaultValue: [Number, Array], defaultFormattedValue: [String, Array], defaultTime: [Number, String, Array], disabled: {
@@ -45,7 +46,7 @@ const datePickerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props
     onChange: [Function, Array] });
 exports.default = (0, vue_1.defineComponent)({
     name: 'DatePicker',
-    props: datePickerProps,
+    props: exports.datePickerProps,
     setup(props, { slots }) {
         var _a;
         if (process.env.NODE_ENV !== 'production') {
@@ -82,11 +83,13 @@ exports.default = (0, vue_1.defineComponent)({
                 case 'datetimerange':
                     return localeRef.value.dateTimeFormat;
                 case 'year':
+                case 'yearrange':
                     return localeRef.value.yearTypeFormat;
                 case 'month':
                 case 'monthrange':
                     return localeRef.value.monthTypeFormat;
                 case 'quarter':
+                case 'quarterrange':
                     return localeRef.value.quarterFormat;
             }
         });
@@ -133,7 +136,13 @@ exports.default = (0, vue_1.defineComponent)({
             return (((_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.DatePicker) === null || _b === void 0 ? void 0 : _b.timePickerSize) || 'small');
         });
         const isRangeRef = (0, vue_1.computed)(() => {
-            return ['daterange', 'datetimerange', 'monthrange'].includes(props.type);
+            return [
+                'daterange',
+                'datetimerange',
+                'monthrange',
+                'quarterrange',
+                'yearrange'
+            ].includes(props.type);
         });
         const localizedPlacehoderRef = (0, vue_1.computed)(() => {
             const { placeholder } = props;
@@ -193,35 +202,46 @@ exports.default = (0, vue_1.defineComponent)({
             }
         });
         const mergedActionsRef = (0, vue_1.computed)(() => {
-            const { actions, type } = props;
+            const { actions, type, clearable } = props;
             if (actions === null)
                 return [];
             if (actions !== undefined)
                 return actions;
+            const result = clearable ? ['clear'] : [];
             switch (type) {
                 case 'date': {
-                    return ['clear', 'now'];
+                    result.push('now');
+                    return result;
                 }
                 case 'datetime': {
-                    return ['clear', 'now', 'confirm'];
+                    result.push('now', 'confirm');
+                    return result;
                 }
                 case 'daterange': {
-                    return ['clear', 'confirm'];
+                    result.push('confirm');
+                    return result;
                 }
                 case 'datetimerange': {
-                    return ['clear', 'confirm'];
+                    result.push('confirm');
+                    return result;
                 }
                 case 'month': {
-                    return ['clear', 'now', 'confirm'];
+                    result.push('now', 'confirm');
+                    return result;
                 }
                 case 'year': {
-                    return ['clear', 'now'];
+                    result.push('now');
+                    return result;
                 }
                 case 'quarter': {
-                    return ['clear', 'now', 'confirm'];
+                    result.push('now', 'confirm');
+                    return result;
                 }
-                case 'monthrange': {
-                    return ['clear', 'confirm'];
+                case 'monthrange':
+                case 'yearrange':
+                case 'quarterrange': {
+                    result.push('confirm');
+                    return result;
                 }
                 default: {
                     (0, _utils_1.warn)('data-picker', "The type is wrong, n-date-picker's type only supports `date`, `datetime`, `daterange` and `datetimerange`.");
@@ -648,7 +668,9 @@ exports.default = (0, vue_1.defineComponent)({
         };
         const renderPanel = () => {
             const { type } = this;
-            return type === 'datetime' ? ((0, vue_1.h)(datetime_1.default, Object.assign({}, commonPanelProps))) : type === 'daterange' ? ((0, vue_1.h)(daterange_1.default, Object.assign({}, commonPanelProps, { defaultCalendarStartTime: this.defaultCalendarStartTime, defaultCalendarEndTime: this.defaultCalendarEndTime, bindCalendarMonths: this.bindCalendarMonths }))) : type === 'datetimerange' ? ((0, vue_1.h)(datetimerange_1.default, Object.assign({}, commonPanelProps, { defaultCalendarStartTime: this.defaultCalendarStartTime, defaultCalendarEndTime: this.defaultCalendarEndTime, bindCalendarMonths: this.bindCalendarMonths }))) : type === 'month' || type === 'year' || type === 'quarter' ? ((0, vue_1.h)(month_1.default, Object.assign({}, commonPanelProps, { type: type, key: type }))) : type === 'monthrange' ? ((0, vue_1.h)(monthrange_1.default, Object.assign({}, commonPanelProps, { type: type }))) : ((0, vue_1.h)(date_1.default, Object.assign({}, commonPanelProps)));
+            return type === 'datetime' ? ((0, vue_1.h)(datetime_1.default, Object.assign({}, commonPanelProps))) : type === 'daterange' ? ((0, vue_1.h)(daterange_1.default, Object.assign({}, commonPanelProps, { defaultCalendarStartTime: this.defaultCalendarStartTime, defaultCalendarEndTime: this.defaultCalendarEndTime, bindCalendarMonths: this.bindCalendarMonths }))) : type === 'datetimerange' ? ((0, vue_1.h)(datetimerange_1.default, Object.assign({}, commonPanelProps, { defaultCalendarStartTime: this.defaultCalendarStartTime, defaultCalendarEndTime: this.defaultCalendarEndTime, bindCalendarMonths: this.bindCalendarMonths }))) : type === 'month' || type === 'year' || type === 'quarter' ? ((0, vue_1.h)(month_1.default, Object.assign({}, commonPanelProps, { type: type, key: type }))) : type === 'monthrange' ||
+                type === 'yearrange' ||
+                type === 'quarterrange' ? ((0, vue_1.h)(monthrange_1.default, Object.assign({}, commonPanelProps, { type: type }))) : ((0, vue_1.h)(date_1.default, Object.assign({}, commonPanelProps)));
         };
         if (this.panel) {
             return renderPanel();

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

@@ -1,3 +1,3 @@
 export declare const START_YEAR = 1901;
 export declare const MONTH_ITEM_HEIGHT = 40;
-export declare type DatePickerType = 'date' | 'datetime' | 'daterange' | 'datetimerange' | 'month' | 'year' | 'quarter' | 'monthrange';
+export declare type DatePickerType = 'date' | 'datetime' | 'daterange' | 'datetimerange' | 'month' | 'year' | 'quarter' | 'monthrange' | 'quarterrange' | 'yearrange';

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

@@ -214,6 +214,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -222,6 +224,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {

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

@@ -234,6 +234,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -242,6 +244,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -1143,7 +1147,7 @@ declare const _default: import("vue").DefineComponent<{
     endDatesElRef: import("vue").Ref<HTMLElement | null>;
     resetSelectingStatus: (e: MouseEvent) => void;
     handleDateClick: (dateItem: import("../utils").DateItem) => void;
-    handleColItemClick: (dateItem: import("../utils").MonthItem | import("../utils").YearItem, clickType: "start" | "end") => void;
+    handleColItemClick: (dateItem: import("../utils").MonthItem | import("../utils").YearItem | import("../utils").QuarterItem, clickType: "start" | "end") => void;
     handleDateMouseEnter: (dateItem: import("../utils").DateItem) => void;
     handleConfirmClick: () => void;
     startCalendarPrevYear: () => void;
@@ -1166,8 +1170,10 @@ declare const _default: import("vue").DefineComponent<{
     endDateArray: import("vue").ComputedRef<import("../utils").DateItem[]>;
     startYearArray: import("vue").ComputedRef<import("../utils").YearItem[]>;
     startMonthArray: import("vue").ComputedRef<import("../utils").MonthItem[]>;
+    startQuarterArray: import("vue").ComputedRef<import("../utils").QuarterItem[]>;
     endYearArray: import("vue").ComputedRef<import("../utils").YearItem[]>;
     endMonthArray: import("vue").ComputedRef<import("../utils").MonthItem[]>;
+    endQuarterArray: import("vue").ComputedRef<import("../utils").QuarterItem[]>;
     isSelecting: import("vue").Ref<boolean>;
     handleRangeShortcutMouseenter: (shortcut: number | [number, number] | (() => number) | readonly [number, number] | (() => [number, number] | readonly [number, number])) => void;
     handleRangeShortcutClick: (shortcut: number | [number, number] | (() => number) | readonly [number, number] | (() => [number, number] | readonly [number, number])) => void;

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

@@ -107,7 +107,7 @@ exports.default = (0, vue_1.defineComponent)({
                     })),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-actions__suffix` },
                     ((_b = this.actions) === null || _b === void 0 ? void 0 : _b.includes('clear')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", onClick: this.handleClearClick }, { default: () => this.locale.clear })) : null,
-                    ((_c = this.actions) === null || _c === void 0 ? void 0 : _c.includes('confirm')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", type: "primary", disabled: this.isRangeInvalid, onClick: this.handleConfirmClick }, { default: () => this.locale.confirm })) : null))) : null,
+                    ((_c = this.actions) === null || _c === void 0 ? void 0 : _c.includes('confirm')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", type: "primary", disabled: this.isRangeInvalid || this.isSelecting, onClick: this.handleConfirmClick }, { default: () => this.locale.confirm })) : null))) : null,
             (0, vue_1.h)(_internal_1.NBaseFocusDetector, { onFocus: this.handleFocusDetectorFocus })));
     }
 });

package/lib/date-picker/src/panel/datetime.d.ts

@@ -203,6 +203,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -211,6 +213,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {

package/lib/date-picker/src/panel/datetimerange.d.ts

@@ -234,6 +234,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -242,6 +244,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -1143,7 +1147,7 @@ declare const _default: import("vue").DefineComponent<{
     endDatesElRef: import("vue").Ref<HTMLElement | null>;
     resetSelectingStatus: (e: MouseEvent) => void;
     handleDateClick: (dateItem: import("../utils").DateItem) => void;
-    handleColItemClick: (dateItem: import("../utils").MonthItem | import("../utils").YearItem, clickType: "start" | "end") => void;
+    handleColItemClick: (dateItem: import("../utils").MonthItem | import("../utils").YearItem | import("../utils").QuarterItem, clickType: "start" | "end") => void;
     handleDateMouseEnter: (dateItem: import("../utils").DateItem) => void;
     handleConfirmClick: () => void;
     startCalendarPrevYear: () => void;
@@ -1166,8 +1170,10 @@ declare const _default: import("vue").DefineComponent<{
     endDateArray: import("vue").ComputedRef<import("../utils").DateItem[]>;
     startYearArray: import("vue").ComputedRef<import("../utils").YearItem[]>;
     startMonthArray: import("vue").ComputedRef<import("../utils").MonthItem[]>;
+    startQuarterArray: import("vue").ComputedRef<import("../utils").QuarterItem[]>;
     endYearArray: import("vue").ComputedRef<import("../utils").YearItem[]>;
     endMonthArray: import("vue").ComputedRef<import("../utils").MonthItem[]>;
+    endQuarterArray: import("vue").ComputedRef<import("../utils").QuarterItem[]>;
     isSelecting: import("vue").Ref<boolean>;
     handleRangeShortcutMouseenter: (shortcut: number | [number, number] | (() => number) | readonly [number, number] | (() => [number, number] | readonly [number, number])) => void;
     handleRangeShortcutClick: (shortcut: number | [number, number] | (() => number) | readonly [number, number] | (() => [number, number] | readonly [number, number])) => void;

package/lib/date-picker/src/panel/datetimerange.js

@@ -128,7 +128,7 @@ exports.default = (0, vue_1.defineComponent)({
                     })),
                 (0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-actions__suffix` },
                     ((_b = this.actions) === null || _b === void 0 ? void 0 : _b.includes('clear')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", onClick: this.handleClearClick }, { default: () => this.locale.clear })) : null,
-                    ((_c = this.actions) === null || _c === void 0 ? void 0 : _c.includes('confirm')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", type: "primary", disabled: this.isRangeInvalid, onClick: this.handleConfirmClick }, { default: () => this.locale.confirm })) : null))) : null,
+                    ((_c = this.actions) === null || _c === void 0 ? void 0 : _c.includes('confirm')) ? ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, size: "tiny", type: "primary", disabled: this.isRangeInvalid || this.isSelecting, onClick: this.handleConfirmClick }, { default: () => this.locale.confirm })) : null))) : null,
             (0, vue_1.h)(_internal_1.NBaseFocusDetector, { onFocus: this.handleFocusDetectorFocus })));
     }
 });

package/lib/date-picker/src/panel/month.d.ts

@@ -211,6 +211,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingYear: string;
             calendarLeftPaddingQuarter: string;
             calendarLeftPaddingMonthrange: string;
+            calendarLeftPaddingQuarterrange: string;
+            calendarLeftPaddingYearrange: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
@@ -219,6 +221,8 @@ declare const _default: import("vue").DefineComponent<{
             calendarRightPaddingYear: string;
             calendarRightPaddingQuarter: string;
             calendarRightPaddingMonthrange: string;
+            calendarRightPaddingQuarterrange: string;
+            calendarRightPaddingYearrange: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {

package/lib/date-picker/src/panel/month.js

@@ -29,7 +29,7 @@ exports.default = (0, vue_1.defineComponent)({
                 case 'month':
                     return item.dateObject.month + 1;
                 case 'quarter':
-                    return `Q ${item.dateObject.quarter}`;
+                    return `Q${item.dateObject.quarter}`;
             }
         };
         const { useAsQuickJump } = props;