vft 0.0.415 → 0.0.417

package/lib/components/dialog/constants.d.ts

@@ -9,3 +9,4 @@ export type DialogContext = {
     style: ComputedRef<CSSProperties>;
 };
 export declare const dialogInjectionKey: InjectionKey<DialogContext>;
+export declare const DEFAULT_DIALOG_TRANSITION = "dialog-fade";

package/lib/components/dialog/dialog-content.vue.d.ts

@@ -4,7 +4,10 @@ declare function __VLS_template(): {
     default?(_: {}): any;
     footer?(_: {}): any;
 };
-declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DialogContentProps>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DialogContentProps>>, {
+    resetPosition: () => void;
+    updatePosition: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DialogContentProps>>> & Readonly<{
     onClose?: ((...args: any[]) => any) | undefined;

package/lib/components/dialog/dialog-content.vue2.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("@vft/utils"),g=require("../icon/index.cjs");require("../focus-trap/focus-trap.vue2.cjs");const p=require("../focus-trap/tokens.cjs");require("../focus-trap/utils.cjs");require("@vueuse/core");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");const C=require("../../utils/vue/refs.cjs");require("../form/index.cjs");const q=require("../../hooks/use-draggable/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const y=require("./constants.cjs"),b=["id"],k=e.defineComponent({name:"vft-dialog-content"}),B=e.defineComponent({...k,props:{center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""}},emits:["close"],setup(n){const{dialogRef:l,headerRef:t,bodyId:a,ns:o,style:i}=e.inject(y.dialogInjectionKey),{focusTrapRef:u}=e.inject(p.FOCUS_TRAP_INJECTION_KEY),c=C.composeRefs(u,l),f=e.computed(()=>n.draggable);q.useDraggable(l,t,f);const d=e.computed(()=>m.singleAttrToObj(n.closeIcon,"icon",{icon:"icon-close",pointer:!0}));return(r,s)=>(e.openBlock(),e.createElementBlock("div",{ref:e.unref(c),class:e.normalizeClass([e.unref(o).b(),e.unref(o).is("fullscreen",r.fullscreen),e.unref(o).is("draggable",r.draggable),e.unref(o).is("align-center",r.alignCenter),{[e.unref(o).m("center")]:r.center},r.customClass]),style:e.normalizeStyle(e.unref(i)),tabindex:"-1"},[e.createElementVNode("header",{ref_key:"headerRef",ref:t,class:e.normalizeClass(e.unref(o).e("header"))},[e.renderSlot(r.$slots,"header",{},()=>[e.createElementVNode("span",{role:"heading",class:e.normalizeClass(e.unref(o).e("title"))},e.toDisplayString(r.title),3)]),r.showClose?(e.openBlock(),e.createBlock(e.unref(g.VftIcon),e.mergeProps({key:0,onClick:s[0]||(s[0]=h=>r.$emit("close")),class:e.unref(o).e("close")},d.value,{size:"20"}),null,16,["class"])):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{id:e.unref(a),class:e.normalizeClass(e.unref(o).e("body"))},[e.renderSlot(r.$slots,"default")],10,b),r.$slots.footer?(e.openBlock(),e.createElementBlock("footer",{key:0,class:e.normalizeClass(e.unref(o).e("footer"))},[e.renderSlot(r.$slots,"footer")],2)):e.createCommentVNode("",!0)],6))}});exports.default=B;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),b=require("@vft/utils"),v=require("../icon/index.cjs");require("../focus-trap/focus-trap.vue2.cjs");const h=require("../focus-trap/tokens.cjs");require("../focus-trap/utils.cjs");require("@vueuse/core");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");const B=require("../../utils/vue/refs.cjs");require("../form/index.cjs");const k=require("../../hooks/use-draggable/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const I=require("./constants.cjs"),S=["id"],w=e.defineComponent({name:"vft-dialog-content"}),z=e.defineComponent({...w,props:{center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""},overflow:{type:Boolean},headerClass:{},bodyClass:{},footerClass:{}},emits:["close"],setup(l,{expose:i}){const{dialogRef:r,headerRef:t,bodyId:u,ns:o,style:c}=e.inject(I.dialogInjectionKey),{focusTrapRef:d}=e.inject(h.FOCUS_TRAP_INJECTION_KEY),f=B.composeRefs(d,r),n=e.computed(()=>l.draggable),m=e.computed(()=>l.overflow),{resetPosition:g,updatePosition:C,isDragging:y}=k.useDraggable(r,t,n,m),p=e.computed(()=>[o.b(),o.is("fullscreen",l.fullscreen),o.is("draggable",n.value),o.is("dragging",y.value),o.is("align-center",l.alignCenter),{[o.m("center")]:l.center}]),q=e.computed(()=>b.singleAttrToObj(l.closeIcon,"icon",{icon:"icon-close",pointer:!0,size:16}));return i({resetPosition:g,updatePosition:C}),(s,a)=>(e.openBlock(),e.createElementBlock("div",{ref:e.unref(f),class:e.normalizeClass(p.value),style:e.normalizeStyle(e.unref(c)),tabindex:"-1"},[e.createElementVNode("header",{ref_key:"headerRef",ref:t,class:e.normalizeClass([e.unref(o).e("header"),s.headerClass,{"show-close":s.showClose}])},[e.renderSlot(s.$slots,"header",{},()=>[e.createElementVNode("span",{role:"heading",class:e.normalizeClass(e.unref(o).e("title"))},e.toDisplayString(s.title),3)]),s.showClose?(e.openBlock(),e.createBlock(e.unref(v.VftIcon),e.mergeProps({key:0,class:[e.unref(o).e("headerbtn")],onClick:a[0]||(a[0]=E=>s.$emit("close"))},q.value),null,16,["class"])):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{id:e.unref(u),class:e.normalizeClass([e.unref(o).e("body"),s.bodyClass])},[e.renderSlot(s.$slots,"default")],10,S),s.$slots.footer?(e.openBlock(),e.createElementBlock("footer",{key:0,class:e.normalizeClass([e.unref(o).e("footer"),s.footerClass])},[e.renderSlot(s.$slots,"footer")],2)):e.createCommentVNode("",!0)],6))}});exports.default=z;

package/lib/components/dialog/dialog.vue.d.ts

@@ -1,22 +1,4 @@
-import { type DialogContentProps } from './types';
-type DoneFn = (cancel?: boolean) => void;
-export interface DialogProps extends DialogContentProps {
-    appendToBody?: boolean;
-    beforeClose?: (done: DoneFn) => void;
-    destroyOnClose?: boolean;
-    closeOnClickModal?: boolean;
-    closeOnPressEscape?: boolean;
-    lockScroll?: boolean;
-    modal?: boolean;
-    openDelay?: number;
-    closeDelay?: number;
-    top?: string;
-    modelValue?: boolean;
-    modalClass?: string;
-    width?: string | number;
-    zIndex?: number;
-    trapFocus?: boolean;
-}
+import { type DialogProps } from './types';
 declare function __VLS_template(): {
     header?(_: {
         close: () => void;
@@ -28,8 +10,11 @@ declare function __VLS_template(): {
     footer?(_: {}): any;
 };
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DialogProps>>, {
+    /** @description whether the dialog is visible */
     visible: import("vue").Ref<boolean, boolean>;
     dialogContentRef: import("vue").Ref<any, any>;
+    resetPosition: () => void;
+    handleClose: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => void;
     close: () => void;

package/lib/components/dialog/dialog.vue2.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),R=require("@vft/utils"),T=require("../focus-trap/focus-trap.vue.cjs");require("../focus-trap/utils.cjs");const $=require("../overlay/index.cjs"),E=require("../../constants/event.cjs");require("@vueuse/core");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");require("../form/index.cjs");const I=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");const V=require("../../hooks/use-same-target/index.cjs");require("../../hooks/use-z-index/index.cjs");const D=require("../teleport/index.cjs"),L=require("./constants.cjs"),N=require("./dialog-content.vue2.cjs"),O=require("./hooks/use-dialog.cjs"),P=["aria-label","aria-labelledby","aria-describedby"],z=e.defineComponent({name:"vft-dialog",inheritAttrs:!1}),j=e.defineComponent({...z,props:{appendToBody:{type:Boolean,default:!1},beforeClose:{},destroyOnClose:{type:Boolean,default:!1},closeOnClickModal:{type:Boolean,default:!0},closeOnPressEscape:{type:Boolean,default:!0},lockScroll:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},openDelay:{default:0},closeDelay:{default:0},top:{},modelValue:{type:Boolean,default:!1},modalClass:{},width:{},zIndex:{},trapFocus:{type:Boolean,default:!1},center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{default:""},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""}},emits:{[E.UPDATE_MODEL_EVENT]:n=>R.isBoolean(n),open:()=>!0,opened:()=>!0,close:()=>!0,closed:()=>!0,openAutoFocus:()=>!0,closeAutoFocus:()=>!0},setup(n,{expose:y}){const a=I.useNamespace("dialog"),u=e.ref(),C=e.ref(),d=e.ref(),v=e.getCurrentInstance(),{visible:s,titleId:i,bodyId:f,style:g,overlayDialogStyle:m,rendered:c,zIndex:b,afterEnter:q,afterLeave:B,beforeLeave:k,handleClose:p,onModalClick:w,onOpenAutoFocus:h,onCloseAutoFocus:A,onCloseRequested:F,onFocusoutPrevented:S}=O.useDialog(v.props,u);e.provide(L.dialogInjectionKey,{dialogRef:u,headerRef:C,bodyId:f,ns:a,rendered:c,style:g});const t=V.useSameTarget(w),M=e.computed(()=>n.draggable&&!n.fullscreen);return y({visible:s,dialogContentRef:d}),(o,l)=>(e.openBlock(),e.createBlock(e.unref(D.VftTeleport),{to:"body",disabled:!o.appendToBody},{default:e.withCtx(()=>[e.createVNode(e.Transition,{name:"dialog-fade",onAfterEnter:e.unref(q),onAfterLeave:e.unref(B),onBeforeLeave:e.unref(k)},{default:e.withCtx(()=>[e.withDirectives(e.createVNode(e.unref($.VftOverlay),{"custom-mask-event":"",mask:o.modal,"overlay-class":o.modalClass,"z-index":e.unref(b)},{default:e.withCtx(()=>[e.createElementVNode("div",{role:"dialog","aria-modal":"true","aria-label":o.title||void 0,"aria-labelledby":o.title?void 0:e.unref(i),"aria-describedby":e.unref(f),class:e.normalizeClass(`${e.unref(a).namespace.value}-overlay-dialog`),style:e.normalizeStyle(e.unref(m)),onClick:l[0]||(l[0]=(...r)=>e.unref(t).onClick&&e.unref(t).onClick(...r)),onMousedown:l[1]||(l[1]=(...r)=>e.unref(t).onMousedown&&e.unref(t).onMousedown(...r)),onMouseup:l[2]||(l[2]=(...r)=>e.unref(t).onMouseup&&e.unref(t).onMouseup(...r))},[e.createVNode(e.unref(T.default),{loop:"",trapped:e.unref(s),"focus-start-el":"container",onFocusAfterTrapped:e.unref(h),onFocusAfterReleased:e.unref(A),onFocusoutPrevented:e.unref(S),onReleaseRequested:e.unref(F)},{default:e.withCtx(()=>[e.unref(c)?(e.openBlock(),e.createBlock(N.default,e.mergeProps({key:0,ref_key:"dialogContentRef",ref:d},o.$attrs,{"custom-class":o.customClass,center:o.center,"align-center":o.alignCenter,"close-icon":o.closeIcon,draggable:M.value,fullscreen:o.fullscreen,"show-close":o.showClose,title:o.title,onClose:e.unref(p)}),e.createSlots({header:e.withCtx(()=>[o.$slots.title?e.renderSlot(o.$slots,"title",{key:1}):e.renderSlot(o.$slots,"header",{key:0,close:e.unref(p),titleId:e.unref(i),titleClass:e.unref(a).e("title")})]),default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:2},[o.$slots.footer?{name:"footer",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"footer")]),key:"0"}:void 0]),1040,["custom-class","center","align-center","close-icon","draggable","fullscreen","show-close","title","onClose"])):e.createCommentVNode("",!0)]),_:3},8,["trapped","onFocusAfterTrapped","onFocusAfterReleased","onFocusoutPrevented","onReleaseRequested"])],46,P)]),_:3},8,["mask","overlay-class","z-index"]),[[e.vShow,e.unref(s)]])]),_:3},8,["onAfterEnter","onAfterLeave","onBeforeLeave"])]),_:3},8,["disabled"]))}});exports.default=j;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),$=require("../focus-trap/focus-trap.vue.cjs");require("../focus-trap/utils.cjs");const M=require("../overlay/index.cjs"),A=require("../teleport/index.cjs"),I=require("../../constants/event.cjs");require("@vueuse/core");const V=require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");require("../form/index.cjs");const D=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");const z=require("../../hooks/use-same-target/index.cjs");require("../../hooks/use-z-index/index.cjs");const E=require("./constants.cjs"),N=require("./dialog-content.vue2.cjs"),O=require("./use-dialog.cjs"),j=["aria-label","aria-labelledby","aria-describedby"],K=e.defineComponent({name:"vft-dialog",inheritAttrs:!1}),L=e.defineComponent({...K,props:{appendToBody:{type:Boolean,default:!1},appendTo:{default:"body"},beforeClose:{},destroyOnClose:{type:Boolean,default:!1},closeOnClickModal:{type:Boolean,default:!0},closeOnPressEscape:{type:Boolean,default:!0},lockScroll:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},openDelay:{default:0},closeDelay:{default:0},top:{},modalPenetrable:{type:Boolean},modelValue:{type:Boolean,default:!1},modalClass:{},width:{},zIndex:{},trapFocus:{type:Boolean,default:!1},overflow:{type:Boolean},transition:{},center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{default:""},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""},headerClass:{},bodyClass:{},footerClass:{}},emits:{[I.UPDATE_MODEL_EVENT]:r=>V.isBoolean(r),open:()=>!0,opened:()=>!0,close:()=>!0,closed:()=>!0,openAutoFocus:()=>!0,closeAutoFocus:()=>!0},setup(r,{expose:y}){const n=D.useNamespace("dialog"),i=e.ref(),C=e.ref(),s=e.ref(),v=e.getCurrentInstance(),{visible:u,titleId:f,bodyId:c,style:m,overlayDialogStyle:g,rendered:p,transitionConfig:b,zIndex:q,_draggable:B,_alignCenter:w,_overflow:h,handleClose:d,onModalClick:k,onOpenAutoFocus:P,onCloseAutoFocus:T,onCloseRequested:F,onFocusoutPrevented:R}=O.useDialog(v.props,i);e.provide(E.dialogInjectionKey,{dialogRef:i,headerRef:C,bodyId:c,ns:n,rendered:p,style:m});const l=z.useSameTarget(k),S=e.computed(()=>r.modalPenetrable&&!r.modal&&!r.fullscreen);return y({visible:u,dialogContentRef:s,resetPosition:()=>{s.value?.resetPosition()},handleClose:d}),(o,t)=>(e.openBlock(),e.createBlock(e.unref(A.VftTeleport),{to:o.appendTo,disabled:o.appendTo!=="body"?!1:!o.appendToBody},{default:e.withCtx(()=>[e.createVNode(e.Transition,e.normalizeProps(e.guardReactiveProps(e.unref(b))),{default:e.withCtx(()=>[e.withDirectives(e.createVNode(e.unref(M.VftOverlay),{"custom-mask-event":"",mask:o.modal,"overlay-class":[o.modalClass??"",`${e.unref(n).namespace.value}-modal-dialog`,e.unref(n).is("penetrable",S.value)],"z-index":e.unref(q)},{default:e.withCtx(()=>[e.createElementVNode("div",{role:"dialog","aria-modal":"true","aria-label":o.title||void 0,"aria-labelledby":o.title?void 0:e.unref(f),"aria-describedby":e.unref(c),class:e.normalizeClass(`${e.unref(n).namespace.value}-overlay-dialog`),style:e.normalizeStyle(e.unref(g)),onClick:t[0]||(t[0]=(...a)=>e.unref(l).onClick&&e.unref(l).onClick(...a)),onMousedown:t[1]||(t[1]=(...a)=>e.unref(l).onMousedown&&e.unref(l).onMousedown(...a)),onMouseup:t[2]||(t[2]=(...a)=>e.unref(l).onMouseup&&e.unref(l).onMouseup(...a))},[e.createVNode(e.unref($.default),{loop:"",trapped:e.unref(u),"focus-start-el":"container",onFocusAfterTrapped:e.unref(P),onFocusAfterReleased:e.unref(T),onFocusoutPrevented:e.unref(R),onReleaseRequested:e.unref(F)},{default:e.withCtx(()=>[e.unref(p)?(e.openBlock(),e.createBlock(N.default,e.mergeProps({key:0,ref_key:"dialogContentRef",ref:s},o.$attrs,{center:o.center,"align-center":e.unref(w),"close-icon":o.closeIcon,draggable:e.unref(B),overflow:e.unref(h),fullscreen:o.fullscreen,"header-class":o.headerClass,"body-class":o.bodyClass,"footer-class":o.footerClass,"show-close":o.showClose,title:o.title,onClose:e.unref(d)}),e.createSlots({header:e.withCtx(()=>[o.$slots.title?e.renderSlot(o.$slots,"title",{key:1}):e.renderSlot(o.$slots,"header",{key:0,close:e.unref(d),titleId:e.unref(f),titleClass:e.unref(n).e("title")})]),default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:2},[o.$slots.footer?{name:"footer",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"footer")]),key:"0"}:void 0]),1040,["center","align-center","close-icon","draggable","overflow","fullscreen","header-class","body-class","footer-class","show-close","title","onClose"])):e.createCommentVNode("",!0)]),_:3},8,["trapped","onFocusAfterTrapped","onFocusAfterReleased","onFocusoutPrevented","onReleaseRequested"])],46,j)]),_:3},8,["mask","overlay-class","z-index"]),[[e.vShow,e.unref(u)]])]),_:3},16)]),_:3},8,["to","disabled"]))}});exports.default=L;

