import{defineComponent as pe,reactive as R,shallowRef as y,computed as d,onMounted as de,watch as F,onUnmounted as we,createVNode as a,cloneVNode as Ce}from"vue";import I from"../../_util/KeyCode.mjs";import $ from"../../_util/classNames.mjs";import ge from"../../vc-dialog/DialogWrap.mjs";import xe from"../../vc-dialog/IDialogPropTypes.mjs";import w from"../../vc-util/Dom/addEventListener.mjs";import{getOffset as ye}from"../../vc-util/Dom/css.mjs";import{context as he}from"./PreviewGroup.mjs";import ke from"./getFixScaleEleTransPosition.mjs";import be from"./hooks/useFrameSetState.mjs";const r={x:0,y:0},$e={...xe(),src:String,alt:String,rootClassName:String,icons:{type:Object,default:()=>({})}},Te=pe({compatConfig:{MODE:3},name:"Preview",inheritAttrs:!1,props:$e,emits:["close","afterClose"],setup(o,{emit:S,attrs:E}){const{rotateLeft:K,rotateRight:A,zoomIn:G,zoomOut:Z,close:j,left:H,right:V,flipX:q,flipY:B}=R(o.icons),t=y(1),C=y(0),s=R({x:1,y:1}),[n,c]=be(r),Y=()=>S("close"),h=y(),u=R({originX:0,originY:0,deltaX:0,deltaY:0}),f=y(!1),J=he.inject(),{previewUrls:D,current:X,isPreviewGroup:O,setCurrent:k}=J,b=d(()=>D.value.size),g=d(()=>Array.from(D.value.keys())),i=d(()=>g.value.indexOf(X.value)),Q=d(()=>O.value?D.value.get(X.value):o.src),M=d(()=>O.value&&b.value>1),L=y({wheelDirection:0}),_=()=>{t.value=1,C.value=0,s.x=1,s.y=1,c(r),S("afterClose")},T=e=>{e?t.value+=.5:t.value++,c(r)},U=e=>{t.value>1&&(e?t.value-=.5:t.value--),c(r)},ee=()=>{C.value+=90},oe=()=>{C.value-=90},te=()=>{s.x=-s.x},ie=()=>{s.y=-s.y},le=e=>{e.preventDefault(),e.stopPropagation(),i.value>0&&k(g.value[i.value-1])},se=e=>{e.preventDefault(),e.stopPropagation(),i.value<b.value-1&&k(g.value[i.value+1])},ne=$({[`${o.prefixCls}-moving`]:f.value}),ae=`${o.prefixCls}-operations-operation`,re=`${o.prefixCls}-operations-icon`,ce=[{icon:j,onClick:Y,type:"close"},{icon:G,onClick:()=>T(),type:"zoomIn"},{icon:Z,onClick:()=>U(),type:"zoomOut",disabled:d(()=>t.value===1)},{icon:A,onClick:ee,type:"rotateRight"},{icon:K,onClick:oe,type:"rotateLeft"},{icon:q,onClick:te,type:"flipX"},{icon:B,onClick:ie,type:"flipY"}],W=()=>{if(o.visible&&f.value){const e=h.value.offsetWidth*t.value,l=h.value.offsetHeight*t.value,{left:v,top:x}=ye(h.value),m=C.value%180!==0;f.value=!1;const p=ke(m?l:e,m?e:l,v,x);p&&c({...p})}},ue=e=>{e.button===0&&(e.preventDefault(),e.stopPropagation(),u.deltaX=e.pageX-n.x,u.deltaY=e.pageY-n.y,u.originX=n.x,u.originY=n.y,f.value=!0)},z=e=>{o.visible&&f.value&&c({x:e.pageX-u.deltaX,y:e.pageY-u.deltaY})},fe=e=>{if(!o.visible)return;e.preventDefault();const l=e.deltaY;L.value={wheelDirection:l}},ve=e=>{!o.visible||!M.value||(e.preventDefault(),e.keyCode===I.LEFT?i.value>0&&k(g.value[i.value-1]):e.keyCode===I.RIGHT&&i.value<b.value-1&&k(g.value[i.value+1]))},me=()=>{o.visible&&(t.value!==1&&(t.value=1),(n.x!==r.x||n.y!==r.y)&&c(r))};let N=()=>{};return de(()=>{F([()=>o.visible,f],()=>{N();let e,l;const v=w(window,"mouseup",W,!1),x=w(window,"mousemove",z,!1),m=w(window,"wheel",fe,{passive:!1}),p=w(window,"keydown",ve,!1);try{window.top!==window.self&&(e=w(window.top,"mouseup",W,!1),l=w(window.top,"mousemove",z,!1))}catch{}N=()=>{v.remove(),x.remove(),m.remove(),p.remove(),e&&e.remove(),l&&l.remove()}},{flush:"post",immediate:!0}),F([L],()=>{const{wheelDirection:e}=L.value;e>0?U(!0):e<0&&T(!0)})}),we(()=>{N()}),()=>{const{visible:e,prefixCls:l,rootClassName:v}=o;return a(ge,{...E,transitionName:o.transitionName,maskTransitionName:o.maskTransitionName,closable:!1,keyboard:!0,prefixCls:l,onClose:Y,afterClose:_,visible:e,wrapClassName:ne,rootClassName:v,getContainer:o.getContainer},{default:()=>[a("div",{class:[`${o.prefixCls}-operations-wrapper`,v]},[a("ul",{class:`${o.prefixCls}-operations`},[ce.map(({icon:x,onClick:m,type:p,disabled:P})=>a("li",{class:$(ae,{[`${o.prefixCls}-operations-operation-disabled`]:P&&P?.value}),onClick:m,key:p},[Ce(x,{class:re})]))])]),a("div",{class:`${o.prefixCls}-img-wrapper`,style:{transform:`translate3d(${n.x}px, ${n.y}px, 0)`}},[a("img",{onMousedown:ue,onDblclick:me,ref:h,class:`${o.prefixCls}-img`,src:Q.value,alt:o.alt,style:{transform:`scale3d(${s.x*t.value}, ${s.y*t.value}, 1) rotate(${C.value}deg)`}},null)]),M.value&&a("div",{class:$(`${o.prefixCls}-switch-left`,{[`${o.prefixCls}-switch-left-disabled`]:i.value<=0}),onClick:le},[H]),M.value&&a("div",{class:$(`${o.prefixCls}-switch-right`,{[`${o.prefixCls}-switch-right-disabled`]:i.value>=b.value-1}),onClick:se},[V])]})}}});export{Te as default,$e as previewProps};
