naive-ui 2.24.0 → 2.24.4

package/es/message/src/MessageProvider.d.ts

@@ -1,4 +1,4 @@
-import { VNodeChild, InjectionKey, ExtractPropTypes, Ref, PropType, CSSProperties } from 'vue';
+import { VNodeChild, ExtractPropTypes, Ref, PropType, CSSProperties } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
 import type { MessageOptions, MessageType } from './types';
 declare type ContentType = string | (() => VNodeChild);
@@ -10,7 +10,7 @@ export interface MessageApiInjection {
     loading: (content: ContentType, options?: MessageOptions) => MessageReactive;
     destroyAll: () => void;
 }
-export declare const messageApiInjectionKey: InjectionKey<MessageApiInjection>;
+export declare const messageApiInjectionKey: import("vue").InjectionKey<MessageApiInjection>;
 export interface MessageReactive {
     content?: ContentType;
     duration?: number;
@@ -186,7 +186,7 @@ declare const messageProviderProps: {
 };
 export declare type MessageProviderProps = ExtractPublicPropTypes<typeof messageProviderProps>;
 declare type MessageProviderSetupProps = ExtractPropTypes<typeof messageProviderProps>;
-export declare const messageProviderInjectionKey: InjectionKey<{
+export declare const messageProviderInjectionKey: import("vue").InjectionKey<{
     props: MessageProviderSetupProps;
     mergedClsPrefixRef: Ref<string>;
 }>;
@@ -379,26 +379,21 @@ declare const _default: import("vue").DefineComponent<{
         destroy: () => void;
     }[]>;
     handleAfterLeave: (key: string) => void;
-} & MessageApiInjection, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    to?: unknown;
-    duration?: unknown;
-    keepAliveOnHover?: unknown;
-    max?: unknown;
-    placement?: unknown;
-    closable?: unknown;
-    containerStyle?: unknown;
-    theme?: unknown;
-    themeOverrides?: unknown;
-    builtinThemeOverrides?: unknown;
-} & {
-    duration: number;
-    placement: "bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
-    closable: boolean;
-    keepAliveOnHover: boolean;
-} & {
-    max?: number | undefined;
-    to?: string | HTMLElement | undefined;
-    theme?: import("../../_mixins").Theme<"Message", {
+} & MessageApiInjection, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    to: PropType<string | HTMLElement>;
+    duration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    keepAliveOnHover: BooleanConstructor;
+    max: NumberConstructor;
+    placement: {
+        type: PropType<"bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
+        default: string;
+    };
+    closable: BooleanConstructor;
+    containerStyle: PropType<string | CSSProperties>;
+    theme: PropType<import("../../_mixins").Theme<"Message", {
         textColorInfo: string;
         textColorSuccess: string;
         textColorError: string;
@@ -446,8 +441,8 @@ declare const _default: import("vue").DefineComponent<{
         closeSize: string;
         iconSize: string;
         fontSize: string;
-    }, any> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Message", {
+    }, any>>;
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Message", {
         textColorInfo: string;
         textColorSuccess: string;
         textColorError: string;
@@ -495,8 +490,8 @@ declare const _default: import("vue").DefineComponent<{
         closeSize: string;
         iconSize: string;
         fontSize: string;
-    }, any>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Message", {
+    }, any>>>;
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Message", {
         textColorInfo: string;
         textColorSuccess: string;
         textColorError: string;
