vue3-dialog-c/lib/vue3-dialog.umd.js

a vue3 dialog component

(function(_,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(_=typeof globalThis<"u"?globalThis:_||self,e(_["vue3-dialog"]={},_.Vue))})(this,function(_,e){"use strict";var w=document.createElement("style");w.textContent=`.dialog-overlay[data-v-26c39cca]{position:fixed;overflow:hidden;inset:0;background:rgba(0,0,0,.5);height:100vh;transition:all .2s linear}.dialog[data-v-26c39cca]{position:absolute;left:50%;top:100px;width:640px;box-shadow:0 12px 32px 4px #0000000a,0 8px 20px #00000014;box-sizing:border-box;background-color:#fff;border-radius:4px;padding:16px;transition:all .2s linear}.dialog-header[data-v-26c39cca]{height:45px;display:flex;align-items:center;justify-content:space-between}.dialog-header .title[data-v-26c39cca]{font-weight:500;font-size:18px;margin:0;color:#333}.close-icon[data-v-26c39cca]{height:26px;width:26px;border-radius:50%;background-color:#ededed;cursor:pointer}.dialog-body[data-v-26c39cca]{padding:0 10px;overflow:hidden}
`,document.head.appendChild(w);var b;const O=typeof window<"u",P=t=>typeof t=="string",T=()=>{};O&&((b=window?.navigator)!=null&&b.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function I(t){return typeof t=="function"?t():e.unref(t)}function j(t){return t}function B(t){return e.getCurrentScope()?(e.onScopeDispose(t),!0):!1}function L(t){var o;const n=I(t);return(o=n?.$el)!=null?o:n}const D=O?window:void 0;function y(...t){let o,n,a,s;if(P(t[0])||Array.isArray(t[0])?([n,a,s]=t,o=D):[o,n,a,s]=t,!o)return T;Array.isArray(n)||(n=[n]),Array.isArray(a)||(a=[a]);const l=[],u=()=>{l.forEach(i=>i()),l.length=0},p=(i,c,g,m)=>(i.addEventListener(c,g,m),()=>i.removeEventListener(c,g,m)),f=e.watch(()=>[L(o),I(s)],([i,c])=>{u(),i&&l.push(...n.flatMap(g=>a.map(m=>p(i,g,m,c))))},{immediate:!0,flush:"post"}),r=()=>{f(),u()};return B(r),r}const E=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},k="__vueuse_ssr_handlers__";E[k]=E[k]||{};function V(t={}){const{type:o="page",touch:n=!0,resetOnTouchEnds:a=!1,initialValue:s={x:0,y:0},window:l=D,eventFilter:u}=t,p=e.ref(s.x),f=e.ref(s.y),r=e.ref(null),i=d=>{o==="page"?(p.value=d.pageX,f.value=d.pageY):o==="client"?(p.value=d.clientX,f.value=d.clientY):o==="movement"&&(p.value=d.movementX,f.value=d.movementY),r.value="mouse"},c=()=>{p.value=s.x,f.value=s.y},g=d=>{if(d.touches.length>0){const h=d.touches[0];o==="page"?(p.value=h.pageX,f.value=h.pageY):o==="client"&&(p.value=h.clientX,f.value=h.clientY),r.value="touch"}},m=d=>u===void 0?i(d):u(()=>i(d),{}),v=d=>u===void 0?g(d):u(()=>g(d),{});return l&&(y(l,"mousemove",m,{passive:!0}),y(l,"dragover",m,{passive:!0}),n&&o!=="movement"&&(y(l,"touchstart",v,{passive:!0}),y(l,"touchmove",v,{passive:!0}),a&&y(l,"touchend",c,{passive:!0}))),{x:p,y:f,sourceType:r}}var C;(function(t){t.UP="UP",t.RIGHT="RIGHT",t.DOWN="DOWN",t.LEFT="LEFT",t.NONE="NONE"})(C||(C={}));var $=Object.defineProperty,N=Object.getOwnPropertySymbols,Q=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable,S=(t,o,n)=>o in t?$(t,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[o]=n,Y=(t,o)=>{for(var n in o||(o={}))Q.call(o,n)&&S(t,n,o[n]);if(N)for(var n of N(o))X.call(o,n)&&S(t,n,o[n]);return t};Y({linear:j},{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 x=Symbol("DialogToken");function A(){const{x:t,y:o}=V(),{dialogs:n,createDialog:a,disposeDialog:s,getDialogId:l}=e.inject(x),u=e.computed(()=>n&&l?n[l()]:null);function p(r,i){return a(r,{...i,pointerX:t.value,pointerY:o.value}),u?.value?.promise}function f(r){r?u?.value?.resolve(r):u?.value?.reject("取消"),s()}return{open:p,close:f}}const H=t=>(e.pushScopeId("data-v-26c39cca"),t=t(),e.popScopeId(),t),R={class:"dialog-header"},W={class:"title"},z=[H(()=>e.createElementVNode("svg",{t:"1679295681396",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.createElementVNode("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"})],-1))],F={class:"dialog-body"},M=e.defineComponent({__name:"DialogContainer",props:{title:{type:String,default:"dialog"},mask:{type:Boolean,default:!0},width:{type:Number,default:600},pointerX:{type:Number},pointerY:{type:Number}},setup(t){const o=t,{dialogs:n,createDialog:a,disposeDialog:s,getDialogId:l}=e.inject(x),u=e.computed(()=>{const c=(document.documentElement.clientWidth-o.width)/2,g=o.pointerX?o.pointerX-c+"px":"0px",m=o.pointerY?o.pointerY-100+"px":"0px";return{width:`${o.width}px`,marginLeft:`-${o.width/2}px`,transform:`scale(${f.value?"1":"0"})`,transformOrigin:`${g} ${m} 0px`}}),p=e.computed(()=>n[l()]),f=e.computed(()=>n[l()]?.visible);function r(c){c.target.className==="dialog-overlay"&&i()}function i(){p.value.reject("取消"),s()}return(c,g)=>(e.openBlock(),e.createElementBlock("div",{class:"dialog-overlay",style:e.normalizeStyle({opacity:e.unref(f)?"1":"0"}),onClick:r},[e.createElementVNode("div",{role:"dialog",tabindex:"-1",class:"dialog",style:e.normalizeStyle(e.unref(u))},[e.createElementVNode("div",R,[e.createElementVNode("p",W,e.toDisplayString(t.title),1),e.createElementVNode("i",{class:"close-icon",onClick:i},z)]),e.createElementVNode("div",F,[e.renderSlot(c.$slots,"default",{},void 0,!0)])],4)],4))}}),oe="",U=((t,o)=>{const n=t.__vccOpts||t;for(const[a,s]of o)n[a]=s;return n})(M,[["__scopeId","data-v-26c39cca"]]);function G(){let t=0,o=null;const n=()=>`__dialog__${t++}`,a=e.reactive({});function s(r,i){o&&clearTimeout(o);let c,g;const m=n(),v=new Promise((J,Z)=>{c=J,g=Z}),{props:d,...h}=i,q=p(r,h,d);a[m]={component:q,config:i,visible:!1,promise:v,resolve:c,reject:g},e.nextTick(()=>{a[m].visible=!0})}function l(){const r=u(),i=a[r];i&&(i.visible=!1,o=setTimeout(()=>{delete a[r]},300))}function u(){const r=Object.keys(a).filter(i=>!!a[i]);return r.length>0?r[0]:""}function p(r,i,c){return console.log(i),e.defineComponent({render(){return e.createVNode(U,i,{default:()=>[e.createVNode(r,c,null)]})}})}return e.provide(x,{dialogs:a,createDialog:s,disposeDialog:l,getDialogId:u}),{dialogList:e.computed(()=>Object.keys(a).filter(i=>!!a[i]).map(i=>({id:i,...a[i],component:e.toRaw(a[i].component)})))}}const K=e.defineComponent({__name:"DialogProvider",setup(t){const{dialogList:o}=G();return(n,a)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.renderSlot(n.$slots,"default"),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(o),s=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.component),{key:s.id,id:s.id},null,8,["id"]))),128))],64))}});_.DialogProvider=K,_.useDialog=A,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})});