import{r as e}from"./rolldown-runtime-DIIn1E2Q.js";import{A as t,D as n,F as r,G as i,Ht as a,I as o,O as s,Ot as c,R as l,Vt as u,_t as d,et as f,j as p,pt as m,rt as h,ut as g}from"./vendor-vue-core-IZuWV8u3.js";import"./vendor-other-DOjudfJ1.js";import{D as _}from"./vendor-vueuse-BDeAjd2M.js";import"./vendor-reka-ui-NsM8zEZd.js";import{t as v}from"./Button-BonqIZfE.js";var y={key:0,class:`flex items-center gap-1`},b={class:`mr-1 text-muted-foreground`},x={"data-testid":`batch-counter`},S=l({__name:`BatchNavigation`,props:i({count:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=g(e,`modelValue`);return(e,r)=>e.count>1?(f(),p(`div`,y,[s(`span`,b,[h(e.$slots,`label`)]),o(v,{variant:`muted-textonly`,size:`icon-sm`,disabled:n.value===0,"data-testid":`batch-prev`,onClick:r[0]||=e=>n.value--},{default:d(()=>r[2]||=[s(`i`,{class:`icon-[lucide--chevron-left]`},null,-1)]),_:1},8,[`disabled`]),s(`span`,x,a(e.$t(`batch.index`,{current:n.value+1,total:e.count})),1),o(v,{variant:`muted-textonly`,size:`icon-sm`,disabled:n.value===e.count-1,"data-testid":`batch-next`,onClick:r[1]||=e=>n.value++},{default:d(()=>r[3]||=[s(`i`,{class:`icon-[lucide--chevron-right]`},null,-1)]),_:1},8,[`disabled`])])):t(``,!0)}}),C={class:`flex size-full min-h-32 flex-col overflow-hidden`},w={key:0,class:`flex shrink-0 justify-between px-2 py-1 text-xs`,"data-testid":`batch-nav`},T={key:0},E=[`src`,`alt`],D=[`src`,`alt`],O={key:2,class:`flex min-h-0 flex-1 items-center justify-center`},k=l({__name:`WidgetImageCompare`,props:{widget:{}},setup(e){let i=e,l=c(null),h=c(50),g=c(0),v=c(0),{elementX:y,elementWidth:b,isOutside:x}=_(l);m([y,b,x],([e,t,n])=>{!n&&t>0&&(h.value=Math.max(0,Math.min(100,e/t*100)))});function isSingleImage(e){return typeof e==`string`}let k=n(()=>{let e=i.widget.value;return isSingleImage(e)?null:e}),A=n(()=>k.value?.beforeImages?.length??0),j=n(()=>k.value?.afterImages?.length??0),M=n(()=>A.value>1||j.value>1);m(()=>k.value?.beforeImages,()=>{g.value=0}),m(()=>k.value?.afterImages,()=>{v.value=0});let N=n(()=>{let e=i.widget.value;return isSingleImage(e)?e:e?.beforeImages?.[g.value]??``}),P=n(()=>{let e=i.widget.value;return isSingleImage(e)?``:e?.afterImages?.[v.value]??``}),F=n(()=>{let e=i.widget.value;return!isSingleImage(e)&&e?.beforeAlt?e.beforeAlt:`Before image`}),I=n(()=>{let e=i.widget.value;return!isSingleImage(e)&&e?.afterAlt?e.afterAlt:`After image`});return(e,n)=>(f(),p(`div`,C,[M.value?(f(),p(`div`,w,[o(S,{modelValue:g.value,"onUpdate:modelValue":n[0]||=e=>g.value=e,count:A.value,"data-testid":`before-batch`},{label:d(()=>[r(a(e.$t(`imageCompare.batchLabelA`)),1)]),_:1},8,[`modelValue`,`count`]),A.value<=1?(f(),p(`div`,T)):t(``,!0),o(S,{modelValue:v.value,"onUpdate:modelValue":n[1]||=e=>v.value=e,count:j.value,"data-testid":`after-batch`},{label:d(()=>[r(a(e.$t(`imageCompare.batchLabelB`)),1)]),_:1},8,[`modelValue`,`count`])])):t(``,!0),N.value||P.value?(f(),p(`div`,{key:1,ref_key:`containerRef`,ref:l,class:`relative min-h-0 flex-1`},[P.value?(f(),p(`img`,{key:0,src:P.value,alt:I.value,draggable:`false`,class:`size-full object-contain`},null,8,E)):t(``,!0),N.value?(f(),p(`img`,{key:1,src:N.value,alt:F.value,draggable:`false`,class:`absolute inset-0 size-full object-contain`,style:u({clipPath:`inset(0 ${100-h.value}% 0 0)`})},null,12,D)):t(``,!0),s(`div`,{class:`pointer-events-none absolute inset-y-0 z-10 w-0.5 bg-white shadow-md`,style:u({left:`${h.value}%`}),role:`presentation`},null,4)],512)):(f(),p(`div`,O,a(e.$t(`imageCompare.noImages`)),1))]))}});export{k as default};
//# sourceMappingURL=WidgetImageCompare-CdT2YYOk.js.map