use-modal-B90Yu1ev.js 16 KB

1
  1. var Ke=Object.defineProperty,Ge=Object.defineProperties;var Qe=Object.getOwnPropertyDescriptors;var ae=Object.getOwnPropertySymbols;var Ce=Object.prototype.hasOwnProperty,ke=Object.prototype.propertyIsEnumerable;var de=(s,t,o)=>t in s?Ke(s,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):s[t]=o,h=(s,t)=>{for(var o in t||(t={}))Ce.call(t,o)&&de(s,o,t[o]);if(ae)for(var o of ae(t))ke.call(t,o)&&de(s,o,t[o]);return s},F=(s,t)=>Ge(s,Qe(t));var H=(s,t)=>{var o={};for(var a in s)Ce.call(s,a)&&t.indexOf(a)<0&&(o[a]=s[a]);if(s!=null&&ae)for(var a of ae(s))t.indexOf(a)<0&&ke.call(s,a)&&(o[a]=s[a]);return o};var W=(s,t,o)=>de(s,typeof t!="symbol"?t+"":t,o);var J=(s,t,o)=>new Promise((a,l)=>{var d=m=>{try{k(o.next(m))}catch(i){l(i)}},p=m=>{try{k(o.throw(m))}catch(i){l(i)}},k=m=>m.done?a(m.value):Promise.resolve(m.value).then(d,p);k((o=o.apply(s,t)).next())});import{a4 as $,aa as y,ab as f,a7 as e,af as Ze,ag as et,ac as v,a8 as C,R as De,av as ue,J as L,P as D,x as X,aq as w,aw as tt,aV as V,aW as A,ad as ce,T as Ae,a9 as ot,ao as st,az as at,bG as ie,an as nt,Y as lt,bU as rt,aB as dt,ai as K,aj as G,ah as Be,n as pe,aF as $e,bb as it,i as ut,k as we}from"../jse/index-index-CTvWBEcQ.js";import{a_ as fe,bk as Te,bN as ct,bO as pt,bP as ft,T as mt,bQ as ht,bR as yt,bh as Ee,bS as vt,bT as gt,bU as bt,bV as Ct,bW as kt,bF as Bt,bX as wt,bG as _t,bY as Ot,bI as xt,ba as Mt,b1 as _e,bE as Dt,bJ as At}from"./bootstrap-BcAf5ut0.js";const $t=fe("expand",[["path",{d:"m15 15 6 6",key:"1s409w"}],["path",{d:"m15 9 6-6",key:"ko1vev"}],["path",{d:"M21 16v5h-5",key:"1ck2sf"}],["path",{d:"M21 8V3h-5",key:"1qoq8a"}],["path",{d:"M3 16v5h5",key:"1t08am"}],["path",{d:"m3 21 6-6",key:"wwnumi"}],["path",{d:"M3 8V3h5",key:"1ln10m"}],["path",{d:"M9 9 3 3",key:"v551iv"}]]);const Tt=fe("shrink",[["path",{d:"m15 15 6 6m-6-6v4.8m0-4.8h4.8",key:"17vawe"}],["path",{d:"M9 19.8V15m0 0H4.2M9 15l-6 6",key:"chjx8e"}],["path",{d:"M15 4.2V9m0 0h4.8M15 9l6-6",key:"lav6yq"}],["path",{d:"M9 4.2V9m0 0H4.2M9 9 3 3",key:"1pxi2q"}]]);const Et=fe("x",[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]]),St=$({__name:"Dialog",props:{open:{type:Boolean},defaultOpen:{type:Boolean},modal:{type:Boolean}},emits:["update:open"],setup(s,{emit:t}){const l=Te(s,t);return(d,p)=>(f(),y(e(ct),Ze(et(e(l))),{default:v(()=>[C(d.$slots,"default")]),_:3},16))}}),It=["data-dismissable-modal"],Pt=$({__name:"DialogOverlay",setup(s){pt();const t=De("DISMISSABLE_MODAL_ID");return(o,a)=>(f(),ue("div",{"data-dismissable-modal":e(t),class:"bg-overlay z-popup inset-0"},null,8,It))}}),Lt=$({__name:"DialogContent",props:{forceMount:{type:Boolean},trapFocus:{type:Boolean},disableOutsidePointerEvents:{type:Boolean},asChild:{type:Boolean},as:{},appendTo:{default:"body"},class:{},closeClass:{},closeDisabled:{type:Boolean,default:!1},modal:{type:Boolean},open:{type:Boolean},overlayBlur:{},showClose:{type:Boolean,default:!0},zIndex:{}},emits:["escapeKeyDown","pointerDownOutside","focusOutside","interactOutside","openAutoFocus","closeAutoFocus","close","closed","opened"],setup(s,{expose:t,emit:o}){const a=s,l=o,d=L(()=>{const O=a,{class:r,modal:u,open:g,showClose:B}=O;return H(O,["class","modal","open","showClose"])});function p(){return a.appendTo==="body"||a.appendTo===document.body||!a.appendTo}const k=L(()=>p()?"fixed":"absolute"),m=Te(d,l),i=D(null);function c(r){var u;r.target===((u=i.value)==null?void 0:u.$el)&&(a.open?l("opened"):l("closed"))}return t({getContentRef:()=>i.value}),(r,u)=>(f(),y(e(ft),{to:r.appendTo},{default:v(()=>[X(mt,{name:"fade"},{default:v(()=>[r.open&&r.modal?(f(),y(Pt,{key:0,style:tt(F(h({},r.zIndex?{zIndex:r.zIndex}:{}),{position:k.value,backdropFilter:r.overlayBlur&&r.overlayBlur>0?`blur(${r.overlayBlur}px)`:"none"})),onClick:u[0]||(u[0]=()=>l("close"))},null,8,["style"])):w("",!0)]),_:1}),X(e(yt),ce({ref_key:"contentRef",ref:i,style:F(h({},r.zIndex?{zIndex:r.zIndex}:{}),{position:k.value}),onAnimationend:c},e(m),{class:e(A)("z-popup bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%] w-full p-6 shadow-lg outline-none sm:rounded-xl",a.class)}),{default:v(()=>[C(r.$slots,"default"),r.showClose?(f(),y(e(ht),{key:0,disabled:r.closeDisabled,class:V(e(A)("data-[state=open]:bg-accent data-[state=open]:text-muted-foreground hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-3 top-3 h-6 w-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none",a.closeClass)),onClick:u[1]||(u[1]=()=>l("close"))},{default:v(()=>[X(e(Et),{class:"h-4 w-4"})]),_:1},8,["disabled","class"])):w("",!0)]),_:3},16,["style","class"])]),_:3},8,["to"]))}}),Oe=$({__name:"DialogDescription",props:{asChild:{type:Boolean},as:{},class:{}},setup(s){const t=s,o=L(()=>{const p=t,{class:l}=p;return H(p,["class"])}),a=Ee(o);return(l,d)=>(f(),y(e(vt),ce(e(a),{class:e(A)("text-muted-foreground text-sm",t.class)}),{default:v(()=>[C(l.$slots,"default")]),_:3},16,["class"]))}}),zt=$({__name:"DialogFooter",props:{class:{}},setup(s){const t=s;return(o,a)=>(f(),ue("div",{class:V(e(A)("flex flex-row flex-col-reverse justify-end gap-x-2",t.class))},[C(o.$slots,"default")],2))}}),Ft=$({__name:"DialogHeader",props:{class:{}},setup(s){const t=s;return(o,a)=>(f(),ue("div",{class:V(e(A)("flex flex-col gap-y-1.5 text-center sm:text-left",t.class))},[C(o.$slots,"default")],2))}}),xe=$({__name:"DialogTitle",props:{asChild:{type:Boolean},as:{},class:{}},setup(s){const t=s,o=L(()=>{const p=t,{class:l}=p;return H(p,["class"])}),a=Ee(o);return(l,d)=>(f(),y(e(gt),ce(e(a),{class:e(A)("text-lg font-semibold leading-none tracking-tight",t.class)}),{default:v(()=>[C(l.$slots,"default")]),_:3},16,["class"]))}});function Vt(s,t,o,a){const l=Ae({offsetX:0,offsetY:0}),d=D(!1),p=c=>{const r=c.clientX,u=c.clientY;if(!s.value)return;const g=s.value.getBoundingClientRect(),{offsetX:B,offsetY:_}=l,O=g.left,R=g.top,Y=g.width,Q=g.height;let E=null;if(a!=null&&a.value){const x=document.querySelector(a.value);x&&(E=x.getBoundingClientRect())}let U,j,q,S;if(E)q=E.left-O+B,U=E.right-O-Y+B,S=E.top-R+_,j=E.bottom-R-Q+_;else{const x=document.documentElement,I=x.clientWidth,M=x.clientHeight;q=-O+B,S=-R+_,U=I-O-Y+B,j=M-R-Q+_}const Z=x=>{let I=B+x.clientX-r,M=_+x.clientY-u;I=Math.min(Math.max(I,q),U),M=Math.min(Math.max(M,S),j),l.offsetX=I,l.offsetY=M,s.value&&(s.value.style.transform=`translate(${I}px, ${M}px)`,d.value=!0)},ee=()=>{d.value=!1,document.removeEventListener("mousemove",Z),document.removeEventListener("mouseup",ee)};document.addEventListener("mousemove",Z),document.addEventListener("mouseup",ee)},k=()=>{const c=ie(t);c&&s.value&&c.addEventListener("mousedown",p)},m=()=>{const c=ie(t);c&&s.value&&c.removeEventListener("mousedown",p)},i=()=>{l.offsetX=0,l.offsetY=0;const c=ie(s);c&&(c.style.transform="none")};return ot(()=>{st(()=>{o.value?k():m()})}),at(()=>{m()}),{dragging:d,resetPosition:i,transform:l}}const Rt=$({__name:"modal",props:{modalApi:{default:void 0},appendToMain:{type:Boolean,default:!1},bordered:{type:Boolean},cancelText:{},centered:{type:Boolean},class:{},closable:{type:Boolean},closeOnClickModal:{type:Boolean},closeOnPressEscape:{type:Boolean},confirmDisabled:{type:Boolean},confirmLoading:{type:Boolean},confirmText:{},contentClass:{},description:{},destroyOnClose:{type:Boolean,default:!1},draggable:{type:Boolean},footer:{type:Boolean},footerClass:{},fullscreen:{type:Boolean},fullscreenButton:{type:Boolean},header:{type:Boolean},headerClass:{},loading:{type:Boolean},modal:{type:Boolean},openAutoFocus:{type:Boolean},overlayBlur:{},showCancelButton:{type:Boolean},showConfirmButton:{type:Boolean},submitting:{type:Boolean},title:{},titleTooltip:{},zIndex:{}},setup(s){var se,be;const t=s,o=bt.getComponents(),a=D(),l=D(),d=D(),p=D(),k=D(),m=nt();$e("DISMISSABLE_MODAL_ID",m);const{$t:i}=Ct(),{isMobile:c}=kt(),r=(be=(se=t.modalApi)==null?void 0:se.useStore)==null?void 0:be.call(se),{appendToMain:u,bordered:g,cancelText:B,centered:_,class:O,closable:R,closeOnClickModal:Y,closeOnPressEscape:Q,confirmDisabled:E,confirmLoading:U,confirmText:j,contentClass:q,description:S,destroyOnClose:Z,draggable:ee,footer:x,footerClass:I,fullscreen:M,fullscreenButton:Se,header:ne,headerClass:Ie,loading:me,modal:Pe,openAutoFocus:Le,overlayBlur:ze,showCancelButton:Fe,showConfirmButton:Ve,submitting:T,title:te,titleTooltip:he,zIndex:Re}=Bt(t,r),oe=L(()=>M.value&&ne.value||c.value),ye=L(()=>ee.value&&!oe.value&&ne.value),ve=L(()=>u.value?`#${wt}>div:not(.absolute)>div`:void 0),{dragging:Ne,transform:Xe}=Vt(d,p,ye,ve),le=D(!1),re=D(!0);lt(()=>{var n;return(n=r==null?void 0:r.value)==null?void 0:n.isOpen},n=>J(null,null,function*(){if(n){if(re.value=!1,le.value||(le.value=!0),yield pe(),!a.value)return;const b=a.value.getContentRef();d.value=b.$el;const{offsetX:N,offsetY:z}=Xe;d.value.style.transform=`translate(${N}px, ${z}px)`}}),{immediate:!0}),rt(()=>{var n;u.value||(n=t.modalApi)==null||n.close()});function Ye(){var n;(n=t.modalApi)==null||n.setState(b=>F(h({},b),{fullscreen:!M.value}))}function Ue(n){(!Y.value||T.value)&&(n.preventDefault(),n.stopPropagation())}function je(n){(!Q.value||T.value)&&n.preventDefault()}function qe(n){Le.value||n==null||n.preventDefault()}function He(n){const b=n.target,N=b==null?void 0:b.dataset.dismissableModal;(!Y.value||N!==m||T.value)&&(n.preventDefault(),n.stopPropagation())}function ge(n){n.preventDefault(),n.stopPropagation()}const We=L(()=>!e(Z)&&e(le));function Je(){var n;re.value=!0,(n=t.modalApi)==null||n.onClosed()}return(n,b)=>{var N;return f(),y(e(St),{modal:!1,open:(N=e(r))==null?void 0:N.isOpen,"onUpdate:open":b[3]||(b[3]=()=>{var z;return e(T)||(z=n.modalApi)==null?void 0:z.close()})},{default:v(()=>{var z;return[X(e(Lt),{ref_key:"contentRef",ref:a,"append-to":ve.value,class:V(e(A)("left-0 right-0 top-[10vh] mx-auto flex max-h-[80%] w-[520px] flex-col p-0",oe.value?"sm:rounded-none":"sm:rounded-[var(--radius)]",e(O),{"border-border border":e(g),"shadow-3xl":!e(g),"left-0 top-0 size-full max-h-full !translate-x-0 !translate-y-0":oe.value,"top-1/2 !-translate-y-1/2":e(_)&&!oe.value,"duration-300":!e(Ne),hidden:re.value})),"force-mount":We.value,modal:e(Pe),open:(z=e(r))==null?void 0:z.isOpen,"show-close":e(R),"z-index":e(Re),"overlay-blur":e(ze),"close-class":"top-3",onCloseAutoFocus:ge,onClosed:Je,"close-disabled":e(T),onEscapeKeyDown:je,onFocusOutside:ge,onInteractOutside:Ue,onOpenAutoFocus:qe,onOpened:b[2]||(b[2]=()=>{var P;return(P=n.modalApi)==null?void 0:P.onOpened()}),onPointerDownOutside:He},{default:v(()=>[X(e(Ft),{ref_key:"headerRef",ref:p,class:V(e(A)("px-5 py-4",{"border-b":e(g),hidden:!e(ne),"cursor-move select-none":ye.value},e(Ie)))},{default:v(()=>[e(te)?(f(),y(e(xe),{key:0,class:"text-left"},{default:v(()=>[C(n.$slots,"title",{},()=>[K(G(e(te))+" ",1),e(he)?C(n.$slots,"titleTooltip",{key:0},()=>[X(e(_t),{"trigger-class":"pb-1"},{default:v(()=>[K(G(e(he)),1)]),_:1})]):w("",!0)])]),_:3})):w("",!0),e(S)?(f(),y(e(Oe),{key:1},{default:v(()=>[C(n.$slots,"description",{},()=>[K(G(e(S)),1)])]),_:3})):w("",!0),!e(te)||!e(S)?(f(),y(e(Ot),{key:2},{default:v(()=>[e(te)?w("",!0):(f(),y(e(xe),{key:0})),e(S)?w("",!0):(f(),y(e(Oe),{key:1}))]),_:1})):w("",!0)]),_:3},8,["class"]),dt("div",{ref_key:"wrapperRef",ref:l,class:V(e(A)("relative min-h-40 flex-1 overflow-y-auto p-3",e(q),{"pointer-events-none":e(me)||e(T)}))},[C(n.$slots,"default")],2),e(me)||e(T)?(f(),y(e(xt),{key:0,spinning:""})):w("",!0),e(Se)?(f(),y(e(Mt),{key:1,class:"hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-10 top-3 hidden size-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none sm:block",onClick:Ye},{default:v(()=>[e(M)?(f(),y(e(Tt),{key:0,class:"size-3.5"})):(f(),y(e($t),{key:1,class:"size-3.5"}))]),_:1})):w("",!0),e(x)?(f(),y(e(zt),{key:2,ref_key:"footerRef",ref:k,class:V(e(A)("flex-row items-center justify-end p-2",{"border-t":e(g)},e(I)))},{default:v(()=>[C(n.$slots,"prepend-footer"),C(n.$slots,"footer",{},()=>[e(Fe)?(f(),y(Be(e(o).DefaultButton||e(_e)),{key:0,variant:"ghost",disabled:e(T),onClick:b[0]||(b[0]=()=>{var P;return(P=n.modalApi)==null?void 0:P.onCancel()})},{default:v(()=>[C(n.$slots,"cancelText",{},()=>[K(G(e(B)||e(i)("cancel")),1)])]),_:3},8,["disabled"])):w("",!0),C(n.$slots,"center-footer"),e(Ve)?(f(),y(Be(e(o).PrimaryButton||e(_e)),{key:1,disabled:e(E),loading:e(U)||e(T),onClick:b[1]||(b[1]=()=>{var P;return(P=n.modalApi)==null?void 0:P.onConfirm()})},{default:v(()=>[C(n.$slots,"confirmText",{},()=>[K(G(e(j)||e(i)("confirm")),1)])]),_:3},8,["disabled","loading"])):w("",!0)]),C(n.$slots,"append-footer")]),_:3},8,["class"])):w("",!0)]),_:3},8,["append-to","class","force-mount","modal","open","show-close","z-index","overlay-blur","close-disabled"])]}),_:3},8,["open"])}}});class Nt{constructor(t={}){W(this,"sharedData",{payload:{}});W(this,"store");W(this,"api");W(this,"state");const r=t,{connectedComponent:o,onBeforeClose:a,onCancel:l,onClosed:d,onConfirm:p,onOpenChange:k,onOpened:m}=r,i=H(r,["connectedComponent","onBeforeClose","onCancel","onClosed","onConfirm","onOpenChange","onOpened"]),c={bordered:!0,centered:!1,class:"",closeOnClickModal:!0,closeOnPressEscape:!0,confirmDisabled:!1,confirmLoading:!1,contentClass:"",destroyOnClose:!0,draggable:!1,footer:!0,footerClass:"",fullscreen:!1,fullscreenButton:!0,header:!0,headerClass:"",isOpen:!1,loading:!1,modal:!0,openAutoFocus:!1,showCancelButton:!0,showConfirmButton:!0,title:""};this.store=new Dt(h(h({},c),i),{onUpdate:()=>{var g,B,_;const u=this.store.state;(u==null?void 0:u.isOpen)===((g=this.state)==null?void 0:g.isOpen)?this.state=u:(this.state=u,(_=(B=this.api).onOpenChange)==null||_.call(B,!!(u!=null&&u.isOpen)))}}),this.state=this.store.state,this.api={onBeforeClose:a,onCancel:l,onClosed:d,onConfirm:p,onOpenChange:k,onOpened:m},it(this)}close(){return J(this,null,function*(){var o,a,l;((l=yield(a=(o=this.api).onBeforeClose)==null?void 0:a.call(o))!=null?l:!0)&&this.store.setState(d=>F(h({},d),{isOpen:!1,submitting:!1}))})}getData(){var t,o;return(o=(t=this.sharedData)==null?void 0:t.payload)!=null?o:{}}lock(t=!0){return this.setState({submitting:t})}onCancel(){var t,o;this.api.onCancel?(o=(t=this.api).onCancel)==null||o.call(t):this.close()}onClosed(){var t,o;this.state.isOpen||(o=(t=this.api).onClosed)==null||o.call(t)}onConfirm(){var t,o;(o=(t=this.api).onConfirm)==null||o.call(t)}onOpened(){var t,o;this.state.isOpen&&((o=(t=this.api).onOpened)==null||o.call(t))}open(){this.store.setState(t=>F(h({},t),{isOpen:!0}))}setData(t){return this.sharedData.payload=t,this}setState(t){return ut(t)?this.store.setState(t):this.store.setState(o=>h(h({},o),t)),this}unlock(){return this.lock(!1)}}const Me=Symbol("VBEN_MODAL_INJECT"),Xt={};function Ht(s={}){var m;const{connectedComponent:t}=s;if(t){const i=Ae({}),c=D(!0);return[$((u,{attrs:g,slots:B})=>($e(Me,{extendApi(O){Object.setPrototypeOf(i,O)},options:s,reCreateModal(){return J(this,null,function*(){c.value=!1,yield pe(),c.value=!0})}}),Yt(i,h(h(h({},u),g),B)),()=>we(c.value?t:"div",h(h({},u),g),B)),{name:"VbenParentModal",inheritAttrs:!1}),i]}const o=De(Me,{}),a=h(h(h({},Xt),o.options),s);a.onOpenChange=i=>{var c,r,u;(c=s.onOpenChange)==null||c.call(s,i),(u=(r=o.options)==null?void 0:r.onOpenChange)==null||u.call(r,i)};const l=a.onClosed;a.onClosed=()=>{var i;l==null||l(),a.destroyOnClose&&((i=o.reCreateModal)==null||i.call(o))};const d=new Nt(a),p=d;p.useStore=i=>At(d.store,i);const k=$((i,{attrs:c,slots:r})=>()=>we(Rt,F(h(h({},i),c),{modalApi:p}),r),{name:"VbenModal",inheritAttrs:!1});return(m=o.extendApi)==null||m.call(o,p),[k,p]}function Yt(s,t){return J(this,null,function*(){var l;if(!t||Object.keys(t).length===0)return;yield pe();const o=(l=s==null?void 0:s.store)==null?void 0:l.state;if(!o)return;const a=new Set(Object.keys(o));for(const d of Object.keys(t))a.has(d)&&!["class"].includes(d)&&console.warn(`[Vben Modal]: When 'connectedComponent' exists, do not set props or slots '${d}', which will increase complexity. If you need to modify the props of Modal, please use useVbenModal or api.`)})}export{Et as X,Ht as u};