naive-ui 2.20.2 → 2.21.2

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

@@ -31,8 +31,8 @@ declare const _default: import("vue").DefineComponent<{
     startTimeValue: import("vue").ComputedRef<number | null>;
     endTimeValue: import("vue").ComputedRef<number | null>;
     handleFocusDetectorFocus: () => void;
-    handleStartTimePickerChange: (value: number) => void;
-    handleEndTimePickerChange: (value: number) => void;
+    handleStartTimePickerChange: (value: number | null) => void;
+    handleEndTimePickerChange: (value: number | null) => void;
     handleStartDateInput: (value: string) => void;
     handleStartDateInputBlur: () => void;
     handleEndDateInput: (value: string) => void;
@@ -125,9 +125,13 @@ declare const _default: import("vue").DefineComponent<{
             tableHeaderColor: string;
             hoverColor: string;
             tableColorHover: string;
+            tableColorStriped: string;
             pressedColor: string;
             opacityDisabled: string;
             inputColorDisabled: string;
+            buttonColor2: string;
+            buttonColor2Hover: string;
+            buttonColor2Pressed: string;
             boxShadow1: string;
             boxShadow2: string;
             boxShadow3: string;
@@ -201,11 +205,13 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingDaterange: string;
             calendarLeftPaddingDatetimerange: string;
             calendarLeftPaddingMonth: string;
+            calendarLeftPaddingYear: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
             calendarRightPaddingDatetimerange: string;
             calendarRightPaddingMonth: string;
+            calendarRightPaddingYear: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -282,20 +288,30 @@ declare const _default: import("vue").DefineComponent<{
                 fontSizeMedium: string;
                 fontSizeLarge: string;
                 opacityDisabled: string;
+                colorOpacitySecondary: number;
+                colorOpacitySecondaryHover: number;
+                colorOpacitySecondaryPressed: number;
+                colorSecondary: string;
+                colorSecondaryHover: string;
+                colorSecondaryPressed: string;
+                colorTertiary: string;
+                colorTertiaryHover: string;
+                colorTertiaryPressed: string;
+                colorQuaternary: string;
+                colorQuaternaryHover: string;
+                colorQuaternaryPressed: string;
                 color: string;
                 colorHover: string;
                 colorPressed: string;
                 colorFocus: string;
                 colorDisabled: string;
                 textColor: string;
+                textColorTertiary: string;
                 textColorHover: string;
                 textColorPressed: string;
                 textColorFocus: string;
                 textColorDisabled: string;
                 textColorText: string;
-                textColorTextDepth1: string;
-                textColorTextDepth2: string;
-                textColorTextDepth3: string;
                 textColorTextHover: string;
                 textColorTextPressed: string;
                 textColorTextFocus: string;
@@ -442,9 +458,8 @@ declare const _default: import("vue").DefineComponent<{
                 borderDisabledError: string;
                 rippleColorError: string;
                 waveOpacity: string;
-                fontWeightText: string;
                 fontWeight: string;
-                fontWeighGhost: string;
+                fontWeightStrong: string;
                 paddingTiny: string;
                 paddingSmall: string;
                 paddingMedium: string;
@@ -498,20 +513,30 @@ declare const _default: import("vue").DefineComponent<{
                     fontSizeMedium: string;
                     fontSizeLarge: string;
                     opacityDisabled: string;
+                    colorOpacitySecondary: number;
+                    colorOpacitySecondaryHover: number;
+                    colorOpacitySecondaryPressed: number;
+                    colorSecondary: string;
+                    colorSecondaryHover: string;
+                    colorSecondaryPressed: string;
+                    colorTertiary: string;
+                    colorTertiaryHover: string;
+                    colorTertiaryPressed: string;
+                    colorQuaternary: string;
+                    colorQuaternaryHover: string;
+                    colorQuaternaryPressed: string;
                     color: string;
                     colorHover: string;
                     colorPressed: string;
                     colorFocus: string;
                     colorDisabled: string;
                     textColor: string;
+                    textColorTertiary: string;
                     textColorHover: string;
                     textColorPressed: string;
                     textColorFocus: string;
                     textColorDisabled: string;
                     textColorText: string;
-                    textColorTextDepth1: string;
-                    textColorTextDepth2: string;
-                    textColorTextDepth3: string;
                     textColorTextHover: string;
                     textColorTextPressed: string;
                     textColorTextFocus: string;
@@ -658,9 +683,8 @@ declare const _default: import("vue").DefineComponent<{
                     borderDisabledError: string;
                     rippleColorError: string;
                     waveOpacity: string;
-                    fontWeightText: string;
                     fontWeight: string;
-                    fontWeighGhost: string;
+                    fontWeightStrong: string;
                     paddingTiny: string;
                     paddingSmall: string;
                     paddingMedium: string;
@@ -776,20 +800,30 @@ declare const _default: import("vue").DefineComponent<{
                         fontSizeMedium: string;
                         fontSizeLarge: string;
                         opacityDisabled: string;
+                        colorOpacitySecondary: number;
+                        colorOpacitySecondaryHover: number;
+                        colorOpacitySecondaryPressed: number;
+                        colorSecondary: string;
+                        colorSecondaryHover: string;
+                        colorSecondaryPressed: string;
+                        colorTertiary: string;
+                        colorTertiaryHover: string;
+                        colorTertiaryPressed: string;
+                        colorQuaternary: string;
+                        colorQuaternaryHover: string;
+                        colorQuaternaryPressed: string;
                         color: string;
                         colorHover: string;
                         colorPressed: string;
                         colorFocus: string;
                         colorDisabled: string;
                         textColor: string;
+                        textColorTertiary: string;
                         textColorHover: string;
                         textColorPressed: string;
                         textColorFocus: string;
                         textColorDisabled: string;
                         textColorText: string;
-                        textColorTextDepth1: string;
-                        textColorTextDepth2: string;
-                        textColorTextDepth3: string;
                         textColorTextHover: string;
                         textColorTextPressed: string;
                         textColorTextFocus: string;
@@ -936,9 +970,8 @@ declare const _default: import("vue").DefineComponent<{
                         borderDisabledError: string;
                         rippleColorError: string;
                         waveOpacity: string;
-                        fontWeightText: string;
                         fontWeight: string;
-                        fontWeighGhost: string;
+                        fontWeightStrong: string;
                         paddingTiny: string;
                         paddingSmall: string;
                         paddingMedium: string;
@@ -1104,9 +1137,9 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     value: import("../interface").Value | null;
     active: boolean;
+    dateFormat: string;
     onUpdateValue: import("../interface").OnPanelUpdateValue;
     actions: unknown[];
-    dateFormat: string;
     timeFormat: string;
 } & {
     onTabOut?: Function | undefined;
@@ -1116,8 +1149,8 @@ declare const _default: import("vue").DefineComponent<{
 }>, {
     value: import("../interface").Value | null;
     active: boolean;
-    actions: unknown[];
     dateFormat: string;
+    actions: unknown[];
     timeFormat: string;
 }>;
 export default _default;

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

@@ -1,29 +1,33 @@
-import { VNode } from 'vue';
+import { VNode, PropType } from 'vue';
 import type { MonthItem, YearItem } from '../utils';
 declare const _default: import("vue").DefineComponent<{
-    readonly actions: {
-        readonly type: ArrayConstructor;
+    type: {
+        type: PropType<"month" | "year">;
+        required: true;
+    };
+    actions: {
+        readonly type: PropType<string[]>;
         readonly default: () => string[];
     };
-    readonly active: BooleanConstructor;
-    readonly dateFormat: {
+    active: BooleanConstructor;
+    dateFormat: {
         readonly type: StringConstructor;
         readonly default: "yyyy-MM-dd";
     };
-    readonly timeFormat: {
+    timeFormat: {
         readonly type: StringConstructor;
         readonly default: "HH:mm:ss";
     };
-    readonly value: {
-        readonly type: import("vue").PropType<import("../interface").Value | null>;
+    value: {
+        readonly type: PropType<import("../interface").Value | null>;
         readonly default: null;
     };
-    readonly shortcuts: import("vue").PropType<import("../interface").Shortcuts>;
-    readonly onConfirm: FunctionConstructor;
-    readonly onClose: import("vue").PropType<import("../interface").OnClose>;
-    readonly onTabOut: FunctionConstructor;
-    readonly onUpdateValue: {
-        readonly type: import("vue").PropType<import("../interface").OnPanelUpdateValue>;
+    shortcuts: PropType<import("../interface").Shortcuts>;
+    onConfirm: FunctionConstructor;
+    onClose: PropType<import("../interface").OnClose>;
+    onTabOut: FunctionConstructor;
+    onUpdateValue: {
+        readonly type: PropType<import("../interface").OnPanelUpdateValue>;
         readonly required: true;
     };
 }, {
@@ -31,7 +35,7 @@ declare const _default: import("vue").DefineComponent<{
     handleDateClick: (dateItem: import("../utils").DateItem | MonthItem | YearItem) => void;
     handleDateInputBlur: () => void;
     handleDateInput: (value: string) => void;
-    handleTimePickerChange: (value: number) => void;
+    handleTimePickerChange: (value: number | null) => void;
     clearSelectedDateTime: () => void;
     virtualListContainer: () => HTMLElement;
     virtualListContent: () => HTMLElement;
@@ -130,9 +134,13 @@ declare const _default: import("vue").DefineComponent<{
             tableHeaderColor: string;
             hoverColor: string;
             tableColorHover: string;
+            tableColorStriped: string;
             pressedColor: string;
             opacityDisabled: string;
             inputColorDisabled: string;
+            buttonColor2: string;
+            buttonColor2Hover: string;
+            buttonColor2Pressed: string;
             boxShadow1: string;
             boxShadow2: string;
             boxShadow3: string;
@@ -141,6 +149,12 @@ declare const _default: import("vue").DefineComponent<{
             fontWeight: string;
             fontWeightStrong: string;
             cubicBezierEaseInOut: string;
+            /**
+             * Month Panel
+             * Update picker value on:
+             * 1. item click
+             * 2. clear click
+             */
             cubicBezierEaseOut: string;
             cubicBezierEaseIn: string;
             borderRadius: string;
@@ -206,11 +220,13 @@ declare const _default: import("vue").DefineComponent<{
             calendarLeftPaddingDaterange: string;
             calendarLeftPaddingDatetimerange: string;
             calendarLeftPaddingMonth: string;
+            calendarLeftPaddingYear: string;
             calendarRightPaddingDate: string;
             calendarRightPaddingDatetime: string;
             calendarRightPaddingDaterange: string;
             calendarRightPaddingDatetimerange: string;
             calendarRightPaddingMonth: string;
+            calendarRightPaddingYear: string;
         };
         peers: {
             Input: import("../../../_mixins").Theme<"Input", {
@@ -287,20 +303,30 @@ declare const _default: import("vue").DefineComponent<{
                 fontSizeMedium: string;
                 fontSizeLarge: string;
                 opacityDisabled: string;
+                colorOpacitySecondary: number;
+                colorOpacitySecondaryHover: number;
+                colorOpacitySecondaryPressed: number;
+                colorSecondary: string;
+                colorSecondaryHover: string;
+                colorSecondaryPressed: string;
+                colorTertiary: string;
+                colorTertiaryHover: string;
+                colorTertiaryPressed: string;
+                colorQuaternary: string;
+                colorQuaternaryHover: string;
+                colorQuaternaryPressed: string;
                 color: string;
                 colorHover: string;
                 colorPressed: string;
                 colorFocus: string;
                 colorDisabled: string;
                 textColor: string;
+                textColorTertiary: string;
                 textColorHover: string;
                 textColorPressed: string;
                 textColorFocus: string;
                 textColorDisabled: string;
                 textColorText: string;
-                textColorTextDepth1: string;
-                textColorTextDepth2: string;
-                textColorTextDepth3: string;
                 textColorTextHover: string;
                 textColorTextPressed: string;
                 textColorTextFocus: string;
@@ -447,9 +473,8 @@ declare const _default: import("vue").DefineComponent<{
                 borderDisabledError: string;
                 rippleColorError: string;
                 waveOpacity: string;
-                fontWeightText: string;
                 fontWeight: string;
-                fontWeighGhost: string;
+                fontWeightStrong: string;
                 paddingTiny: string;
                 paddingSmall: string;
                 paddingMedium: string;
@@ -462,12 +487,6 @@ declare const _default: import("vue").DefineComponent<{
                 iconMarginSmall: string;
                 iconMarginMedium: string;
                 iconMarginLarge: string;
-                /**
-                 * Month Panel
-                 * Update picker value on:
-                 * 1. item click
-                 * 2. clear click
-                 */
                 iconSizeTiny: string;
                 iconSizeSmall: string;
                 iconSizeMedium: string;
@@ -509,20 +528,30 @@ declare const _default: import("vue").DefineComponent<{
                     fontSizeMedium: string;
                     fontSizeLarge: string;
                     opacityDisabled: string;
+                    colorOpacitySecondary: number;
+                    colorOpacitySecondaryHover: number;
+                    colorOpacitySecondaryPressed: number;
+                    colorSecondary: string;
+                    colorSecondaryHover: string;
+                    colorSecondaryPressed: string;
+                    colorTertiary: string;
+                    colorTertiaryHover: string;
+                    colorTertiaryPressed: string;
+                    colorQuaternary: string;
+                    colorQuaternaryHover: string;
+                    colorQuaternaryPressed: string;
                     color: string;
                     colorHover: string;
                     colorPressed: string;
                     colorFocus: string;
                     colorDisabled: string;
                     textColor: string;
+                    textColorTertiary: string;
                     textColorHover: string;
                     textColorPressed: string;
                     textColorFocus: string;
                     textColorDisabled: string;
                     textColorText: string;
-                    textColorTextDepth1: string;
-                    textColorTextDepth2: string;
-                    textColorTextDepth3: string;
                     textColorTextHover: string;
                     textColorTextPressed: string;
                     textColorTextFocus: string;
@@ -669,9 +698,8 @@ declare const _default: import("vue").DefineComponent<{
                     borderDisabledError: string;
                     rippleColorError: string;
                     waveOpacity: string;
-                    fontWeightText: string;
                     fontWeight: string;
-                    fontWeighGhost: string;
+                    fontWeightStrong: string;
                     paddingTiny: string;
                     paddingSmall: string;
                     paddingMedium: string;
@@ -684,12 +712,6 @@ declare const _default: import("vue").DefineComponent<{
                     iconMarginSmall: string;
                     iconMarginMedium: string;
                     iconMarginLarge: string;
-                    /**
-                     * Month Panel
-                     * Update picker value on:
-                     * 1. item click
-                     * 2. clear click
-                     */
                     iconSizeTiny: string;
                     iconSizeSmall: string;
                     iconSizeMedium: string;
@@ -793,20 +815,30 @@ declare const _default: import("vue").DefineComponent<{
                         fontSizeMedium: string;
                         fontSizeLarge: string;
                         opacityDisabled: string;
+                        colorOpacitySecondary: number;
+                        colorOpacitySecondaryHover: number;
+                        colorOpacitySecondaryPressed: number;
+                        colorSecondary: string;
+                        colorSecondaryHover: string;
+                        colorSecondaryPressed: string;
+                        colorTertiary: string;
+                        colorTertiaryHover: string;
+                        colorTertiaryPressed: string;
+                        colorQuaternary: string;
+                        colorQuaternaryHover: string;
+                        colorQuaternaryPressed: string;
                         color: string;
                         colorHover: string;
                         colorPressed: string;
                         colorFocus: string;
                         colorDisabled: string;
                         textColor: string;
+                        textColorTertiary: string;
                         textColorHover: string;
                         textColorPressed: string;
                         textColorFocus: string;
                         textColorDisabled: string;
                         textColorText: string;
-                        textColorTextDepth1: string;
-                        textColorTextDepth2: string;
-                        textColorTextDepth3: string;
                         textColorTextHover: string;
                         textColorTextPressed: string;
                         textColorTextFocus: string;
@@ -953,9 +985,8 @@ declare const _default: import("vue").DefineComponent<{
                         borderDisabledError: string;
                         rippleColorError: string;
                         waveOpacity: string;
-                        fontWeightText: string;
                         fontWeight: string;
-                        fontWeighGhost: string;
+                        fontWeightStrong: string;
                         paddingTiny: string;
                         paddingSmall: string;
                         paddingMedium: string;
@@ -968,12 +999,6 @@ declare const _default: import("vue").DefineComponent<{
                         iconMarginSmall: string;
                         iconMarginMedium: string;
                         iconMarginLarge: string;
-                        /**
-                         * Month Panel
-                         * Update picker value on:
-                         * 1. item click
-                         * 2. clear click
-                         */
                         iconSizeTiny: string;
                         iconSizeSmall: string;
                         iconSizeMedium: string;
@@ -1112,22 +1137,24 @@ declare const _default: import("vue").DefineComponent<{
     handleSingleShortcutMouseenter: (shortcut: number | [number, number] | (() => number) | (() => [number, number])) => void;
     handleSingleShortcutClick: (shortcut: number | [number, number] | (() => number) | (() => [number, number])) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly actions?: unknown;
-    readonly active?: unknown;
-    readonly dateFormat?: unknown;
-    readonly timeFormat?: unknown;
-    readonly value?: unknown;
-    readonly shortcuts?: unknown;
-    readonly onConfirm?: unknown;
-    readonly onClose?: unknown;
-    readonly onTabOut?: unknown;
-    readonly onUpdateValue?: unknown;
+    type?: unknown;
+    actions?: unknown;
+    active?: unknown;
+    dateFormat?: unknown;
+    timeFormat?: unknown;
+    value?: unknown;
+    shortcuts?: unknown;
+    onConfirm?: unknown;
+    onClose?: unknown;
+    onTabOut?: unknown;
+    onUpdateValue?: unknown;
 } & {
+    type: "month" | "year";
     value: import("../interface").Value | null;
     active: boolean;
-    onUpdateValue: import("../interface").OnPanelUpdateValue;
-    actions: unknown[];
     dateFormat: string;
+    onUpdateValue: import("../interface").OnPanelUpdateValue;
+    actions: string[];
     timeFormat: string;
 } & {
     onTabOut?: Function | undefined;
@@ -1137,8 +1164,8 @@ declare const _default: import("vue").DefineComponent<{
 }>, {
     value: import("../interface").Value | null;
     active: boolean;
-    actions: unknown[];
     dateFormat: string;
+    actions: string[];
     timeFormat: string;
 }>;
 /**

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

@@ -14,9 +14,12 @@ const config_1 = require("../config");
  */
 exports.default = (0, vue_1.defineComponent)({
     name: 'MonthPanel',
-    props: use_calendar_1.useCalendar.props,
+    props: Object.assign(Object.assign({}, use_calendar_1.useCalendar.props), { type: {
+            type: String,
+            required: true
+        } }),
     setup(props) {
-        const useCalendarRef = (0, use_calendar_1.useCalendar)(props, 'month');
+        const useCalendarRef = (0, use_calendar_1.useCalendar)(props, props.type);
         const renderItem = (item, i, mergedClsPrefix) => {
             const { mergedIsDateDisabled, handleDateClick } = useCalendarRef;
             return ((0, vue_1.h)("div", { "data-n-date": true, key: i, class: [
@@ -35,23 +38,23 @@ exports.default = (0, vue_1.defineComponent)({
         return Object.assign(Object.assign({}, useCalendarRef), { renderItem });
     },
     render() {
-        const { mergedClsPrefix, mergedTheme, shortcuts, actions, renderItem } = this;
+        const { mergedClsPrefix, mergedTheme, shortcuts, actions, renderItem, type } = this;
         return ((0, vue_1.h)("div", { ref: "selfRef", tabindex: 0, class: `${mergedClsPrefix}-date-panel ${mergedClsPrefix}-date-panel--month`, onFocus: this.handlePanelFocus, onKeydown: this.handlePanelKeyDown },
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-month-calendar` },
                 (0, vue_1.h)(_internal_1.NScrollbar, { ref: "scrollbarInstRef", class: `${mergedClsPrefix}-date-panel-month-calendar__picker-col`, theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, container: this.virtualListContainer, content: this.virtualListContent, horizontalRailStyle: { zIndex: 1 }, verticalRailStyle: { zIndex: 1 } }, {
-                    default: () => ((0, vue_1.h)(vueuc_1.VirtualList, { ref: "yearScrollRef", items: this.yearArray, itemSize: config_1.MONTH_ITEM_HEIGHT, showScrollbar: false, keyField: "ts", onScroll: this.handleVirtualListScroll }, {
+                    default: () => ((0, vue_1.h)(vueuc_1.VirtualList, { ref: "yearScrollRef", items: this.yearArray, itemSize: config_1.MONTH_ITEM_HEIGHT, showScrollbar: false, keyField: "ts", onScroll: this.handleVirtualListScroll, paddingBottom: 4 }, {
                         default: ({ item, index }) => {
                             return renderItem(item, index, mergedClsPrefix);
                         }
                     }))
                 }),
-                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-month-calendar__picker-col` },
+                type === 'month' ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-month-calendar__picker-col` },
                     (0, vue_1.h)(_internal_1.NScrollbar, { ref: "monthScrollRef", theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar }, {
                         default: () => [
                             this.monthArray.map((monthItem, i) => renderItem(monthItem, i, mergedClsPrefix)),
                             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-month-calendar__padding` })
                         ]
-                    }))),
+                    }))) : null),
             this.datePickerSlots.footer ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-date-panel-footer` }, {
                 default: this.datePickerSlots.footer
             })) : null,