vue-amazing-ui/lib/modal/Modal.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("../button/index.cjs"),R=require("../utils/index.cjs"),oe={class:"modal-body"},le={key:1,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ae={key:2,class:"icon-svg",focusable:"false","data-icon":"info-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ne={key:3,class:"icon-svg",focusable:"false","data-icon":"check-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},re={key:4,class:"icon-svg",focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","fill-rule":"evenodd",viewBox:"64 64 896 896"},ce={key:5,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},se={class:"modal-btns"},ie={class:"modal-body"},ue={key:1,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},de={key:2,class:"icon-svg",focusable:"false","data-icon":"info-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},me={key:3,class:"icon-svg",focusable:"false","data-icon":"check-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ve={key:4,class:"icon-svg",focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","fill-rule":"evenodd",viewBox:"64 64 896 896"},fe={key:5,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},pe={class:"modal-btns"},ye=e.defineComponent({__name:"Modal",props:{width:{default:420},icon:{type:[Object,Function],default:void 0},title:{default:void 0},titleStyle:{default:()=>({})},content:{default:void 0},contentStyle:{default:()=>({})},bodyClass:{default:void 0},bodyStyle:{default:()=>({})},cancelText:{default:"取消"},cancelProps:{default:()=>({})},okText:{default:"确定"},okType:{default:"primary"},okProps:{default:()=>({})},noticeText:{default:"知道了"},noticeProps:{default:()=>({})},destroyOnClose:{type:Boolean,default:!1},centered:{type:Boolean,default:!1},top:{default:100},transformOrigin:{default:"mouse"},confirmLoading:{type:Boolean,default:!1},blockScroll:{type:Boolean,default:!0},keyboard:{type:Boolean,default:!0},maskClosable:{type:Boolean,default:!0},maskStyle:{default:()=>({})}},emits:["update:open","cancel","ok","know"],setup(W,{expose:j,emit:q}){const k=W,h=e.ref(),c=e.ref(null),r=e.ref(!1),y=e.ref(!1),s=e.ref(!1),u=e.ref("50% 50%"),n=e.ref(),l=e.ref(),{colorPalettes:F}=R.useInject("Modal"),{isSupported:g}=R.useOptionsSupported("capture"),v=q,w=e.computed(()=>{const t=a("width");return typeof t=="number"?`${t}px`:t}),Y=e.computed(()=>{const t=a("top");return typeof t=="number"?`${t}px`:t}),C=e.computed(()=>a("centered")),H=e.computed(()=>C.value?{width:w.value,transformOrigin:u.value}:{width:w.value,top:Y.value,transformOrigin:u.value}),B=e.computed(()=>a("titleStyle")),S=e.computed(()=>a("contentStyle")),V=e.computed(()=>a("bodyClass")),x=e.computed(()=>a("bodyStyle")),I=e.computed(()=>a("maskStyle")),f=e.computed(()=>a("icon")),z=e.computed(()=>a("title")),N=e.computed(()=>a("content")),E=e.computed(()=>a("cancelText")),b=e.computed(()=>a("cancelProps")),T=e.computed(()=>a("okType")),O=e.computed(()=>a("okText")),M=e.computed(()=>a("okProps")),P=e.computed(()=>a("noticeText")),$=e.computed(()=>a("noticeProps")),D=e.computed(()=>a("destroyOnClose"));e.watch(r,async t=>{const o=a("blockScroll");t?(await e.nextTick(),h.value.focus(),o&&(document.documentElement.style.overflowY="hidden",document.body.style.overflowY="hidden")):o&&(document.documentElement.style.removeProperty("overflow-y"),document.body.style.removeProperty("overflow-y"))},{immediate:!0}),e.watchEffect(()=>{s.value=k.confirmLoading}),e.onMounted(()=>{document.addEventListener("click",L,g.value?{capture:!0}:!0)}),e.onUnmounted(()=>{document.removeEventListener("click",L,g.value?{capture:!0}:!0)});function L(t){r.value||(c.value={x:t.clientX,y:t.clientY})}async function A(t){if(y.value=!0,await e.nextTick(),a("transformOrigin")==="mouse"&&c.value){const i=t.getBoundingClientRect();u.value=`${c.value.x-i.left}px ${c.value.y-i.top}px`}else u.value="50% 50%"}function U(t){if(a("transformOrigin")==="mouse"&&c.value){const i=t.getBoundingClientRect();u.value=`${c.value.x-i.left}px ${c.value.y-i.top}px`}else u.value="50% 50%"}function X(){y.value=!1}function a(t){let o=k[t];return n.value?.[t]!==void 0&&(o=n.value[t]),o}function G(t){l.value="info",n.value=t,d()}function J(t){l.value="success",n.value=t,d()}function Q(t){l.value="error",n.value=t,d()}function Z(t){l.value="warning",n.value=t,d()}function ee(t){l.value="confirm",n.value=t,d()}function te(t){l.value="erase",n.value=t,d()}function d(){r.value=!0,v("update:open",!0)}function p(){n.value?.onCancel&&n.value.onCancel(),r.value=!1,v("cancel")}async function _(){n.value?.onOk&&(s.value=!0,await n.value.onOk(),s.value=!1),r.value=!1,v("ok")}function K(){n.value?.onKnow&&n.value.onKnow(),r.value=!1,v("know")}return j({info:G,success:J,error:Q,warning:Z,confirm:ee,erase:te}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:"modal-root",style:e.normalizeStyle(`
      --modal-primary-color: ${e.unref(F)[5]};
      --modal-success-color: #52c41a;
      --modal-error-color: #ff4d4f;
      --modal-warning-color: #faad14;
      --modal-confirm-color: #faad14;
      --modal-erase-color: #faad14;
    `)},[e.createVNode(e.Transition,{name:"fade"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:"modal-mask",style:e.normalizeStyle(I.value)},null,4),[[e.vShow,r.value]])]),_:1}),e.withDirectives(e.createElementVNode("div",{tabindex:"-1",ref_key:"modalWrapRef",ref:h,class:e.normalizeClass(["modal-wrap",{"flex-centered":C.value}]),onClick:o[0]||(o[0]=e.withModifiers(i=>a("maskClosable")?p():()=>!1,["self"])),onKeydown:o[1]||(o[1]=e.withKeys(i=>a("keyboard")?p():()=>!1,["esc"]))},[e.createVNode(e.Transition,{name:"zoom","enter-from-class":"zoom-enter","enter-active-class":"zoom-enter","enter-to-class":"zoom-enter zoom-enter-active","leave-from-class":"zoom-leave","leave-active-class":"zoom-leave zoom-leave-active","leave-to-class":"zoom-leave zoom-leave-active",onBeforeEnter:A,onBeforeLeave:U,onAfterLeave:X},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:"modal-container",style:e.normalizeStyle(H.value)},[D.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["modal-body-wrap",V.value]),style:e.normalizeStyle(x.value)},[e.createElementVNode("div",oe,[e.createElementVNode("div",{class:e.normalizeClass(["modal-header",{[`icon-${l.value}`]:["info","success","error","warning","confirm","erase"].includes(l.value)}])},[e.renderSlot(t.$slots,"icon",{},()=>[f.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value),{key:0,class:"icon-svg"})):l.value==="confirm"||l.value==="erase"?(e.openBlock(),e.createElementBlock("svg",le,[...o[2]||(o[2]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"},null,-1),e.createElementVNode("path",{d:"M464 688a48 48 0 1096 0 48 48 0 10-96 0zm24-112h48c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8z"},null,-1)])])):l.value==="info"?(e.openBlock(),e.createElementBlock("svg",ae,[...o[3]||(o[3]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)])])):l.value==="success"?(e.openBlock(),e.createElementBlock("svg",ne,[...o[4]||(o[4]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"},null,-1)])])):l.value==="error"?(e.openBlock(),e.createElementBlock("svg",re,[...o[5]||(o[5]=[e.createElementVNode("path",{d:"M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z"},null,-1)])])):l.value==="warning"?(e.openBlock(),e.createElementBlock("svg",ce,[...o[6]||(o[6]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)])])):e.createCommentVNode("",!0)],!0),e.createElementVNode("div",{class:"modal-title",style:e.normalizeStyle(B.value)},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(z.value),1)],!0)],4)],2),e.createElementVNode("div",{class:"modal-content",style:e.normalizeStyle(S.value)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(N.value),1)],!0)],4)]),e.createElementVNode("div",se,[["confirm","erase"].includes(l.value)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(m.default),e.mergeProps({class:"mr8",onClick:p},b.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(E.value),1)]),_:1},16),e.createVNode(e.unref(m.default),e.mergeProps({type:T.value,loading:s.value,onClick:_},M.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(O.value),1)]),_:1},16,["type","loading"])],64)):e.createCommentVNode("",!0),["info","success","error","warning"].includes(l.value)?(e.openBlock(),e.createBlock(e.unref(m.default),e.mergeProps({key:1,type:"primary",loading:s.value,onClick:K},$.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(P.value),1)]),_:1},16,["loading"])):e.createCommentVNode("",!0)])],6)),D.value&&r.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["modal-body-wrap",V.value]),style:e.normalizeStyle(x.value)},[e.createElementVNode("div",ie,[e.createElementVNode("div",{class:e.normalizeClass(["modal-header",{[`icon-${l.value}`]:["info","success","error","warning","confirm","erase"].includes(l.value)}])},[e.renderSlot(t.$slots,"icon",{},()=>[f.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value),{key:0,class:"icon-svg"})):l.value==="confirm"||l.value==="erase"?(e.openBlock(),e.createElementBlock("svg",ue,[...o[7]||(o[7]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"},null,-1),e.createElementVNode("path",{d:"M464 688a48 48 0 1096 0 48 48 0 10-96 0zm24-112h48c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8z"},null,-1)])])):l.value==="info"?(e.openBlock(),e.createElementBlock("svg",de,[...o[8]||(o[8]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)])])):l.value==="success"?(e.openBlock(),e.createElementBlock("svg",me,[...o[9]||(o[9]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"},null,-1)])])):l.value==="error"?(e.openBlock(),e.createElementBlock("svg",ve,[...o[10]||(o[10]=[e.createElementVNode("path",{d:"M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z"},null,-1)])])):l.value==="warning"?(e.openBlock(),e.createElementBlock("svg",fe,[...o[11]||(o[11]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)])])):e.createCommentVNode("",!0)],!0),e.createElementVNode("div",{class:"modal-title",style:e.normalizeStyle(B.value)},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(z.value),1)],!0)],4)],2),e.createElementVNode("div",{class:"modal-content",style:e.normalizeStyle(S.value)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(N.value),1)],!0)],4)]),e.createElementVNode("div",pe,[["confirm","erase"].includes(l.value)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(m.default),e.mergeProps({class:"mr8",onClick:p},b.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(E.value),1)]),_:1},16),e.createVNode(e.unref(m.default),e.mergeProps({type:T.value,loading:s.value,onClick:_},M.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(O.value),1)]),_:1},16,["type","loading"])],64)):e.createCommentVNode("",!0),["info","success","error","warning"].includes(l.value)?(e.openBlock(),e.createBlock(e.unref(m.default),e.mergeProps({key:1,type:"primary",loading:s.value,onClick:K},$.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(P.value),1)]),_:1},16,["loading"])):e.createCommentVNode("",!0)])],6)):e.createCommentVNode("",!0)],4),[[e.vShow,r.value]])]),_:3})],34),[[e.vShow,y.value]])],4))}});exports.default=ye;