package/lib/components/dialog/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const i=require("../../utils/vue/install.cjs");require("lodash-es");require("../form/index.cjs");const r=require("./dialog.vue2.cjs"),t=require("./constants.cjs"),u=require("./hooks/use-dialog.cjs"),e=i.withInstall(r.default);exports.dialogInjectionKey=t.dialogInjectionKey;exports.useDialog=u.useDialog;exports.VftDialog=e;exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const r=require("../../utils/vue/install.cjs");require("lodash-es");require("../form/index.cjs");const t=require("./dialog.vue2.cjs"),e=require("./constants.cjs"),u=require("./use-dialog.cjs"),i=r.withInstall(t.default);exports.DEFAULT_DIALOG_TRANSITION=e.DEFAULT_DIALOG_TRANSITION;exports.dialogInjectionKey=e.dialogInjectionKey;exports.useDialog=u.useDialog;exports.VftDialog=i;exports.default=i;

package/lib/components/dialog/index.d.ts

@@ -1,13 +1,14 @@
-import { type DialogProps } from './dialog.vue';
 export * from './constants';
-export * from './hooks/use-dialog';
+export * from './use-dialog';
 export * from './types';
-export type { DialogProps };
 export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
         appendToBody: {
             type: import("vue").PropType<boolean>;
         };
