imperative-modal/lib/imperative-modal.umd.js

1.npm run build:lib 打包库 2.npm run release 发布到 npm

(function(y,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(y=typeof globalThis<"u"?globalThis:y||self,e(y["imperative-modal"]={},y.Vue))})(this,function(y,e){"use strict";var v=document.createElement("style");v.textContent=`.modal_wrap[data-v-83d69dc2]{position:fixed;overflow:hidden;inset:0;background:rgba(0,0,0,.5);height:100vh;transition:all .2s linear}.modal_content[data-v-83d69dc2]{position:absolute;left:50%;top:100px;box-shadow:0 12px 32px 4px #0000000a,0 8px 20px #00000014;box-sizing:border-box;background-color:#fff;border-radius:4px;padding:12px;transition:all .2s linear}.modal-header[data-v-83d69dc2]{height:45px;display:flex;align-items:center;justify-content:space-between}.modal-header .title[data-v-83d69dc2]{font-weight:500;font-size:16px;margin:0 12px;color:#333}.close-icon[data-v-83d69dc2]{height:26px;width:26px;border-radius:50%;background-color:#ededed;cursor:pointer}.modal_body[data-v-83d69dc2]{padding:0 12px;overflow:hidden}.confirm_text{&[data-v-83d69dc2]{display:flex;align-items:center;justify-content:flex-start;margin:12px 0 20px 12px}.text[data-v-83d69dc2]{margin-left:8px;font-size:13px;font-weight:500}}.modal_footer[data-v-83d69dc2]{display:flex;align-items:center;justify-content:flex-end}
`,document.head.appendChild(v);var b;const C=typeof window<"u",F=t=>typeof t=="string",M=()=>{};C&&((b=window?.navigator)!=null&&b.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function N(t){return typeof t=="function"?t():e.unref(t)}function B(t){return t}function P(t){return e.getCurrentScope()?(e.onScopeDispose(t),!0):!1}function L(t){var o;const n=N(t);return(o=n?.$el)!=null?o:n}const E=C?window:void 0;function x(...t){let o,n,r,u;if(F(t[0])||Array.isArray(t[0])?([n,r,u]=t,o=E):[o,n,r,u]=t,!o)return M;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const f=[],p=()=>{f.forEach(s=>s()),f.length=0},d=(s,h,g,c)=>(s.addEventListener(h,g,c),()=>s.removeEventListener(h,g,c)),l=e.watch(()=>[L(o),N(u)],([s,h])=>{p(),s&&f.push(...n.flatMap(g=>r.map(c=>d(s,g,c,h))))},{immediate:!0,flush:"post"}),m=()=>{l(),p()};return P(m),m}const O=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},I="__vueuse_ssr_handlers__";O[I]=O[I]||{};function T(t={}){const{type:o="page",touch:n=!0,resetOnTouchEnds:r=!1,initialValue:u={x:0,y:0},window:f=E,eventFilter:p}=t,d=e.ref(u.x),l=e.ref(u.y),m=e.ref(null),s=i=>{o==="page"?(d.value=i.pageX,l.value=i.pageY):o==="client"?(d.value=i.clientX,l.value=i.clientY):o==="movement"&&(d.value=i.movementX,l.value=i.movementY),m.value="mouse"},h=()=>{d.value=u.x,l.value=u.y},g=i=>{if(i.touches.length>0){const _=i.touches[0];o==="page"?(d.value=_.pageX,l.value=_.pageY):o==="client"&&(d.value=_.clientX,l.value=_.clientY),m.value="touch"}},c=i=>p===void 0?s(i):p(()=>s(i),{}),a=i=>p===void 0?g(i):p(()=>g(i),{});return f&&(x(f,"mousemove",c,{passive:!0}),x(f,"dragover",c,{passive:!0}),n&&o!=="movement"&&(x(f,"touchstart",a,{passive:!0}),x(f,"touchmove",a,{passive:!0}),r&&x(f,"touchend",h,{passive:!0}))),{x:d,y:l,sourceType:m}}var V;(function(t){t.UP="UP",t.RIGHT="RIGHT",t.DOWN="DOWN",t.LEFT="LEFT",t.NONE="NONE"})(V||(V={}));var z=Object.defineProperty,k=Object.getOwnPropertySymbols,j=Object.prototype.hasOwnProperty,W=Object.prototype.propertyIsEnumerable,S=(t,o,n)=>o in t?z(t,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[o]=n,R=(t,o)=>{for(var n in o||(o={}))j.call(o,n)&&S(t,n,o[n]);if(k)for(var n of k(o))W.call(o,n)&&S(t,n,o[n]);return t};R({linear:B},{easeInSine:[.12,0,.39,0],easeOutSine:[.61,1,.88,1],easeInOutSine:[.37,0,.63,1],easeInQuad:[.11,0,.5,0],easeOutQuad:[.5,1,.89,1],easeInOutQuad:[.45,0,.55,1],easeInCubic:[.32,0,.67,0],easeOutCubic:[.33,1,.68,1],easeInOutCubic:[.65,0,.35,1],easeInQuart:[.5,0,.75,0],easeOutQuart:[.25,1,.5,1],easeInOutQuart:[.76,0,.24,1],easeInQuint:[.64,0,.78,0],easeOutQuint:[.22,1,.36,1],easeInOutQuint:[.83,0,.17,1],easeInExpo:[.7,0,.84,0],easeOutExpo:[.16,1,.3,1],easeInOutExpo:[.87,0,.13,1],easeInCirc:[.55,0,1,.45],easeOutCirc:[0,.55,.45,1],easeInOutCirc:[.85,0,.15,1],easeInBack:[.36,0,.66,-.56],easeOutBack:[.34,1.56,.64,1],easeInOutBack:[.68,-.6,.32,1.6]});const w=Symbol("ModalContext");function $(){const{x:t,y:o}=T(),n=e.inject(w);if(!n)throw new Error("ProvideContext 未提供，请确保在应用中已提供相应的 ProvideContext！");const{modalReactiveList:r,createModal:u,destroyModal:f}=n,p=e.computed(()=>{const a=r.value.length-1;return r.value[a]});function d(a,i){return u({...i,type:a,pointerX:t.value,pointerY:o.value}),p.value?.promise}const l=a=>d("default",a),m=a=>d("success",a),s=a=>d("warning",a),h=a=>d("error",a),g=a=>d("info",a);function c(a){a?p?.value?.resolve(a):p?.value?.reject("取消"),f()}return{create:l,info:g,success:m,warning:s,error:h,destroy:c}}function A(t=8){return Math.random().toString(16).slice(2,2+t)}const Q=e.defineComponent({name:"Info",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"14496",width:"26",height:"26"},[e.createVNode("path",{d:"M512 512m-448 0a448 448 0 1 0 896 0 448 448 0 1 0-896 0Z",fill:"#2196F3","p-id":"14497"},null),e.createVNode("path",{d:"M469.333333 469.333333h85.333334v234.666667h-85.333334z",fill:"#FFFFFF","p-id":"14498"},null),e.createVNode("path",{d:"M512 352m-53.333333 0a53.333333 53.333333 0 1 0 106.666666 0 53.333333 53.333333 0 1 0-106.666666 0Z",fill:"#FFFFFF","p-id":"14499"},null)])}}),X=e.defineComponent({name:"Success",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"4256",width:"26",height:"26"},[e.createVNode("path",{d:"M512 512m-448 0a448 448 0 1 0 896 0 448 448 0 1 0-896 0Z",fill:"#07C160","p-id":"4257"},null),e.createVNode("path",{d:"M466.7 679.8c-8.5 0-16.6-3.4-22.6-9.4l-181-181.1c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l158.4 158.5 249-249c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3L489.3 670.4c-6 6-14.1 9.4-22.6 9.4z",fill:"#FFFFFF","p-id":"4258"},null)])}}),Y=e.defineComponent({name:"Warning",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"17307",width:"26",height:"26"},[e.createVNode("path",{d:"M512 64c247.424 0 448 200.576 448 448S759.424 960 512 960 64 759.424 64 512 264.576 64 512 64z m64 608H448v128h128V672z m32-448H416l64 400h64l64-400z",fill:"#E6960C","p-id":"17308"},null)])}}),H=e.defineComponent({name:"Error",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"15486",width:"26",height:"26"},[e.createVNode("path",{d:"M512 0C229.376 0 0 229.376 0 512s229.376 512 512 512 512-229.376 512-512S794.624 0 512 0z m218.624 672.256c15.872 15.872 15.872 41.984 0 57.856-8.192 8.192-18.432 11.776-29.184 11.776s-20.992-4.096-29.184-11.776L512 569.856l-160.256 160.256c-8.192 8.192-18.432 11.776-29.184 11.776s-20.992-4.096-29.184-11.776c-15.872-15.872-15.872-41.984 0-57.856L454.144 512 293.376 351.744c-15.872-15.872-15.872-41.984 0-57.856 15.872-15.872 41.984-15.872 57.856 0L512 454.144l160.256-160.256c15.872-15.872 41.984-15.872 57.856 0 15.872 15.872 15.872 41.984 0 57.856L569.856 512l160.768 160.256z",fill:"#CF3736","p-id":"15487"},null)])}}),D=e.defineComponent({name:"Close",render(){return e.createVNode("svg",{class:"icon",viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"3779",width:"26",height:"26"},[e.createVNode("path",{d:"M572.16 512l183.466667-183.04a42.666667 42.666667 0 1 0-60.586667-60.586667L512 451.84l-183.04-183.466667a42.666667 42.666667 0 0 0-60.586667 60.586667l183.466667 183.04-183.466667 183.04a42.666667 42.666667 0 0 0 0 60.586667 42.666667 42.666667 0 0 0 60.586667 0l183.04-183.466667 183.04 183.466667a42.666667 42.666667 0 0 0 60.586667 0 42.666667 42.666667 0 0 0 0-60.586667z","p-id":"3780"},null)])}}),U={class:"modal-header"},Z={class:"title"},q={class:"modal_body"},G={class:"confirm_text"},K={class:"close-icon"},J={class:"text"},ee={class:"modal_footer"},te=e.defineComponent({__name:"modalWrap",props:{id:{type:String,required:!0},type:{type:String,default:"default"},title:{type:String,default:"标题"},content:{type:String,default:"默认内容"},mask:{type:Boolean,default:!0},width:{type:Number,default:420},pointerX:{type:Number},pointerY:{type:Number}},setup(t){const{modalReactiveList:o,destroyModal:n}=e.inject(w),r=t,u={info:Q,success:X,warning:Y,error:H},f=e.computed(()=>(console.log(u[r.type]),u[r.type])),p=e.computed(()=>o.value.find(c=>c.id==r.id)),d=e.computed(()=>p.value?.visible),l=e.computed(()=>({opacity:d.value?"1":"0",zIndex:p.value?.zIndex})),m=e.computed(()=>{const c=(document.documentElement.clientWidth-r.width)/2,a=r.pointerX?r.pointerX-c+"px":"0px",i=r.pointerY?r.pointerY-100+"px":"0px";return{width:`${r.width}px`,marginLeft:`-${r.width/2}px`,transform:`scale(${d.value?"1":"0"})`,transformOrigin:`${a} ${i} 0px`}});function s(c){c.target.className==="modal_wrap"&&g()}function h(){p.value.resolve("确认"),n()}function g(){p.value.reject("取消"),n()}return(c,a)=>{const i=e.resolveComponent("el-button");return e.openBlock(),e.createElementBlock("div",{class:"modal_wrap",style:e.normalizeStyle(l.value),onClick:s},[e.createElementVNode("div",{role:"modal",tabindex:"-1",class:"modal_content",style:e.normalizeStyle(m.value)},[e.createElementVNode("div",U,[e.createElementVNode("p",Z,e.toDisplayString(t.title),1),e.createElementVNode("i",{class:"close-icon",onClick:g},[e.createVNode(e.unref(D))])]),e.createElementVNode("div",q,[e.renderSlot(c.$slots,"default",{},void 0,!0)]),t.type!="default"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",G,[e.createElementVNode("i",K,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value)))]),e.createElementVNode("span",J,e.toDisplayString(t.content),1)]),e.createElementVNode("div",ee,[e.createVNode(i,{type:"default",onClick:g},{default:e.withCtx(()=>a[0]||(a[0]=[e.createTextVNode("取消")])),_:1}),e.createVNode(i,{type:"primary",onClick:h},{default:e.withCtx(()=>a[1]||(a[1]=[e.createTextVNode("确认")])),_:1})])],64)):e.createCommentVNode("",!0)],4)],4)}}}),ae="",ne=((t,o)=>{const n=t.__vccOpts||t;for(const[r,u]of o)n[r]=u;return n})(te,[["__scopeId","data-v-83d69dc2"]]),oe=e.defineComponent({__name:"modalProvider",setup(t){let o=999,n=null;const r=e.ref([]),u=e.computed(()=>r.value.map(l=>{const{component:m,props:s,...h}=l;return{id:h.id,options:h,props:s,component:e.toRaw(m)}}));function f(l){console.log(l),n&&clearTimeout(n);const m=A();let s,h;const g=new Promise((a,i)=>{s=a,h=i}),c={...l,id:m,visible:!1,zIndex:o++,promise:g,resolve:s,reject:h};r.value.push(c),console.log(r),e.nextTick(()=>{const a=r.value.findIndex(i=>i.id==m);r.value[a].visible=!0})}function p(){const l=r.value.length-1;l>-1&&(r.value[l].visible=!1,n=setTimeout(()=>{d(l)},300))}function d(l){r.value.splice(l,1)}return e.provide(w,{modalReactiveList:r,createModal:f,destroyModal:p}),(l,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.renderSlot(l.$slots,"default"),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,s=>(e.openBlock(),e.createBlock(ne,e.mergeProps({key:s.id,ref_for:!0},s.options),e.createSlots({_:2},[s.options.type==="default"?{name:"default",fn:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.component),e.mergeProps({ref_for:!0},s.props),null,16))]),key:"0"}:void 0]),1040))),128))],64))}});y.ModalProvider=oe,y.useModal=$,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})});