@@ -544,9 +539,8 @@ declare const _default: import("vue").DefineComponent<{
         closeSize: string;
         iconSize: string;
         fontSize: string;
-    }, any>> | undefined;
-    containerStyle?: string | CSSProperties | undefined;
-}>, {
+    }, any>>>;
+}>>, {
     duration: number;
     placement: "bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
     closable: boolean;

package/es/message/src/MessageProvider.js

@@ -1,9 +1,9 @@
-import { Fragment, ref, h, reactive, Teleport, defineComponent, provide, renderSlot } from 'vue';
+import { Fragment, ref, h, reactive, Teleport, defineComponent, provide } from 'vue';
 import { createId } from 'seemly';
-import { omit } from '../../_utils';
+import { createInjectionKey, omit } from '../../_utils';
 import { useConfig, useTheme } from '../../_mixins';
 import MessageEnvironment from './MessageEnvironment';
-export const messageApiInjectionKey = Symbol('messageApi');
+export const messageApiInjectionKey = createInjectionKey('n-message-api');
 const messageProviderProps = Object.assign(Object.assign({}, useTheme.props), { to: [String, Object], duration: {
         type: Number,
         default: 3000
@@ -11,7 +11,7 @@ const messageProviderProps = Object.assign(Object.assign({}, useTheme.props), {
         type: String,
         default: 'top'
     }, closable: Boolean, containerStyle: [String, Object] });
-export const messageProviderInjectionKey = Symbol('messageProvider');
+export const messageProviderInjectionKey = createInjectionKey('n-message-provider');
 export default defineComponent({
     name: 'MessageProvider',
     props: messageProviderProps,
@@ -73,10 +73,10 @@ export default defineComponent({
         }, api);
     },
     render() {
-        var _a;
-        return (h(Fragment, null,
-            renderSlot(this.$slots, 'default'),
-            this.messageList.length ? (h(Teleport, { to: (_a = this.to) !== null && _a !== void 0 ? _a : 'body' },
+        var _a, _b, _c;
+        return (h(Fragment, null, (_b = (_a = this.$slots).default) === null || _b === void 0 ? void 0 :
+            _b.call(_a),
+            this.messageList.length ? (h(Teleport, { to: (_c = this.to) !== null && _c !== void 0 ? _c : 'body' },
                 h("div", { class: [
                         `${this.mergedClsPrefix}-message-container`,
                         `${this.mergedClsPrefix}-message-container--${this.placement}`

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

@@ -24,11 +24,8 @@ declare const _default: import("vue").DefineComponent<{
         type: FunctionConstructor;
         required: true;
     };
-    onKeyup: {
-        type: PropType<(e: KeyboardEvent) => void>;
-        required: true;
-    };
     onAfterEnter: PropType<() => void>;
+    onEsc: PropType<() => void>;
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;
@@ -73,6 +70,14 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<"show" | "if">;
         required: true;
     };
+    trapFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     mergedTheme: import("vue").Ref<{
         common: {
@@ -679,11 +684,14 @@ declare const _default: import("vue").DefineComponent<{
     mergedClsPrefix: import("vue").Ref<string>;
     bodyRef: import("vue").Ref<ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | HTMLElement | null>;
     scrollbarRef: import("vue").Ref<{
-        scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
-        sync: () => void;
         containerRef: HTMLElement | null;
         contentRef: HTMLElement | null;
         containerScrollTop: number;
+        syncUnifiedContainer: () => void;
+        scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+        sync: () => void;
+        handleMouseEnterWrapper: () => void;
+        handleMouseLeaveWrapper: () => void;
     } | null>;
     displayed: import("vue").Ref<boolean>;
     handleClickOutside: (e: MouseEvent) => void;
@@ -693,74 +701,89 @@ declare const _default: import("vue").DefineComponent<{
     handleAfterLeave: () => void;
     handleBeforeLeave: (el: HTMLElement) => void;
     handleEnter: (el: HTMLElement) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    onClickoutside?: unknown;
-    onBeforeLeave?: unknown;
-    onAfterLeave?: unknown;
-    onPositiveClick?: unknown;
-    onNegativeClick?: unknown;
-    onClose?: unknown;
-    onKeyup?: unknown;
-    onAfterEnter?: unknown;
-    icon?: unknown;
-    type?: unknown;
-    title?: unknown;
-    closable?: unknown;
-    negativeText?: unknown;
-    positiveText?: unknown;
-    content?: unknown;
-    action?: unknown;
-    showIcon?: unknown;
-    loading?: unknown;
-    bordered?: unknown;
-    iconPlacement?: unknown;
-    contentStyle?: unknown;
-    headerStyle?: unknown;
-    footerStyle?: unknown;
-    embedded?: unknown;
-    segmented?: unknown;
-    size?: unknown;
-    hoverable?: unknown;
-    role?: unknown;
-    show?: unknown;
-    preset?: unknown;
-    displayDirective?: unknown;
-} & {
-    type: "default" | "error" | "info" | "success" | "warning";
-    size: "small" | "medium" | "large" | "huge";
-    show: boolean;
-    onBeforeLeave: Function;
-    onAfterLeave: Function;
-    onKeyup: (e: KeyboardEvent) => void;
-    loading: boolean;
-    showIcon: boolean;
-    bordered: boolean;
-    onClose: Function;
-    closable: boolean;
-    displayDirective: "show" | "if";
-    onClickoutside: Function;
-    hoverable: boolean;
-    embedded: boolean;
-    segmented: boolean | import("../../card/src/Card").Segmented;
-    onPositiveClick: Function;
-    onNegativeClick: Function;
-} & {
-    content?: string | (() => import("vue").VNodeChild) | undefined;
-    icon?: (() => import("vue").VNodeChild) | undefined;
-    onAfterEnter?: (() => void) | undefined;
-    title?: string | (() => import("vue").VNodeChild) | undefined;
-    role?: string | undefined;
-    action?: (() => import("vue").VNodeChild) | undefined;
-    positiveText?: string | undefined;
-    negativeText?: string | undefined;
-    contentStyle?: string | import("vue").CSSProperties | undefined;
-    iconPlacement?: import("../../dialog/src/interface").IconPlacement | undefined;
-    headerStyle?: string | import("vue").CSSProperties | undefined;
-    footerStyle?: string | import("vue").CSSProperties | undefined;
-    preset?: "dialog" | "card" | "confirm" | undefined;
-}>, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    onClickoutside: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onBeforeLeave: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onAfterLeave: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onPositiveClick: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onNegativeClick: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onClose: {
+        type: FunctionConstructor;
+        required: true;
+    };
+    onAfterEnter: PropType<() => void>;
+    onEsc: PropType<() => void>;
+    icon: PropType<() => import("vue").VNodeChild>;
+    type: {
+        readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;
+        readonly default: "default";
+    };
+    title: PropType<string | (() => import("vue").VNodeChild)>;
+    closable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    negativeText: StringConstructor;
+    positiveText: StringConstructor;
+    content: PropType<string | (() => import("vue").VNodeChild)>;
+    action: PropType<() => import("vue").VNodeChild>;
+    showIcon: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    loading: BooleanConstructor;
+    bordered: BooleanConstructor;
+    iconPlacement: PropType<import("../../dialog/src/interface").IconPlacement>;
+    contentStyle: PropType<string | import("vue").CSSProperties>;
+    headerStyle: PropType<string | import("vue").CSSProperties>;
+    footerStyle: PropType<string | import("vue").CSSProperties>;
+    embedded: BooleanConstructor;
+    segmented: {
+        readonly type: PropType<boolean | import("../../card/src/Card").Segmented>;
+        readonly default: false;
+    };
+    size: {
+        readonly type: PropType<"small" | "medium" | "large" | "huge">;
+        readonly default: "medium";
+    };
+    hoverable: BooleanConstructor;
+    role: StringConstructor;
+    show: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    preset: PropType<"dialog" | "card" | "confirm">;
+    displayDirective: {
+        type: PropType<"show" | "if">;
+        required: true;
+    };
+    trapFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
     type: "default" | "error" | "info" | "success" | "warning";
     size: "small" | "medium" | "large" | "huge";
+    autoFocus: boolean;
     loading: boolean;
     showIcon: boolean;
     bordered: boolean;
@@ -768,5 +791,6 @@ declare const _default: import("vue").DefineComponent<{
     hoverable: boolean;
     embedded: boolean;
     segmented: boolean | import("../../card/src/Card").Segmented;
+    trapFocus: boolean;
 }>;
 export default _default;

package/es/modal/src/BodyWrapper.js

@@ -3,14 +3,14 @@ import { clickoutside } from 'vdirs';
 import { VFocusTrap } from 'vueuc';
 import { dialogPropKeys } from '../../dialog/src/Dialog';
 import { cardBasePropKeys } from '../../card/src/Card';
+import { drawerBodyInjectionKey } from '../../drawer/src/interface';
+import { popoverBodyInjectionKey } from '../../popover/src/interface';
 import { NScrollbar } from '../../_internal';
 import { NDialog } from '../../dialog';
 import { NCard } from '../../card';
 import { getFirstSlotVNode, keep, warn } from '../../_utils';
-import { presetProps } from './presetProps';
-import { drawerBodyInjectionKey } from '../../drawer/src/interface';
-import { popoverBodyInjectionKey } from '../../popover/src/interface';
 import { modalBodyInjectionKey, modalInjectionKey } from './interface';
+import { presetProps } from './presetProps';
 export default defineComponent({
     name: 'ModalBody',
     inheritAttrs: false,
@@ -20,6 +20,12 @@ export default defineComponent({
         }, preset: String, displayDirective: {
             type: String,
             required: true
+        }, trapFocus: {
+            type: Boolean,
+            default: true
+        }, autoFocus: {
+            type: Boolean,
+            default: true
         } }, presetProps), { 
         // events
         onClickoutside: {
@@ -40,10 +46,7 @@ export default defineComponent({
         }, onClose: {
             type: Function,
             required: true
-        }, onKeyup: {
-            type: Function,
-            required: true
-        }, onAfterEnter: Function }),
+        }, onAfterEnter: Function, onEsc: Function }),
     setup(props) {
         const bodyRef = ref(null);
         const scrollbarRef = ref(null);
@@ -156,9 +159,9 @@ export default defineComponent({
             }, $attrs, childNode.props || {});
         }
         return this.displayDirective === 'show' || this.displayed || this.show
-            ? withDirectives(h("div", { role: "none", class: `${mergedClsPrefix}-modal-body-wrapper`, onKeyup: this.onKeyup },
+            ? withDirectives(h("div", { role: "none", class: `${mergedClsPrefix}-modal-body-wrapper` },
                 h(NScrollbar, { ref: "scrollbarRef", theme: this.mergedTheme.peers.Scrollbar, themeOverrides: this.mergedTheme.peerOverrides.Scrollbar, contentClass: `${mergedClsPrefix}-modal-scroll-content` }, {
-                    default: () => (h(VFocusTrap, { active: this.show, focusFirstDescendant: true }, {
+                    default: () => (h(VFocusTrap, { disabled: !this.trapFocus, active: this.show, onEsc: this.onEsc, autoFocus: this.autoFocus }, {
                         default: () => {
                             var _a;
                             return (h(Transition, { name: "fade-in-scale-up-transition", appear: (_a = this.appear) !== null && _a !== void 0 ? _a : this.isMounted, onEnter: handleEnter, onAfterEnter: this.onAfterEnter, onAfterLeave: handleAfterLeave, onBeforeLeave: handleBeforeLeave }, {