naive-ui 2.24.0 → 2.24.4

package/es/dialog/src/DialogEnvironment.d.ts

@@ -80,52 +80,47 @@ declare const _default: import("vue").DefineComponent<{
     handleNegativeClick: (e: MouseEvent) => void;
     handlePositiveClick: (e: MouseEvent) => void;
     handleMaskClick: (e: MouseEvent) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    internalKey?: unknown;
-    to?: unknown;
-    onInternalAfterLeave?: unknown;
-    internalStyle?: unknown;
-    maskClosable?: unknown;
-    onPositiveClick?: unknown;
-    onNegativeClick?: unknown;
-    onClose?: unknown;
-    onMaskClick?: 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;
-} & {
-    type: "default" | "error" | "info" | "success" | "warning";
-    loading: boolean;
-    showIcon: boolean;
-    bordered: boolean;
-    closable: boolean;
-    maskClosable: boolean;
-    internalKey: string;
-    onInternalAfterLeave: (key: string) => void;
-} & {
-    content?: string | (() => import("vue").VNodeChild) | undefined;
-    icon?: (() => import("vue").VNodeChild) | undefined;
-    title?: string | (() => import("vue").VNodeChild) | undefined;
-    action?: (() => import("vue").VNodeChild) | undefined;
-    to?: string | HTMLElement | undefined;
-    positiveText?: string | undefined;
-    negativeText?: string | undefined;
-    onClose?: (() => unknown) | undefined;
-    iconPlacement?: import("./interface").IconPlacement | undefined;
-    onPositiveClick?: ((e: MouseEvent) => unknown) | undefined;
-    onNegativeClick?: ((e: MouseEvent) => unknown) | undefined;
-    onMaskClick?: ((e: MouseEvent) => void) | undefined;
-    internalStyle?: string | CSSProperties | 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<{
+    internalKey: {
+        type: StringConstructor;
+        required: true;
+    };
+    to: PropType<string | HTMLElement>;
+    onInternalAfterLeave: {
+        type: PropType<(key: string) => void>;
+        required: true;
+    };
+    internalStyle: PropType<string | CSSProperties>;
+    maskClosable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    onPositiveClick: PropType<(e: MouseEvent) => unknown>;
+    onNegativeClick: PropType<(e: MouseEvent) => unknown>;
+    onClose: PropType<() => unknown>;
+    onMaskClick: PropType<(e: MouseEvent) => 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("./interface").IconPlacement>;
+}>>, {
     type: "default" | "error" | "info" | "success" | "warning";
     loading: boolean;
     showIcon: boolean;

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

@@ -1,4 +1,4 @@
-import { ExtractPropTypes, PropType, InjectionKey, Ref, CSSProperties } from 'vue';
+import { ExtractPropTypes, PropType, Ref, CSSProperties } from 'vue';
 import type { ExtractPublicPropTypes, Mutable } from '../../_utils';
 import { exposedDialogEnvProps } from './DialogEnvironment';
 export declare type DialogOptions = Mutable<Omit<Partial<ExtractPropTypes<typeof exposedDialogEnvProps>>, 'internalStyle'> & {
@@ -16,7 +16,7 @@ export interface DialogApiInjection {
     error: (options: DialogOptions) => DialogReactive;
     info: (options: DialogOptions) => DialogReactive;
 }
-export declare const dialogApiInjectionKey: InjectionKey<DialogApiInjection>;
+export declare const dialogApiInjectionKey: import("vue").InjectionKey<DialogApiInjection>;
 export interface DialogProviderInjection {
     clickedRef: Ref<boolean>;
     clickPositionRef: Ref<{
@@ -24,7 +24,7 @@ export interface DialogProviderInjection {
         y: number;
     } | null>;
 }
-export declare const dialogProviderInjectionKey: InjectionKey<DialogProviderInjection>;
+export declare const dialogProviderInjectionKey: import("vue").InjectionKey<DialogProviderInjection>;
 interface DialogInst {
     hide: () => void;
 }
@@ -68,11 +68,8 @@ declare const _default: import("vue").DefineComponent<{
     success: (options: DialogOptions) => DialogReactive;
     warning: (options: DialogOptions) => DialogReactive;
     error: (options: DialogOptions) => DialogReactive;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    injectionKey?: unknown;
-    to?: unknown;
-} & {} & {
-    to?: string | HTMLElement | undefined;
-    injectionKey?: string | undefined;
-}>, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    injectionKey: StringConstructor;
+    to: PropType<string | HTMLElement>;
+}>>, {}>;
 export default _default;

package/es/dialog/src/DialogProvider.js

@@ -1,10 +1,10 @@
 import { defineComponent, Fragment, ref, h, provide, reactive } from 'vue';
 import { createId } from 'seemly';
-import { omit } from '../../_utils';
+import { createInjectionKey, omit } from '../../_utils';
 import DialogEnvironment from './DialogEnvironment';
 import { useClicked, useClickPosition } from 'vooks';
-export const dialogApiInjectionKey = Symbol('dialogApi');
-export const dialogProviderInjectionKey = Symbol('dialogProvider');
+export const dialogApiInjectionKey = createInjectionKey('n-dialog-api');
+export const dialogProviderInjectionKey = createInjectionKey('n-dialog-provider');
 const dialogProviderProps = {
     injectionKey: String,
     to: [String, Object]

package/es/divider/src/Divider.d.ts

@@ -54,34 +54,29 @@ declare const _default: import("vue").DefineComponent<{
         '--n-text-color': string;
         '--n-font-weight': string;
     }>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly titlePlacement?: unknown;
-    readonly dashed?: unknown;
-    readonly vertical?: unknown;
-    readonly theme?: unknown;
-    readonly themeOverrides?: unknown;
-    readonly builtinThemeOverrides?: unknown;
-} & {
-    dashed: boolean;
-    vertical: boolean;
-    titlePlacement: "left" | "right" | "center";
-} & {
-    theme?: import("../../_mixins").Theme<"Divider", {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly titlePlacement: {
+        readonly type: PropType<"left" | "right" | "center">;
+        readonly default: "center";
+    };
+    readonly dashed: BooleanConstructor;
+    readonly vertical: BooleanConstructor;
+    readonly theme: PropType<import("../../_mixins").Theme<"Divider", {
         textColor: string;
         color: string;
         fontWeight: string;
-    }, any> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Divider", {
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Divider", {
         textColor: string;
         color: string;
         fontWeight: string;
-    }, any>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Divider", {
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Divider", {
         textColor: string;
         color: string;
         fontWeight: string;
-    }, any>> | undefined;
-}>, {
+    }, any>>>;
+}>>, {
     dashed: boolean;
     vertical: boolean;
     titlePlacement: "left" | "right" | "center";

package/es/drawer/src/Drawer.d.ts

@@ -33,6 +33,19 @@ declare const drawerProps: {
     readonly onMaskClick: PropType<(e: MouseEvent) => void>;
     readonly scrollbarProps: PropType<ScrollbarProps>;
     readonly contentStyle: PropType<string | CSSProperties>;
+    readonly trapFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly onEsc: PropType<() => void>;
+    readonly autoFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly closeOnEsc: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
     /** @deprecated */
@@ -143,6 +156,19 @@ declare const _default: import("vue").DefineComponent<{
     readonly onMaskClick: PropType<(e: MouseEvent) => void>;
     readonly scrollbarProps: PropType<ScrollbarProps>;
     readonly contentStyle: PropType<string | CSSProperties>;
+    readonly trapFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly onEsc: PropType<() => void>;
+    readonly autoFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly closeOnEsc: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
     /** @deprecated */
@@ -225,7 +251,7 @@ declare const _default: import("vue").DefineComponent<{
     namespace: import("vue").ComputedRef<string | undefined>;
     mergedBodyStyle: import("vue").ComputedRef<(string | CSSProperties | undefined)[]>;
     handleMaskClick: (e: MouseEvent) => void;
-    handleKeydown: (e: KeyboardEvent) => void;
+    handleEsc: () => void;
     mergedTheme: import("vue").ComputedRef<{
         common: {
             baseColor: string;
@@ -384,42 +410,59 @@ declare const _default: import("vue").DefineComponent<{
         '--n-close-size': string;
     }>;
     isMounted: Readonly<import("vue").Ref<boolean>>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly show?: unknown;
-    readonly width?: unknown;
-    readonly height?: unknown;
-    readonly placement?: unknown;
-    readonly maskClosable?: unknown;
-    readonly to?: unknown;
-    readonly displayDirective?: unknown;
-    readonly nativeScrollbar?: unknown;
-    readonly zIndex?: unknown;
-    readonly onMaskClick?: unknown;
-    readonly scrollbarProps?: unknown;
-    readonly contentStyle?: unknown;
-    readonly 'onUpdate:show'?: unknown;
-    readonly onUpdateShow?: unknown;
-    readonly drawerStyle?: unknown;
-    readonly drawerClass?: unknown;
-    readonly target?: unknown;
-    readonly onShow?: unknown;
-    readonly onHide?: unknown;
-    readonly theme?: unknown;
-    readonly themeOverrides?: unknown;
-    readonly builtinThemeOverrides?: unknown;
-} & {
-    show: boolean;
-    height: string | number;
-    width: string | number;
-    placement: Placement;
-    displayDirective: "show" | "if";
-    maskClosable: boolean;
-    nativeScrollbar: boolean;
-} & {
-    zIndex?: number | undefined;
-    target?: any;
-    to?: string | HTMLElement | undefined;
-    theme?: import("../../_mixins").Theme<"Drawer", {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly show: BooleanConstructor;
+    readonly width: {
+        readonly type: PropType<string | number>;
+        readonly default: 251;
+    };
+    readonly height: {
+        readonly type: PropType<string | number>;
+        readonly default: 251;
+    };
+    readonly placement: {
+        readonly type: PropType<Placement>;
+        readonly default: "right";
+    };
+    readonly maskClosable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly to: PropType<string | HTMLElement>;
+    readonly displayDirective: {
+        readonly type: PropType<"show" | "if">;
+        readonly default: "if";
+    };
+    readonly nativeScrollbar: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly zIndex: NumberConstructor;
+    readonly onMaskClick: PropType<(e: MouseEvent) => void>;
+    readonly scrollbarProps: PropType<ScrollbarProps>;
+    readonly contentStyle: PropType<string | CSSProperties>;
+    readonly trapFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly onEsc: PropType<() => void>;
+    readonly autoFocus: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly closeOnEsc: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
+    readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
+    /** @deprecated */
+    readonly drawerStyle: PropType<string | CSSProperties>;
+    readonly drawerClass: StringConstructor;
+    readonly target: null;
+    readonly onShow: PropType<(value: boolean) => void>;
+    readonly onHide: PropType<(value: boolean) => void>;
+    readonly theme: PropType<import("../../_mixins").Theme<"Drawer", {
         bodyPadding: string;
         headerPadding: string;
         footerPadding: string;
@@ -441,8 +484,8 @@ declare const _default: import("vue").DefineComponent<{
             color: string;
             colorHover: string;
         }, any>;
-    }> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Drawer", {
+    }>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Drawer", {
         bodyPadding: string;
         headerPadding: string;
         footerPadding: string;
@@ -464,8 +507,8 @@ declare const _default: import("vue").DefineComponent<{
             color: string;
             colorHover: string;
         }, any>;
-    }>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Drawer", {
+    }>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Drawer", {
         bodyPadding: string;
         headerPadding: string;
         footerPadding: string;
@@ -487,23 +530,17 @@ declare const _default: import("vue").DefineComponent<{
             color: string;
             colorHover: string;
         }, any>;
-    }>> | undefined;
-    contentStyle?: string | CSSProperties | undefined;
-    "onUpdate:show"?: MaybeArray<(value: boolean) => void> | undefined;
-    onUpdateShow?: MaybeArray<(value: boolean) => void> | undefined;
-    onShow?: ((value: boolean) => void) | undefined;
-    onHide?: ((value: boolean) => void) | undefined;
-    onMaskClick?: ((e: MouseEvent) => void) | undefined;
-    scrollbarProps?: ScrollbarProps | undefined;
-    drawerStyle?: string | CSSProperties | undefined;
-    drawerClass?: string | undefined;
-}>, {
+    }>>>;
+}>>, {
     show: boolean;
     height: string | number;
     width: string | number;
+    autoFocus: boolean;
     placement: Placement;
     displayDirective: "show" | "if";
+    trapFocus: boolean;
     maskClosable: boolean;
+    closeOnEsc: boolean;
     nativeScrollbar: boolean;
 }>;
 export default _default;

package/es/drawer/src/Drawer.js

@@ -26,7 +26,16 @@ const drawerProps = Object.assign(Object.assign({}, useTheme.props), { show: Boo
     }, nativeScrollbar: {
         type: Boolean,
         default: true
-    }, zIndex: Number, onMaskClick: Function, scrollbarProps: Object, contentStyle: [Object, String], 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], 
+    }, zIndex: Number, onMaskClick: Function, scrollbarProps: Object, contentStyle: [Object, String], trapFocus: {
+        type: Boolean,
+        default: true
+    }, onEsc: Function, autoFocus: {
+        type: Boolean,
+        default: true
+    }, closeOnEsc: {
+        type: Boolean,
+        default: true
+    }, 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], 
     /** @deprecated */
     drawerStyle: [String, Object], drawerClass: String, target: null, onShow: Function, onHide: Function });
 export default defineComponent({
@@ -87,8 +96,10 @@ export default defineComponent({
             if (onMaskClick)
                 onMaskClick(e);
         }
-        function handleKeydown(e) {
-            if (e.code === 'Escape') {
+        function handleEsc() {
+            var _a;
+            (_a = props.onEsc) === null || _a === void 0 ? void 0 : _a.call(props);
+            if (props.closeOnEsc) {
                 doUpdateShow(false);
             }
         }
@@ -113,7 +124,7 @@ export default defineComponent({
             namespace: namespaceRef,
             mergedBodyStyle: mergedBodyStyleRef,
             handleMaskClick,
-            handleKeydown,
+            handleEsc,
             mergedTheme: themeRef,
             cssVars: computed(() => {
                 const { common: { cubicBezierEaseInOut, cubicBezierEaseIn, cubicBezierEaseOut }, self: { color, textColor, boxShadow, lineHeight, headerPadding, footerPadding, bodyPadding, titleFontSize, titleTextColor, titleFontWeight, headerBorderBottom, footerBorderTop, closeColor, closeColorHover, closeColorPressed, closeSize } } = themeRef.value;
@@ -146,11 +157,11 @@ export default defineComponent({
         const { mergedClsPrefix } = this;
         return (h(VLazyTeleport, { to: this.to, show: this.show }, {
             default: () => {
-                return withDirectives(h("div", { class: [`${mergedClsPrefix}-drawer-container`, this.namespace], style: this.cssVars, onKeydown: this.handleKeydown, role: "none" },
+                return withDirectives(h("div", { class: [`${mergedClsPrefix}-drawer-container`, this.namespace], style: this.cssVars, role: "none" },
                     h(Transition, { name: "fade-in-transition", appear: this.isMounted }, {
                         default: () => this.show ? (h("div", { "aria-hidden": true, class: `${mergedClsPrefix}-drawer-mask`, onClick: this.handleMaskClick })) : null
                     }),
-                    h(NDrawerBodyWrapper, Object.assign({}, this.$attrs, { class: [this.drawerClass, this.$attrs.class], style: [this.mergedBodyStyle, this.$attrs.style], contentStyle: this.contentStyle, placement: this.placement, scrollbarProps: this.scrollbarProps, show: this.show, displayDirective: this.displayDirective, nativeScrollbar: this.nativeScrollbar }), this.$slots)), [[zindexable, { zIndex: this.zIndex, enabled: this.show }]]);
+                    h(NDrawerBodyWrapper, Object.assign({}, this.$attrs, { class: [this.drawerClass, this.$attrs.class], style: [this.mergedBodyStyle, this.$attrs.style], contentStyle: this.contentStyle, placement: this.placement, scrollbarProps: this.scrollbarProps, show: this.show, displayDirective: this.displayDirective, nativeScrollbar: this.nativeScrollbar, trapFocus: this.trapFocus, autoFocus: this.autoFocus, onEsc: this.handleEsc }), this.$slots)), [[zindexable, { zIndex: this.zIndex, enabled: this.show }]]);
             }
         }));
     }

package/es/drawer/src/DrawerBodyWrapper.d.ts

@@ -20,6 +20,15 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     scrollbarProps: PropType<ScrollbarProps>;
+    trapFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onEsc: PropType<() => void>;
 }, {
     bodyRef: import("vue").Ref<HTMLElement | null>;
     mergedClsPrefix: import("vue").Ref<string>;
@@ -163,22 +172,37 @@ declare const _default: import("vue").DefineComponent<{
     displayed: import("vue").Ref<boolean | undefined>;
     transitionName: import("vue").ComputedRef<string>;
     handleAfterLeave: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    show?: unknown;
-    displayDirective?: unknown;
-    placement?: unknown;
-    contentStyle?: unknown;
-    nativeScrollbar?: unknown;
-    scrollbarProps?: unknown;
-} & {
-    placement: Placement;
-    displayDirective: "show" | "if";
-    nativeScrollbar: boolean;
-} & {
-    show?: boolean | undefined;
-    contentStyle?: string | CSSProperties | undefined;
-    scrollbarProps?: ScrollbarProps | 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<{
+    show: {
+        type: PropType<boolean | undefined>;
+        default: undefined;
+    };
+    displayDirective: {
+        type: PropType<"show" | "if">;
+        required: true;
+    };
+    placement: {
+        type: PropType<Placement>;
+        required: true;
+    };
+    contentStyle: PropType<string | CSSProperties>;
+    nativeScrollbar: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    scrollbarProps: PropType<ScrollbarProps>;
+    trapFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onEsc: PropType<() => void>;
+}>>, {
     show: boolean | undefined;
+    autoFocus: boolean;
+    trapFocus: boolean;
 }>;
 export default _default;

package/es/drawer/src/DrawerBodyWrapper.js

@@ -25,7 +25,16 @@ export default defineComponent({
             type: Boolean,
             required: true
         },
-        scrollbarProps: Object
+        scrollbarProps: Object,
+        trapFocus: {
+            type: Boolean,
+            default: true
+        },
+        autoFocus: {
+            type: Boolean,
+            default: true
+        },
+        onEsc: Function
     },
     setup(props) {
         const displayedRef = ref(props.show);
@@ -66,7 +75,7 @@ export default defineComponent({
             /* Keep the wrapper dom. Make sure the drawer has a host.
               Nor the detached content will disappear without transition */
             h("div", { role: "none" },
-                h(VFocusTrap, { active: this.show, focusFirstDescendant: true }, {
+                h(VFocusTrap, { disabled: !this.trapFocus, active: this.show, autoFocus: this.autoFocus, onEsc: this.onEsc }, {
                     default: () => (h(Transition, { name: this.transitionName, appear: this.isMounted, onAfterLeave: this.handleAfterLeave }, {
                         default: () => withDirectives(h('div', mergeProps(this.$attrs, {
                             role: 'dialog',

package/es/drawer/src/DrawerContent.d.ts

@@ -170,26 +170,21 @@ declare const _default: import("vue").DefineComponent<{
         };
     }>;
     mergedClsPrefix: import("vue").Ref<string>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    title?: unknown;
-    headerStyle?: unknown;
-    footerStyle?: unknown;
-    bodyStyle?: unknown;
-    bodyContentStyle?: unknown;
-    nativeScrollbar?: unknown;
-    scrollbarProps?: unknown;
-    closable?: unknown;
-} & {
-    closable: boolean;
-    nativeScrollbar: boolean;
-} & {
-    title?: string | undefined;
-    bodyStyle?: string | CSSProperties | undefined;
-    headerStyle?: string | CSSProperties | undefined;
-    footerStyle?: string | CSSProperties | undefined;
-    scrollbarProps?: ScrollbarProps | undefined;
-    bodyContentStyle?: string | CSSProperties | 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<{
+    title: {
+        type: StringConstructor;
+    };
+    headerStyle: PropType<string | CSSProperties>;
+    footerStyle: PropType<string | CSSProperties>;
+    bodyStyle: PropType<string | CSSProperties>;
+    bodyContentStyle: PropType<string | CSSProperties>;
+    nativeScrollbar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    scrollbarProps: PropType<ScrollbarProps>;
+    closable: BooleanConstructor;
+}>>, {
     closable: boolean;
     nativeScrollbar: boolean;
 }>;

package/es/drawer/src/interface.d.ts

@@ -1,12 +1,12 @@
-import { Ref, InjectionKey } from 'vue';
+import { Ref } from 'vue';
 import type { MergedTheme } from '../../_mixins';
 import type { DrawerTheme } from '../styles';
 export declare type DrawerBodyInjection = Ref<HTMLElement | null> | null;
-export declare const drawerBodyInjectionKey: InjectionKey<DrawerBodyInjection>;
+export declare const drawerBodyInjectionKey: import("vue").InjectionKey<DrawerBodyInjection>;
 export interface DrawerInjection {
     isMountedRef: Ref<boolean>;
     mergedThemeRef: Ref<MergedTheme<DrawerTheme>>;
     mergedClsPrefixRef: Ref<string>;
     doUpdateShow: (show: boolean) => void;
 }
-export declare const drawerInjectionKey: InjectionKey<DrawerInjection>;
+export declare const drawerInjectionKey: import("vue").InjectionKey<DrawerInjection>;

package/es/drawer/src/interface.js

@@ -1,2 +1,3 @@
-export const drawerBodyInjectionKey = Symbol('drawerBody');
-export const drawerInjectionKey = Symbol('drawer');
+import { createInjectionKey } from '../../_utils/vue/create-injection-key';
+export const drawerBodyInjectionKey = createInjectionKey('n-drawer-body');
+export const drawerInjectionKey = createInjectionKey('n-drawer');