+        appendTo: {
+            type: import("vue").PropType<string | HTMLElement>;
+        };
         beforeClose: {
             type: import("vue").PropType<(done: (cancel?: boolean) => void) => void>;
         };
@@ -35,6 +36,9 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         top: {
             type: import("vue").PropType<string>;
         };
+        modalPenetrable: {
+            type: import("vue").PropType<boolean>;
+        };
         modelValue: {
             type: import("vue").PropType<boolean>;
         };
@@ -50,6 +54,12 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         trapFocus: {
             type: import("vue").PropType<boolean>;
         };
+        overflow: {
+            type: import("vue").PropType<boolean>;
+        };
+        transition: {
+            type: import("vue").PropType<string | import("vue").TransitionProps>;
+        };
         center: {
             type: import("vue").PropType<boolean>;
         };
@@ -74,6 +84,15 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         title: {
             type: import("vue").PropType<string>;
         };
+        headerClass: {
+            type: import("vue").PropType<string>;
+        };
+        bodyClass: {
+            type: import("vue").PropType<string>;
+        };
+        footerClass: {
+            type: import("vue").PropType<string>;
+        };
     }>> & Readonly<{
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         onClose?: (() => any) | undefined;
@@ -85,6 +104,8 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     }>, {
         visible: import("vue").Ref<boolean, boolean>;
         dialogContentRef: import("vue").Ref<any, any>;
+        resetPosition: () => void;
+        handleClose: () => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         "update:modelValue": (value: boolean) => void;
         close: () => void;
@@ -104,6 +125,9 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         appendToBody: {
             type: import("vue").PropType<boolean>;
         };
+        appendTo: {
+            type: import("vue").PropType<string | HTMLElement>;
+        };
         beforeClose: {
             type: import("vue").PropType<(done: (cancel?: boolean) => void) => void>;
         };
@@ -131,6 +155,9 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         top: {
             type: import("vue").PropType<string>;
         };
+        modalPenetrable: {
+            type: import("vue").PropType<boolean>;
+        };
         modelValue: {
             type: import("vue").PropType<boolean>;
         };
@@ -146,6 +173,12 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         trapFocus: {
             type: import("vue").PropType<boolean>;
         };
+        overflow: {
+            type: import("vue").PropType<boolean>;
+        };
+        transition: {
+            type: import("vue").PropType<string | import("vue").TransitionProps>;
+        };
         center: {
             type: import("vue").PropType<boolean>;
         };
@@ -170,6 +203,15 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
         title: {
             type: import("vue").PropType<string>;
         };
+        headerClass: {
+            type: import("vue").PropType<string>;
+        };
+        bodyClass: {
+            type: import("vue").PropType<string>;
+        };
+        footerClass: {
+            type: import("vue").PropType<string>;
+        };
     }>> & Readonly<{
         "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
         onClose?: (() => any) | undefined;
@@ -181,6 +223,8 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     }>, {
         visible: import("vue").Ref<boolean, boolean>;
         dialogContentRef: import("vue").Ref<any, any>;
+        resetPosition: () => void;
+        handleClose: () => void;
     }, {}, {}, {}, {}>;
     __isFragment?: never;
     __isTeleport?: never;
