@gopowerteam/modal-render 0.0.7 → 0.0.8

package/dist/cjs/components/modal-provider.vue.d.ts

@@ -1,4 +1,5 @@
-import type { ModalElement, SizeOptions } from '../interfaces';
+import type { Component } from 'vue';
+import type { ModalElement, OpenModalOptions, SizeOptions } from '../interfaces';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     appendToBody: boolean | string;
     sizes: SizeOptions;
@@ -15,6 +16,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     };
 }>, {
     elements: import("vue").ShallowRef<ModalElement[]>;
+    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'success', props?: Record<string, any>, options?: OpenModalOptions) => Promise<unknown> & {
+        close: () => void;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     appendToBody: boolean | string;
     sizes: SizeOptions;

package/dist/cjs/hooks/use-modal.d.ts

@@ -5,11 +5,13 @@ export declare function useModal(): {
         (component: 'confirm', props: {
             title?: string;
             content: string;
+            onOk?: () => Promise<void> | void;
+            onCancel?: () => Promise<void> | void;
             footer?: () => JSX.Element;
         }): Promise<any> & {
             close: () => void;
         };
-        (component: 'info' | 'warning' | 'error' | 'sucess', props: {
+        (component: 'info' | 'warning' | 'error' | 'success', props: {
             title?: string;
             content: string;
         }): Promise<any> & {
@@ -23,4 +25,37 @@ export declare function useModal(): {
     closeAll(): void;
     showLoading(): void;
     hideLoading(): void;
+    confirm(props: {
+        title?: string;
+        content: string;
+        onOk?: () => Promise<void> | void;
+        onCancel?: () => Promise<void> | void;
+        footer?: () => JSX.Element;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    info(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    error(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    warning(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    success(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
 };

package/dist/cjs/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");const S=Symbol("__MODAL__");function R(o){return e.getCurrentScope()?(e.onScopeDispose(o),!0):!1}function C(o){return typeof o=="function"?o():e.unref(o)}const A=typeof window<"u"&&typeof document<"u",F=Object.prototype.toString,I=o=>F.call(o)==="[object Object]",H=()=>{};function W(o,s={}){if(!e.isRef(o))return e.toRefs(o);const n=Array.isArray(o.value)?Array.from({length:o.value.length}):{};for(const t in o.value)n[t]=e.customRef(()=>({get(){return o.value[t]},set(a){var i;if((i=C(s.replaceRef))!=null?i:!0)if(Array.isArray(o.value)){const y=[...o.value];y[t]=a,o.value=y}else{const y={...o.value,[t]:a};Object.setPrototypeOf(y,Object.getPrototypeOf(o.value)),o.value=y}else o.value[t]=a}}));return n}function j(o){var s;const n=C(o);return(s=n==null?void 0:n.$el)!=null?s:n}const D=A?window:void 0;function P(...o){let s,n,t,a;if(typeof o[0]=="string"||Array.isArray(o[0])?([n,t,a]=o,s=D):[s,n,t,a]=o,!s)return H;Array.isArray(n)||(n=[n]),Array.isArray(t)||(t=[t]);const i=[],f=()=>{i.forEach(m=>m()),i.length=0},y=(m,g,l,u)=>(m.addEventListener(g,l,u),()=>m.removeEventListener(g,l,u)),_=e.watch(()=>[j(s),C(a)],([m,g])=>{if(f(),!m)return;const l=I(g)?{...g}:g;i.push(...n.flatMap(u=>t.map(c=>y(m,u,c,l))))},{immediate:!0,flush:"post"}),w=()=>{_(),f()};return R(w),w}function K(o,s={}){var n,t;const{pointerTypes:a,preventDefault:i,stopPropagation:f,exact:y,onMove:_,onEnd:w,onStart:m,initialValue:g,axis:l="both",draggingElement:u=D,containerElement:c,handle:v=o}=s,p=e.ref((n=C(g))!=null?n:{x:0,y:0}),h=e.ref(),E=d=>a?a.includes(d.pointerType):!0,B=d=>{C(i)&&d.preventDefault(),C(f)&&d.stopPropagation()},V=d=>{var b;if(!E(d)||C(y)&&d.target!==C(o))return;const x=((b=C(c))!=null?b:C(o)).getBoundingClientRect(),r={x:d.clientX-x.left,y:d.clientY-x.top};(m==null?void 0:m(r,d))!==!1&&(h.value=r,B(d))},L=d=>{if(!E(d)||!h.value)return;let{x:b,y:M}=p.value;(l==="x"||l==="both")&&(b=d.clientX-h.value.x),(l==="y"||l==="both")&&(M=d.clientY-h.value.y),p.value={x:b,y:M},_==null||_(p.value,d),B(d)},$=d=>{E(d)&&h.value&&(h.value=void 0,w==null||w(p.value,d),B(d))};if(A){const d={capture:(t=s.capture)!=null?t:!0};P(v,"pointerdown",V,d),P(u,"pointermove",L,d),P(u,"pointerup",$,d)}return{...W(p),position:p,isDragging:e.computed(()=>!!h.value),style:e.computed(()=>`left:${p.value.x}px;top:${p.value.y}px;`)}}const X=o=>(e.pushScopeId("data-v-450bcc09"),o=o(),e.popScopeId(),o),Y={class:"title font-bold"},q={class:"action"},G={key:1,class:"modal-footer space-x-2"},U=["form"],J={key:2,class:"modal-loading"},Q=X(()=>e.createElementVNode("div",{class:"lds-ring"},[e.createElementVNode("div"),e.createElementVNode("div"),e.createElementVNode("div"),e.createElementVNode("div")],-1)),Z=[Q],ee={name:"ModalContainer",inheritAttrs:!0},te=e.defineComponent({...ee,props:{id:{},form:{},component:{},componentProps:{},width:{},maxWidth:{},maxHeight:{},sizes:{},size:{default:"middle"},fullscreen:{type:Boolean},title:{},header:{type:Boolean,default:!0},footer:{type:Boolean,default:!1},closeable:{type:Boolean,default:!0},esc:{type:Boolean,default:!1},maskClosable:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},mode:{default:"dialog"},type:{}},emits:["submit"],setup(o,{expose:s,emit:n}){const t=o,a=n,i=e.inject(S),f=e.ref(!1);let y=0,_=0;const w=e.shallowRef(),m=e.shallowRef(),g=e.shallowRef(),{x:l,y:u}=K(g,{initialValue:{x:0,y:0}});function c(){i==null||i.close(t.id)}function v(r){if(typeof r=="number")return`${r}px`;if(typeof r=="string")return r}const p=e.computed(()=>{const r={};return t.mode==="dialog"&&(r.justifyContent="center"),t.mode==="drawer"&&(r.justifyContent="flex-end"),r}),h=e.computed(()=>{const r={};return t.size&&(r.width=v(t.sizes[t.size])),t.width&&(r.width=v(t.width)),t.maxWidth&&(r.maxWidth=v(t.maxWidth)),t.fullscreen&&(r.maxWidth="unset",r.width="100%",r.position="fixed",r.top=0,r.left=0,r.bottom=0,r.right=0,r.borderRadius=0),t.draggable&&!t.fullscreen&&t.mode==="dialog"&&(r.transform=`translate3d(${l.value-y}px, ${u.value-_}px, 0px)`),t.mode==="drawer"&&(r.borderRadius=0),r}),E=e.computed(()=>{const r={};return t.draggable&&!t.fullscreen&&t.mode==="dialog"&&(r.cursor="move"),r}),B=e.computed(()=>{var k;const r={};return t.maxHeight&&(r.maxHeight=`calc(${(k=v(t.maxHeight))==null?void 0:k.replace("%","vh")} - 50px)`),t.mode==="drawer"&&(r.maxHeight="unset",r.height=`calc(100vh - ${(t.header?50:0)+(t.footer?50:0)}px)`),t.fullscreen&&(r.maxHeight="unset",r.height=`calc(100vh - ${(t.header?50:0)+(t.footer?50:0)}px)`),t.type!=="component"&&(r.padding="0"),r});function V(){const r=m.value;if(t.form&&r){const k=r.querySelector(`form[name="${t.form}"]`);k&&k.dispatchEvent(new Event("submit"))}a("submit")}function L(){i==null||i.close(t.id)}function $(){window&&window.addEventListener("resize",()=>{e.triggerRef(w),e.triggerRef(m),y=m.value.offsetLeft,_=m.value.offsetTop})}function d(){if(t.closeable&&t.esc){const r=({key:k})=>{k==="Escape"&&(i==null||i.close(t.id),window.removeEventListener("keydown",r))};window.addEventListener("keydown",r)}}function b(){y=m.value.offsetLeft,_=m.value.offsetTop}e.onMounted(()=>{d(),$()}),e.onUnmounted(()=>{});function M(){return f.value=!0,()=>x()}function x(){f.value=!1}return s({showLoading:M,hideLoading:x}),(r,k)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"wrapperRef",ref:w,class:"modal-wrapper",style:e.normalizeStyle(p.value),onClick:k[0]||(k[0]=e.withModifiers(pe=>r.maskClosable&&c(),["self"]))},[e.createElementVNode("div",{ref_key:"contentRef",ref:m,class:e.normalizeClass(["modal-content",{[`${r.mode}-mode`]:!0}]),style:e.normalizeStyle(h.value)},[r.header?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"headerRef",ref:g,class:"modal-header",style:e.normalizeStyle(E.value),onMousedown:b},[e.createElementVNode("div",Y,e.toDisplayString(r.title),1),e.createElementVNode("div",q,[r.closeable?(e.openBlock(),e.createElementBlock("div",{key:0,class:"i-icon-park-outline:close block cursor-pointer",onClick:c})):e.createCommentVNode("",!0)])],36)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"modal-body",style:e.normalizeStyle(B.value)},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.component),e.normalizeProps(e.guardReactiveProps(r.componentProps)),null,16))],4),r.footer?(e.openBlock(),e.createElementBlock("div",G,[e.createElementVNode("button",{class:"submit-button",form:r.form,type:"submit",onClick:V}," 确定 ",8,U),e.createElementVNode("button",{class:"cancel-button",type:"button",onClick:L}," 取消 ")])):e.createCommentVNode("",!0),f.value?(e.openBlock(),e.createElementBlock("div",J,Z)):e.createCommentVNode("",!0)],6)],4))}});const z=(o,s)=>{const n=o.__vccOpts||o;for(const[t,a]of s)n[t]=a;return n},O=z(te,[["__scopeId","data-v-450bcc09"]]),oe={class:"modal-dialog"},ne={class:"dialog-body"},re={class:"dialog-title"},le={class:"dialog-content"},ie=e.defineComponent({__name:"modal-dialog",props:{type:{},title:{},content:{},okText:{default:"确定"},cancelText:{default:"取消"},onOk:{},onCancel:{},footer:{}},setup(o){const s=o,n=T(),t=e.computed(()=>s.title?s.title:{confirm:"提示",info:"提示",warning:"警告",error:"错误",success:"成功"}[s.type]);async function a(){s.onOk&&await s.onOk(),n.close()}async function i(){s.onCancel&&await s.onCancel(),n.close()}return(f,y)=>(e.openBlock(),e.createElementBlock("section",oe,[e.createElementVNode("div",ne,[e.createElementVNode("div",re,e.toDisplayString(t.value),1),e.createElementVNode("div",le,e.toDisplayString(f.content),1)]),e.createElementVNode("div",{class:"dialog-footer space-x-2",style:e.normalizeStyle(f.type==="confirm"?{"justify-content":"end"}:{"border-top":"none"})},[f.footer?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.footer),{key:0})):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("button",{class:"submit-button",type:"submit",onClick:a},e.toDisplayString(f.okText),1),f.type==="confirm"?(e.openBlock(),e.createElementBlock("button",{key:0,class:"cancel-button",type:"button",onClick:i},e.toDisplayString(f.cancelText),1)):e.createCommentVNode("",!0)],64))],4)]))}});const se=z(ie,[["__scopeId","data-v-8326e5a5"]]),ae={key:0,class:"modal-teleport"},ce={name:"ModalProvider",inheritAttrs:!0},de=e.defineComponent({...ce,props:{appendToBody:{type:[Boolean,String],default:!1},sizes:{default:()=>({small:520,middle:860,large:1190})},maxWidth:{default:"80%"},maxHeight:{default:"80%"}},setup(o,{expose:s}){const n=e.shallowRef([]),t=e.ref(!1),a=e.getCurrentInstance();function i(l,u={},c={}){const v=e.defineAsyncComponent(()=>Promise.resolve(typeof l=="string"?se:l));typeof l=="string"&&(u.type=l,c.size="small",c.fullscreen=!1,c.mode="dialog",c.footer=!1,c.header=!1);const p=Math.random().toString(32).slice(2),h=new Promise(E=>{n.value.push({id:p,component:v,props:u||{},options:{...c,type:typeof l=="string"?l:"component"},resolve:E,listeners:[]}),e.triggerRef(n)});return Object.assign(h,{close:()=>f(p)})}function f(l,u){const c=n.value.findIndex(p=>p.id===l);if(c<0)return;const v=n.value[c];v==null||v.resolve(u),n.value.splice(c,1),e.triggerRef(n)}function y(){n.value.forEach(l=>{l.resolve()}),n.value=[],e.triggerRef(n)}function _(l,u){const c=n.value.find(p=>p.id===l);if(!c)return;const v=c.listeners.find(p=>p.event===u);v&&v.callback({open:i,close:()=>f(c.id),closeAll:y,showLoading:()=>w(c.id),hideLoading:()=>m(c.id)})}function w(l){if(!a)return;const[u]=a.refs[`modal-container_${l}`];if(u)return u.showLoading()}function m(l){if(!a)return;const[u]=a.refs[`modal-container_${l}`];if(u)return u.hideLoading()}function g(l,u,c){const v=n.value.find(p=>p.id===l);v&&v.listeners.push({event:u,callback:c})}return e.provide(S,{open:i,close:f,closeAll:y,addEventListener:g}),s({elements:n}),e.onMounted(()=>{t.value=!0}),(l,u)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.renderSlot(l.$slots,"default",{},void 0,!0),t.value?(e.openBlock(),e.createElementBlock("div",ae,[(e.openBlock(),e.createBlock(e.Teleport,{disabled:!l.appendToBody,to:typeof l.appendToBody=="string"?l.appendToBody:"body"},[e.createVNode(e.TransitionGroup,{name:"modal-fade"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.value,c=>(e.openBlock(),e.createBlock(O,e.mergeProps({id:c.id,key:c.id,ref_for:!0,ref:`modal-container_${c.id}`,component:c.component,"component-props":c.props,"max-height":l.maxHeight,"max-width":l.maxWidth,sizes:l.sizes},c.options,{onSubmit:()=>_(c.id,"submit")}),null,16,["id","component","component-props","max-height","max-width","sizes","onSubmit"]))),128))]),_:1})],8,["disabled","to"]))])):e.createCommentVNode("",!0)],64))}});const ue=z(de,[["__scopeId","data-v-09133e47"]]);function N(o,s){var t,a;let n=o==null?void 0:o.parent;for(;n&&((t=n==null?void 0:n.type)==null?void 0:t.name)!==s;)n=n.parent;return((a=n==null?void 0:n.type)==null?void 0:a.name)===s?n:null}function T(){const o=e.inject(S),s=e.getCurrentInstance();function n(t,a,i){if(!o)throw new Error("Not Found Modal Provider Component");return o.open(t,a,i)}return{open:n,close(t){var f;if(!o)throw new Error("Not Found Modal Provider Component");const a=N(s,"ModalContainer"),i=(f=a==null?void 0:a.props)==null?void 0:f.id;if(!i)throw new Error("Not Found Current Modal Container");o.close(i,t)},closeAll(){if(!o)throw new Error("Not Found Modal Provider Component");o.closeAll()},showLoading(){var i;if(!o)throw new Error("Not Found Modal Provider Component");const t=N(s,"ModalContainer");if(!((i=t==null?void 0:t.props)==null?void 0:i.id))throw new Error("Not Found Current Modal Container");t!=null&&t.exposed&&(t==null||t.exposed.showLoading())},hideLoading(){var i;if(!o)throw new Error("Not Found Modal Provider Component");const t=N(s,"ModalContainer");if(!((i=t==null?void 0:t.props)==null?void 0:i.id))throw new Error("Not Found Current Modal Container");t!=null&&t.exposed&&(t==null||t.exposed.hideLoading())}}}function fe(o){var i;const s=e.inject(S),n=e.getCurrentInstance(),t=N(n,"ModalContainer"),a=(i=t==null?void 0:t.props)==null?void 0:i.id;s&&a&&s.addEventListener(a,"submit",o)}exports.ModalContainer=O;exports.ModalKey=S;exports.ModalProvider=ue;exports.onSubmit=fe;exports.useModal=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");const S=Symbol("__MODAL__");function R(o){return e.getCurrentScope()?(e.onScopeDispose(o),!0):!1}function b(o){return typeof o=="function"?o():e.unref(o)}const A=typeof window<"u"&&typeof document<"u",F=Object.prototype.toString,I=o=>F.call(o)==="[object Object]",H=()=>{};function W(o,s={}){if(!e.isRef(o))return e.toRefs(o);const n=Array.isArray(o.value)?Array.from({length:o.value.length}):{};for(const t in o.value)n[t]=e.customRef(()=>({get(){return o.value[t]},set(a){var i;if((i=b(s.replaceRef))!=null?i:!0)if(Array.isArray(o.value)){const y=[...o.value];y[t]=a,o.value=y}else{const y={...o.value,[t]:a};Object.setPrototypeOf(y,Object.getPrototypeOf(o.value)),o.value=y}else o.value[t]=a}}));return n}function j(o){var s;const n=b(o);return(s=n==null?void 0:n.$el)!=null?s:n}const D=A?window:void 0;function P(...o){let s,n,t,a;if(typeof o[0]=="string"||Array.isArray(o[0])?([n,t,a]=o,s=D):[s,n,t,a]=o,!s)return H;Array.isArray(n)||(n=[n]),Array.isArray(t)||(t=[t]);const i=[],p=()=>{i.forEach(m=>m()),i.length=0},y=(m,g,l,f)=>(m.addEventListener(g,l,f),()=>m.removeEventListener(g,l,f)),_=e.watch(()=>[j(s),b(a)],([m,g])=>{if(p(),!m)return;const l=I(g)?{...g}:g;i.push(...n.flatMap(f=>t.map(c=>y(m,f,c,l))))},{immediate:!0,flush:"post"}),w=()=>{_(),p()};return R(w),w}function K(o,s={}){var n,t;const{pointerTypes:a,preventDefault:i,stopPropagation:p,exact:y,onMove:_,onEnd:w,onStart:m,initialValue:g,axis:l="both",draggingElement:f=D,containerElement:c,handle:v=o}=s,d=e.ref((n=b(g))!=null?n:{x:0,y:0}),h=e.ref(),C=u=>a?a.includes(u.pointerType):!0,B=u=>{b(i)&&u.preventDefault(),b(p)&&u.stopPropagation()},V=u=>{var E;if(!C(u)||b(y)&&u.target!==b(o))return;const x=((E=b(c))!=null?E:b(o)).getBoundingClientRect(),r={x:u.clientX-x.left,y:u.clientY-x.top};(m==null?void 0:m(r,u))!==!1&&(h.value=r,B(u))},L=u=>{if(!C(u)||!h.value)return;let{x:E,y:M}=d.value;(l==="x"||l==="both")&&(E=u.clientX-h.value.x),(l==="y"||l==="both")&&(M=u.clientY-h.value.y),d.value={x:E,y:M},_==null||_(d.value,u),B(u)},$=u=>{C(u)&&h.value&&(h.value=void 0,w==null||w(d.value,u),B(u))};if(A){const u={capture:(t=s.capture)!=null?t:!0};P(v,"pointerdown",V,u),P(f,"pointermove",L,u),P(f,"pointerup",$,u)}return{...W(d),position:d,isDragging:e.computed(()=>!!h.value),style:e.computed(()=>`left:${d.value.x}px;top:${d.value.y}px;`)}}const X=o=>(e.pushScopeId("data-v-450bcc09"),o=o(),e.popScopeId(),o),Y={class:"title font-bold"},q={class:"action"},G={key:1,class:"modal-footer space-x-2"},U=["form"],J={key:2,class:"modal-loading"},Q=X(()=>e.createElementVNode("div",{class:"lds-ring"},[e.createElementVNode("div"),e.createElementVNode("div"),e.createElementVNode("div"),e.createElementVNode("div")],-1)),Z=[Q],ee={name:"ModalContainer",inheritAttrs:!0},te=e.defineComponent({...ee,props:{id:{},form:{},component:{},componentProps:{},width:{},maxWidth:{},maxHeight:{},sizes:{},size:{default:"middle"},fullscreen:{type:Boolean},title:{},header:{type:Boolean,default:!0},footer:{type:Boolean,default:!1},closeable:{type:Boolean,default:!0},esc:{type:Boolean,default:!1},maskClosable:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},mode:{default:"dialog"},type:{}},emits:["submit"],setup(o,{expose:s,emit:n}){const t=o,a=n,i=e.inject(S),p=e.ref(!1);let y=0,_=0;const w=e.shallowRef(),m=e.shallowRef(),g=e.shallowRef(),{x:l,y:f}=K(g,{initialValue:{x:0,y:0}});function c(){i==null||i.close(t.id)}function v(r){if(typeof r=="number")return`${r}px`;if(typeof r=="string")return r}const d=e.computed(()=>{const r={};return t.mode==="dialog"&&(r.justifyContent="center"),t.mode==="drawer"&&(r.justifyContent="flex-end"),r}),h=e.computed(()=>{const r={};return t.size&&(r.width=v(t.sizes[t.size])),t.width&&(r.width=v(t.width)),t.maxWidth&&(r.maxWidth=v(t.maxWidth)),t.fullscreen&&(r.maxWidth="unset",r.width="100%",r.position="fixed",r.top=0,r.left=0,r.bottom=0,r.right=0,r.borderRadius=0),t.draggable&&!t.fullscreen&&t.mode==="dialog"&&(r.transform=`translate3d(${l.value-y}px, ${f.value-_}px, 0px)`),t.mode==="drawer"&&(r.borderRadius=0),r}),C=e.computed(()=>{const r={};return t.draggable&&!t.fullscreen&&t.mode==="dialog"&&(r.cursor="move"),r}),B=e.computed(()=>{var k;const r={};return t.maxHeight&&(r.maxHeight=`calc(${(k=v(t.maxHeight))==null?void 0:k.replace("%","vh")} - 50px)`),t.mode==="drawer"&&(r.maxHeight="unset",r.height=`calc(100vh - ${(t.header?50:0)+(t.footer?50:0)}px)`),t.fullscreen&&(r.maxHeight="unset",r.height=`calc(100vh - ${(t.header?50:0)+(t.footer?50:0)}px)`),t.type!=="component"&&(r.padding="0"),r});function V(){const r=m.value;if(t.form&&r){const k=r.querySelector(`form[name="${t.form}"]`);k&&k.dispatchEvent(new Event("submit"))}a("submit")}function L(){i==null||i.close(t.id)}function $(){window&&window.addEventListener("resize",()=>{e.triggerRef(w),e.triggerRef(m),y=m.value.offsetLeft,_=m.value.offsetTop})}function u(){if(t.closeable&&t.esc){const r=({key:k})=>{k==="Escape"&&(i==null||i.close(t.id),window.removeEventListener("keydown",r))};window.addEventListener("keydown",r)}}function E(){y=m.value.offsetLeft,_=m.value.offsetTop}e.onMounted(()=>{u(),$()}),e.onUnmounted(()=>{});function M(){return p.value=!0,()=>x()}function x(){p.value=!1}return s({showLoading:M,hideLoading:x}),(r,k)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"wrapperRef",ref:w,class:"modal-wrapper",style:e.normalizeStyle(d.value),onClick:k[0]||(k[0]=e.withModifiers(pe=>r.maskClosable&&c(),["self"]))},[e.createElementVNode("div",{ref_key:"contentRef",ref:m,class:e.normalizeClass(["modal-content",{[`${r.mode}-mode`]:!0}]),style:e.normalizeStyle(h.value)},[r.header?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"headerRef",ref:g,class:"modal-header",style:e.normalizeStyle(C.value),onMousedown:E},[e.createElementVNode("div",Y,e.toDisplayString(r.title),1),e.createElementVNode("div",q,[r.closeable?(e.openBlock(),e.createElementBlock("div",{key:0,class:"i-icon-park-outline:close block cursor-pointer",onClick:c})):e.createCommentVNode("",!0)])],36)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"modal-body",style:e.normalizeStyle(B.value)},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.component),e.normalizeProps(e.guardReactiveProps(r.componentProps)),null,16))],4),r.footer?(e.openBlock(),e.createElementBlock("div",G,[e.createElementVNode("button",{class:"submit-button",form:r.form,type:"submit",onClick:V}," 确定 ",8,U),e.createElementVNode("button",{class:"cancel-button",type:"button",onClick:L}," 取消 ")])):e.createCommentVNode("",!0),p.value?(e.openBlock(),e.createElementBlock("div",J,Z)):e.createCommentVNode("",!0)],6)],4))}});const z=(o,s)=>{const n=o.__vccOpts||o;for(const[t,a]of s)n[t]=a;return n},O=z(te,[["__scopeId","data-v-450bcc09"]]),oe={class:"modal-dialog"},ne={class:"dialog-body"},re={class:"dialog-title"},ie={class:"dialog-content"},le=e.defineComponent({__name:"modal-dialog",props:{type:{},title:{},content:{},okText:{default:"确定"},cancelText:{default:"取消"},onOk:{},onCancel:{},footer:{}},setup(o){const s=o,n=T(),t=e.computed(()=>s.title?s.title:{confirm:"提示",info:"提示",warning:"警告",error:"错误",success:"成功"}[s.type]);async function a(){s.onOk&&await s.onOk(),n.close()}async function i(){s.onCancel&&await s.onCancel(),n.close()}return(p,y)=>(e.openBlock(),e.createElementBlock("section",oe,[e.createElementVNode("div",ne,[e.createElementVNode("div",re,e.toDisplayString(t.value),1),e.createElementVNode("div",ie,e.toDisplayString(p.content),1)]),e.createElementVNode("div",{class:"dialog-footer space-x-2",style:e.normalizeStyle(p.type==="confirm"?{"justify-content":"end"}:{"border-top":"none"})},[p.footer?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(p.footer),{key:0})):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("button",{class:"submit-button",type:"submit",onClick:a},e.toDisplayString(p.okText),1),p.type==="confirm"?(e.openBlock(),e.createElementBlock("button",{key:0,class:"cancel-button",type:"button",onClick:i},e.toDisplayString(p.cancelText),1)):e.createCommentVNode("",!0)],64))],4)]))}});const se=z(le,[["__scopeId","data-v-8326e5a5"]]),ae={key:0,class:"modal-teleport"},ce={name:"ModalProvider",inheritAttrs:!0},de=e.defineComponent({...ce,props:{appendToBody:{type:[Boolean,String],default:!1},sizes:{default:()=>({small:520,middle:860,large:1190})},maxWidth:{default:"80%"},maxHeight:{default:"80%"}},setup(o,{expose:s}){const n=e.shallowRef([]),t=e.ref(!1),a=e.getCurrentInstance();function i(l,f={},c={}){const v=e.defineAsyncComponent(()=>Promise.resolve(typeof l=="string"?se:l));typeof l=="string"&&(f.type=l,c.size="small",c.fullscreen=!1,c.mode="dialog",c.footer=!1,c.header=!1);const d=Math.random().toString(32).slice(2),h=new Promise(C=>{n.value.push({id:d,component:v,props:f||{},options:{...c,type:typeof l=="string"?l:"component"},resolve:C,listeners:[]}),e.triggerRef(n)});return Object.assign(h,{close:()=>p(d)})}function p(l,f){const c=n.value.findIndex(d=>d.id===l);if(c<0)return;const v=n.value[c];v==null||v.resolve(f),n.value.splice(c,1),e.triggerRef(n)}function y(){n.value.forEach(l=>{l.resolve()}),n.value=[],e.triggerRef(n)}function _(l,f){const c=n.value.find(d=>d.id===l);if(!c)return;const v=c.listeners.find(d=>d.event===f);v&&v.callback({open:i,close:d=>p(c.id,d),closeAll:y,showLoading:()=>w(c.id),hideLoading:()=>m(c.id),confirm:d=>i("confirm",d),success:d=>i("success",d),error:d=>i("error",d),warning:d=>i("warning",d),info:d=>i("info",d)})}function w(l){if(!a)return;const[f]=a.refs[`modal-container_${l}`];if(f)return f.showLoading()}function m(l){if(!a)return;const[f]=a.refs[`modal-container_${l}`];if(f)return f.hideLoading()}function g(l,f,c){const v=n.value.find(d=>d.id===l);v&&v.listeners.push({event:f,callback:c})}return e.provide(S,{open:i,close:p,closeAll:y,addEventListener:g}),s({elements:n,open:i}),e.onMounted(()=>{t.value=!0}),(l,f)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.renderSlot(l.$slots,"default",{},void 0,!0),t.value?(e.openBlock(),e.createElementBlock("div",ae,[(e.openBlock(),e.createBlock(e.Teleport,{disabled:!l.appendToBody,to:typeof l.appendToBody=="string"?l.appendToBody:"body"},[e.createVNode(e.TransitionGroup,{name:"modal-fade"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.value,c=>(e.openBlock(),e.createBlock(O,e.mergeProps({id:c.id,key:c.id,ref_for:!0,ref:`modal-container_${c.id}`,component:c.component,"component-props":c.props,"max-height":l.maxHeight,"max-width":l.maxWidth,sizes:l.sizes},c.options,{onSubmit:()=>_(c.id,"submit")}),null,16,["id","component","component-props","max-height","max-width","sizes","onSubmit"]))),128))]),_:1})],8,["disabled","to"]))])):e.createCommentVNode("",!0)],64))}});const ue=z(de,[["__scopeId","data-v-cbdbb036"]]);function N(o,s){var t,a;let n=o==null?void 0:o.parent;for(;n&&((t=n==null?void 0:n.type)==null?void 0:t.name)!==s;)n=n.parent;return((a=n==null?void 0:n.type)==null?void 0:a.name)===s?n:null}function T(){const o=e.inject(S),s=e.getCurrentInstance();function n(t,a,i){if(!o)throw new Error("Not Found Modal Provider Component");return o.open(t,a,i)}return{open:n,close(t){var p;if(!o)throw new Error("Not Found Modal Provider Component");const a=N(s,"ModalContainer"),i=(p=a==null?void 0:a.props)==null?void 0:p.id;if(!i)throw new Error("Not Found Current Modal Container");o.close(i,t)},closeAll(){if(!o)throw new Error("Not Found Modal Provider Component");o.closeAll()},showLoading(){var i;if(!o)throw new Error("Not Found Modal Provider Component");const t=N(s,"ModalContainer");if(!((i=t==null?void 0:t.props)==null?void 0:i.id))throw new Error("Not Found Current Modal Container");t!=null&&t.exposed&&(t==null||t.exposed.showLoading())},hideLoading(){var i;if(!o)throw new Error("Not Found Modal Provider Component");const t=N(s,"ModalContainer");if(!((i=t==null?void 0:t.props)==null?void 0:i.id))throw new Error("Not Found Current Modal Container");t!=null&&t.exposed&&(t==null||t.exposed.hideLoading())},confirm(t){return this.open("confirm",t)},info(t){return this.open("info",t)},error(t){return this.open("error",t)},warning(t){return this.open("warning",t)},success(t){return this.open("success",t)}}}function fe(o){var i;const s=e.inject(S),n=e.getCurrentInstance(),t=N(n,"ModalContainer"),a=(i=t==null?void 0:t.props)==null?void 0:i.id;s&&a&&s.addEventListener(a,"submit",o)}exports.ModalContainer=O;exports.ModalKey=S;exports.ModalProvider=ue;exports.onSubmit=fe;exports.useModal=T;

