|
|
import{i as He}from"./is-browser-DqcmxZSF.js";import{f as he,b as W,c as z,e as $e,u as K,h as De}from"./light-Cua7cqmF.js";import{c as ve}from"./context-KbjOeZY_.js";import{G as i,d as N,O as q,s as M,t as Ee,S as fe,i as ge,c as Ne,y as ae,T as V,F as X,z as Be,n as Ae,P as we,R as je,v as ce,E as de}from"./index-bVOhw2NF.js";import{f as ue}from"./fade-in.cssr-CltBGdAW.js";import{f as Ze,L as We,z as Ve}from"./fade-in-scale-up.cssr-CTZmXn_X.js";import{i as Xe}from"./light-jvBBpnb8.js";import{u as Ye}from"./use-locale-CFjRjALw.js";import{o as Y,a as D}from"./delegate-CI_DDEu_.js";import{i as Fe}from"./use-is-mounted-wlrzLfZo.js";import{r as $,N as k}from"./Icon-Ck7Ij_E6.js";import{c as Ge}from"./_createCompounder-D746aL6M.js";import{_ as Ue}from"./Tooltip-C_3SXSAr.js";import{b as Ke}from"./Follower-DJGS5Fnl.js";import{d as qe}from"./download-C2161hUv.js";import{c as Je}from"./index-L98eAIry.js";var Qe=Ge(function(e,u,l){return e+(l?"-":"")+u.toLowerCase()});const eo=$("download",i("svg",{viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},i("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},i("g",{fill:"currentColor","fill-rule":"nonzero"},i("path",{d:"M3.5,13 L12.5,13 C12.7761424,13 13,13.2238576 13,13.5 C13,13.7454599 12.8231248,13.9496084 12.5898756,13.9919443 L12.5,14 L3.5,14 C3.22385763,14 3,13.7761424 3,13.5 C3,13.2545401 3.17687516,13.0503916 3.41012437,13.0080557 L3.5,13 L12.5,13 L3.5,13 Z M7.91012437,1.00805567 L8,1 C8.24545989,1 8.44960837,1.17687516 8.49194433,1.41012437 L8.5,1.5 L8.5,10.292 L11.1819805,7.6109127 C11.3555469,7.43734635 11.6249713,7.4180612 11.8198394,7.55305725 L11.8890873,7.6109127 C12.0626536,7.78447906 12.0819388,8.05390346 11.9469427,8.2487716 L11.8890873,8.31801948 L8.35355339,11.8535534 C8.17998704,12.0271197 7.91056264,12.0464049 7.7156945,11.9114088 L7.64644661,11.8535534 L4.1109127,8.31801948 C3.91565056,8.12275734 3.91565056,7.80617485 4.1109127,7.6109127 C4.28447906,7.43734635 4.55390346,7.4180612 4.7487716,7.55305725 L4.81801948,7.6109127 L7.5,10.292 L7.5,1.5 C7.5,1.25454011 7.67687516,1.05039163 7.91012437,1.00805567 L8,1 L7.91012437,1.00805567 Z"}))))),oo=$("rotateClockwise",i("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10C17 12.7916 15.3658 15.2026 13 16.3265V14.5C13 14.2239 12.7761 14 12.5 14C12.2239 14 12 14.2239 12 14.5V17.5C12 17.7761 12.2239 18 12.5 18H15.5C15.7761 18 16 17.7761 16 17.5C16 17.2239 15.7761 17 15.5 17H13.8758C16.3346 15.6357 18 13.0128 18 10C18 5.58172 14.4183 2 10 2C5.58172 2 2 5.58172 2 10C2 10.2761 2.22386 10.5 2.5 10.5C2.77614 10.5 3 10.2761 3 10Z",fill:"currentColor"}),i("path",{d:"M10 12C11.1046 12 12 11.1046 12 10C12 8.89543 11.1046 8 10 8C8.89543 8 8 8.89543 8 10C8 11.1046 8.89543 12 10 12ZM10 11C9.44772 11 9 10.5523 9 10C9 9.44772 9.44772 9 10 9C10.5523 9 11 9.44772 11 10C11 10.5523 10.5523 11 10 11Z",fill:"currentColor"}))),to=$("rotateClockwise",i("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M17 10C17 6.13401 13.866 3 10 3C6.13401 3 3 6.13401 3 10C3 12.7916 4.63419 15.2026 7 16.3265V14.5C7 14.2239 7.22386 14 7.5 14C7.77614 14 8 14.2239 8 14.5V17.5C8 17.7761 7.77614 18 7.5 18H4.5C4.22386 18 4 17.7761 4 17.5C4 17.2239 4.22386 17 4.5 17H6.12422C3.66539 15.6357 2 13.0128 2 10C2 5.58172 5.58172 2 10 2C14.4183 2 18 5.58172 18 10C18 10.2761 17.7761 10.5 17.5 10.5C17.2239 10.5 17 10.2761 17 10Z",fill:"currentColor"}),i("path",{d:"M10 12C8.89543 12 8 11.1046 8 10C8 8.89543 8.89543 8 10 8C11.1046 8 12 8.89543 12 10C12 11.1046 11.1046 12 10 12ZM10 11C10.5523 11 11 10.5523 11 10C11 9.44772 10.5523 9 10 9C9.44772 9 9 9.44772 9 10C9 10.5523 9.44772 11 10 11Z",fill:"currentColor"}))),io=$("zoomIn",i("svg",{viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("path",{d:"M11.5 8.5C11.5 8.22386 11.2761 8 11 8H9V6C9 5.72386 8.77614 5.5 8.5 5.5C8.22386 5.5 8 5.72386 8 6V8H6C5.72386 8 5.5 8.22386 5.5 8.5C5.5 8.77614 5.72386 9 6 9H8V11C8 11.2761 8.22386 11.5 8.5 11.5C8.7761 position: fixed; left: 0; right: 0; top: 0; bottom: 0; display: flex; `),z("image-preview-overlay",` z-index: -1; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, .3); `,[ue()]),z("image-preview-toolbar",` z-index: 1; position: absolute; left: 50%; transform: translateX(-50%); border-radius: var(--n-toolbar-border-radius); height: 48px; bottom: 40px; padding: 0 12px; background: var(--n-toolbar-color); box-shadow: var(--n-toolbar-box-shadow); color: var(--n-toolbar-icon-color); transition: color .3s var(--n-bezier); display: flex; align-items: center; `,[z("base-icon",` padding: 0 8px; font-size: 28px; cursor: pointer; `),ue()]),z("image-preview-wrapper",` position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: flex; pointer-events: none; `,[Ze()]),z("image-preview",` user-select: none; -webkit-user-select: none; pointer-events: all; margin: auto; max-height: calc(100vh - 32px); max-width: calc(100vw - 32px); transition: transform .3s var(--n-bezier); `),z("image",` display: inline-flex; max-height: 100%; max-width: 100%; `,[$e("preview-disabled",` cursor: pointer; `),W("img",` border-radius: inherit; `)])]),E=32,pe=N({name:"ImagePreview",props:Object.assign(Object.assign({},J),{onNext:Function,onPrev:Function,clsPrefix:{type:String,required:!0}}),setup(e){const u=he("Image","-image",vo,Xe,e,q(e,"clsPrefix"));let l=null;const d=M(null),s=M(null),h=M(void 0),m=M(!1),w=M(!1),{localeRef:c}=Ye("Image");function n(){const{value:o}=s;if(!l||!o)return;const{style:r}=o,t=l.getBoundingClientRect(),f=t.left+t.width/2,g=t.top+t.height/2;r.transformOrigin=`${f}px ${g}px`}function a(o){var r,t;switch(o.key){case" ":o.preventDefault();break;case"ArrowLeft":(r=e.onPrev)===null||r===void 0||r.call(e);break;case"ArrowRight":(t=e.onNext)===null||t===void 0||t.call(e);break;case"Escape":re();break}}Ee(m,o=>{o?Y("keydown",document,a):D("keydown",document,a)}),fe(()=>{D("keydown",document,a)});let v=0,p=0,C=0,b=0,T=0,B=0,Q=0,ee=0,A=!1;function oe(o){const{clientX:r,clientY:t}=o;C=r-v,b=t-p,Ke(P)}function be(o){const{mouseUpClientX:r,mouseUpClientY:t,mouseDownClientX:f,mouseDownClientY:g}=o,L=f-r,O=g-t,I=`vertical${O>0?"Top":"Bottom"}`,y=`horizontal${L>0?"Left":"Right"}`;return{moveVerticalDirection:I,moveHorizontalDirection:y,deltaHorizontal:L,deltaVertical:O}}function te(o){const{value:r}=d;if(!r)return{offsetX:0,offsetY:0};const t=r.getBoundingClientRect(),{moveVerticalDirection:f,moveHorizontalDirection:g,deltaHorizontal:L,deltaVertical:O}=o||{};let I=0,y=0;return t.width<=window.innerWidth?I=0:t.left>0?I=(t.width-window.innerWidth)/2:t.right<window.innerWidth?I=-(t.width-window.innerWidth)/2:g==="horizontalRight"?I=Math.min((t.width-window.innerWidth)/2,T-(L??0)):I=Math.max(-((t.width-window.innerWidth)/2),T-(L??0)),t.height<=window.innerHeight?y=0:t.top>0?y=(t.height-window.innerHeight)/2:t.bottom<window.innerHeight?y=-(t.height-window.innerHeight)/2:f==="verticalBottom"?y=Math.min((t.height-window.innerHeight)/2,B-(O??0)):y=Math.max(-((t.height-window.innerHeight)/2),B-(O??0)),{offsetX:I,offsetY:y}}function ie(o){D("mousemove",document,oe),D("mouseup",document,ie);const{clientX:r,clientY:t}=o;A=!1;const f=be({mouseUpClientX:r,mouseUpClientY:t,mouseDownClientX:Q,mouseDownClientY:ee}),g=te(f);C=g.offsetX,b=g.offsetY,P()}const x=ge(me,null);function xe(o){var r,t;if((t=(r=x==null?void 0:x.previewedImgPropsRef.value)===null||r===void 0?void 0:r.onMousedown)===null||t===void 0||t.call(r,o),o.button!==0)return;const{clientX:f,clientY:g}=o;A=!0,v=f-C,p=g-b,T=C,B=b,Q=f,ee=g,P(),Y("mousemove",document,oe),Y("mouseup",document,ie)}const j=1.5;let R=0,S=1,_=0;function Se(o){var r,t;(t=(r=x==null?void 0:x.previewedImgPropsRef.value)===null||r===void 0?void 0:r.onDblclick)===null||t===void 0||t.call(r,o);const f=ne();S=S===f?1:f,P()}function Z(){S=1,R=0}function Le(){var o;Z(),_=0,(o=e.onPrev)===null||o===void 0||o.call(e)}function Oe(){var o;Z(),_=0,(o=e.onNext)===null||o===void 0||o.call(e)}function Pe(){_-=90,P()}function Ie(){_+=90,P()}function Me(){const{value:o}=d;if(!o)return 1;const{innerWidth:r,innerHeight:t}=window,f=Math.max(1,o.naturalHeight/(t-E)),g=Math.max(1,o.naturalWidth/(r-E));return Math.max(3,f*2,g*2)}function ne(){const{value:o}=d;if(!o)return 1;const{innerWidth:r,innerHeight:t}=window,f=o.naturalHeight/(t-E),g=o.naturalWidth/(r-E);return f<1&&g<1?1:Math.max(f,g)}function ke(){const o=Me();S<o&&(R+=1,S=Math.min(o,Math.pow(j,R)),P())}function ye(){if(S>.5){const o=S;R-=1,S=Math.max(.5,Math.pow(j,R));const r=o-S;P(!1);const t=te();S+=r,P(!1),S-=r,C=t.offsetX,b=t.offsetY,P()}}function ze(){const o=h.value;o&&qe(o,void 0)}function P(o=!0){var r;const{value:t}=d;if(!t)return;const{style:f}=t,g=Ae((r=x==null?void 0:x.previewedImgPropsRef.value)===null||r===void 0?void 0:r.style);let L="";if(typeof g=="string")L=`${g};`;else for(const I in g)L+=`${Qe(I)}: ${g[I]};`;const O=`transform-origin: center; transform: translateX(${C}px) translateY(${b}px) rotate(${_}deg) scale(${S});`;A?f.cssText=`${L}cursor: grabbing; transition: none;${O}`:f.cssText=`${L}cursor: grab;${O}${o?"":"transition: none;"}`,o||t.offsetHeight}function re(){m.value=!m.value,w.value=!0}function Te(){S=ne(),R=Math.ceil(Math.log(S)/Math.log(j)),C=0,b=0,P()}const Re
|