@@ -189,6 +233,9 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     appendToBody: {
         type: import("vue").PropType<boolean>;
     };
+    appendTo: {
+        type: import("vue").PropType<string | HTMLElement>;
+    };
     beforeClose: {
         type: import("vue").PropType<(done: (cancel?: boolean) => void) => void>;
     };
@@ -216,6 +263,9 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     top: {
         type: import("vue").PropType<string>;
     };
+    modalPenetrable: {
+        type: import("vue").PropType<boolean>;
+    };
     modelValue: {
         type: import("vue").PropType<boolean>;
     };
@@ -231,6 +281,12 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     trapFocus: {
         type: import("vue").PropType<boolean>;
     };
+    overflow: {
+        type: import("vue").PropType<boolean>;
+    };
+    transition: {
+        type: import("vue").PropType<string | import("vue").TransitionProps>;
+    };
     center: {
         type: import("vue").PropType<boolean>;
     };
@@ -255,6 +311,15 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
     title: {
         type: import("vue").PropType<string>;
     };
+    headerClass: {
+        type: import("vue").PropType<string>;
+    };
+    bodyClass: {
+        type: import("vue").PropType<string>;
+    };
+    footerClass: {
+        type: import("vue").PropType<string>;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onClose?: (() => any) | undefined;
@@ -266,6 +331,8 @@ export declare const VftDialog: import("vft/es/utils").SFCWithInstall<{
 }>, {
     visible: import("vue").Ref<boolean, boolean>;
     dialogContentRef: import("vue").Ref<any, any>;
+    resetPosition: () => void;
+    handleClose: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => void;
     close: () => void;

package/lib/components/dialog/types.d.ts

@@ -1,11 +1,80 @@
 import type { IconProps } from 'vft/es/components/icon';
+import type { TransitionProps } from 'vue';
+type DoneFn = (cancel?: boolean) => void;
+export interface DialogProps extends DialogContentProps {
+    /** 是否将对话框挂载到 body 元素上 */
+    appendToBody?: boolean;
+    /** 指定对话框挂载的容器元素 */
+    appendTo?: string | HTMLElement;
+    /** 关闭前的回调，会暂停对话框的关闭 */
+    beforeClose?: (done: DoneFn) => void;
+    /** 关闭时销毁对话框内的元素 */
+    destroyOnClose?: boolean;
+    /** 是否可以通过点击遮罩层关闭对话框 */
+    closeOnClickModal?: boolean;
+    /** 是否可以通过按下 ESC 键关闭对话框 */
+    closeOnPressEscape?: boolean;
+    /** 是否锁定页面滚动 */
+    lockScroll?: boolean;
+    /** 是否显示遮罩层 */
+    modal?: boolean;
+    /** 对话框打开的延时时间（毫秒） */
+    openDelay?: number;
+    /** 对话框关闭的延时时间（毫秒） */
+    closeDelay?: number;
+    /** 对话框距离顶部的距离 */
+    top?: string;
+    /** 遮罩层是否可穿透 */
+    modalPenetrable?: boolean;
+    /** 对话框是否可见 */
+    modelValue?: boolean;
+    /** 遮罩层的自定义类名 */
+    modalClass?: string;
+    /** 对话框的宽度 */
+    width?: string | number;
+    /** 对话框的层级 */
+    zIndex?: number;
+    /** 是否启用焦点陷阱 */
+    trapFocus?: boolean;
+    /** 是否允许对话框内容溢出 */
+    overflow?: boolean;
+    /** 对话框的过渡动画 */
+    transition?: string | TransitionProps;
+}
 export interface DialogContentProps {
+    /** 是否居中显示对话框 */
     center?: boolean;
+    /** 是否垂直居中显示对话框 */
     alignCenter?: boolean;
+    /** 关闭按钮的图标 */
     closeIcon?: string | IconProps;
+    /** 对话框的自定义类名 */
     customClass?: string;
+    /** 是否可拖拽对话框 */
     draggable?: boolean;
+    /** 是否全屏显示对话框 */
     fullscreen?: boolean;
+    /** 是否显示关闭按钮 */
     showClose?: boolean;
+    /** 对话框标题 */
     title?: string;
+    /** 是否允许对话框内容溢出 */
+    overflow?: boolean;
+    /** 对话框头部内容的自定义类名 */
+    headerClass?: string;
+    /** 对话框主体内容的自定义类名 */
+    bodyClass?: string;
+    /** 对话框底部内容的自定义类名 */
+    footerClass?: string;
+}
+export interface DialogConfigContext {
+    /** 是否垂直居中显示对话框 */
+    alignCenter?: boolean;
+    /** 是否可拖拽对话框 */
+    draggable?: boolean;
+    /** 是否允许对话框内容溢出 */
+    overflow?: boolean;
+    /** 对话框的过渡动画 */
+    transition?: string | TransitionProps;
 }
+export {};

package/lib/components/dialog/use-dialog.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("./constants.cjs");require("../config-provider/index.cjs");const W=require("../../constants/event.cjs"),x=require("@vueuse/core"),f=require("@vft/utils"),X=require("../../utils/helper.cjs"),n=require("vue");require("lodash-es");require("../form/index.cjs");const P=require("../../hooks/use-id/index.cjs"),Y=require("../../hooks/use-lockscreen/index.cjs");require("../../hooks/use-model-toggle/index.cjs");const H=require("../../hooks/use-namespace/index.cjs");require("@popperjs/core");const R=require("../../hooks/use-z-index/index.cjs"),p=require("../config-provider/hooks/use-global-config.cjs"),ee=(e,l)=>{const i=n.getCurrentInstance().emit,{nextZIndex:d}=R.useZIndex();let L="";const S=P.useId(),$=P.useId(),u=n.ref(!1),v=n.ref(!1),c=n.ref(!1),m=n.ref(e.zIndex??d());let g,y;const E=p.useGlobalConfig(),z=n.computed(()=>E.value?.namespace??H.defaultNamespace),s=n.computed(()=>E.value?.dialog),M=n.computed(()=>{const o={},a=`--${z.value}-dialog`;return e.fullscreen||(e.top&&(o[`${a}-margin-top`]=e.top),e.width&&(o[`${a}-width`]=X.addUnit(e.width))),o}),G=n.computed(()=>(e.draggable??s.value?.draggable??!1)&&!e.fullscreen),O=n.computed(()=>e.alignCenter??s.value?.alignCenter??!1),U=n.computed(()=>e.overflow??s.value?.overflow??!1),k=n.computed(()=>O.value?{display:"flex"}:{}),B=n.computed(()=>{const o=e.transition??s.value?.transition??N.DEFAULT_DIALOG_TRANSITION,a={name:o,onAfterEnter:C,onBeforeLeave:I,onAfterLeave:A};if(f.isObject(o)){const t={...o},b=(r,Q)=>_=>{f.isArray(r)?r.forEach(w=>{f.isFunction(w)&&w(_)}):f.isFunction(r)&&r(_),Q()};return t.onAfterEnter=b(t.onAfterEnter,C),t.onBeforeLeave=b(t.onBeforeLeave,I),t.onAfterLeave=b(t.onAfterLeave,A),t.name||(t.name=N.DEFAULT_DIALOG_TRANSITION),t}return a});function C(){i("opened")}function A(){i("closed"),i(W.UPDATE_MODEL_EVENT,!1),e.destroyOnClose&&(c.value=!1)}function I(){i("close")}function F(){y?.(),g?.(),e.openDelay&&e.openDelay>0?{stop:g}=x.useTimeoutFn(()=>h(),e.openDelay):h()}function q(){g?.(),y?.(),e.closeDelay&&e.closeDelay>0?{stop:y}=x.useTimeoutFn(()=>T(),e.closeDelay):T()}function D(){function o(a){a||(v.value=!0,u.value=!1)}console.log(111),e.beforeClose?e.beforeClose(o):q()}function V(){e.closeOnClickModal&&D()}function h(){x.isClient&&(u.value=!0)}function T(){u.value=!1}function j(){i("openAutoFocus")}function Z(){i("closeAutoFocus")}function J(o){o.detail?.focusReason==="pointer"&&o.preventDefault()}e.lockScroll&&Y.useLockscreen(u);function K(){e.closeOnPressEscape&&D()}return n.watch(()=>e.zIndex,()=>{m.value=e.zIndex??d()}),n.watch(()=>e.modelValue,o=>{o?(v.value=!1,F(),c.value=!0,m.value=e.zIndex??d(),n.nextTick(()=>{i("open"),l.value&&(l.value.parentElement.scrollTop=0,l.value.parentElement.scrollLeft=0,l.value.scrollTop=0)})):u.value&&q()}),n.watch(()=>e.fullscreen,o=>{l.value&&(o?(L=l.value.style.transform,l.value.style.transform=""):l.value.style.transform=L)}),n.onMounted(()=>{e.modelValue&&(u.value=!0,c.value=!0,F())}),{afterEnter:C,afterLeave:A,beforeLeave:I,handleClose:D,onModalClick:V,close:q,doClose:T,onOpenAutoFocus:j,onCloseAutoFocus:Z,onCloseRequested:K,onFocusoutPrevented:J,titleId:S,bodyId:$,closed:v,style:M,overlayDialogStyle:k,rendered:c,visible:u,zIndex:m,transitionConfig:B,_draggable:G,_alignCenter:O,_overflow:U}};exports.useDialog=ee;

package/lib/components/dialog/{hooks/use-dialog.d.ts → use-dialog.d.ts}

@@ -1,5 +1,5 @@
-import type { CSSProperties, Ref } from 'vue';
-import type { DialogProps } from '../dialog.vue';
+import type { CSSProperties, Ref, TransitionProps } from 'vue';
+import type { DialogProps } from './types';
 export declare const useDialog: (props: DialogProps, targetRef: Ref<HTMLElement | undefined>) => {
     afterEnter: () => void;
     afterLeave: () => void;
@@ -20,4 +20,13 @@ export declare const useDialog: (props: DialogProps, targetRef: Ref<HTMLElement
     rendered: Ref<boolean, boolean>;
     visible: Ref<boolean, boolean>;
     zIndex: Ref<number, number>;
+    transitionConfig: import("vue").ComputedRef<TransitionProps | {
+        name: string | TransitionProps;
+        onAfterEnter: () => void;
+        onBeforeLeave: () => void;
+        onAfterLeave: () => void;
+    }>;
+    _draggable: import("vue").ComputedRef<boolean>;
+    _alignCenter: import("vue").ComputedRef<boolean>;
+    _overflow: import("vue").ComputedRef<boolean>;
 };

package/lib/components/drawer/composables/useResizable.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),s=require("@vueuse/core");require("@vft/utils");const R=require("../../../utils/helper.cjs");require("lodash-es");require("../../form/index.cjs");function U(u,f){const{width:g,height:z}=s.useWindowSize(),n=e.computed(()=>["ltr","rtl"].includes(u.direction)),m=e.computed(()=>["ltr","ttb"].includes(u.direction)?1:-1),w=e.computed(()=>n.value?g.value:z.value),d=e.computed(()=>s.clamp(o.value+m.value*a.value,4,w.value)),o=e.ref(0),a=e.ref(0),r=e.ref(!1),i=e.ref(!1);let l=[],c=[];const h=()=>{const t=f.value?.closest('[aria-modal="true"]');return t?n.value?t.offsetWidth:t.offsetHeight:100};e.watch(()=>[u.size,u.resizable],()=>{i.value=!1,o.value=0,a.value=0,v()});const p=t=>{u.resizable&&(i.value||(o.value=h(),i.value=!0),l=[t.pageX,t.pageY],r.value=!0,c.push(s.useEventListener(window,"mouseup",v),s.useEventListener(window,"mousemove",S)))},S=t=>{const{pageX:q,pageY:E}=t,M=q-l[0],L=E-l[1];a.value=n.value?M:L},v=()=>{l=[],o.value=d.value,a.value=0,r.value=!1,c.forEach(t=>t?.()),c=[]},b=s.useEventListener(f,"mousedown",p);return e.onBeforeUnmount(()=>{b(),v()}),{size:e.computed(()=>i.value?`${d.value}px`:R.addUnit(u.size)),isResizing:r,isHorizontal:n}}exports.useResizable=U;

package/lib/components/drawer/composables/useResizable.d.ts

@@ -0,0 +1,7 @@
+import type { DrawerProps } from '../types';
+import type { Ref } from 'vue';
+export declare function useResizable(props: DrawerProps, target: Ref<HTMLElement | undefined>): {
+    size: import("vue").ComputedRef<string>;
+    isResizing: Ref<boolean, boolean>;
+    isHorizontal: import("vue").ComputedRef<boolean>;
+};

package/lib/components/drawer/drawer.vue.d.ts

@@ -1,10 +1,4 @@
-import { type DialogProps } from 'vft/es/components/dialog';
-export interface DrawerProps extends DialogProps {
-    direction?: 'ltr' | 'rtl' | 'ttb' | 'btt';
-    size?: string | number;
-    withHeader?: boolean;
-    modalFade?: boolean;
-}
+import type { DrawerProps } from './types';
 declare function __VLS_template(): {
     header?(_: {
         close: () => void;
@@ -17,6 +11,8 @@ declare function __VLS_template(): {
 };
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DrawerProps>>, {
     close: () => void;
+    afterEnter: () => void;
+    afterLeave: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => void;
     close: () => void;

package/lib/components/drawer/drawer.vue2.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("@vft/utils");require("../dialog/index.cjs");const g=require("../focus-trap/focus-trap.vue.cjs");require("../focus-trap/utils.cjs");const V=require("../icon/index.cjs"),E=require("../overlay/index.cjs"),z=require("../../constants/event.cjs");require("@vueuse/core");const S=require("../../utils/helper.cjs");require("lodash-es");require("../form/index.cjs");const N=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const $=require("../teleport/index.cjs"),A=require("../dialog/hooks/use-dialog.cjs"),I=["aria-label","aria-labelledby","aria-describedby"],D=["id"],R=["id"],T=e.defineComponent({name:"vft-drawer"}),O=e.defineComponent({...T,props:{direction:{default:"rtl"},size:{default:"30%"},withHeader:{type:Boolean,default:!0},modalFade:{type:Boolean,default:!0},appendToBody:{type:Boolean,default:!1},beforeClose:{},destroyOnClose:{type:Boolean,default:!1},closeOnClickModal:{type:Boolean,default:!0},closeOnPressEscape:{type:Boolean,default:!0},lockScroll:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},openDelay:{default:0},closeDelay:{default:0},top:{},modelValue:{type:Boolean,default:!1},modalClass:{},width:{},zIndex:{},trapFocus:{type:Boolean,default:!1},center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{default:""},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""}},emits:{[z.UPDATE_MODEL_EVENT]:l=>c.isBoolean(l),open:()=>!0,opened:()=>!0,close:()=>!0,closed:()=>!0,openAutoFocus:()=>!0,closeAutoFocus:()=>!0},setup(l,{expose:p}){const t=N.useNamespace("drawer"),m=e.getCurrentInstance(),r=e.ref(),{afterEnter:y,afterLeave:C,beforeLeave:B,handleClose:a,onModalClick:k,close:F,doClose:L,onOpenAutoFocus:M,onCloseAutoFocus:P,onCloseRequested:v,onFocusoutPrevented:H,titleId:n,bodyId:u,closed:j,style:U,overlayDialogStyle:G,rendered:b,visible:s,zIndex:h}=A.useDialog(m.props,r),d=e.ref(),q=e.computed(()=>l.direction==="rtl"||l.direction==="ltr"),i=e.computed(()=>S.addUnit(l.size)),w=e.computed(()=>c.singleAttrToObj(l.closeIcon,"icon",{icon:"icon-close",pointer:!0}));return p({close:a}),(o,f)=>(e.openBlock(),e.createBlock(e.unref($.VftTeleport),{to:"body",disabled:!o.appendToBody},{default:e.withCtx(()=>[e.createVNode(e.Transition,{name:e.unref(t).b("fade"),onAfterEnter:e.unref(y),onAfterLeave:e.unref(C),onBeforeLeave:e.unref(B)},{default:e.withCtx(()=>[e.withDirectives(e.createVNode(e.unref(E.VftOverlay),{mask:o.modal,"overlay-class":o.modalClass,"z-index":e.unref(h),onClick:e.unref(k)},{default:e.withCtx(()=>[e.createVNode(e.unref(g.default),{loop:"",trapped:e.unref(s),"focus-trap-el":r.value,"focus-start-el":d.value,onReleaseRequested:e.unref(v)},{default:e.withCtx(()=>[e.createElementVNode("div",e.mergeProps({ref_key:"drawerRef",ref:r,"aria-modal":"true","aria-label":o.title||void 0,"aria-labelledby":o.title?void 0:e.unref(n),"aria-describedby":e.unref(u)},o.$attrs,{class:[e.unref(t).b(),o.direction,e.unref(s)&&"open",o.customClass],style:q.value?"width: "+i.value:"height: "+i.value,role:"dialog",onClick:f[0]||(f[0]=e.withModifiers(()=>{},["stop"]))}),[e.createElementVNode("span",{ref_key:"focusStartRef",ref:d,class:e.normalizeClass(e.unref(t).e("sr-focus")),tabindex:"-1"},null,2),o.withHeader?(e.openBlock(),e.createElementBlock("header",{key:0,class:e.normalizeClass(e.unref(t).e("header"))},[o.$slots.title?e.renderSlot(o.$slots,"title",{key:1}):e.renderSlot(o.$slots,"header",{key:0,close:e.unref(a),titleId:e.unref(n),titleClass:e.unref(t).e("title")},()=>[o.$slots.title?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,id:e.unref(n),role:"heading",class:e.normalizeClass(e.unref(t).e("title"))},e.toDisplayString(o.title),11,D))]),o.showClose?(e.openBlock(),e.createBlock(e.unref(V.VftIcon),e.mergeProps({key:2,onClick:e.unref(a)},w.value,{class:e.unref(t).e("close")}),null,16,["onClick","class"])):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0),e.unref(b)?(e.openBlock(),e.createElementBlock("div",{key:1,id:e.unref(u),class:e.normalizeClass(e.unref(t).e("body"))},[e.renderSlot(o.$slots,"default")],10,R)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(e.unref(t).e("footer"))},[e.renderSlot(o.$slots,"footer")],2)):e.createCommentVNode("",!0)],16,I)]),_:3},8,["trapped","focus-trap-el","focus-start-el","onReleaseRequested"])]),_:3},8,["mask","overlay-class","z-index","onClick"]),[[e.vShow,e.unref(s)]])]),_:3},8,["name","onAfterEnter","onAfterLeave","onBeforeLeave"])]),_:3},8,["disabled"]))}});exports.default=O;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");require("../dialog/index.cjs");const E=require("../focus-trap/focus-trap.vue.cjs");require("../focus-trap/utils.cjs");const T=require("../icon/index.cjs"),F=require("../overlay/index.cjs"),N=require("../teleport/index.cjs"),S=require("../../constants/event.cjs");require("@vueuse/core");const C=require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");require("../form/index.cjs");const I=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const $=require("./composables/useResizable.cjs"),P=require("../dialog/use-dialog.cjs"),D=["aria-label","aria-labelledby","aria-describedby"],O=["id"],L=["id"],M=e.defineComponent({name:"vft-drawer",inheritAttrs:!1}),H=e.defineComponent({...M,props:{direction:{default:"rtl"},size:{default:"30%"},withHeader:{type:Boolean,default:!0},modalFade:{type:Boolean,default:!0},resizable:{type:Boolean,default:!1},appendToBody:{type:Boolean,default:!1},appendTo:{default:"body"},beforeClose:{},destroyOnClose:{type:Boolean,default:!1},closeOnClickModal:{type:Boolean,default:!0},closeOnPressEscape:{type:Boolean,default:!0},lockScroll:{type:Boolean,default:!0},modal:{type:Boolean,default:!0},openDelay:{default:0},closeDelay:{default:0},top:{},modalPenetrable:{type:Boolean},modelValue:{type:Boolean,default:!1},modalClass:{},width:{},zIndex:{},trapFocus:{type:Boolean,default:!1},overflow:{type:Boolean},transition:{},center:{type:Boolean,default:!1},alignCenter:{type:Boolean,default:!1},closeIcon:{},customClass:{default:""},draggable:{type:Boolean,default:!1},fullscreen:{type:Boolean,default:!1},showClose:{type:Boolean,default:!0},title:{default:""},headerClass:{},bodyClass:{},footerClass:{}},emits:{[S.UPDATE_MODEL_EVENT]:t=>C.isBoolean(t),open:()=>!0,opened:()=>!0,close:()=>!0,closed:()=>!0,openAutoFocus:()=>!0,closeAutoFocus:()=>!0},setup(t,{expose:B}){const u=e.getCurrentInstance(),l=e.ref(),d=e.ref(),i=e.ref(),r=I.useNamespace("drawer"),{afterEnter:f,afterLeave:c,beforeLeave:b,visible:a,rendered:k,titleId:n,bodyId:p,zIndex:y,onModalClick:v,onOpenAutoFocus:g,onCloseAutoFocus:h,onFocusoutPrevented:q,onCloseRequested:z,handleClose:s}=P.useDialog(u.props,l),{isHorizontal:w,size:R,isResizing:V}=$.useResizable(u.props,i),A=e.computed(()=>C.singleAttrToObj(t.closeIcon,"icon",{icon:"icon-close",pointer:!0}));return B({close:s,afterEnter:f,afterLeave:c}),(o,m)=>(e.openBlock(),e.createBlock(e.unref(N.VftTeleport),{to:o.appendTo,disabled:o.appendTo!=="body"?!1:!o.appendToBody},{default:e.withCtx(()=>[e.createVNode(e.Transition,{name:e.unref(r).b("fade"),onAfterEnter:e.unref(f),onAfterLeave:e.unref(c),onBeforeLeave:e.unref(b)},{default:e.withCtx(()=>[e.withDirectives(e.createVNode(e.unref(F.VftOverlay),{mask:o.modal,"overlay-class":[e.unref(r).is("drawer"),o.modalClass??""],"z-index":e.unref(y),onClick:e.unref(v)},{default:e.withCtx(()=>[e.createVNode(e.unref(E.default),{loop:"",trapped:e.unref(a),"focus-trap-el":l.value,"focus-start-el":d.value,onFocusAfterTrapped:e.unref(g),onFocusAfterReleased:e.unref(h),onFocusoutPrevented:e.unref(q),onReleaseRequested:e.unref(z)},{default:e.withCtx(()=>[e.createElementVNode("div",e.mergeProps({ref_key:"drawerRef",ref:l,"aria-modal":"true","aria-label":o.title||void 0,"aria-labelledby":o.title?void 0:e.unref(n),"aria-describedby":e.unref(p)},o.$attrs,{class:[e.unref(r).b(),o.direction,e.unref(a)&&"open",e.unref(r).is("dragging",e.unref(V))],style:{[e.unref(w)?"width":"height"]:e.unref(R)},role:"dialog",onClick:m[0]||(m[0]=e.withModifiers(()=>{},["stop"]))}),[e.createElementVNode("span",{ref_key:"focusStartRef",ref:d,class:e.normalizeClass(e.unref(r).e("sr-focus")),tabindex:"-1"},null,2),o.withHeader?(e.openBlock(),e.createElementBlock("header",{key:0,class:e.normalizeClass([e.unref(r).e("header"),o.headerClass])},[o.$slots.title?e.renderSlot(o.$slots,"title",{key:1}):e.renderSlot(o.$slots,"header",{key:0,close:e.unref(s),titleId:e.unref(n),titleClass:e.unref(r).e("title")},()=>[e.createElementVNode("span",{id:e.unref(n),role:"heading",class:e.normalizeClass(e.unref(r).e("title"))},e.toDisplayString(o.title),11,O)]),o.showClose?(e.openBlock(),e.createBlock(e.unref(T.VftIcon),e.mergeProps({key:2,onClick:e.unref(s)},A.value,{class:e.unref(r).e("close")}),null,16,["onClick","class"])):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0),e.unref(k)?(e.openBlock(),e.createElementBlock("div",{key:1,id:e.unref(p),class:e.normalizeClass([e.unref(r).e("body"),o.bodyClass])},[e.renderSlot(o.$slots,"default")],10,L)):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass([e.unref(r).e("footer"),o.footerClass])},[e.renderSlot(o.$slots,"footer")],2)):e.createCommentVNode("",!0),o.resizable?(e.openBlock(),e.createElementBlock("div",{key:3,ref_key:"draggerRef",ref:i,style:e.normalizeStyle({zIndex:e.unref(y)}),class:e.normalizeClass(e.unref(r).e("dragger"))},null,6)):e.createCommentVNode("",!0)],16,D)]),_:3},8,["trapped","focus-trap-el","focus-start-el","onFocusAfterTrapped","onFocusAfterReleased","onFocusoutPrevented","onReleaseRequested"])]),_:3},8,["mask","overlay-class","z-index","onClick"]),[[e.vShow,e.unref(a)]])]),_:3},8,["name","onAfterEnter","onAfterLeave","onBeforeLeave"])]),_:3},8,["to","disabled"]))}});exports.default=H;