import{useRef as e,useState as r,useMemo as t,useEffect as u}from"react";import n from"../../carousel-v3/hooks/useTrackPreviewPause.js";import{useTransition as i}from"./useTransition.js";import{useCurrentDevice as o,isBrowser as l}from"@gem-sdk/core";let c=c=>{let{setting:m,builderProps:a,styles:s}=c,d=e(null),T=o(),{speed:f,direction:v,isPreview:g,itemWidthType:q}=m||{},{itemMaxWidth:w}=s||{},h=e(null),p=e(null),I=e(null),S=e(null),[b,k]=r(),[y,B]=r(),[E,C]=r(0),[M,N]=r(!1),[O,R]=r(!1),{isFirstPreviewClicked:_}=n(g),$=t(()=>E||(f&&_&&g&&!M?100*f:0),[f,_,g,E,M]),j=e=>{let r=d.current?.getBoundingClientRect(),t=window.innerWidth,u=d.current?.querySelector(`.gem-marquee-item-${e}`);if(!u)return;let n=u.getBoundingClientRect().left,i=u.getBoundingClientRect().width;if(n>0&&n+20<t)return;let o=n+i/2-t/2;i>t&&(o=n-(r?.left||0));let l=o/1e3;return l},J=e=>{let r=e.detail;a?.uid===r.id&&("activeItem"===r.field&&k(r.value),"hoverItem"===r.field&&B(r.value))};i((e,r)=>{if(void 0===e||!r||e==f&&r==v)return;S.current&&clearTimeout(S.current);let t=f||0;return C(100*t),S.current=setTimeout(()=>{C(0)},3e3),()=>{S.current&&clearTimeout(S.current)}},[f,v]),i(e=>{e!==$&&void 0!==e&&0===$&&L()},[$]),i(e=>{e&&JSON.stringify(e)!==JSON.stringify(w)&&(h.current&&clearTimeout(h.current),R(!0),I.current&&clearTimeout(I.current),I.current=setTimeout(()=>{L()},1500),h.current=setTimeout(()=>{R(!1)},3e3))},[w]),u(()=>(window.addEventListener("update-marquee",J),()=>{window.removeEventListener("update-marquee",J)}),[]),u(()=>{if(void 0!==b)return P(b||"0"),()=>{I.current&&clearTimeout(I.current),h.current&&clearTimeout(h.current)}},[b]),u(()=>()=>{I.current&&clearTimeout(I.current),h.current&&clearTimeout(h.current),p.current&&clearTimeout(p.current)},[]),u(()=>{M&&N(!1)},[g]);let L=e=>{let r=d.current?.querySelector(".first-block");r?.scrollIntoView({inline:"center",block:"nearest",behavior:e?"smooth":void 0})},P=e=>{if(q?.[T]==="BASE_ON_NUMBER_OF_ITEMS")return;if(p.current&&clearTimeout(p.current),R(!0),p.current=setTimeout(()=>{R(!1)},2e3),"0"==e){L(!0);return}let r=d.current?.querySelector(`.gem-marquee-item-${e}`);r?.scrollIntoView({inline:"center",block:"nearest",behavior:"smooth"})},V=t(()=>l()?j(parseInt(b??"0")):void 0,[b]);return{rate:$,wrapperElement:d,timeToScroll:V,hoverItem:y,setHoverItem:B,setActiveItem:k,getTimeScroll:j,activeItem:b,direction:v,isPause:O,scrollTime:1e3*Math.abs(V??0),scrollToItemClass:e=>`gem-marquee-item gem-marquee-item-${e}`}};export{c as useMarqueeScrollToItem};
