import{r as e}from"./rolldown-runtime-DCMCV6zW.js";import{A as t,Bt as n,D as r,Dt as i,O as a,R as o,Vt as s,et as c,j as l,pt as u}from"./vendor-vue-core-X6q-rGJs.js";import{T as d}from"./vendor-vueuse-B_IQhD9R.js";var f={key:0,class:`relative size-full`},p=[`src`,`alt`],m=[`src`,`alt`],h={key:1,class:`flex size-full items-center justify-center`},g=o({__name:`WidgetImageCompare`,props:{widget:{}},setup(e){let o=e,g=i(null),_=i(50),{elementX:v,elementWidth:y,isOutside:b}=d(g);u([v,y,b],([e,t,n])=>{!n&&t>0&&(_.value=Math.max(0,Math.min(100,e/t*100)))});let x=r(()=>{let e=o.widget.value;return typeof e==`string`?e:e?.before||``}),S=r(()=>{let e=o.widget.value;return typeof e==`string`?``:e?.after||``}),C=r(()=>{let e=o.widget.value;return typeof e==`object`&&e?.beforeAlt?e.beforeAlt:`Before image`}),w=r(()=>{let e=o.widget.value;return typeof e==`object`&&e?.afterAlt?e.afterAlt:`After image`});return(e,r)=>(c(),l(`div`,{ref_key:`containerRef`,ref:g,class:`relative size-full min-h-32 overflow-hidden`},[x.value||S.value?(c(),l(`div`,f,[S.value?(c(),l(`img`,{key:0,src:S.value,alt:w.value,draggable:`false`,class:`size-full object-contain`},null,8,p)):t(``,!0),x.value?(c(),l(`img`,{key:1,src:x.value,alt:C.value,draggable:`false`,class:`absolute inset-0 size-full object-contain`,style:n({clipPath:`inset(0 ${100-_.value}% 0 0)`})},null,12,m)):t(``,!0),a(`div`,{class:`pointer-events-none absolute inset-y-0 z-10 w-0.5 bg-white shadow-md`,style:n({left:`${_.value}%`}),role:`presentation`},null,4)])):(c(),l(`div`,h,s(e.$t(`imageCompare.noImages`)),1))],512))}});export{g as default};
//# sourceMappingURL=WidgetImageCompare-BLHLMq38.js.map