naive-ui 2.18.1 → 2.19.2

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

@@ -5,10 +5,19 @@ const button_1 = require("../../../button");
 const icons_1 = require("../../../_internal/icons");
 const _internal_1 = require("../../../_internal");
 const use_dual_calendar_1 = require("./use-dual-calendar");
+const _utils_1 = require("../../../_utils");
 exports.default = (0, vue_1.defineComponent)({
     name: 'DateRangePanel',
     props: use_dual_calendar_1.useDualCalendar.props,
     setup(props) {
+        if (process.env.NODE_ENV !== 'production') {
+            (0, vue_1.watchEffect)(() => {
+                var _a;
+                if ((_a = props.actions) === null || _a === void 0 ? void 0 : _a.includes('now')) {
+                    (0, _utils_1.warnOnce)('date-picker', 'The `now` action is not supported for n-date-picker of `daterange` type');
+                }
+            });
+        }
         return (0, use_dual_calendar_1.useDualCalendar)(props, 'daterange');
     },
     render() {

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

@@ -7,10 +7,19 @@ const time_picker_1 = require("../../../time-picker");
 const icons_1 = require("../../../_internal/icons");
 const _internal_1 = require("../../../_internal");
 const use_dual_calendar_1 = require("./use-dual-calendar");
+const _utils_1 = require("../../../_utils");
 exports.default = (0, vue_1.defineComponent)({
     name: 'DateTimeRangePanel',
     props: use_dual_calendar_1.useDualCalendar.props,
     setup(props) {
+        if (process.env.NODE_ENV !== 'production') {
+            (0, vue_1.watchEffect)(() => {
+                var _a;
+                if ((_a = props.actions) === null || _a === void 0 ? void 0 : _a.includes('now')) {
+                    (0, _utils_1.warnOnce)('date-picker', 'The `now` action is not supported for n-date-picker of `datetimerange` type');
+                }
+            });
+        }
         return (0, use_dual_calendar_1.useDualCalendar)(props, 'datetimerange');
     },
     render() {

package/lib/descriptions/src/Descriptions.d.ts

@@ -6,10 +6,7 @@ declare const descriptionProps: {
         readonly type: NumberConstructor;
         readonly default: 3;
     };
-    readonly columns: {
-        readonly type: NumberConstructor;
-        readonly default: undefined;
-    };
+    readonly columns: NumberConstructor;
     readonly labelPlacement: {
         readonly type: PropType<"left" | "top">;
         readonly default: "top";
@@ -22,10 +19,7 @@ declare const descriptionProps: {
         readonly type: PropType<"small" | "medium" | "large">;
         readonly default: "medium";
     };
-    readonly bordered: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
+    readonly bordered: BooleanConstructor;
     readonly labelStyle: PropType<string | CSSProperties>;
     readonly contentStyle: PropType<string | CSSProperties>;
     readonly theme: PropType<import("../../_mixins").Theme<"Descriptions", {
@@ -129,10 +123,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: NumberConstructor;
         readonly default: 3;
     };
-    readonly columns: {
-        readonly type: NumberConstructor;
-        readonly default: undefined;
-    };
+    readonly columns: NumberConstructor;
     readonly labelPlacement: {
         readonly type: PropType<"left" | "top">;
         readonly default: "top";
@@ -145,10 +136,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<"small" | "medium" | "large">;
         readonly default: "medium";
     };
-    readonly bordered: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
+    readonly bordered: BooleanConstructor;
     readonly labelStyle: PropType<string | CSSProperties>;
     readonly contentStyle: PropType<string | CSSProperties>;
     readonly theme: PropType<import("../../_mixins").Theme<"Descriptions", {
@@ -387,7 +375,6 @@ declare const _default: import("vue").DefineComponent<{
 }>, {
     column: number;
     size: "small" | "medium" | "large";
-    columns: number;
     bordered: boolean;
     labelPlacement: "left" | "top";
     labelAlign: "left" | "right" | "center";

package/lib/descriptions/src/Descriptions.js

@@ -10,10 +10,7 @@ const index_cssr_1 = require("./styles/index.cssr");
 const descriptionProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { title: String, column: {
         type: Number,
         default: 3
-    }, columns: {
-        type: Number,
-        default: undefined
-    }, labelPlacement: {
+    }, columns: Number, labelPlacement: {
         type: String,
         default: 'top'
     }, labelAlign: {
@@ -22,10 +19,7 @@ const descriptionProps = Object.assign(Object.assign({}, _mixins_1.useTheme.prop
     }, size: {
         type: String,
         default: 'medium'
-    }, bordered: {
-        type: Boolean,
-        default: false
-    }, labelStyle: [Object, String], contentStyle: [Object, String] });
+    }, bordered: Boolean, labelStyle: [Object, String], contentStyle: [Object, String] });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Descriptions',
     props: descriptionProps,

package/lib/dialog/src/DialogProvider.d.ts

@@ -1,9 +1,9 @@
 import { ExtractPropTypes, PropType, InjectionKey, Ref, CSSProperties } from 'vue';
-import type { ExtractPublicPropTypes } from '../../_utils';
+import type { ExtractPublicPropTypes, Mutable } from '../../_utils';
 import { exposedDialogEnvProps } from './DialogEnvironment';
-export declare type DialogOptions = Omit<Partial<ExtractPropTypes<typeof exposedDialogEnvProps>>, 'internalStyle'> & {
+export declare type DialogOptions = Mutable<Omit<Partial<ExtractPropTypes<typeof exposedDialogEnvProps>>, 'internalStyle'> & {
     style?: string | CSSProperties;
-};
+}>;
 export declare type DialogReactive = {
     readonly key: string;
     readonly destroy: () => void;
@@ -41,23 +41,23 @@ declare const _default: import("vue").DefineComponent<{
     dialogList: Ref<{
         readonly key: string;
         readonly destroy: () => void;
-        readonly type?: "default" | "error" | "info" | "success" | "warning" | undefined;
-        readonly content?: string | (() => import("vue").VNodeChild) | undefined;
-        readonly icon?: (() => import("vue").VNodeChild) | undefined;
-        readonly title?: string | (() => import("vue").VNodeChild) | undefined;
-        readonly action?: (() => import("vue").VNodeChild) | undefined;
-        readonly bordered?: boolean | undefined;
-        readonly loading?: boolean | undefined;
-        readonly onClose?: (() => unknown) | undefined;
-        readonly closable?: boolean | undefined;
-        readonly showIcon?: boolean | undefined;
-        readonly iconPlacement?: import("./interface").IconPlacement | undefined;
-        readonly negativeText?: string | undefined;
-        readonly positiveText?: string | undefined;
-        readonly onPositiveClick?: ((e: MouseEvent) => unknown) | undefined;
-        readonly onNegativeClick?: ((e: MouseEvent) => unknown) | undefined;
-        readonly onMaskClick?: ((e: MouseEvent) => void) | undefined;
-        readonly maskClosable?: boolean | undefined;
+        type?: "default" | "error" | "info" | "success" | "warning" | undefined;
+        content?: string | (() => import("vue").VNodeChild) | undefined;
+        icon?: (() => import("vue").VNodeChild) | undefined;
+        title?: string | (() => import("vue").VNodeChild) | undefined;
+        action?: (() => import("vue").VNodeChild) | undefined;
+        bordered?: boolean | undefined;
+        loading?: boolean | undefined;
+        onClose?: (() => unknown) | undefined;
+        closable?: boolean | undefined;
+        showIcon?: boolean | undefined;
+        iconPlacement?: import("./interface").IconPlacement | undefined;
+        negativeText?: string | undefined;
+        positiveText?: string | undefined;
+        onPositiveClick?: ((e: MouseEvent) => unknown) | undefined;
+        onNegativeClick?: ((e: MouseEvent) => unknown) | undefined;
+        onMaskClick?: ((e: MouseEvent) => void) | undefined;
+        maskClosable?: boolean | undefined;
         style?: any;
     }[]>;
     dialogInstRefs: Record<string, DialogInst>;

package/lib/drawer/src/styles/index.cssr.js

@@ -70,6 +70,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('drawer', `
  font-size: var(--title-font-size);
  color: var(--title-text-color);
  padding: var(--header-padding);
+ transition: border .3s var(--bezier);
  border-bottom: 1px solid var(--divider-color);
  border-bottom: var(--header-border-bottom);
  display: flex;
@@ -82,6 +83,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('drawer', `
  display: flex;
  justify-content: flex-end;
  border-top: var(--footer-border-top);
+ transition: border .3s var(--bezier);
  padding: var(--footer-padding);
  `)]), (0, cssr_1.cM)('right-placement', `
  top: 0;

package/lib/dropdown/src/Dropdown.d.ts

@@ -297,16 +297,9 @@ declare const dropdownProps: {
     readonly onClickoutside: PropType<(e: MouseEvent) => void>;
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
-    readonly onShow: {
-        type: PropType<MaybeArray<(value: boolean) => void> | undefined>;
-        validator: () => boolean;
-        default: undefined;
-    };
-    readonly onHide: {
-        type: PropType<MaybeArray<(value: boolean) => void> | undefined>;
-        validator: () => boolean;
-        default: undefined;
-    };
+    readonly zIndex: NumberConstructor;
+    readonly onShow: PropType<MaybeArray<(value: boolean) => void> | undefined>;
+    readonly onHide: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly arrow: {
         type: PropType<boolean | undefined>;
         default: undefined;
@@ -595,16 +588,9 @@ declare const _default: import("vue").DefineComponent<{
     readonly onClickoutside: PropType<(e: MouseEvent) => void>;
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
-    readonly onShow: {
-        type: PropType<MaybeArray<(value: boolean) => void> | undefined>;
-        validator: () => boolean;
-        default: undefined;
-    };
-    readonly onHide: {
-        type: PropType<MaybeArray<(value: boolean) => void> | undefined>;
-        validator: () => boolean;
-        default: undefined;
-    };
+    readonly zIndex: NumberConstructor;
+    readonly onShow: PropType<MaybeArray<(value: boolean) => void> | undefined>;
+    readonly onHide: PropType<MaybeArray<(value: boolean) => void> | undefined>;
     readonly arrow: {
         type: PropType<boolean | undefined>;
         default: undefined;
@@ -830,6 +816,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly onClickoutside?: unknown;
     readonly 'onUpdate:show'?: unknown;
     readonly onUpdateShow?: unknown;
+    readonly zIndex?: unknown;
     readonly onShow?: unknown;
     readonly onHide?: unknown;
     readonly arrow?: unknown;
@@ -861,6 +848,7 @@ declare const _default: import("vue").DefineComponent<{
     maxWidth?: number | undefined;
     minWidth?: number | undefined;
     width?: number | "trigger" | undefined;
+    zIndex?: number | undefined;
     onSelect?: MaybeArray<OnUpdateValue> | undefined;
     theme?: import("../../_mixins").Theme<"Dropdown", {
         optionHeightSmall: string;
@@ -1072,6 +1060,7 @@ declare const _default: import("vue").DefineComponent<{
             padding: string;
         }, any>;
     }>> | undefined;
+    renderIcon?: RenderIcon | undefined;
     renderLabel?: RenderLabel | undefined;
     arrowStyle?: string | CSSProperties | undefined;
     onClickoutside?: ((e: MouseEvent) => void) | undefined;
@@ -1081,7 +1070,6 @@ declare const _default: import("vue").DefineComponent<{
     onShow?: MaybeArray<(value: boolean) => void> | undefined;
     onHide?: MaybeArray<(value: boolean) => void> | undefined;
     arrow?: boolean | undefined;
-    renderIcon?: RenderIcon | undefined;
 }>, {
     size: "small" | "medium" | "large" | "huge";
     show: boolean | undefined;
@@ -1099,8 +1087,6 @@ declare const _default: import("vue").DefineComponent<{
     animated: boolean;
     defaultShow: boolean;
     internalExtraClass: string[];
-    onShow: MaybeArray<(value: boolean) => void> | undefined;
-    onHide: MaybeArray<(value: boolean) => void> | undefined;
     arrow: boolean | undefined;
     options: DropdownMixedOption[];
     keyboard: boolean;

package/lib/dynamic-tags/src/DynamicTags.js

@@ -54,7 +54,8 @@ exports.default = (0, vue_1.defineComponent)({
             return (0, _utils_1.smallerSize)(props.size);
         });
         const triggerDisabledRef = (0, vue_1.computed)(() => {
-            return !!props.max && mergedValueRef.value.length >= props.max;
+            return (mergedDisabledRef.value ||
+                (!!props.max && mergedValueRef.value.length >= props.max));
         });
         function doChange(value) {
             const { onChange, 'onUpdate:value': _onUpdateValue, onUpdateValue } = props;

package/lib/empty/src/Empty.d.ts

@@ -1,4 +1,4 @@
-import { PropType } from 'vue';
+import { PropType, VNodeChild } from 'vue';
 import { ExtractPublicPropTypes } from '../../_utils';
 declare const emptyProps: {
     description: {
@@ -13,6 +13,7 @@ declare const emptyProps: {
         type: PropType<"small" | "medium" | "large" | "huge">;
         default: string;
     };
+    renderIcon: PropType<() => VNodeChild>;
     theme: PropType<import("../../_mixins").Theme<"Empty", {
         fontSizeSmall: string;
         fontSizeMedium: string;
@@ -67,6 +68,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<"small" | "medium" | "large" | "huge">;
         default: string;
     };
+    renderIcon: PropType<() => VNodeChild>;
     theme: PropType<import("../../_mixins").Theme<"Empty", {
         fontSizeSmall: string;
         fontSizeMedium: string;
@@ -108,6 +110,7 @@ declare const _default: import("vue").DefineComponent<{
     }, any>>>;
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
+    mergedRenderIcon: import("vue").ComputedRef<() => VNodeChild>;
     localizedDescription: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
         '--icon-size': string;
@@ -121,6 +124,7 @@ declare const _default: import("vue").DefineComponent<{
     description?: unknown;
     showDescription?: unknown;
     size?: unknown;
+    renderIcon?: unknown;
     theme?: unknown;
     themeOverrides?: unknown;
     builtinThemeOverrides?: unknown;
@@ -168,6 +172,7 @@ declare const _default: import("vue").DefineComponent<{
         iconSizeLarge: string;
         iconSizeHuge: string;
     }, any>> | undefined;
+    renderIcon?: (() => VNodeChild) | undefined;
 }>, {
     description: string;
     size: "small" | "medium" | "large" | "huge";

package/lib/empty/src/Empty.js

@@ -7,6 +7,7 @@ const _utils_1 = require("../../_utils");
 const _internal_1 = require("../../_internal");
 const styles_1 = require("../styles");
 const index_cssr_1 = require("./styles/index.cssr");
+const ConfigProvider_1 = require("../../config-provider/src/ConfigProvider");
 const emptyProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { description: {
         type: String,
         default: undefined
@@ -16,7 +17,7 @@ const emptyProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), {
     }, size: {
         type: String,
         default: 'medium'
-    } });
+    }, renderIcon: Function });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Empty',
     props: emptyProps,
@@ -24,10 +25,21 @@ exports.default = (0, vue_1.defineComponent)({
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('Empty', 'Empty', index_cssr_1.default, styles_1.emptyLight, props, mergedClsPrefixRef);
         const { localeRef } = (0, _mixins_1.useLocale)('Empty');
+        const NConfigProvider = (0, vue_1.inject)(ConfigProvider_1.configProviderInjectionKey, null);
+        const mergedDescriptionRef = (0, vue_1.computed)(() => {
+            var _a, _b, _c;
+            return ((_a = props.description) !== null && _a !== void 0 ? _a : (_c = (_b = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef.value) === null || _b === void 0 ? void 0 : _b.Empty) === null || _c === void 0 ? void 0 : _c.description);
+        });
+        const mergedRenderIconRef = (0, vue_1.computed)(() => {
+            var _a, _b;
+            return ((_b = (_a = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.Empty) === null || _b === void 0 ? void 0 : _b.renderIcon) ||
+                (() => (0, vue_1.h)(icons_1.EmptyIcon, null));
+        });
         return {
             mergedClsPrefix: mergedClsPrefixRef,
+            mergedRenderIcon: mergedRenderIconRef,
             localizedDescription: (0, vue_1.computed)(() => {
-                return props.description || localeRef.value.description;
+                return mergedDescriptionRef.value || localeRef.value.description;
             }),
             cssVars: (0, vue_1.computed)(() => {
                 const { size } = props;
@@ -47,7 +59,7 @@ exports.default = (0, vue_1.defineComponent)({
         const { $slots, mergedClsPrefix } = this;
         return ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty`, style: this.cssVars },
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty__icon` }, (0, vue_1.renderSlot)($slots, 'icon', undefined, () => [
-                (0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: () => (0, vue_1.h)(icons_1.EmptyIcon, null) })
+                (0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, { default: this.mergedRenderIcon })
             ])),
             this.showDescription ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-empty__description` }, (0, vue_1.renderSlot)($slots, 'default', undefined, () => [
                 this.localizedDescription

package/lib/form/src/FormItemGridItem.d.ts

@@ -137,7 +137,7 @@ export declare const formItemGiProps: {
         readonly default: true;
     };
 };
-export declare const formItemGiPropKeys: ("label" | "size" | "first" | "offset" | "span" | "required" | "path" | "suffix" | "theme" | "themeOverrides" | "builtinThemeOverrides" | "labelPlacement" | "labelAlign" | "labelStyle" | "labelWidth" | "showRequireMark" | "requireMarkPlacement" | "showFeedback" | "showLabel" | "rulePath" | "rule" | "ignorePathChange" | "validationStatus" | "feedback" | "privateColStart" | "privateShow" | "privateSpan" | "privateOffset")[];
+export declare const formItemGiPropKeys: ("label" | "size" | "first" | "offset" | "span" | "required" | "path" | "theme" | "themeOverrides" | "builtinThemeOverrides" | "suffix" | "labelPlacement" | "labelAlign" | "labelStyle" | "labelWidth" | "showRequireMark" | "requireMarkPlacement" | "showFeedback" | "showLabel" | "rulePath" | "rule" | "ignorePathChange" | "validationStatus" | "feedback" | "privateColStart" | "privateShow" | "privateSpan" | "privateOffset")[];
 export declare type FormItemGiProps = ExtractPublicPropTypes<typeof formItemGiProps>;
 declare const _default: import("vue").DefineComponent<{
     readonly label: StringConstructor;

package/lib/form/src/FormItemGridItem.js

@@ -12,7 +12,7 @@ exports.default = (0, vue_1.defineComponent)({
     name: 'FormItemGridItem',
     alias: ['FormItemGi'],
     props: exports.formItemGiProps,
-    setup(props) {
+    setup() {
         const formItemInstRef = (0, vue_1.ref)(null);
         const validate = ((...args) => {
             const { value } = formItemInstRef;
@@ -32,7 +32,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        return (0, vue_1.h)(GridItem_1.default, (0, _utils_1.keep)(this.$props, GridItem_1.gridItemPropKeys), {
+        return (0, vue_1.h)(GridItem_1.default, (0, _utils_1.keep)(this.$.vnode.props || {}, GridItem_1.gridItemPropKeys), {
             default: () => {
                 const itemProps = (0, _utils_1.keep)(this.$props, FormItem_1.formItemPropKeys);
                 return (0, vue_1.h)(FormItem_1.default, Object.assign({ ref: 'formItemInstRef' }, itemProps), this.$slots);

package/lib/global-style/src/GlobalStyle.js

@@ -12,6 +12,7 @@ exports.default = (0, vue_1.defineComponent)({
         const { body } = document;
         const { style } = body;
         let styleApplied = false;
+        let firstApply = true;
         (0, vue_1.onBeforeMount)(() => {
             (0, vue_1.watchEffect)(() => {
                 var _a, _b;
@@ -19,14 +20,23 @@ exports.default = (0, vue_1.defineComponent)({
                     ? (0, lodash_1.merge)({}, ((_a = NConfigProvider.mergedThemeRef.value) === null || _a === void 0 ? void 0 : _a.common) || common_1.commonLight, (_b = NConfigProvider.mergedThemeOverridesRef.value) === null || _b === void 0 ? void 0 : _b.common)
                     : common_1.commonLight;
                 if (styleApplied || !body.hasAttribute('n-styled')) {
-                    body.setAttribute('n-styled', '');
-                    styleApplied = true;
                     style.backgroundColor = bodyColor;
                     style.color = textColor2;
                     style.fontSize = fontSize;
                     style.fontFamily = fontFamily;
                     style.lineHeight = lineHeight;
-                    style.transition = `color .3s ${cubicBezierEaseInOut}, background-color .3s ${cubicBezierEaseInOut}`;
+                    const transition = `color .3s ${cubicBezierEaseInOut}, background-color .3s ${cubicBezierEaseInOut}`;
+                    if (firstApply) {
+                        setTimeout(() => {
+                            style.transition = transition;
+                        }, 0);
+                    }
+                    else {
+                        style.transition = transition;
+                    }
+                    body.setAttribute('n-styled', '');
+                    styleApplied = true;
+                    firstApply = false;
                 }
                 else if (process.env.NODE_ENV !== 'production') {
                     (0, _utils_1.warn)('global-style', 'More than one n-global-style exist in the document.body. Only the first mounted one will work.');

package/lib/grid/src/GridItem.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, PropType } from 'vue';
+import { PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
 export declare const defaultSpan = 1;
 export declare const gridItemProps: {
@@ -40,7 +40,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {
     overflow: import("vue").Ref<boolean>;
-    itemStyle: import("vue").Ref<string | CSSProperties | undefined>;
+    itemStyle: import("vue").Ref<string | import("vue").CSSProperties | undefined>;
     deriveStyle: () => {
         display: string;
         gridColumn: string;

package/lib/grid/src/GridItem.js

@@ -31,7 +31,7 @@ exports.default = (0, vue_1.defineComponent)({
     name: 'GridItem',
     alias: ['Gi'],
     props: exports.gridItemProps,
-    setup(props) {
+    setup() {
         const { xGapRef, itemStyleRef, overflowRef
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
          } = (0, vue_1.inject)(Grid_1.gridInjectionKey);

package/lib/input-number/src/InputNumber.d.ts

@@ -7,7 +7,7 @@ declare const inputNumberProps: {
         type: PropType<number | null>;
         default: null;
     };
-    value: NumberConstructor;
+    value: PropType<number | null>;
     step: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -28,6 +28,7 @@ declare const inputNumberProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    readonly: BooleanConstructor;
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
@@ -824,7 +825,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<number | null>;
         default: null;
     };
-    value: NumberConstructor;
+    value: PropType<number | null>;
     step: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -845,6 +846,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    readonly: BooleanConstructor;
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
@@ -2063,6 +2065,7 @@ declare const _default: import("vue").DefineComponent<{
     validator?: unknown;
     bordered?: unknown;
     showButton?: unknown;
+    readonly?: unknown;
     clearable?: unknown;
     'onUpdate:value'?: unknown;
     onUpdateValue?: unknown;
@@ -2074,12 +2077,13 @@ declare const _default: import("vue").DefineComponent<{
     themeOverrides?: unknown;
     builtinThemeOverrides?: unknown;
 } & {
+    readonly: boolean;
     step: string | number;
     clearable: boolean;
     defaultValue: number | null;
     showButton: boolean;
 } & {
-    value?: number | undefined;
+    value?: number | null | undefined;
     size?: "small" | "medium" | "large" | undefined;
     disabled?: boolean | undefined;
     onFocus?: MaybeArray<(e: FocusEvent) => void> | undefined;
@@ -2871,6 +2875,7 @@ declare const _default: import("vue").DefineComponent<{
     "onUpdate:value"?: MaybeArray<OnUpdateValue> | undefined;
     onUpdateValue?: MaybeArray<OnUpdateValue> | undefined;
 }>, {
+    readonly: boolean;
     disabled: boolean | undefined;
     step: string | number;
     onChange: MaybeArray<OnUpdateValue> | undefined;

package/lib/input-number/src/InputNumber.js

@@ -27,7 +27,7 @@ const inputNumberProps = Object.assign(Object.assign({}, _mixins_1.useTheme.prop
     }, showButton: {
         type: Boolean,
         default: true
-    }, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onFocus: [Function, Array], onBlur: [Function, Array], onClear: [Function, Array], 
+    }, readonly: Boolean, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onFocus: [Function, Array], onBlur: [Function, Array], onClear: [Function, Array], 
     // deprecated
     onChange: {
         type: [Function, Array],
@@ -358,18 +358,18 @@ exports.default = (0, vue_1.defineComponent)({
     render() {
         const { mergedClsPrefix } = this;
         return ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-input-number` },
-            (0, vue_1.h)(input_1.NInput, { ref: "inputInstRef", bordered: this.mergedBordered, value: this.displayedValue, onUpdateValue: this.handleUpdateDisplayedValue, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, builtinThemeOverrides: this.inputThemeOverrides, size: this.mergedSize, placeholder: this.mergedPlaceholder, disabled: this.mergedDisabled, textDecoration: this.displayedValueInvalid ? 'line-through' : undefined, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeydown: this.handleKeyDown, onMousedown: this.handleMouseDown, onClear: this.handleClear, clearable: this.clearable }, {
+            (0, vue_1.h)(input_1.NInput, { ref: "inputInstRef", bordered: this.mergedBordered, value: this.displayedValue, onUpdateValue: this.handleUpdateDisplayedValue, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, builtinThemeOverrides: this.inputThemeOverrides, size: this.mergedSize, placeholder: this.mergedPlaceholder, disabled: this.mergedDisabled, readonly: this.readonly, textDecoration: this.displayedValueInvalid ? 'line-through' : undefined, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeydown: this.handleKeyDown, onMousedown: this.handleMouseDown, onClear: this.handleClear, clearable: this.clearable }, {
                 _: 2,
                 prefix: this.$slots.prefix,
                 suffix: this.showButton
                     ? () => [
                         this.$slots.suffix && ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-input-number-suffix` }, { default: this.$slots.suffix })),
-                        (0, vue_1.h)(button_1.NButton, { text: true, disabled: !this.minusable || this.mergedDisabled, focusable: false, builtinThemeOverrides: this.buttonThemeOverrides, onClick: this.handleMinusClick, ref: "minusButtonInstRef" }, {
+                        (0, vue_1.h)(button_1.NButton, { text: true, disabled: !this.minusable || this.mergedDisabled || this.readonly, focusable: false, builtinThemeOverrides: this.buttonThemeOverrides, onClick: this.handleMinusClick, ref: "minusButtonInstRef" }, {
                             default: () => ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
                                 default: () => (0, vue_1.h)(icons_1.RemoveIcon, null)
                             }))
                         }),
-                        (0, vue_1.h)(button_1.NButton, { text: true, disabled: !this.addable || this.mergedDisabled, focusable: false, builtinThemeOverrides: this.buttonThemeOverrides, onClick: this.handleAddClick, ref: "addButtonInstRef" }, {
+                        (0, vue_1.h)(button_1.NButton, { text: true, disabled: !this.addable || this.mergedDisabled || this.readonly, focusable: false, builtinThemeOverrides: this.buttonThemeOverrides, onClick: this.handleAddClick, ref: "addButtonInstRef" }, {
                             default: () => ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix }, {
                                 default: () => (0, vue_1.h)(icons_1.AddIcon, null)
                             }))

package/lib/jest-setup.js

@@ -1,3 +1,5 @@
 "use strict";
 // https://github.com/jsdom/jsdom/issues/1422
-HTMLDivElement.prototype.scrollTo = () => { };
+if (typeof window !== 'undefined') {
+    HTMLDivElement.prototype.scrollTo = () => { };
+}