"use strict";var core=require("@gem-sdk/core"),React=require("react");const useCompareImage=({props:e,aspectRatio:t})=>{let{styles:n,leftImage:o,rightImage:r,hover:u=!1,vertical:s=!1,sliderLineWidth:c=2,sliderPositionPercentage:a=.5,onSliderPositionChange:i,preload:m}=e,d=!s,{isPreviewSharePageMode:v,isEditMode:l}=core.useRenderMode(),R="STATIC"===core.usePageType(),[f,g]=React.useState(a),[p,E]=React.useState(0),[w,h]=React.useState(0),[L,b]=React.useState(!1),[C,S]=React.useState(!1),I=React.useRef(null),M=React.useRef(null),B=React.useRef(null),O=React.useRef(null),{onListener:T,saveToElementInteractionData:X}=core.useInteraction(),Y=React.useRef(null),q=React.useMemo(()=>t,[o,r,n?.aspectRatio,n?.customAspectRadio]);React.useEffect(()=>{let t=`[data-id="${e?.componentUid}"]`;T({event:"gp:change-ratio-original",selector:t,elementRef:Y},e=>{let{data:t,isRollback:n,uniqueStorageKey:o}=e||{};if(!n||void 0!==t){if(n){g(Number(t));return}X(Y.current,o,f),g(Number(t)/100)}})},[T,e?.componentUid,X,f]);let A=React.useMemo(()=>c/2+21,[c]),N=React.useMemo(()=>(d?p-c/2:w-c/2)-21,[d,p,c,w]),P=m||l||v||R;React.useEffect(()=>{let e=I.current;if(!e)return;let t=new ResizeObserver(([e])=>{let t=e?.target.getBoundingClientRect().width??0;E(t)});return t.observe(e),()=>t.disconnect()},[]),React.useEffect(()=>{let e=O?.current?.complete;return e&&b(!0),()=>{b(!1)}},[o]),React.useEffect(()=>{let e=B?.current?.complete;return e&&S(!0),()=>{S(!1)}},[r]);let U=C&&L;return React.useEffect(()=>{let e=d?a*p:a*w;e<A?g(d?A/p:A/w):e>N?g(d?N/p:N/w):g(a)},[w,p,d,N,A,a]),React.useEffect(()=>{let e=e=>{let t=e||window.event;if(t.stopPropagation(),t.button&&0!==t.button)return;let n="touches"in t?t?.touches?.[0]?.pageX??0:t.pageX,o="touches"in t?t?.touches?.[0]?.pageY??0:t.pageY,r=n-window.pageXOffset,u=o-window.pageYOffset,s=B.current?.getBoundingClientRect(),c=d?r-(s?.left??0):u-(s?.top??0);c<A&&(c=A),c>N&&(c=N),d?g(c/p):g(c/w),i&&(d?i(c/p):i(c/w))},t=t=>{t.preventDefault(),e(t),t.button&&0!==t.button||(window.addEventListener("mousemove",e),r.addEventListener("touchmove",e))},n=()=>{window.removeEventListener("mousemove",e),r.removeEventListener("touchmove",e)},o=I.current,r=M.current;if(U&&o&&r){r.addEventListener("touchstart",t),r.addEventListener("touchend",n),u?(o.addEventListener("mousemove",e),o.addEventListener("mouseleave",n)):(o.addEventListener("mousedown",t),window.addEventListener("mouseup",n));let s=O.current?.getBoundingClientRect(),c=B.current?.getBoundingClientRect(),a=(s?.height??0)/(s?.width??1),i=(c?.height??0)/(c?.width??1),m=Math.min(a,i),d=p*m;h(d)}return()=>{o&&r&&(r.removeEventListener("touchstart",t),r.removeEventListener("touchend",n),o.removeEventListener("mousemove",e),o.removeEventListener("mouseleave",n),o.removeEventListener("mousedown",t),window.removeEventListener("mouseup",n),window.removeEventListener("mousemove",e),r.removeEventListener("touchmove",e))}},[u,N,A,d,q,p,w,U,c,n?.aspectRatio,i]),{ref:Y,priority:P,sliderRef:M,containerRef:I,leftImageRef:O,rightImageRef:B,sliderPosition:f,containerWidth:p,containerHeight:w,allImagesLoaded:U,setLeftImgLoaded:b,setRightImgLoaded:S}};exports.useCompareImage=useCompareImage;
