naive-ui 2.41.1 → 2.43.0

package/es/modal/src/Modal.d.ts

@@ -25,6 +25,10 @@ export declare const modalProps: {
     onBeforeHide: PropType<() => void>;
     onAfterHide: PropType<() => void>;
     onHide: PropType<(value: false) => void>;
+    unstableShowMask: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"info" | "success" | "warning" | "error" | "default">;
@@ -54,6 +58,7 @@ export declare const modalProps: {
     contentStyle: PropType<string | CSSProperties>;
     actionClass: PropType<string | Array<string | undefined>>;
     actionStyle: PropType<string | CSSProperties>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -62,7 +67,7 @@ export declare const modalProps: {
     footerStyle: PropType<CSSProperties | string>;
     embedded: BooleanConstructor;
     segmented: {
-        readonly type: PropType<boolean | import("../../card").CardSegmented>;
+        readonly type: PropType<boolean | import("../..").CardSegmented>;
         readonly default: false;
     };
     size: {
@@ -79,7 +84,7 @@ export declare const modalProps: {
     footer: PropType<() => import("vue").VNodeChild>;
     headerExtra: PropType<() => import("vue").VNodeChild>;
     show: BooleanConstructor;
-    unstableShowMask: {
+    showMask: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -1019,6 +1024,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     onBeforeHide: PropType<() => void>;
     onAfterHide: PropType<() => void>;
     onHide: PropType<(value: false) => void>;
+    unstableShowMask: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"info" | "success" | "warning" | "error" | "default">;
@@ -1048,6 +1057,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     contentStyle: PropType<string | CSSProperties>;
     actionClass: PropType<string | Array<string | undefined>>;
     actionStyle: PropType<string | CSSProperties>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -1056,7 +1066,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     footerStyle: PropType<CSSProperties | string>;
     embedded: BooleanConstructor;
     segmented: {
-        readonly type: PropType<boolean | import("../../card").CardSegmented>;
+        readonly type: PropType<boolean | import("../..").CardSegmented>;
         readonly default: false;
     };
     size: {
@@ -1073,7 +1083,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     footer: PropType<() => import("vue").VNodeChild>;
     headerExtra: PropType<() => import("vue").VNodeChild>;
     show: BooleanConstructor;
-    unstableShowMask: {
+    showMask: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -2028,6 +2038,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     onBeforeHide: PropType<() => void>;
     onAfterHide: PropType<() => void>;
     onHide: PropType<(value: false) => void>;
+    unstableShowMask: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"info" | "success" | "warning" | "error" | "default">;
@@ -2057,6 +2071,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     contentStyle: PropType<string | CSSProperties>;
     actionClass: PropType<string | Array<string | undefined>>;
     actionStyle: PropType<string | CSSProperties>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -2065,7 +2080,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     footerStyle: PropType<CSSProperties | string>;
     embedded: BooleanConstructor;
     segmented: {
-        readonly type: PropType<boolean | import("../../card").CardSegmented>;
+        readonly type: PropType<boolean | import("../..").CardSegmented>;
         readonly default: false;
     };
     size: {
@@ -2082,7 +2097,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     footer: PropType<() => import("vue").VNodeChild>;
     headerExtra: PropType<() => import("vue").VNodeChild>;
     show: BooleanConstructor;
-    unstableShowMask: {
+    showMask: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -2994,27 +3009,29 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }, any>;
     }>>>;
 }>> & Readonly<{}>, {
-    type: "error" | "default" | "info" | "success" | "warning";
+    type: "error" | "default" | "info" | "warning" | "success";
     tag: keyof HTMLElementTagNameMap;
     size: "small" | "medium" | "large" | "huge";
     show: boolean;
     transformOrigin: "center" | "mouse";
     loading: boolean;
     autoFocus: boolean;
-    bordered: boolean;
     showIcon: boolean;
+    bordered: boolean;
     closable: boolean;
-    displayDirective: "show" | "if";
-    hoverable: boolean;
     embedded: boolean;
-    segmented: boolean | import("../../card").CardSegmented;
+    segmented: boolean | import("../..").CardSegmented;
+    hoverable: boolean;
+    closeFocusable: boolean;
+    displayDirective: "show" | "if";
+    blockScroll: boolean;
+    closeOnEsc: boolean;
+    maskClosable: boolean;
+    showMask: boolean;
+    trapFocus: boolean;
     internalDialog: boolean;
     internalModal: boolean;
     internalAppear: boolean | undefined;
     unstableShowMask: boolean;
-    maskClosable: boolean;
-    trapFocus: boolean;
-    closeOnEsc: boolean;
-    blockScroll: boolean;
 }, SlotsType<ModalSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/modal/src/Modal.mjs

@@ -13,7 +13,7 @@ import { presetProps, presetPropsKeys } from "./presetProps.mjs";
 import style from "./styles/index.cssr.mjs";
 export const modalProps = Object.assign(Object.assign(Object.assign(Object.assign({}, useTheme.props), {
   show: Boolean,
-  unstableShowMask: {
+  showMask: {
     type: Boolean,
     default: true
   },
@@ -72,7 +72,11 @@ export const modalProps = Object.assign(Object.assign(Object.assign(Object.assig
   overlayStyle: [String, Object],
   onBeforeHide: Function,
   onAfterHide: Function,
-  onHide: Function
+  onHide: Function,
+  unstableShowMask: {
+    type: Boolean,
+    default: undefined
+  }
 });
 export default defineComponent({
   name: 'Modal',
@@ -93,6 +97,9 @@ export default defineComponent({
       if (props.overlayStyle) {
         warnOnce('modal', '`overlay-style` is deprecated, please use `style` instead.');
       }
+      if (props.unstableShowMask) {
+        warnOnce('modal', '`unstable-show-mask` has been removed, please use `show-mask` instead.');
+      }
     }
     const containerRef = ref(null);
     const {
@@ -275,7 +282,7 @@ export default defineComponent({
         var _a;
         (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
         const {
-          unstableShowMask
+          showMask
         } = this;
         return withDirectives(h("div", {
           role: "none",
@@ -292,7 +299,8 @@ export default defineComponent({
           autoFocus: this.autoFocus,
           trapFocus: this.trapFocus,
           draggable: this.draggable,
-          blockScroll: this.blockScroll
+          blockScroll: this.blockScroll,
+          maskHidden: !showMask
         }, this.presetProps, {
           onEsc: this.handleEsc,
           onClose: this.handleCloseClick,
@@ -301,8 +309,8 @@ export default defineComponent({
           onBeforeLeave: this.handleBeforeLeave,
           onAfterEnter: this.onAfterEnter,
           onAfterLeave: this.handleAfterLeave,
-          onClickoutside: unstableShowMask ? undefined : this.handleClickoutside,
-          renderMask: unstableShowMask ? () => {
+          onClickoutside: showMask ? undefined : this.handleClickoutside,
+          renderMask: showMask ? () => {
             var _a;
             return h(Transition, {
               name: "fade-in-transition",

package/es/modal/src/ModalEnvironment.d.ts

@@ -29,6 +29,10 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     onBeforeHide: PropType<() => void>;
     onAfterHide: PropType<() => void>;
     onHide: PropType<(value: false) => void>;
+    unstableShowMask: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"info" | "success" | "warning" | "error" | "default">;
@@ -58,6 +62,7 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     contentStyle: PropType<string | import("vue").CSSProperties>;
     actionClass: PropType<string | Array<string | undefined>>;
     actionStyle: PropType<string | import("vue").CSSProperties>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<import("vue").CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -83,7 +88,7 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     footer: PropType<() => import("vue").VNodeChild>;
     headerExtra: PropType<() => import("vue").VNodeChild>;
     show: BooleanConstructor;
-    unstableShowMask: {
+    showMask: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -1034,6 +1039,10 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     onBeforeHide: PropType<() => void>;
     onAfterHide: PropType<() => void>;
     onHide: PropType<(value: false) => void>;
+    unstableShowMask: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"info" | "success" | "warning" | "error" | "default">;
@@ -1063,6 +1072,7 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     contentStyle: PropType<string | import("vue").CSSProperties>;
     actionClass: PropType<string | Array<string | undefined>>;
     actionStyle: PropType<string | import("vue").CSSProperties>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<import("vue").CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -1088,7 +1098,7 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
     footer: PropType<() => import("vue").VNodeChild>;
     headerExtra: PropType<() => import("vue").VNodeChild>;
     show: BooleanConstructor;
-    unstableShowMask: {
+    showMask: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -2000,26 +2010,28 @@ export declare const NModalEnvironment: import("vue").DefineComponent<import("vu
         }, any>;
     }>>>;
 }>> & Readonly<{}>, {
-    type: "error" | "default" | "info" | "success" | "warning";
+    type: "error" | "default" | "info" | "warning" | "success";
     tag: keyof HTMLElementTagNameMap;
     size: "small" | "medium" | "large" | "huge";
     show: boolean;
     transformOrigin: "center" | "mouse";
     loading: boolean;
     autoFocus: boolean;
-    bordered: boolean;
     showIcon: boolean;
+    bordered: boolean;
     closable: boolean;
-    displayDirective: "show" | "if";
-    hoverable: boolean;
     embedded: boolean;
     segmented: boolean | import("../..").CardSegmented;
+    hoverable: boolean;
+    closeFocusable: boolean;
+    displayDirective: "show" | "if";
+    blockScroll: boolean;
+    closeOnEsc: boolean;
+    maskClosable: boolean;
+    showMask: boolean;
+    trapFocus: boolean;
     internalDialog: boolean;
     internalModal: boolean;
     internalAppear: boolean | undefined;
     unstableShowMask: boolean;
-    maskClosable: boolean;
-    trapFocus: boolean;
-    closeOnEsc: boolean;
-    blockScroll: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/es/modal/src/ModalEnvironment.mjs

@@ -119,6 +119,6 @@ export const NModalEnvironment = defineComponent({
       onAfterLeave: handleAfterLeave,
       internalAppear: true,
       internalModal: true
-    }));
+    }), this.$slots);
   }
 });

package/es/modal/src/ModalProvider.d.ts

@@ -1,9 +1,10 @@
-import type { CSSProperties, DefineComponent, ExtractPropTypes, PropType, Ref } from 'vue';
+import type { CSSProperties, DefineComponent, ExtractPropTypes, PropType, Ref, VNodeChild } from 'vue';
 import type { ExtractPublicPropTypes, Mutable } from '../../_utils';
 import type { modalProps } from './Modal';
 export type ModalOptions = Mutable<Omit<Partial<ExtractPropTypes<typeof modalProps>>, 'internalStyle'> & {
     class?: any;
     style?: string | CSSProperties;
+    render?: () => VNodeChild;
 }>;
 export type ModalReactive = {
     readonly key: string;

package/es/modal/src/ModalProvider.mjs

@@ -56,7 +56,7 @@ export const NModalProvider = defineComponent({
     var _a, _b;
     return h(Fragment, null, [this.modalList.map(modal => {
       var _a;
-      return h(NModalEnvironment, omit(modal, ['destroy'], {
+      return h(NModalEnvironment, omit(modal, ['destroy', 'render'], {
         to: (_a = modal.to) !== null && _a !== void 0 ? _a : this.to,
         ref: inst => {
           if (inst === null) {
@@ -67,7 +67,9 @@ export const NModalProvider = defineComponent({
         },
         internalKey: modal.key,
         onInternalAfterLeave: this.handleAfterLeave
-      }));
+      }), {
+        default: modal.render
+      });
     }), (_b = (_a = this.$slots).default) === null || _b === void 0 ? void 0 : _b.call(_a)]);
   }
 });

package/es/modal/src/presetProps.d.ts

@@ -31,6 +31,7 @@ declare const presetProps: {
     onPositiveClick: import("vue").PropType<(e: MouseEvent) => void>;
     onNegativeClick: import("vue").PropType<(e: MouseEvent) => void>;
     onClose: import("vue").PropType<() => void>;
+    closeFocusable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: import("vue").PropType<import("vue").CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -39,7 +40,7 @@ declare const presetProps: {
     footerStyle: import("vue").PropType<import("vue").CSSProperties | string>;
     embedded: BooleanConstructor;
     segmented: {
-        readonly type: import("vue").PropType<boolean | import("../../card/src/Card").CardSegmented>;
+        readonly type: import("vue").PropType<boolean | import("../..").CardSegmented>;
         readonly default: false;
     };
     size: {
@@ -56,5 +57,5 @@ declare const presetProps: {
     footer: import("vue").PropType<() => import("vue").VNodeChild>;
     headerExtra: import("vue").PropType<() => import("vue").VNodeChild>;
 };
-declare const presetPropsKeys: ("type" | "tag" | "content" | "size" | "footer" | "title" | "cover" | "icon" | "role" | "onClose" | "action" | "loading" | "positiveText" | "negativeText" | "bordered" | "showIcon" | "contentClass" | "contentStyle" | "closable" | "headerClass" | "headerStyle" | "footerClass" | "footerStyle" | "iconPlacement" | "hoverable" | "embedded" | "headerExtraClass" | "headerExtraStyle" | "segmented" | "headerExtra" | "positiveButtonProps" | "negativeButtonProps" | "titleClass" | "titleStyle" | "actionClass" | "actionStyle" | "onPositiveClick" | "onNegativeClick")[];
+declare const presetPropsKeys: ("type" | "tag" | "content" | "size" | "footer" | "title" | "cover" | "icon" | "role" | "onClose" | "action" | "loading" | "showIcon" | "bordered" | "closable" | "iconPlacement" | "contentClass" | "contentStyle" | "headerClass" | "headerStyle" | "headerExtraClass" | "headerExtraStyle" | "footerClass" | "footerStyle" | "embedded" | "segmented" | "hoverable" | "headerExtra" | "closeFocusable" | "negativeText" | "positiveText" | "positiveButtonProps" | "negativeButtonProps" | "titleClass" | "titleStyle" | "actionClass" | "actionStyle" | "onPositiveClick" | "onNegativeClick")[];
 export { presetProps, presetPropsKeys };

package/es/modal/src/styles/index.cssr.mjs

@@ -1,6 +1,6 @@
 import { fadeInScaleUpTransition } from "../../../_styles/transitions/fade-in-scale-up.cssr.mjs";
 import { fadeInTransition } from "../../../_styles/transitions/fade-in.cssr.mjs";
-import { c, cB } from "../../../_utils/cssr/index.mjs";
+import { c, cB, cM } from "../../../_utils/cssr/index.mjs";
 import { DRAGGABLE_CLASS } from "../composables.mjs";
 // vars:
 // --n-bezier-ease-out
@@ -37,7 +37,9 @@ export default c([cB('modal-container', `
  min-height: 100%;
  display: flex;
  position: relative;
- `)]), cB('modal', `
+ `), cM('mask-hidden', `pointer-events: none;`, [c('> *', `
+ pointer-events: all;
+ `)])]), cB('modal', `
  position: relative;
  align-self: center;
  color: var(--n-text-color);

package/es/notification/src/Notification.d.ts

@@ -22,7 +22,7 @@ export declare const notificationProps: {
     readonly onMouseenter: PropType<(e: MouseEvent) => void>;
     readonly onMouseleave: PropType<(e: MouseEvent) => void>;
 };
-export declare const notificationPropKeys: ("type" | "meta" | "content" | "description" | "title" | "onMouseenter" | "onMouseleave" | "onClose" | "action" | "avatar" | "closable" | "keepAliveOnHover")[];
+export declare const notificationPropKeys: ("type" | "meta" | "content" | "description" | "title" | "onMouseenter" | "onMouseleave" | "onClose" | "action" | "closable" | "avatar" | "keepAliveOnHover")[];
 export declare const Notification: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly closable: {
         readonly type: BooleanConstructor;
@@ -108,7 +108,7 @@ export declare const Notification: import("vue").DefineComponent<import("vue").E
     readonly onMouseenter: PropType<(e: MouseEvent) => void>;
     readonly onMouseleave: PropType<(e: MouseEvent) => void>;
 }>> & Readonly<{}>, {
-    readonly type: "error" | "default" | "info" | "success" | "warning";
+    readonly type: "error" | "default" | "info" | "warning" | "success";
     readonly closable: boolean;
     readonly keepAliveOnHover: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/es/notification/src/NotificationEnvironment.d.ts

@@ -110,7 +110,7 @@ export declare const NotificationEnvironment: import("vue").DefineComponent<Extr
     onMouseenter: PropType<(e: MouseEvent) => void>;
     onMouseleave: PropType<(e: MouseEvent) => void>;
 }>> & Readonly<{}>, {
-    type: "error" | "default" | "info" | "success" | "warning";
+    type: "error" | "default" | "info" | "warning" | "success";
     closable: boolean;
     keepAliveOnHover: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/es/notification/src/NotificationProvider.d.ts

@@ -337,7 +337,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         readonly destroy: () => void;
         readonly hide: () => void;
         readonly deactivate: () => void;
-        type?: "error" | "default" | "info" | "success" | "warning" | undefined;
+        type?: "error" | "default" | "info" | "warning" | "success" | undefined;
         closable?: boolean | undefined;
         keepAliveOnHover?: boolean | undefined;
         meta?: string | (() => import("vue").VNodeChild) | undefined;
@@ -352,16 +352,16 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         onMouseleave?: ((e: MouseEvent) => void) | undefined;
         onClose?: (() => Promise<boolean> | boolean | any) | undefined;
         action?: string | (() => import("vue").VNodeChild) | undefined;
+        onAfterHide?: (() => void) | undefined;
         avatar?: (() => import("vue").VNodeChild) | undefined;
         onHide?: (() => void) | undefined;
-        onAfterHide?: (() => void) | undefined;
         onAfterShow?: (() => void) | undefined;
     }[], NotificationReactive[] | {
         readonly key: string;
         readonly destroy: () => void;
         readonly hide: () => void;
         readonly deactivate: () => void;
-        type?: "error" | "default" | "info" | "success" | "warning" | undefined;
+        type?: "error" | "default" | "info" | "warning" | "success" | undefined;
         closable?: boolean | undefined;
         keepAliveOnHover?: boolean | undefined;
         meta?: string | (() => import("vue").VNodeChild) | undefined;
@@ -376,9 +376,9 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         onMouseleave?: ((e: MouseEvent) => void) | undefined;
         onClose?: (() => Promise<boolean> | boolean | any) | undefined;
         action?: string | (() => import("vue").VNodeChild) | undefined;
+        onAfterHide?: (() => void) | undefined;
         avatar?: (() => import("vue").VNodeChild) | undefined;
         onHide?: (() => void) | undefined;
-        onAfterHide?: (() => void) | undefined;
         onAfterShow?: (() => void) | undefined;
     }[]>;
     notificationRefs: Record<string, NotificationRef>;
@@ -539,7 +539,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     }>>>;
 }>> & Readonly<{}>, {
     placement: NotificationPlacement;
-    scrollable: boolean;
     keepAliveOnHover: boolean;
+    scrollable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/number-animation/src/NumberAnimation.mjs

@@ -1,4 +1,4 @@
-import { round } from 'lodash-es';
+import { round } from 'lodash';
 import { computed, defineComponent, onMounted, ref, watchEffect } from 'vue';
 import { useLocale } from "../../_mixins/index.mjs";
 import { tween } from "./utils.mjs";