package/dist/cjs/interfaces.d.ts

@@ -34,7 +34,7 @@ export interface ModalElement extends OpenModalOptions {
     }[];
 }
 export interface ModalActions {
-    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'sucess', props?: Record<string, any>, options?: OpenModalOptions) => Promise<any> & {
+    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'success', props?: Record<string, any>, options?: OpenModalOptions) => Promise<any> & {
         close: () => void;
     };
     close: (id: string, data?: any) => void;

package/dist/es/components/modal-provider.vue.d.ts

@@ -1,4 +1,5 @@
-import type { ModalElement, SizeOptions } from '../interfaces';
+import type { Component } from 'vue';
+import type { ModalElement, OpenModalOptions, SizeOptions } from '../interfaces';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     appendToBody: boolean | string;
     sizes: SizeOptions;
@@ -15,6 +16,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     };
 }>, {
     elements: import("vue").ShallowRef<ModalElement[]>;
+    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'success', props?: Record<string, any>, options?: OpenModalOptions) => Promise<unknown> & {
+        close: () => void;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     appendToBody: boolean | string;
     sizes: SizeOptions;

package/dist/es/hooks/use-modal.d.ts

@@ -5,11 +5,13 @@ export declare function useModal(): {
         (component: 'confirm', props: {
             title?: string;
             content: string;
+            onOk?: () => Promise<void> | void;
+            onCancel?: () => Promise<void> | void;
             footer?: () => JSX.Element;
         }): Promise<any> & {
             close: () => void;
         };
-        (component: 'info' | 'warning' | 'error' | 'sucess', props: {
+        (component: 'info' | 'warning' | 'error' | 'success', props: {
             title?: string;
             content: string;
         }): Promise<any> & {
@@ -23,4 +25,37 @@ export declare function useModal(): {
     closeAll(): void;
     showLoading(): void;
     hideLoading(): void;
+    confirm(props: {
+        title?: string;
+        content: string;
+        onOk?: () => Promise<void> | void;
+        onCancel?: () => Promise<void> | void;
+        footer?: () => JSX.Element;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    info(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    error(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    warning(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
+    success(props: {
+        title?: string;
+        content: string;
+    }): Promise<any> & {
+        close: () => void;
+    };
 };

package/dist/es/index.mjs

@@ -1,7 +1,7 @@
-import { unref as Z, isRef as ee, toRefs as te, customRef as oe, getCurrentScope as ne, onScopeDispose as ie, ref as N, computed as S, watch as re, defineComponent as Y, inject as K, shallowRef as T, onMounted as U, onUnmounted as se, openBlock as h, createElementBlock as w, normalizeStyle as z, withModifiers as le, createElementVNode as y, normalizeClass as ae, toDisplayString as B, createCommentVNode as $, createBlock as F, resolveDynamicComponent as j, normalizeProps as de, guardReactiveProps as ce, triggerRef as O, pushScopeId as ue, popScopeId as fe, Fragment as X, getCurrentInstance as q, provide as pe, renderSlot as me, Teleport as ve, createVNode as ye, TransitionGroup as he, withCtx as ge, renderList as _e, mergeProps as we, defineAsyncComponent as be } from "vue";
+import { unref as Z, isRef as ee, toRefs as te, customRef as oe, getCurrentScope as ne, onScopeDispose as re, ref as N, computed as S, watch as ie, defineComponent as Y, inject as K, shallowRef as T, onMounted as U, onUnmounted as se, openBlock as h, createElementBlock as w, normalizeStyle as z, withModifiers as le, createElementVNode as y, normalizeClass as ae, toDisplayString as B, createCommentVNode as $, createBlock as F, resolveDynamicComponent as j, normalizeProps as de, guardReactiveProps as ce, triggerRef as O, pushScopeId as ue, popScopeId as fe, Fragment as X, getCurrentInstance as q, provide as pe, renderSlot as me, Teleport as ve, createVNode as ye, TransitionGroup as he, withCtx as ge, renderList as _e, mergeProps as we, defineAsyncComponent as be } from "vue";
 const H = Symbol("__MODAL__");
 function Ce(t) {
-  return ne() ? (ie(t), !0) : !1;
+  return ne() ? (re(t), !0) : !1;
 }
 function x(t) {
   return typeof t == "function" ? t() : Z(t);
@@ -44,21 +44,21 @@ function V(...t) {
   if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([o, e, l] = t, s = Q) : [s, o, e, l] = t, !s)
     return Me;
   Array.isArray(o) || (o = [o]), Array.isArray(e) || (e = [e]);
-  const r = [], u = () => {
+  const r = [], f = () => {
     r.forEach((p) => p()), r.length = 0;
-  }, v = (p, g, i, c) => (p.addEventListener(g, i, c), () => p.removeEventListener(g, i, c)), b = re(
+  }, v = (p, g, i, u) => (p.addEventListener(g, i, u), () => p.removeEventListener(g, i, u)), b = ie(
     () => [Se(s), x(l)],
     ([p, g]) => {
-      if (u(), !p)
+      if (f(), !p)
         return;
       const i = xe(g) ? { ...g } : g;
       r.push(
-        ...o.flatMap((c) => e.map((a) => v(p, c, a, i)))
+        ...o.flatMap((u) => e.map((a) => v(p, u, a, i)))
       );
     },
     { immediate: !0, flush: "post" }
   ), C = () => {
-    b(), u();
+    b(), f();
   };
   return Ce(C), C;
 }
@@ -67,50 +67,50 @@ function $e(t, s = {}) {
   const {
     pointerTypes: l,
     preventDefault: r,
-    stopPropagation: u,
+    stopPropagation: f,
     exact: v,
     onMove: b,
     onEnd: C,
     onStart: p,
     initialValue: g,
     axis: i = "both",
-    draggingElement: c = Q,
+    draggingElement: u = Q,
     containerElement: a,
     handle: m = t
-  } = s, f = N(
+  } = s, d = N(
     (o = x(g)) != null ? o : { x: 0, y: 0 }
-  ), _ = N(), M = (d) => l ? l.includes(d.pointerType) : !0, L = (d) => {
-    x(r) && d.preventDefault(), x(u) && d.stopPropagation();
-  }, R = (d) => {
+  ), _ = N(), M = (c) => l ? l.includes(c.pointerType) : !0, L = (c) => {
+    x(r) && c.preventDefault(), x(f) && c.stopPropagation();
+  }, R = (c) => {
     var E;
-    if (!M(d) || x(v) && d.target !== x(t))
+    if (!M(c) || x(v) && c.target !== x(t))
       return;
     const P = ((E = x(a)) != null ? E : x(t)).getBoundingClientRect(), n = {
-      x: d.clientX - P.left,
-      y: d.clientY - P.top
+      x: c.clientX - P.left,
+      y: c.clientY - P.top
     };
-    (p == null ? void 0 : p(n, d)) !== !1 && (_.value = n, L(d));
-  }, W = (d) => {
-    if (!M(d) || !_.value)
+    (p == null ? void 0 : p(n, c)) !== !1 && (_.value = n, L(c));
+  }, W = (c) => {
+    if (!M(c) || !_.value)
       return;
-    let { x: E, y: A } = f.value;
-    (i === "x" || i === "both") && (E = d.clientX - _.value.x), (i === "y" || i === "both") && (A = d.clientY - _.value.y), f.value = {
+    let { x: E, y: A } = d.value;
+    (i === "x" || i === "both") && (E = c.clientX - _.value.x), (i === "y" || i === "both") && (A = c.clientY - _.value.y), d.value = {
       x: E,
       y: A
-    }, b == null || b(f.value, d), L(d);
-  }, I = (d) => {
-    M(d) && _.value && (_.value = void 0, C == null || C(f.value, d), L(d));
+    }, b == null || b(d.value, c), L(c);
+  }, I = (c) => {
+    M(c) && _.value && (_.value = void 0, C == null || C(d.value, c), L(c));
   };
   if (J) {
-    const d = { capture: (e = s.capture) != null ? e : !0 };
-    V(m, "pointerdown", R, d), V(c, "pointermove", W, d), V(c, "pointerup", I, d);
+    const c = { capture: (e = s.capture) != null ? e : !0 };
+    V(m, "pointerdown", R, c), V(u, "pointermove", W, c), V(u, "pointerup", I, c);
   }
   return {
-    ...Ee(f),
-    position: f,
+    ...Ee(d),
+    position: d,
     isDragging: S(() => !!_.value),
     style: S(
-      () => `left:${f.value.x}px;top:${f.value.y}px;`
+      () => `left:${d.value.x}px;top:${d.value.y}px;`
     )
   };
 }
@@ -155,9 +155,9 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
   },
   emits: ["submit"],
   setup(t, { expose: s, emit: o }) {
-    const e = t, l = o, r = K(H), u = N(!1);
+    const e = t, l = o, r = K(H), f = N(!1);
     let v = 0, b = 0;
-    const C = T(), p = T(), g = T(), { x: i, y: c } = $e(g, {
+    const C = T(), p = T(), g = T(), { x: i, y: u } = $e(g, {
       initialValue: { x: 0, y: 0 }
     });
     function a() {
@@ -169,12 +169,12 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
       if (typeof n == "string")
         return n;
     }
-    const f = S(() => {
+    const d = S(() => {
       const n = {};
       return e.mode === "dialog" && (n.justifyContent = "center"), e.mode === "drawer" && (n.justifyContent = "flex-end"), n;
     }), _ = S(() => {
       const n = {};
-      return e.size && (n.width = m(e.sizes[e.size])), e.width && (n.width = m(e.width)), e.maxWidth && (n.maxWidth = m(e.maxWidth)), e.fullscreen && (n.maxWidth = "unset", n.width = "100%", n.position = "fixed", n.top = 0, n.left = 0, n.bottom = 0, n.right = 0, n.borderRadius = 0), e.draggable && !e.fullscreen && e.mode === "dialog" && (n.transform = `translate3d(${i.value - v}px, ${c.value - b}px, 0px)`), e.mode === "drawer" && (n.borderRadius = 0), n;
+      return e.size && (n.width = m(e.sizes[e.size])), e.width && (n.width = m(e.width)), e.maxWidth && (n.maxWidth = m(e.maxWidth)), e.fullscreen && (n.maxWidth = "unset", n.width = "100%", n.position = "fixed", n.top = 0, n.left = 0, n.bottom = 0, n.right = 0, n.borderRadius = 0), e.draggable && !e.fullscreen && e.mode === "dialog" && (n.transform = `translate3d(${i.value - v}px, ${u.value - b}px, 0px)`), e.mode === "drawer" && (n.borderRadius = 0), n;
     }), M = S(() => {
       const n = {};
       return e.draggable && !e.fullscreen && e.mode === "dialog" && (n.cursor = "move"), n;
@@ -199,7 +199,7 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
         O(C), O(p), v = p.value.offsetLeft, b = p.value.offsetTop;
       });
     }
-    function d() {
+    function c() {
       if (e.closeable && e.esc) {
         const n = ({ key: k }) => {
           k === "Escape" && (r == null || r.close(e.id), window.removeEventListener("keydown", n));
@@ -211,14 +211,14 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
       v = p.value.offsetLeft, b = p.value.offsetTop;
     }
     U(() => {
-      d(), I();
+      c(), I();
     }), se(() => {
     });
     function A() {
-      return u.value = !0, () => P();
+      return f.value = !0, () => P();
     }
     function P() {
-      u.value = !1;
+      f.value = !1;
     }
     return s({
       showLoading: A,
@@ -227,7 +227,7 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
       ref_key: "wrapperRef",
       ref: C,
       class: "modal-wrapper",
-      style: z(f.value),
+      style: z(d.value),
       onClick: k[0] || (k[0] = le((je) => n.maskClosable && a(), ["self"]))
     }, [
       y("div", {
@@ -272,7 +272,7 @@ const Le = (t) => (ue("data-v-450bcc09"), t = t(), fe(), t), Ae = { class: "titl
             onClick: W
           }, " 取消 ")
         ])) : $("", !0),
-        u.value ? (h(), w("div", Oe, De)) : $("", !0)
+        f.value ? (h(), w("div", Oe, De)) : $("", !0)
       ], 6)
     ], 4));
   }
@@ -308,27 +308,27 @@ const G = (t, s) => {
     async function r() {
       s.onCancel && await s.onCancel(), o.close();
     }
-    return (u, v) => (h(), w("section", Re, [
+    return (f, v) => (h(), w("section", Re, [
       y("div", We, [
         y("div", Ie, B(e.value), 1),
-        y("div", Ve, B(u.content), 1)
+        y("div", Ve, B(f.content), 1)
       ]),
       y("div", {
         class: "dialog-footer space-x-2",
-        style: z(u.type === "confirm" ? { "justify-content": "end" } : { "border-top": "none" })
+        style: z(f.type === "confirm" ? { "justify-content": "end" } : { "border-top": "none" })
       }, [
-        u.footer ? (h(), F(j(u.footer), { key: 0 })) : (h(), w(X, { key: 1 }, [
+        f.footer ? (h(), F(j(f.footer), { key: 0 })) : (h(), w(X, { key: 1 }, [
           y("button", {
             class: "submit-button",
             type: "submit",
             onClick: l
-          }, B(u.okText), 1),
-          u.type === "confirm" ? (h(), w("button", {
+          }, B(f.okText), 1),
+          f.type === "confirm" ? (h(), w("button", {
             key: 0,
             class: "cancel-button",
             type: "button",
             onClick: r
-          }, B(u.cancelText), 1)) : $("", !0)
+          }, B(f.cancelText), 1)) : $("", !0)
         ], 64))
       ], 4)
     ]));
@@ -354,16 +354,16 @@ const Ye = /* @__PURE__ */ G(Xe, [["__scopeId", "data-v-8326e5a5"]]), Ke = {
   },
   setup(t, { expose: s }) {
     const o = T([]), e = N(!1), l = q();
-    function r(i, c = {}, a = {}) {
+    function r(i, u = {}, a = {}) {
       const m = be(
         () => Promise.resolve(typeof i == "string" ? Ye : i)
       );
-      typeof i == "string" && (c.type = i, a.size = "small", a.fullscreen = !1, a.mode = "dialog", a.footer = !1, a.header = !1);
-      const f = Math.random().toString(32).slice(2), _ = new Promise((M) => {
+      typeof i == "string" && (u.type = i, a.size = "small", a.fullscreen = !1, a.mode = "dialog", a.footer = !1, a.header = !1);
+      const d = Math.random().toString(32).slice(2), _ = new Promise((M) => {
         o.value.push({
-          id: f,
+          id: d,
           component: m,
-          props: c || {},
+          props: u || {},
           options: {
             ...a,
             type: typeof i == "string" ? i : "component"
@@ -373,65 +373,71 @@ const Ye = /* @__PURE__ */ G(Xe, [["__scopeId", "data-v-8326e5a5"]]), Ke = {
         }), O(o);
       });
       return Object.assign(_, {
-        close: () => u(f)
+        close: () => f(d)
       });
     }
-    function u(i, c) {
-      const a = o.value.findIndex((f) => f.id === i);
+    function f(i, u) {
+      const a = o.value.findIndex((d) => d.id === i);
       if (a < 0)
         return;
       const m = o.value[a];
-      m == null || m.resolve(c), o.value.splice(a, 1), O(o);
+      m == null || m.resolve(u), o.value.splice(a, 1), O(o);
     }
     function v() {
       o.value.forEach((i) => {
         i.resolve();
       }), o.value = [], O(o);
     }
-    function b(i, c) {
-      const a = o.value.find((f) => f.id === i);
+    function b(i, u) {
+      const a = o.value.find((d) => d.id === i);
       if (!a)
         return;
-      const m = a.listeners.find((f) => f.event === c);
+      const m = a.listeners.find((d) => d.event === u);
       m && m.callback({
         open: r,
-        close: () => u(a.id),
+        close: (d) => f(a.id, d),
         closeAll: v,
         showLoading: () => C(a.id),
-        hideLoading: () => p(a.id)
+        hideLoading: () => p(a.id),
+        confirm: (d) => r("confirm", d),
+        success: (d) => r("success", d),
+        error: (d) => r("error", d),
+        warning: (d) => r("warning", d),
+        info: (d) => r("info", d)
       });
     }
     function C(i) {
       if (!l)
         return;
-      const [c] = l.refs[`modal-container_${i}`];
-      if (c)
-        return c.showLoading();
+      const [u] = l.refs[`modal-container_${i}`];
+      if (u)
+        return u.showLoading();
     }
     function p(i) {
       if (!l)
         return;
-      const [c] = l.refs[`modal-container_${i}`];
-      if (c)
-        return c.hideLoading();
+      const [u] = l.refs[`modal-container_${i}`];
+      if (u)
+        return u.hideLoading();
     }
-    function g(i, c, a) {
-      const m = o.value.find((f) => f.id === i);
+    function g(i, u, a) {
+      const m = o.value.find((d) => d.id === i);
       m && m.listeners.push({
-        event: c,
+        event: u,
         callback: a
       });
     }
     return pe(H, {
       open: r,
-      close: u,
+      close: f,
       closeAll: v,
       addEventListener: g
     }), s({
-      elements: o
+      elements: o,
+      open: r
     }), U(() => {
       e.value = !0;
-    }), (i, c) => (h(), w(X, null, [
+    }), (i, u) => (h(), w(X, null, [
       me(i.$slots, "default", {}, void 0, !0),
       e.value ? (h(), w("div", Ke, [
         (h(), F(ve, {
@@ -461,7 +467,7 @@ const Ye = /* @__PURE__ */ G(Xe, [["__scopeId", "data-v-8326e5a5"]]), Ke = {
     ], 64));
   }
 });
-const Qe = /* @__PURE__ */ G(Ge, [["__scopeId", "data-v-09133e47"]]);
+const Qe = /* @__PURE__ */ G(Ge, [["__scopeId", "data-v-cbdbb036"]]);
 function D(t, s) {
   var e, l;
   let o = t == null ? void 0 : t.parent;
@@ -479,10 +485,10 @@ function Ue() {
   return {
     open: o,
     close(e) {
-      var u;
+      var f;
       if (!t)
         throw new Error("Not Found Modal Provider Component");
-      const l = D(s, "ModalContainer"), r = (u = l == null ? void 0 : l.props) == null ? void 0 : u.id;
+      const l = D(s, "ModalContainer"), r = (f = l == null ? void 0 : l.props) == null ? void 0 : f.id;
       if (!r)
         throw new Error("Not Found Current Modal Container");
       t.close(r, e);
@@ -509,6 +515,21 @@ function Ue() {
       if (!((r = e == null ? void 0 : e.props) == null ? void 0 : r.id))
         throw new Error("Not Found Current Modal Container");
       e != null && e.exposed && (e == null || e.exposed.hideLoading());
+    },
+    confirm(e) {
+      return this.open("confirm", e);
+    },
+    info(e) {
+      return this.open("info", e);
+    },
+    error(e) {
+      return this.open("error", e);
+    },
+    warning(e) {
+      return this.open("warning", e);
+    },
+    success(e) {
+      return this.open("success", e);
     }
   };
 }

package/dist/es/interfaces.d.ts

@@ -34,7 +34,7 @@ export interface ModalElement extends OpenModalOptions {
     }[];
 }
 export interface ModalActions {
-    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'sucess', props?: Record<string, any>, options?: OpenModalOptions) => Promise<any> & {
+    open: (component: Component | 'confirm' | 'info' | 'warning' | 'error' | 'success', props?: Record<string, any>, options?: OpenModalOptions) => Promise<any> & {
         close: () => void;
     };
     close: (id: string, data?: any) => void;

package/dist/style.css

@@ -1 +1 @@
-*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.i-icon-park-outline\:close{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 48 48' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='m8 8l32 32M8 40L40 8'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;width:1em;height:1em}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.transform{transform:translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.cursor-pointer{cursor:pointer}.resize{resize:both}.space-x-2>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(.5rem * calc(1 - var(--un-space-x-reverse)));margin-right:calc(.5rem * var(--un-space-x-reverse))}.border{border-width:1px}.px{padding-left:1rem;padding-right:1rem}.font-bold{font-weight:700}.outline{outline-style:solid}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease{transition-timing-function:cubic-bezier(.4,0,.2,1)}.modal-wrapper[data-v-450bcc09]{z-index:1000;position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;background:rgba(0,0,0,.3)}.modal-content[data-v-450bcc09]{background:#ffffff;border-radius:5px;position:relative}.modal-header[data-v-450bcc09]{box-sizing:border-box;padding:10px;height:50px;display:flex;justify-content:space-between;align-items:center;border-bottom:solid 1px var(--color-border-1, #e8e8e8)}.modal-body[data-v-450bcc09]{padding:20px 10px;box-sizing:border-box;max-height:10vw;overflow:auto}.modal-footer[data-v-450bcc09]{box-sizing:border-box;height:50px;border-top:solid 1px var(--color-border-1, #e8e8e8);display:flex;justify-content:end;padding:10px}.modal-footer button[data-v-450bcc09]{height:28px;line-height:28px;width:80px;outline:none;border-color:transparent;font-size:14px;border-radius:4px;padding:0;box-sizing:content-box}.modal-footer button.submit-button[data-v-450bcc09]{color:#fff;background-color:rgb(var(--primary-6, 45, 106, 251))}.modal-footer button.submit-button[data-v-450bcc09]:hover{background-color:rgb(var(--primary-5, 28, 76, 207))}.modal-footer button.cancel-button[data-v-450bcc09]{color:rgb(var(--color-text-2, 78, 89, 105));background-color:var(--color-fill-1, #f5f5f5)}.modal-footer button.cancel-button[data-v-450bcc09]:hover{background-color:var(--color-fill-4, #c9cdd4)}.modal-loading[data-v-450bcc09]{position:absolute;z-index:1001;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;background-color:#0000001a}.modal-loading .lds-ring[data-v-450bcc09]{display:inline-block;position:relative;width:80px;height:80px}.modal-loading .lds-ring div[data-v-450bcc09]{box-sizing:border-box;display:block;position:absolute;width:48px;height:48px;margin:8px;border:5px solid #fff;border-radius:50%;animation:lds-ring-450bcc09 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:#fff transparent transparent transparent}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(1){animation-delay:-.45s}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(2){animation-delay:-.3s}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(3){animation-delay:-.15s}@keyframes lds-ring-450bcc09{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dialog-body[data-v-8326e5a5]{padding:20px 10px 10px}.dialog-title[data-v-8326e5a5]{padding:5px;font-weight:700;font-size:16px}.dialog-content[data-v-8326e5a5]{padding:5px}.dialog-footer[data-v-8326e5a5]{box-sizing:border-box;height:50px;border-top:solid 1px var(--color-border-1, #e8e8e8);display:flex;justify-content:center;align-items:center;padding:0 10px}.dialog-footer button[data-v-8326e5a5]{height:28px;line-height:28px;width:80px;outline:none;border-color:transparent;font-size:14px;border-radius:4px;padding:0;box-sizing:content-box}.dialog-footer button.submit-button[data-v-8326e5a5]{color:#fff;background-color:rgb(var(--primary-6, 45, 106, 251))}.dialog-footer button.submit-button[data-v-8326e5a5]:hover{background-color:rgb(var(--primary-5, 28, 76, 207))}.dialog-footer button.cancel-button[data-v-8326e5a5]{color:rgb(var(--color-text-2, 78, 89, 105));background-color:var(--color-fill-1, #f5f5f5)}.dialog-footer button.cancel-button[data-v-8326e5a5]:hover{background-color:var(--color-fill-4, #c9cdd4)}.modal-fade-enter-active[data-v-09133e47],.modal-fade-leave-active[data-v-09133e47]{transition:opacity .5s ease}.modal-fade-enter-active[data-v-09133e47] .modal-content.drawer-mode,.modal-fade-leave-active[data-v-09133e47] .modal-content.drawer-mode{transition:transform .5s ease}.modal-fade-enter-from[data-v-09133e47],.modal-fade-leave-to[data-v-09133e47]{opacity:0}.modal-fade-enter-from[data-v-09133e47] .modal-content.drawer-mode,.modal-fade-leave-to[data-v-09133e47] .modal-content.drawer-mode{transform:translate3d(100%,0,0)}
+*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.i-icon-park-outline\:close{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 48 48' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='m8 8l32 32M8 40L40 8'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;width:1em;height:1em}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.transform{transform:translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.cursor-pointer{cursor:pointer}.resize{resize:both}.space-x-2>:not([hidden])~:not([hidden]){--un-space-x-reverse:0;margin-left:calc(.5rem * calc(1 - var(--un-space-x-reverse)));margin-right:calc(.5rem * var(--un-space-x-reverse))}.border{border-width:1px}.px{padding-left:1rem;padding-right:1rem}.font-bold{font-weight:700}.outline{outline-style:solid}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease{transition-timing-function:cubic-bezier(.4,0,.2,1)}.modal-wrapper[data-v-450bcc09]{z-index:1000;position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;background:rgba(0,0,0,.3)}.modal-content[data-v-450bcc09]{background:#ffffff;border-radius:5px;position:relative}.modal-header[data-v-450bcc09]{box-sizing:border-box;padding:10px;height:50px;display:flex;justify-content:space-between;align-items:center;border-bottom:solid 1px var(--color-border-1, #e8e8e8)}.modal-body[data-v-450bcc09]{padding:20px 10px;box-sizing:border-box;max-height:10vw;overflow:auto}.modal-footer[data-v-450bcc09]{box-sizing:border-box;height:50px;border-top:solid 1px var(--color-border-1, #e8e8e8);display:flex;justify-content:end;padding:10px}.modal-footer button[data-v-450bcc09]{height:28px;line-height:28px;width:80px;outline:none;border-color:transparent;font-size:14px;border-radius:4px;padding:0;box-sizing:content-box}.modal-footer button.submit-button[data-v-450bcc09]{color:#fff;background-color:rgb(var(--primary-6, 45, 106, 251))}.modal-footer button.submit-button[data-v-450bcc09]:hover{background-color:rgb(var(--primary-5, 28, 76, 207))}.modal-footer button.cancel-button[data-v-450bcc09]{color:rgb(var(--color-text-2, 78, 89, 105));background-color:var(--color-fill-1, #f5f5f5)}.modal-footer button.cancel-button[data-v-450bcc09]:hover{background-color:var(--color-fill-4, #c9cdd4)}.modal-loading[data-v-450bcc09]{position:absolute;z-index:1001;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;background-color:#0000001a}.modal-loading .lds-ring[data-v-450bcc09]{display:inline-block;position:relative;width:80px;height:80px}.modal-loading .lds-ring div[data-v-450bcc09]{box-sizing:border-box;display:block;position:absolute;width:48px;height:48px;margin:8px;border:5px solid #fff;border-radius:50%;animation:lds-ring-450bcc09 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:#fff transparent transparent transparent}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(1){animation-delay:-.45s}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(2){animation-delay:-.3s}.modal-loading .lds-ring div[data-v-450bcc09]:nth-child(3){animation-delay:-.15s}@keyframes lds-ring-450bcc09{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dialog-body[data-v-8326e5a5]{padding:20px 10px 10px}.dialog-title[data-v-8326e5a5]{padding:5px;font-weight:700;font-size:16px}.dialog-content[data-v-8326e5a5]{padding:5px}.dialog-footer[data-v-8326e5a5]{box-sizing:border-box;height:50px;border-top:solid 1px var(--color-border-1, #e8e8e8);display:flex;justify-content:center;align-items:center;padding:0 10px}.dialog-footer button[data-v-8326e5a5]{height:28px;line-height:28px;width:80px;outline:none;border-color:transparent;font-size:14px;border-radius:4px;padding:0;box-sizing:content-box}.dialog-footer button.submit-button[data-v-8326e5a5]{color:#fff;background-color:rgb(var(--primary-6, 45, 106, 251))}.dialog-footer button.submit-button[data-v-8326e5a5]:hover{background-color:rgb(var(--primary-5, 28, 76, 207))}.dialog-footer button.cancel-button[data-v-8326e5a5]{color:rgb(var(--color-text-2, 78, 89, 105));background-color:var(--color-fill-1, #f5f5f5)}.dialog-footer button.cancel-button[data-v-8326e5a5]:hover{background-color:var(--color-fill-4, #c9cdd4)}.modal-fade-enter-active[data-v-cbdbb036],.modal-fade-leave-active[data-v-cbdbb036]{transition:opacity .5s ease}.modal-fade-enter-active[data-v-cbdbb036] .modal-content.drawer-mode,.modal-fade-leave-active[data-v-cbdbb036] .modal-content.drawer-mode{transition:transform .5s ease}.modal-fade-enter-from[data-v-cbdbb036],.modal-fade-leave-to[data-v-cbdbb036]{opacity:0}.modal-fade-enter-from[data-v-cbdbb036] .modal-content.drawer-mode,.modal-fade-leave-to[data-v-cbdbb036] .modal-content.drawer-mode{transform:translate3d(100%,0,0)}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@gopowerteam/modal-render",
   "type": "module",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "author": {
     "name": "zhuchentong",
     "email": "2037630@gmail.com"