react-smart-ticker - npm Package Compare versions

Comparing version 1.5.2 to 1.5.3

CHANGELOG.md

 # Changelog
 
+## [1.5.3](https://github.com/eugen-k/react-smart-ticker/compare/v1.5.2...v1.5.3) (2025-05-21)
+
+
+### Bug Fixes
+
+* improve animation state management and event handling ([d659163](https://github.com/eugen-k/react-smart-ticker/commit/d659163dbf8ddf5d25c04b5aad8529c48fb12323))
+* improve animation state management and event handling ([623fb74](https://github.com/eugen-k/react-smart-ticker/commit/623fb74d1ecdf3b2909052315d511314aeaf20bd))
+
 ## [1.5.2](https://github.com/eugen-k/react-smart-ticker/compare/v1.5.1...v1.5.2) (2025-05-17)
@@ -4,0 +12,0 @@

dist/SmartTickerDraggable.esm.js

@@ -1,2 +0,2 @@
-import t,{useRef as e,useState as i,useImperativeHandle as r,useEffect as n,useLayoutEffect as s,useCallback as a,useMemo as o,Fragment as l}from"react";import{s as c,u,T as d}from"./index-mujaiDHd.js";var h,p="smartTickerDraggable-module_ticker__VSYGW",m="smartTickerDraggable-module_drag-wrapper__rAdh-",g="smartTickerDraggable-module_no-dragging__X1QfP",v="smartTickerDraggable-module_dragging__IcxtW",f="smartTickerDraggable-module_off__pFb7U";c(".smartTickerDraggable-module_ticker__VSYGW {\n  flex-wrap: nowrap;\n  position: relative;\n  -webkit-text-size-adjust: none;\n     -moz-text-size-adjust: none;\n          text-size-adjust: none;\n}\n\n.smartTickerDraggable-module_drag-wrapper__rAdh- {\n  display: flex;\n  position: relative;\n  flex-wrap: nowrap;\n  touch-action: none;\n  -webkit-touch-action: none;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-:not(.smartTickerDraggable-module_no-dragging__X1QfP) {\n  cursor: grab;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_dragging__IcxtW {\n  cursor: grabbing;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_off__pFb7U {\n  cursor: inherit;\n}"),function(t){t.Forward="FORWARD",t.Back="BACK",t.Restart="RESTART",t.Dragging="DRAGGING"}(h||(h={}));class y{constructor(){this.prevTime=0,this.isDragging=!1,this.iterationCounter=0,this.speed=50,this.speedBack=200,this.isPausedByVisibility=!1,this.isInited=!1,this.reqAnimFrameKey=null,this.animationState=null,this.timeoutIds=[],this.restartLoop=()=>{requestAnimationFrame((()=>{this.wrapperEl.current&&this.animate(h.Restart)}))},this.getSign=()=>{switch(this.animationState){case h.Forward:return"left"===this.direction||"top"===this.direction?-1:1;case h.Back:case h.Restart:return this.animationStartPos<0?-1:1;default:return 1}}}draw(t){var e,i,r,n;if(null===(null===(e=this.wrapperEl)||void 0===e?void 0:e.current))return;const s=([h.Back,h.Restart].includes(this.animationState)?this.speedBack:this.speed)*t*this.getSign(),a=Number((null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style["x"===this.axis?"left":"top"])||void 0===n?void 0:n.replace("px",""))||0)+s;this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"}animate(t,e){var i,r,n,s;this.stopAnimation(),t!==this.animationState&&(this.animationState=t),this.prevTime=0,this.animationStartPos=Number((null===(s=null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)||void 0===n?void 0:n["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0);const a=i=>{this.prevTime||(this.prevTime=i);const r=Math.min((i-this.prevTime)/1e3,.1);this.prevTime=i,this.draw(r),this.alignPosition(t,e)&&(this.reqAnimFrameKey=requestAnimationFrame(a.bind(this)))};requestAnimationFrame(a.bind(this))}stopAnimation(){this.reqAnimFrameKey&&(cancelAnimationFrame(this.reqAnimFrameKey),this.reqAnimFrameKey=null)}clearTimeouts(){this.timeoutIds.forEach((t=>clearTimeout(t))),this.timeoutIds=[]}alignPosition(t,e){var i,r,n,s,a,o,l,c,u,d,p,m;if(!this.isInited)return!1;if(!this.infiniteScrollView||t!==h.Forward&&t!==h.Dragging){if(t===h.Forward){const t={y:{top:this.tickerRect.height-this.containerRect.height,bottom:this.tickerRect.height-this.containerRect.height},x:{left:this.tickerRect.width-this.containerRect.width,right:this.tickerRect.width-this.containerRect.width}};if(Math.abs(Number((null===(m=null===(p=null===(d=null===(u=this.wrapperEl)||void 0===u?void 0:u.current)||void 0===d?void 0:d.style)||void 0===p?void 0:p["x"===this.axis?"left":"top"])||void 0===m?void 0:m.replace("px",""))||0))>t[this.axis][this.direction])return this.iterationCounter++,this.stopAnimation(),this.timeoutIds.push(setTimeout((()=>{this.restartLoop()}),this.delayBack)),!1}else if(t===h.Restart){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px","infinite"===this.iterations||this.iterationCounter<this.iterations?this.timeoutIds.push(setTimeout((()=>{this.animate(h.Forward)}),this.delay)):"function"==typeof this.onIterationsEnd&&(e&&e(),this.onIterationsEnd())})),!1}else if(t===h.Back){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),this.animationState=null,requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px"})),e&&e(),!1}}else{switch(this.axis){case"x":{const t=Number(null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style.left.replace("px","")),e=Number(null===(s=null===(n=this.tickerEl)||void 0===n?void 0:n.current)||void 0===s?void 0:s.style.minWidth.replace("px",""));if(this.wrapperEl&&t>=e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=t-e+"px"}));break}if(this.wrapperEl&&t<=-e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=t+e+"px"}));break}break}case"y":{const t=Number(null===(o=null===(a=this.wrapperEl)||void 0===a?void 0:a.current)||void 0===o?void 0:o.style.top.replace("px","")),e=Number(null===(c=null===(l=this.tickerEl)||void 0===l?void 0:l.current)||void 0===c?void 0:c.style.minHeight.replace("px",""));if(this.wrapperEl&&t>=e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=t-e+"px"}));break}if(this.wrapperEl&&t<=-e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=t+e+"px"}));break}break}}if("infinite"!==this.iterations&&this.iterationCounter>=this.iterations)return this.stopAnimation(),e&&e(),"function"==typeof this.onIterationsEnd&&this.onIterationsEnd(),!1}return!0}pause(){this.isInited&&(this.isPausedByVisibility=!1,this.stopAnimation())}setIsDragging(t){t&&this.stopAnimation(),this.isDragging=t}getIsDragging(){return this.isDragging}play(t){var e,i;this.isInited&&(null===(i=null===(e=this.wrapperEl)||void 0===e?void 0:e.current)||void 0===i?void 0:i.style)&&(this.isPausedByVisibility=!1,this.clearTimeouts(),this.animationState===h.Back&&(this.animationState=h.Restart),this.isDragging||this.timeoutIds.push(setTimeout((()=>{this.animate(this.animationState||h.Forward,(()=>{"function"==typeof t&&t()}))}),this.animationState?0:this.delay)))}toggleByVisibility(){this.isInited&&("hidden"===(null===document||void 0===document?void 0:document.visibilityState)?(this.animationState&&(this.isPausedByVisibility=!0),this.stopAnimation()):this.isPausedByVisibility&&"visible"===(null===document||void 0===document?void 0:document.visibilityState)&&(this.prevTime=performance.now(),this.play()))}init({tickerEl:t,wrapperEl:e,tickerRect:i,delay:r,delayBack:n,containerRect:s,startPosition:a,speed:o,speedBack:l,infiniteScrollView:c,direction:u,iterations:d,onIterationsEnd:h}){this.tickerEl=t,this.wrapperEl=e,this.axis="left"===u||"right"===u?"x":"y",this.speed=o,this.speedBack=-1*l,this.iterations=d,this.onIterationsEnd=h||null,this.iterationCounter=0,this.infiniteScrollView=c,this.tickerRect=i,this.containerRect=s,this.delay=r,this.delayBack=n,this.direction=u,0!==this.iterations&&(a&&(this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"),"x"===this.axis?this.wrapperEl.current.style.top="0px":this.wrapperEl.current.style.left="0px",this.isInited=!0)}backToStartPosition(t=!0,e,i=!1){var r,n;if(!this.isInited||!(null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style))return;this.clearTimeouts();const s=this.speedBack;this.speedBack=i?1e3:this.speedBack,this.animate(h.Back,(()=>{this.speedBack=s,t?"function"==typeof e&&e():this.timeoutIds.push(setTimeout((()=>{this.animate(h.Forward)}),this.delay))}))}getCounter(){return this.iterationCounter}setCounter(t){this.iterationCounter=t}}const w=({children:c,smart:w=!0,autoFill:x=!1,rtl:b=!1,direction:k=(b?"right":"left"),speed:E=50,pauseOnHover:S=!1,playOnHover:R=!1,delay:D=0,delayBack:T=500,speedBack:A=200,iterations:_="infinite",recalcDeps:B=[],style:F,containerStyle:C,isText:I=!0,waitForFonts:O=!!I,multiLine:H=0,infiniteScrollView:j=!0,disableSelect:P=!1,disableDragging:V=!1,forwardedRef:N})=>{var L;w=w&&!x,S=!R&&S,I=!!H||I;const q="left"===(k=H?"top":k)||"right"===k?"x":"y",[W,M]=i(!1),{containerRef:$,tickerRef:X,containerRect:Y,tickerRect:z,isChildFit:K,amountToFill:G,isCalculated:U,recalc:Q}=u({children:c,multiLine:H,infiniteScrollView:j,smart:w,waitForFonts:O,direction:k,autoFill:x,speed:E,recalcDeps:B}),J=o((()=>!K||!w&&K&&j),[K,w,j]),{onMouseDownHandler:Z,onTouchStartHandler:tt,onContainerHoverHandler:et,wrapperRef:it,isPaused:rt,isAnimating:nt,onVisibilityChangeHandler:st}=(({isCalculated:t,tickerRef:o,tickerRect:l,containerRect:c,delay:u,delayBack:d,speed:p,speedBack:m,direction:g,rtl:v,infiniteScrollView:f,iterations:w,playOnHover:x,pauseOnHover:b,canBeAnimated:k,onMouseDown:E,onMouseUp:S,forwardedRef:R})=>{const D="left"===g||"right"===g?"x":"y",T=e(new y),A=e(null),[_,B]=i(!0),[F,C]=i(!1),[I,O]=i(!1);let H,j,P,V;r(R,(()=>({play:()=>{B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))},pause:()=>{T.current.pause()},reset:(t=!0)=>{B(!1),C(!0),T.current.backToStartPosition(t,(()=>{B(t),t&&C(!1)}))}}))),n((()=>()=>{removeEventListener("mousemove",H),removeEventListener("mouseup",V),removeEventListener("touchmove",j),removeEventListener("touchend",P),B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}),!0)}),[]),s((()=>(t&&(T.current.init({tickerEl:o,wrapperEl:A,tickerRect:l,containerRect:c,infiniteScrollView:f,startPosition:0,speed:p,speedBack:m,delay:u,delayBack:d,direction:g,rtl:v,iterations:w,onIterationsEnd:()=>{I&&x?T.current.pause():(B(!0),C(!1))}}),!k||x&&!b||(B(!1),C(!0))),()=>{B(!0),C(!1)})),[t,u,d,p,m,w,f,g,v,b,x]),s((()=>{_?(A.current&&(A.current.style.willChange="auto"),T.current.pause(),x&&(T.current.setCounter(0),T.current.backToStartPosition(!0,(()=>{C(!1)})))):k&&(A.current&&(A.current.style.willChange="x"===D?"left":"top"),T.current.play((()=>{B(!0),C(!1)})),C(!0))}),[_,k]);const N=a((t=>{O(t)}),[x,b]);n((()=>{T.current.getIsDragging()||(x&&B(!I),b&&B(!!I))}),[I]);const L=t=>{var e,i,r,n;let s=null!==(e=t.clientX)&&void 0!==e?e:null===(i=t.touches[0])||void 0===i?void 0:i.clientX,a=null!==(r=t.clientY)&&void 0!==r?r:null===(n=t.touches[0])||void 0===n?void 0:n.clientY,o=0,u=0;const d={y:{top:-(l.height-c.height),bottom:0},x:{left:-(l.width-c.width),right:0}},p={y:{top:0,bottom:l.height-c.height},x:{left:0,right:l.width-c.width}};return t=>{var e,i,r,n,l,c,m,v;o=s-Number(null!==(e=t.clientX)&&void 0!==e?e:null===(i=t.touches[0])||void 0===i?void 0:i.clientX),u=a-Number(null!==(r=t.clientY)&&void 0!==r?r:null===(n=t.touches[0])||void 0===n?void 0:n.clientY),s=null!==(l=t.clientX)&&void 0!==l?l:null===(c=t.touches[0])||void 0===c?void 0:c.clientX,a=null!==(m=t.clientY)&&void 0!==m?m:null===(v=t.touches[0])||void 0===v?void 0:v.clientY,requestAnimationFrame((()=>{if(f)A.current.style["x"===D?"left":"top"]=Number(A.current.style["x"===D?"left":"top"].replace("px",""))-("x"===D?o:u)+"px",T.current.alignPosition(h.Dragging);else{const t=Number(A.current.style["x"===D?"left":"top"].replace("px","")),e=t-("x"===D?o:u);(e<d[D][g]||e>p[D][g])&&(o/=50,u/=50),A.current.style["x"===D?"left":"top"]=t-("x"===D?o:u)+"px"}}))}},q=a((()=>{T.current.toggleByVisibility()}),[]);return{onMouseDownHandler:t=>{"function"==typeof E&&E(),t.preventDefault(),T.current.setIsDragging(!0),A.current&&(A.current.style.willChange="x"===D?"left":"top"),addEventListener("mousemove",H=L(t)),addEventListener("mouseup",V=()=>{"function"==typeof S&&S(),A.current&&(A.current.style.willChange="auto"),T.current.setIsDragging(!1),k&&!x&&("infinite"===w||T.current.getCounter()<w)?(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))):(B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}))),removeEventListener("mousemove",H),removeEventListener("mouseup",V)})},onMoveHandler:L,onTouchStartHandler:t=>{T.current.setIsDragging(!0),"function"==typeof E&&E(),A.current&&(A.current.style.willChange="x"===D?"left":"top"),addEventListener("touchmove",j=L(t)),addEventListener("touchend",P=()=>{T.current.setIsDragging(!1),"function"==typeof S&&S(),A.current&&(A.current.style.willChange="auto"),k&&!x&&("infinite"===w||T.current.getCounter()<w)?(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))):(B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}))),removeEventListener("touchmove",j),removeEventListener("touchend",P)})},onContainerHoverHandler:N,onVisibilityChangeHandler:q,isPaused:_,isAnimating:F,wrapperRef:A,animation:T.current}})({isCalculated:U,tickerRef:X,tickerRect:z,containerRect:Y,infiniteScrollView:j,delay:D,delayBack:T,speed:E,speedBack:A,canBeAnimated:J,direction:k,rtl:b,iterations:_,playOnHover:R,pauseOnHover:S,onMouseDown:function(){var t;null===(t=it.current)||void 0===t||t.classList.add(v),M(!0)},onMouseUp:function(){var t;null===(t=it.current)||void 0===t||t.classList.remove(v),M(!1)},forwardedRef:N}),at=a((()=>{Q()}),[]);const ot=o((()=>x?new Array(G).fill(0).map(((e,i)=>t.createElement(l,{key:i},c,"y"===q&&G>1&&I&&t.createElement("br",null)))):c),[c,x,G]),lt=o((()=>!(!(("left"===k||"right"===k&&b)&&I&&rt)||nt||S||W||K||x||!U)),[q,I,rt,S,W,K,U,nt]),ct=o((()=>!("top"!==k||!rt||!I||nt||S||W||K||!H||x||!U)),[q,I,rt,S,W,H,K,U,nt]),ut=o((()=>lt?"inline-block":ct?"-webkit-box":"flex"),[lt,ct]),dt=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},F),{display:ut,flexWrap:"nowrap",overflow:"hidden",textSizeAdjust:"none",justifyItems:"flex-start",flexDirection:"x"===q?"row":"column",userSelect:P?"none":"unset",WebkitUserSelect:P?"none":"unset",WebkitTouchCallout:P?"none":"unset"}),"x"===q&&{minWidth:z.width,whiteSpace:"nowrap"}),"y"===q&&{minHeight:z.height,whiteSpace:"normal"}),{direction:b?"rtl":"ltr"}),lt&&{minWidth:Y.width,maxWidth:Y.width,display:ut,textOverflow:"ellipsis"}),ct&&{display:ut,WebkitLineClamp:H,WebkitBoxOrient:"vertical",maxHeight:Y.height*H}),b&&"x"===q&&Object.assign({transform:`translate${q}(-100%)`,left:`${z.width}px`},lt&&{left:`${Y.width}px`})),ht=Object.assign(Object.assign({[k]:null===(L=null==it?void 0:it.current)||void 0===L?void 0:L.style[k],justifyItems:b?"flex-end":"flex-start",flexDirection:"x"===q?"row":"column",transform:`translate${q}(-${z["x"===q?"width":"height"]}px)`},lt&&{transform:`translate${q}(-${Y["x"===q?"width":"height"]}px)`}),!j&&{transform:`translate${q}(0px)`});return w&&K&&U?t.createElement(d,{containerRef:$,containerRect:Y,direction:k,infiniteScrollView:j,style:C,onResizeHandler:at},t.createElement("div",{ref:it,className:m+" "+f},t.createElement("div",{key:"ticker-simple",ref:X,"data-testid":"ticker-smart",className:p,style:dt},c))):t.createElement(d,Object.assign({containerRef:$,containerRect:Y,infiniteScrollView:j,direction:k,style:C,onResizeHandler:at,onVisibilityChangeHandler:st,draggable:!0},(R||S)&&{onHoverHandler:et}),t.createElement("div",Object.assign({ref:it,"data-testid":"ticker-wrapper",className:`${m} ${V?g:""}`,style:ht},!V&&{onMouseDown:Z},!V&&{onTouchStart:tt}),t.createElement("div",{key:"ticker-1",ref:X,"data-testid":"ticker-1",className:p,style:dt},ot),j&&t.createElement(t.Fragment,null,t.createElement("div",{"data-testid":"ticker-2",className:p,style:Object.assign(Object.assign({},dt),{display:U?ut:"none"})},ot),t.createElement("div",{"data-testid":"ticker-3",className:p,style:Object.assign(Object.assign({},dt),{display:U?ut:"none"})},ot))))};export{w as SmartTickerDraggable,w as default};
+import t,{useRef as e,useState as i,useImperativeHandle as r,useEffect as n,useLayoutEffect as s,useCallback as a,useMemo as o,Fragment as l}from"react";import{s as c,u,T as d}from"./index-mujaiDHd.js";var h,p="smartTickerDraggable-module_ticker__VSYGW",m="smartTickerDraggable-module_drag-wrapper__rAdh-",g="smartTickerDraggable-module_no-dragging__X1QfP",v="smartTickerDraggable-module_dragging__IcxtW",f="smartTickerDraggable-module_off__pFb7U";c(".smartTickerDraggable-module_ticker__VSYGW {\n  flex-wrap: nowrap;\n  position: relative;\n  -webkit-text-size-adjust: none;\n     -moz-text-size-adjust: none;\n          text-size-adjust: none;\n}\n\n.smartTickerDraggable-module_drag-wrapper__rAdh- {\n  display: flex;\n  position: relative;\n  flex-wrap: nowrap;\n  touch-action: none;\n  -webkit-touch-action: none;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-:not(.smartTickerDraggable-module_no-dragging__X1QfP) {\n  cursor: grab;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_dragging__IcxtW {\n  cursor: grabbing;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_off__pFb7U {\n  cursor: inherit;\n}"),function(t){t.Forward="FORWARD",t.Back="BACK",t.Restart="RESTART",t.Dragging="DRAGGING"}(h||(h={}));class y{constructor(){this.prevTime=0,this.isDragging=!1,this.iterationCounter=0,this.speed=50,this.speedBack=200,this.isPausedByVisibility=!1,this.isInited=!1,this.reqAnimFrameKey=null,this.animationState=null,this.timeoutIds=[],this.restartLoop=()=>{requestAnimationFrame((()=>{this.wrapperEl.current&&this.animate(h.Restart)}))},this.getSign=()=>{switch(this.animationState){case h.Forward:return"left"===this.direction||"top"===this.direction?-1:1;case h.Back:case h.Restart:return this.animationStartPos<0?-1:1;default:return 1}}}draw(t){var e,i,r,n;if(null===(null===(e=this.wrapperEl)||void 0===e?void 0:e.current))return;const s=([h.Back,h.Restart].includes(this.animationState)?this.speedBack:this.speed)*t*this.getSign(),a=Number((null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style["x"===this.axis?"left":"top"])||void 0===n?void 0:n.replace("px",""))||0)+s;this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"}animate(t,e){var i,r,n,s;this.stopAnimation(),t!==this.animationState&&(this.animationState=t),this.prevTime=0,this.animationStartPos=Number((null===(s=null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)||void 0===n?void 0:n["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0);const a=i=>{this.prevTime||(this.prevTime=i);const r=Math.min((i-this.prevTime)/1e3,.1);this.prevTime=i,this.draw(r),this.alignPosition(t,e)&&(this.reqAnimFrameKey=requestAnimationFrame(a.bind(this)))};requestAnimationFrame(a.bind(this))}stopAnimation(){this.reqAnimFrameKey&&(cancelAnimationFrame(this.reqAnimFrameKey),this.reqAnimFrameKey=null)}clearTimeouts(){this.timeoutIds.forEach((t=>clearTimeout(t))),this.timeoutIds=[]}alignPosition(t,e){var i,r,n,s,a,o,l,c,u,d,p,m;if(!this.isInited)return!1;if(!this.infiniteScrollView||t!==h.Forward&&t!==h.Dragging){if(t===h.Forward){const t={y:{top:this.tickerRect.height-this.containerRect.height,bottom:this.tickerRect.height-this.containerRect.height},x:{left:this.tickerRect.width-this.containerRect.width,right:this.tickerRect.width-this.containerRect.width}};if(Math.abs(Number((null===(m=null===(p=null===(d=null===(u=this.wrapperEl)||void 0===u?void 0:u.current)||void 0===d?void 0:d.style)||void 0===p?void 0:p["x"===this.axis?"left":"top"])||void 0===m?void 0:m.replace("px",""))||0))>t[this.axis][this.direction])return this.iterationCounter++,this.stopAnimation(),this.timeoutIds.push(setTimeout((()=>{this.restartLoop()}),this.delayBack)),!1}else if(t===h.Restart){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px","infinite"===this.iterations||this.iterationCounter<this.iterations?this.timeoutIds.push(setTimeout((()=>{this.animate(h.Forward)}),this.delay)):"function"==typeof this.onIterationsEnd&&(e&&e(),this.onIterationsEnd())})),!1}else if(t===h.Back){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),this.animationState=null,requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px"})),e&&e(),!1}}else{switch(this.axis){case"x":{const t=Number(null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style.left.replace("px","")),e=Number(null===(s=null===(n=this.tickerEl)||void 0===n?void 0:n.current)||void 0===s?void 0:s.style.minWidth.replace("px",""));if(this.wrapperEl&&t>=e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=t-e+"px"}));break}if(this.wrapperEl&&t<=-e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=t+e+"px"}));break}break}case"y":{const t=Number(null===(o=null===(a=this.wrapperEl)||void 0===a?void 0:a.current)||void 0===o?void 0:o.style.top.replace("px","")),e=Number(null===(c=null===(l=this.tickerEl)||void 0===l?void 0:l.current)||void 0===c?void 0:c.style.minHeight.replace("px",""));if(this.wrapperEl&&t>=e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=t-e+"px"}));break}if(this.wrapperEl&&t<=-e){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=t+e+"px"}));break}break}}if("infinite"!==this.iterations&&this.iterationCounter>=this.iterations)return this.stopAnimation(),e&&e(),"function"==typeof this.onIterationsEnd&&this.onIterationsEnd(),!1}return!0}pause(){this.isInited&&(this.isPausedByVisibility=!1,this.stopAnimation())}setIsDragging(t){t&&this.stopAnimation(),this.isDragging=t}getIsDragging(){return this.isDragging}play(t){var e,i;this.isInited&&(null===(i=null===(e=this.wrapperEl)||void 0===e?void 0:e.current)||void 0===i?void 0:i.style)&&(this.isPausedByVisibility=!1,this.clearTimeouts(),this.animationState===h.Back&&(this.animationState=h.Restart),this.isDragging||this.timeoutIds.push(setTimeout((()=>{this.animate(this.animationState||h.Forward,(()=>{"function"==typeof t&&t()}))}),this.animationState?0:this.delay)))}toggleByVisibility(){this.isInited&&("hidden"===(null===document||void 0===document?void 0:document.visibilityState)?(this.animationState&&(this.isPausedByVisibility=!0),this.stopAnimation()):this.isPausedByVisibility&&"visible"===(null===document||void 0===document?void 0:document.visibilityState)&&(this.prevTime=performance.now(),this.play()))}init({tickerEl:t,wrapperEl:e,tickerRect:i,delay:r,delayBack:n,containerRect:s,startPosition:a,speed:o,speedBack:l,infiniteScrollView:c,direction:u,iterations:d,onIterationsEnd:h}){this.tickerEl=t,this.wrapperEl=e,this.axis="left"===u||"right"===u?"x":"y",this.speed=o,this.speedBack=-1*l,this.iterations=d,this.onIterationsEnd=h||null,this.iterationCounter=0,this.infiniteScrollView=c,this.tickerRect=i,this.containerRect=s,this.delay=r,this.delayBack=n,this.direction=u,0!==this.iterations&&(a&&(this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"),"x"===this.axis?this.wrapperEl.current.style.top="0px":this.wrapperEl.current.style.left="0px",this.isInited=!0)}backToStartPosition(t=!0,e,i=!1){var r,n;if(!this.isInited||!(null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style))return;this.clearTimeouts();const s=this.speedBack;this.speedBack=i?1e3:this.speedBack,this.animate(h.Back,(()=>{this.speedBack=s,t?"function"==typeof e&&e():this.timeoutIds.push(setTimeout((()=>{this.animate(h.Forward)}),this.delay))}))}getCounter(){return this.iterationCounter}setCounter(t){this.iterationCounter=t}}const w=({children:c,smart:w=!0,autoFill:x=!1,rtl:b=!1,direction:k=(b?"right":"left"),speed:E=50,pauseOnHover:S=!1,playOnHover:D=!1,delay:R=0,delayBack:T=500,speedBack:A=200,iterations:_="infinite",recalcDeps:B=[],style:F,containerStyle:C,isText:I=!0,waitForFonts:O=!!I,multiLine:H=0,infiniteScrollView:j=!0,disableSelect:P=!1,disableDragging:V=!1,forwardedRef:N})=>{var L;w=w&&!x,S=!D&&S,I=!!H||I;const q="left"===(k=H?"top":k)||"right"===k?"x":"y",[W,M]=i(!1),{containerRef:$,tickerRef:X,containerRect:Y,tickerRect:z,isChildFit:K,amountToFill:G,isCalculated:U,recalc:Q}=u({children:c,multiLine:H,infiniteScrollView:j,smart:w,waitForFonts:O,direction:k,autoFill:x,speed:E,recalcDeps:B}),J=o((()=>!K||!w&&K&&j),[K,w,j]),{onMouseDownHandler:Z,onTouchStartHandler:tt,onContainerHoverHandler:et,wrapperRef:it,isPaused:rt,isAnimating:nt,onVisibilityChangeHandler:st}=(({isCalculated:t,tickerRef:o,tickerRect:l,containerRect:c,delay:u,delayBack:d,speed:p,speedBack:m,direction:g,rtl:v,infiniteScrollView:f,iterations:w,playOnHover:x,pauseOnHover:b,canBeAnimated:k,onMouseDown:E,onMouseUp:S,forwardedRef:D})=>{const R="left"===g||"right"===g?"x":"y",T=e(new y),A=e(null),[_,B]=i(!0),[F,C]=i(!1),[I,O]=i(!1);let H,j,P,V;r(D,(()=>({play:()=>{B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))},pause:()=>{B(!0),C(!1),T.current.pause()},reset:(t=!0)=>{B(!1),C(!0),T.current.backToStartPosition(t,(()=>{B(t),t&&C(!1)}))}}))),n((()=>()=>{removeEventListener("mousemove",H),removeEventListener("mouseup",V),removeEventListener("touchmove",j),removeEventListener("touchend",P),B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}),!0)}),[]),s((()=>(t&&(T.current.init({tickerEl:o,wrapperEl:A,tickerRect:l,containerRect:c,infiniteScrollView:f,startPosition:0,speed:p,speedBack:m,delay:u,delayBack:d,direction:g,rtl:v,iterations:w,onIterationsEnd:()=>{I&&x?T.current.pause():(B(!0),C(!1))}}),!k||x&&!b||(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)})))),()=>{B(!0),C(!1)})),[t,u,d,p,m,w,f,g,v,b,x]),s((()=>{_?(A.current&&(A.current.style.willChange="auto"),T.current.pause(),x&&T.current.setCounter(0)):k&&A.current&&(A.current.style.willChange="x"===R?"left":"top")}),[_,k]);const N=a((t=>{O(t)}),[x,b]);n((()=>{T.current.getIsDragging()||(x&&(I?(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))):(B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)})))),b&&(I?(B(!0),C(!1),T.current.pause()):(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)})))))}),[I]);const L=t=>{var e,i,r,n;let s=null!==(e=t.clientX)&&void 0!==e?e:null===(i=t.touches[0])||void 0===i?void 0:i.clientX,a=null!==(r=t.clientY)&&void 0!==r?r:null===(n=t.touches[0])||void 0===n?void 0:n.clientY,o=0,u=0;const d={y:{top:-(l.height-c.height),bottom:0},x:{left:-(l.width-c.width),right:0}},p={y:{top:0,bottom:l.height-c.height},x:{left:0,right:l.width-c.width}};return t=>{var e,i,r,n,l,c,m,v;o=s-Number(null!==(e=t.clientX)&&void 0!==e?e:null===(i=t.touches[0])||void 0===i?void 0:i.clientX),u=a-Number(null!==(r=t.clientY)&&void 0!==r?r:null===(n=t.touches[0])||void 0===n?void 0:n.clientY),s=null!==(l=t.clientX)&&void 0!==l?l:null===(c=t.touches[0])||void 0===c?void 0:c.clientX,a=null!==(m=t.clientY)&&void 0!==m?m:null===(v=t.touches[0])||void 0===v?void 0:v.clientY,requestAnimationFrame((()=>{if(f)A.current.style["x"===R?"left":"top"]=Number(A.current.style["x"===R?"left":"top"].replace("px",""))-("x"===R?o:u)+"px",T.current.alignPosition(h.Dragging);else{const t=Number(A.current.style["x"===R?"left":"top"].replace("px","")),e=t-("x"===R?o:u);(e<d[R][g]||e>p[R][g])&&(o/=50,u/=50),A.current.style["x"===R?"left":"top"]=t-("x"===R?o:u)+"px"}}))}},q=a((()=>{T.current.toggleByVisibility()}),[]);return{onMouseDownHandler:t=>{"function"==typeof E&&E(),t.preventDefault(),T.current.setIsDragging(!0),A.current&&(A.current.style.willChange="x"===R?"left":"top"),addEventListener("mousemove",H=L(t)),addEventListener("mouseup",V=t=>{t.preventDefault(),"function"==typeof S&&S(),A.current&&(A.current.style.willChange="auto"),T.current.setIsDragging(!1),k&&!x&&("infinite"===w||T.current.getCounter()<w)?(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))):(B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}))),removeEventListener("mousemove",H),removeEventListener("mouseup",V)})},onMoveHandler:L,onTouchStartHandler:t=>{T.current.setIsDragging(!0),"function"==typeof E&&E(),A.current&&(A.current.style.willChange="x"===R?"left":"top"),addEventListener("touchmove",j=L(t)),addEventListener("touchend",P=t=>{t.preventDefault(),T.current.setIsDragging(!1),"function"==typeof S&&S(),A.current&&(A.current.style.willChange="auto"),k&&!x&&("infinite"===w||T.current.getCounter()<w)?(B(!1),C(!0),T.current.play((()=>{B(!0),C(!1)}))):(B(!1),C(!0),T.current.backToStartPosition(!0,(()=>{B(!0),C(!1)}))),removeEventListener("touchmove",j),removeEventListener("touchend",P)})},onContainerHoverHandler:N,onVisibilityChangeHandler:q,isPaused:_,isAnimating:F,wrapperRef:A,animation:T.current}})({isCalculated:U,tickerRef:X,tickerRect:z,containerRect:Y,infiniteScrollView:j,delay:R,delayBack:T,speed:E,speedBack:A,canBeAnimated:J,direction:k,rtl:b,iterations:_,playOnHover:D,pauseOnHover:S,onMouseDown:function(){var t;null===(t=it.current)||void 0===t||t.classList.add(v),M(!0)},onMouseUp:function(){var t;null===(t=it.current)||void 0===t||t.classList.remove(v),M(!1)},forwardedRef:N}),at=a((()=>{Q()}),[]);const ot=o((()=>x?new Array(G).fill(0).map(((e,i)=>t.createElement(l,{key:i},c,"y"===q&&G>1&&I&&t.createElement("br",null)))):c),[c,x,G]),lt=o((()=>!(!(("left"===k||"right"===k&&b)&&I&&rt)||nt||S||W||K||x||!U)),[q,I,rt,S,W,K,U,nt]),ct=o((()=>!("top"!==k||!rt||!I||nt||S||W||K||!H||x||!U)),[q,I,rt,S,W,H,K,U,nt]),ut=o((()=>lt?"inline-block":ct?"-webkit-box":"flex"),[lt,ct]),dt=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},F),{display:ut,flexWrap:"nowrap",overflow:"hidden",textSizeAdjust:"none",justifyItems:"flex-start",flexDirection:"x"===q?"row":"column",userSelect:P?"none":"unset",WebkitUserSelect:P?"none":"unset",WebkitTouchCallout:P?"none":"unset"}),"x"===q&&{minWidth:z.width,whiteSpace:"nowrap"}),"y"===q&&{minHeight:z.height,whiteSpace:"normal"}),{direction:b?"rtl":"ltr"}),lt&&{minWidth:Y.width,maxWidth:Y.width,display:ut,textOverflow:"ellipsis"}),ct&&{display:ut,WebkitLineClamp:H,WebkitBoxOrient:"vertical",maxHeight:Y.height*H}),b&&"x"===q&&Object.assign({transform:`translate${q}(-100%)`,left:`${z.width}px`},lt&&{left:`${Y.width}px`})),ht=Object.assign(Object.assign({[k]:null===(L=null==it?void 0:it.current)||void 0===L?void 0:L.style[k],justifyItems:b?"flex-end":"flex-start",flexDirection:"x"===q?"row":"column",transform:`translate${q}(-${z["x"===q?"width":"height"]}px)`},lt&&{transform:`translate${q}(-${Y["x"===q?"width":"height"]}px)`}),!j&&{transform:`translate${q}(0px)`});return w&&K&&U?t.createElement(d,{containerRef:$,containerRect:Y,direction:k,infiniteScrollView:j,style:C,onResizeHandler:at},t.createElement("div",{ref:it,className:m+" "+f},t.createElement("div",{key:"ticker-simple",ref:X,"data-testid":"ticker-smart",className:p,style:dt},c))):t.createElement(d,Object.assign({containerRef:$,containerRect:Y,infiniteScrollView:j,direction:k,style:C,onResizeHandler:at,onVisibilityChangeHandler:st,draggable:!0},(D||S)&&{onHoverHandler:et}),t.createElement("div",Object.assign({ref:it,"data-testid":"ticker-wrapper",className:`${m} ${V?g:""}`,style:ht},!V&&{onMouseDown:Z},!V&&{onTouchStart:tt}),t.createElement("div",{key:"ticker-1",ref:X,"data-testid":"ticker-1",className:p,style:dt},ot),j&&t.createElement(t.Fragment,null,t.createElement("div",{"data-testid":"ticker-2",className:p,style:Object.assign(Object.assign({},dt),{display:U?ut:"none"})},ot),t.createElement("div",{"data-testid":"ticker-3",className:p,style:Object.assign(Object.assign({},dt),{display:U?ut:"none"})},ot))))};export{w as SmartTickerDraggable,w as default};
 //# sourceMappingURL=SmartTickerDraggable.esm.js.map

dist/SmartTickerDraggable.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),i=require("./index-CkcSSpJU.js"),r="smartTickerDraggable-module_ticker__VSYGW",n="smartTickerDraggable-module_drag-wrapper__rAdh-",s="smartTickerDraggable-module_no-dragging__X1QfP",a="smartTickerDraggable-module_dragging__IcxtW",o="smartTickerDraggable-module_off__pFb7U";i.styleInject(".smartTickerDraggable-module_ticker__VSYGW {\n  flex-wrap: nowrap;\n  position: relative;\n  -webkit-text-size-adjust: none;\n     -moz-text-size-adjust: none;\n          text-size-adjust: none;\n}\n\n.smartTickerDraggable-module_drag-wrapper__rAdh- {\n  display: flex;\n  position: relative;\n  flex-wrap: nowrap;\n  touch-action: none;\n  -webkit-touch-action: none;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-:not(.smartTickerDraggable-module_no-dragging__X1QfP) {\n  cursor: grab;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_dragging__IcxtW {\n  cursor: grabbing;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_off__pFb7U {\n  cursor: inherit;\n}"),function(e){e.Forward="FORWARD",e.Back="BACK",e.Restart="RESTART",e.Dragging="DRAGGING"}(e||(e={}));class l{constructor(){this.prevTime=0,this.isDragging=!1,this.iterationCounter=0,this.speed=50,this.speedBack=200,this.isPausedByVisibility=!1,this.isInited=!1,this.reqAnimFrameKey=null,this.animationState=null,this.timeoutIds=[],this.restartLoop=()=>{requestAnimationFrame((()=>{this.wrapperEl.current&&this.animate(e.Restart)}))},this.getSign=()=>{switch(this.animationState){case e.Forward:return"left"===this.direction||"top"===this.direction?-1:1;case e.Back:case e.Restart:return this.animationStartPos<0?-1:1;default:return 1}}}draw(t){var i,r,n,s;if(null===(null===(i=this.wrapperEl)||void 0===i?void 0:i.current))return;const a=([e.Back,e.Restart].includes(this.animationState)?this.speedBack:this.speed)*t*this.getSign(),o=Number((null===(s=null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0)+a;this.wrapperEl.current.style["x"===this.axis?"left":"top"]=o+"px"}animate(e,t){var i,r,n,s;this.stopAnimation(),e!==this.animationState&&(this.animationState=e),this.prevTime=0,this.animationStartPos=Number((null===(s=null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)||void 0===n?void 0:n["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0);const a=i=>{this.prevTime||(this.prevTime=i);const r=Math.min((i-this.prevTime)/1e3,.1);this.prevTime=i,this.draw(r),this.alignPosition(e,t)&&(this.reqAnimFrameKey=requestAnimationFrame(a.bind(this)))};requestAnimationFrame(a.bind(this))}stopAnimation(){this.reqAnimFrameKey&&(cancelAnimationFrame(this.reqAnimFrameKey),this.reqAnimFrameKey=null)}clearTimeouts(){this.timeoutIds.forEach((e=>clearTimeout(e))),this.timeoutIds=[]}alignPosition(t,i){var r,n,s,a,o,l,c,u,d,h,p,m;if(!this.isInited)return!1;if(!this.infiniteScrollView||t!==e.Forward&&t!==e.Dragging){if(t===e.Forward){const e={y:{top:this.tickerRect.height-this.containerRect.height,bottom:this.tickerRect.height-this.containerRect.height},x:{left:this.tickerRect.width-this.containerRect.width,right:this.tickerRect.width-this.containerRect.width}};if(Math.abs(Number((null===(m=null===(p=null===(h=null===(d=this.wrapperEl)||void 0===d?void 0:d.current)||void 0===h?void 0:h.style)||void 0===p?void 0:p["x"===this.axis?"left":"top"])||void 0===m?void 0:m.replace("px",""))||0))>e[this.axis][this.direction])return this.iterationCounter++,this.stopAnimation(),this.timeoutIds.push(setTimeout((()=>{this.restartLoop()}),this.delayBack)),!1}else if(t===e.Restart){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px","infinite"===this.iterations||this.iterationCounter<this.iterations?this.timeoutIds.push(setTimeout((()=>{this.animate(e.Forward)}),this.delay)):"function"==typeof this.onIterationsEnd&&(i&&i(),this.onIterationsEnd())})),!1}else if(t===e.Back){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),this.animationState=null,requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px"})),i&&i(),!1}}else{switch(this.axis){case"x":{const e=Number(null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style.left.replace("px","")),t=Number(null===(a=null===(s=this.tickerEl)||void 0===s?void 0:s.current)||void 0===a?void 0:a.style.minWidth.replace("px",""));if(this.wrapperEl&&e>=t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=e-t+"px"}));break}if(this.wrapperEl&&e<=-t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=e+t+"px"}));break}break}case"y":{const e=Number(null===(l=null===(o=this.wrapperEl)||void 0===o?void 0:o.current)||void 0===l?void 0:l.style.top.replace("px","")),t=Number(null===(u=null===(c=this.tickerEl)||void 0===c?void 0:c.current)||void 0===u?void 0:u.style.minHeight.replace("px",""));if(this.wrapperEl&&e>=t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=e-t+"px"}));break}if(this.wrapperEl&&e<=-t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=e+t+"px"}));break}break}}if("infinite"!==this.iterations&&this.iterationCounter>=this.iterations)return this.stopAnimation(),i&&i(),"function"==typeof this.onIterationsEnd&&this.onIterationsEnd(),!1}return!0}pause(){this.isInited&&(this.isPausedByVisibility=!1,this.stopAnimation())}setIsDragging(e){e&&this.stopAnimation(),this.isDragging=e}getIsDragging(){return this.isDragging}play(t){var i,r;this.isInited&&(null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)&&(this.isPausedByVisibility=!1,this.clearTimeouts(),this.animationState===e.Back&&(this.animationState=e.Restart),this.isDragging||this.timeoutIds.push(setTimeout((()=>{this.animate(this.animationState||e.Forward,(()=>{"function"==typeof t&&t()}))}),this.animationState?0:this.delay)))}toggleByVisibility(){this.isInited&&("hidden"===(null===document||void 0===document?void 0:document.visibilityState)?(this.animationState&&(this.isPausedByVisibility=!0),this.stopAnimation()):this.isPausedByVisibility&&"visible"===(null===document||void 0===document?void 0:document.visibilityState)&&(this.prevTime=performance.now(),this.play()))}init({tickerEl:e,wrapperEl:t,tickerRect:i,delay:r,delayBack:n,containerRect:s,startPosition:a,speed:o,speedBack:l,infiniteScrollView:c,direction:u,iterations:d,onIterationsEnd:h}){this.tickerEl=e,this.wrapperEl=t,this.axis="left"===u||"right"===u?"x":"y",this.speed=o,this.speedBack=-1*l,this.iterations=d,this.onIterationsEnd=h||null,this.iterationCounter=0,this.infiniteScrollView=c,this.tickerRect=i,this.containerRect=s,this.delay=r,this.delayBack=n,this.direction=u,0!==this.iterations&&(a&&(this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"),"x"===this.axis?this.wrapperEl.current.style.top="0px":this.wrapperEl.current.style.left="0px",this.isInited=!0)}backToStartPosition(t=!0,i,r=!1){var n,s;if(!this.isInited||!(null===(s=null===(n=this.wrapperEl)||void 0===n?void 0:n.current)||void 0===s?void 0:s.style))return;this.clearTimeouts();const a=this.speedBack;this.speedBack=r?1e3:this.speedBack,this.animate(e.Back,(()=>{this.speedBack=a,t?"function"==typeof i&&i():this.timeoutIds.push(setTimeout((()=>{this.animate(e.Forward)}),this.delay))}))}getCounter(){return this.iterationCounter}setCounter(e){this.iterationCounter=e}}const c=({children:c,smart:u=!0,autoFill:d=!1,rtl:h=!1,direction:p=(h?"right":"left"),speed:m=50,pauseOnHover:g=!1,playOnHover:v=!1,delay:f=0,delayBack:y=500,speedBack:w=200,iterations:x="infinite",recalcDeps:b=[],style:k,containerStyle:E,isText:S=!0,waitForFonts:R=!!S,multiLine:D=0,infiniteScrollView:T=!0,disableSelect:_=!1,disableDragging:A=!1,forwardedRef:C})=>{var B;u=u&&!d,g=!v&&g,S=!!D||S;const F="left"===(p=D?"top":p)||"right"===p?"x":"y",[I,O]=t.useState(!1),{containerRef:j,tickerRef:H,containerRect:P,tickerRect:V,isChildFit:L,amountToFill:N,isCalculated:q,recalc:M}=i.useSmartCheck({children:c,multiLine:D,infiniteScrollView:T,smart:u,waitForFonts:R,direction:p,autoFill:d,speed:m,recalcDeps:b}),W=t.useMemo((()=>!L||!u&&L&&T),[L,u,T]),{onMouseDownHandler:$,onTouchStartHandler:X,onContainerHoverHandler:Y,wrapperRef:z,isPaused:K,isAnimating:G,onVisibilityChangeHandler:U}=(({isCalculated:i,tickerRef:r,tickerRect:n,containerRect:s,delay:a,delayBack:o,speed:c,speedBack:u,direction:d,rtl:h,infiniteScrollView:p,iterations:m,playOnHover:g,pauseOnHover:v,canBeAnimated:f,onMouseDown:y,onMouseUp:w,forwardedRef:x})=>{const b="left"===d||"right"===d?"x":"y",k=t.useRef(new l),E=t.useRef(null),[S,R]=t.useState(!0),[D,T]=t.useState(!1),[_,A]=t.useState(!1);let C,B,F,I;t.useImperativeHandle(x,(()=>({play:()=>{R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))},pause:()=>{k.current.pause()},reset:(e=!0)=>{R(!1),T(!0),k.current.backToStartPosition(e,(()=>{R(e),e&&T(!1)}))}}))),t.useEffect((()=>()=>{removeEventListener("mousemove",C),removeEventListener("mouseup",I),removeEventListener("touchmove",B),removeEventListener("touchend",F),R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}),!0)}),[]),t.useLayoutEffect((()=>(i&&(k.current.init({tickerEl:r,wrapperEl:E,tickerRect:n,containerRect:s,infiniteScrollView:p,startPosition:0,speed:c,speedBack:u,delay:a,delayBack:o,direction:d,rtl:h,iterations:m,onIterationsEnd:()=>{_&&g?k.current.pause():(R(!0),T(!1))}}),!f||g&&!v||(R(!1),T(!0))),()=>{R(!0),T(!1)})),[i,a,o,c,u,m,p,d,h,v,g]),t.useLayoutEffect((()=>{S?(E.current&&(E.current.style.willChange="auto"),k.current.pause(),g&&(k.current.setCounter(0),k.current.backToStartPosition(!0,(()=>{T(!1)})))):f&&(E.current&&(E.current.style.willChange="x"===b?"left":"top"),k.current.play((()=>{R(!0),T(!1)})),T(!0))}),[S,f]);const O=t.useCallback((e=>{A(e)}),[g,v]);t.useEffect((()=>{k.current.getIsDragging()||(g&&R(!_),v&&R(!!_))}),[_]);const j=t=>{var i,r,a,o;let l=null!==(i=t.clientX)&&void 0!==i?i:null===(r=t.touches[0])||void 0===r?void 0:r.clientX,c=null!==(a=t.clientY)&&void 0!==a?a:null===(o=t.touches[0])||void 0===o?void 0:o.clientY,u=0,h=0;const m={y:{top:-(n.height-s.height),bottom:0},x:{left:-(n.width-s.width),right:0}},g={y:{top:0,bottom:n.height-s.height},x:{left:0,right:n.width-s.width}};return t=>{var i,r,n,s,a,o,v,f;u=l-Number(null!==(i=t.clientX)&&void 0!==i?i:null===(r=t.touches[0])||void 0===r?void 0:r.clientX),h=c-Number(null!==(n=t.clientY)&&void 0!==n?n:null===(s=t.touches[0])||void 0===s?void 0:s.clientY),l=null!==(a=t.clientX)&&void 0!==a?a:null===(o=t.touches[0])||void 0===o?void 0:o.clientX,c=null!==(v=t.clientY)&&void 0!==v?v:null===(f=t.touches[0])||void 0===f?void 0:f.clientY,requestAnimationFrame((()=>{if(p)E.current.style["x"===b?"left":"top"]=Number(E.current.style["x"===b?"left":"top"].replace("px",""))-("x"===b?u:h)+"px",k.current.alignPosition(e.Dragging);else{const e=Number(E.current.style["x"===b?"left":"top"].replace("px","")),t=e-("x"===b?u:h);(t<m[b][d]||t>g[b][d])&&(u/=50,h/=50),E.current.style["x"===b?"left":"top"]=e-("x"===b?u:h)+"px"}}))}},H=t.useCallback((()=>{k.current.toggleByVisibility()}),[]);return{onMouseDownHandler:e=>{"function"==typeof y&&y(),e.preventDefault(),k.current.setIsDragging(!0),E.current&&(E.current.style.willChange="x"===b?"left":"top"),addEventListener("mousemove",C=j(e)),addEventListener("mouseup",I=()=>{"function"==typeof w&&w(),E.current&&(E.current.style.willChange="auto"),k.current.setIsDragging(!1),f&&!g&&("infinite"===m||k.current.getCounter()<m)?(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))):(R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}))),removeEventListener("mousemove",C),removeEventListener("mouseup",I)})},onMoveHandler:j,onTouchStartHandler:e=>{k.current.setIsDragging(!0),"function"==typeof y&&y(),E.current&&(E.current.style.willChange="x"===b?"left":"top"),addEventListener("touchmove",B=j(e)),addEventListener("touchend",F=()=>{k.current.setIsDragging(!1),"function"==typeof w&&w(),E.current&&(E.current.style.willChange="auto"),f&&!g&&("infinite"===m||k.current.getCounter()<m)?(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))):(R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}))),removeEventListener("touchmove",B),removeEventListener("touchend",F)})},onContainerHoverHandler:O,onVisibilityChangeHandler:H,isPaused:S,isAnimating:D,wrapperRef:E,animation:k.current}})({isCalculated:q,tickerRef:H,tickerRect:V,containerRect:P,infiniteScrollView:T,delay:f,delayBack:y,speed:m,speedBack:w,canBeAnimated:W,direction:p,rtl:h,iterations:x,playOnHover:v,pauseOnHover:g,onMouseDown:function(){var e;null===(e=z.current)||void 0===e||e.classList.add(a),O(!0)},onMouseUp:function(){var e;null===(e=z.current)||void 0===e||e.classList.remove(a),O(!1)},forwardedRef:C}),Q=t.useCallback((()=>{M()}),[]);const J=t.useMemo((()=>d?new Array(N).fill(0).map(((e,i)=>t.createElement(t.Fragment,{key:i},c,"y"===F&&N>1&&S&&t.createElement("br",null)))):c),[c,d,N]),Z=t.useMemo((()=>!(!(("left"===p||"right"===p&&h)&&S&&K)||G||g||I||L||d||!q)),[F,S,K,g,I,L,q,G]),ee=t.useMemo((()=>!("top"!==p||!K||!S||G||g||I||L||!D||d||!q)),[F,S,K,g,I,D,L,q,G]),te=t.useMemo((()=>Z?"inline-block":ee?"-webkit-box":"flex"),[Z,ee]),ie=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},k),{display:te,flexWrap:"nowrap",overflow:"hidden",textSizeAdjust:"none",justifyItems:"flex-start",flexDirection:"x"===F?"row":"column",userSelect:_?"none":"unset",WebkitUserSelect:_?"none":"unset",WebkitTouchCallout:_?"none":"unset"}),"x"===F&&{minWidth:V.width,whiteSpace:"nowrap"}),"y"===F&&{minHeight:V.height,whiteSpace:"normal"}),{direction:h?"rtl":"ltr"}),Z&&{minWidth:P.width,maxWidth:P.width,display:te,textOverflow:"ellipsis"}),ee&&{display:te,WebkitLineClamp:D,WebkitBoxOrient:"vertical",maxHeight:P.height*D}),h&&"x"===F&&Object.assign({transform:`translate${F}(-100%)`,left:`${V.width}px`},Z&&{left:`${P.width}px`})),re=Object.assign(Object.assign({[p]:null===(B=null==z?void 0:z.current)||void 0===B?void 0:B.style[p],justifyItems:h?"flex-end":"flex-start",flexDirection:"x"===F?"row":"column",transform:`translate${F}(-${V["x"===F?"width":"height"]}px)`},Z&&{transform:`translate${F}(-${P["x"===F?"width":"height"]}px)`}),!T&&{transform:`translate${F}(0px)`});return u&&L&&q?t.createElement(i.TickerContainer,{containerRef:j,containerRect:P,direction:p,infiniteScrollView:T,style:E,onResizeHandler:Q},t.createElement("div",{ref:z,className:n+" "+o},t.createElement("div",{key:"ticker-simple",ref:H,"data-testid":"ticker-smart",className:r,style:ie},c))):t.createElement(i.TickerContainer,Object.assign({containerRef:j,containerRect:P,infiniteScrollView:T,direction:p,style:E,onResizeHandler:Q,onVisibilityChangeHandler:U,draggable:!0},(v||g)&&{onHoverHandler:Y}),t.createElement("div",Object.assign({ref:z,"data-testid":"ticker-wrapper",className:`${n} ${A?s:""}`,style:re},!A&&{onMouseDown:$},!A&&{onTouchStart:X}),t.createElement("div",{key:"ticker-1",ref:H,"data-testid":"ticker-1",className:r,style:ie},J),T&&t.createElement(t.Fragment,null,t.createElement("div",{"data-testid":"ticker-2",className:r,style:Object.assign(Object.assign({},ie),{display:q?te:"none"})},J),t.createElement("div",{"data-testid":"ticker-3",className:r,style:Object.assign(Object.assign({},ie),{display:q?te:"none"})},J))))};exports.SmartTickerDraggable=c,exports.default=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),i=require("./index-CkcSSpJU.js"),r="smartTickerDraggable-module_ticker__VSYGW",n="smartTickerDraggable-module_drag-wrapper__rAdh-",s="smartTickerDraggable-module_no-dragging__X1QfP",a="smartTickerDraggable-module_dragging__IcxtW",o="smartTickerDraggable-module_off__pFb7U";i.styleInject(".smartTickerDraggable-module_ticker__VSYGW {\n  flex-wrap: nowrap;\n  position: relative;\n  -webkit-text-size-adjust: none;\n     -moz-text-size-adjust: none;\n          text-size-adjust: none;\n}\n\n.smartTickerDraggable-module_drag-wrapper__rAdh- {\n  display: flex;\n  position: relative;\n  flex-wrap: nowrap;\n  touch-action: none;\n  -webkit-touch-action: none;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-:not(.smartTickerDraggable-module_no-dragging__X1QfP) {\n  cursor: grab;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_dragging__IcxtW {\n  cursor: grabbing;\n}\n.smartTickerDraggable-module_drag-wrapper__rAdh-.smartTickerDraggable-module_off__pFb7U {\n  cursor: inherit;\n}"),function(e){e.Forward="FORWARD",e.Back="BACK",e.Restart="RESTART",e.Dragging="DRAGGING"}(e||(e={}));class l{constructor(){this.prevTime=0,this.isDragging=!1,this.iterationCounter=0,this.speed=50,this.speedBack=200,this.isPausedByVisibility=!1,this.isInited=!1,this.reqAnimFrameKey=null,this.animationState=null,this.timeoutIds=[],this.restartLoop=()=>{requestAnimationFrame((()=>{this.wrapperEl.current&&this.animate(e.Restart)}))},this.getSign=()=>{switch(this.animationState){case e.Forward:return"left"===this.direction||"top"===this.direction?-1:1;case e.Back:case e.Restart:return this.animationStartPos<0?-1:1;default:return 1}}}draw(t){var i,r,n,s;if(null===(null===(i=this.wrapperEl)||void 0===i?void 0:i.current))return;const a=([e.Back,e.Restart].includes(this.animationState)?this.speedBack:this.speed)*t*this.getSign(),o=Number((null===(s=null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0)+a;this.wrapperEl.current.style["x"===this.axis?"left":"top"]=o+"px"}animate(e,t){var i,r,n,s;this.stopAnimation(),e!==this.animationState&&(this.animationState=e),this.prevTime=0,this.animationStartPos=Number((null===(s=null===(n=null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)||void 0===n?void 0:n["x"===this.axis?"left":"top"])||void 0===s?void 0:s.replace("px",""))||0);const a=i=>{this.prevTime||(this.prevTime=i);const r=Math.min((i-this.prevTime)/1e3,.1);this.prevTime=i,this.draw(r),this.alignPosition(e,t)&&(this.reqAnimFrameKey=requestAnimationFrame(a.bind(this)))};requestAnimationFrame(a.bind(this))}stopAnimation(){this.reqAnimFrameKey&&(cancelAnimationFrame(this.reqAnimFrameKey),this.reqAnimFrameKey=null)}clearTimeouts(){this.timeoutIds.forEach((e=>clearTimeout(e))),this.timeoutIds=[]}alignPosition(t,i){var r,n,s,a,o,l,c,u,d,h,p,m;if(!this.isInited)return!1;if(!this.infiniteScrollView||t!==e.Forward&&t!==e.Dragging){if(t===e.Forward){const e={y:{top:this.tickerRect.height-this.containerRect.height,bottom:this.tickerRect.height-this.containerRect.height},x:{left:this.tickerRect.width-this.containerRect.width,right:this.tickerRect.width-this.containerRect.width}};if(Math.abs(Number((null===(m=null===(p=null===(h=null===(d=this.wrapperEl)||void 0===d?void 0:d.current)||void 0===h?void 0:h.style)||void 0===p?void 0:p["x"===this.axis?"left":"top"])||void 0===m?void 0:m.replace("px",""))||0))>e[this.axis][this.direction])return this.iterationCounter++,this.stopAnimation(),this.timeoutIds.push(setTimeout((()=>{this.restartLoop()}),this.delayBack)),!1}else if(t===e.Restart){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px","infinite"===this.iterations||this.iterationCounter<this.iterations?this.timeoutIds.push(setTimeout((()=>{this.animate(e.Forward)}),this.delay)):"function"==typeof this.onIterationsEnd&&(i&&i(),this.onIterationsEnd())})),!1}else if(t===e.Back){if(Number(this.wrapperEl.current.style["x"===this.axis?"left":"top"].replace("px",""))*-this.getSign()>=0)return this.stopAnimation(),this.animationState=null,requestAnimationFrame((()=>{this.wrapperEl.current.style["x"===this.axis?"left":"top"]="0px"})),i&&i(),!1}}else{switch(this.axis){case"x":{const e=Number(null===(n=null===(r=this.wrapperEl)||void 0===r?void 0:r.current)||void 0===n?void 0:n.style.left.replace("px","")),t=Number(null===(a=null===(s=this.tickerEl)||void 0===s?void 0:s.current)||void 0===a?void 0:a.style.minWidth.replace("px",""));if(this.wrapperEl&&e>=t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=e-t+"px"}));break}if(this.wrapperEl&&e<=-t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.left=e+t+"px"}));break}break}case"y":{const e=Number(null===(l=null===(o=this.wrapperEl)||void 0===o?void 0:o.current)||void 0===l?void 0:l.style.top.replace("px","")),t=Number(null===(u=null===(c=this.tickerEl)||void 0===c?void 0:c.current)||void 0===u?void 0:u.style.minHeight.replace("px",""));if(this.wrapperEl&&e>=t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=e-t+"px"}));break}if(this.wrapperEl&&e<=-t){this.isDragging||this.iterationCounter++,requestAnimationFrame((()=>{this.wrapperEl.current.style.top=e+t+"px"}));break}break}}if("infinite"!==this.iterations&&this.iterationCounter>=this.iterations)return this.stopAnimation(),i&&i(),"function"==typeof this.onIterationsEnd&&this.onIterationsEnd(),!1}return!0}pause(){this.isInited&&(this.isPausedByVisibility=!1,this.stopAnimation())}setIsDragging(e){e&&this.stopAnimation(),this.isDragging=e}getIsDragging(){return this.isDragging}play(t){var i,r;this.isInited&&(null===(r=null===(i=this.wrapperEl)||void 0===i?void 0:i.current)||void 0===r?void 0:r.style)&&(this.isPausedByVisibility=!1,this.clearTimeouts(),this.animationState===e.Back&&(this.animationState=e.Restart),this.isDragging||this.timeoutIds.push(setTimeout((()=>{this.animate(this.animationState||e.Forward,(()=>{"function"==typeof t&&t()}))}),this.animationState?0:this.delay)))}toggleByVisibility(){this.isInited&&("hidden"===(null===document||void 0===document?void 0:document.visibilityState)?(this.animationState&&(this.isPausedByVisibility=!0),this.stopAnimation()):this.isPausedByVisibility&&"visible"===(null===document||void 0===document?void 0:document.visibilityState)&&(this.prevTime=performance.now(),this.play()))}init({tickerEl:e,wrapperEl:t,tickerRect:i,delay:r,delayBack:n,containerRect:s,startPosition:a,speed:o,speedBack:l,infiniteScrollView:c,direction:u,iterations:d,onIterationsEnd:h}){this.tickerEl=e,this.wrapperEl=t,this.axis="left"===u||"right"===u?"x":"y",this.speed=o,this.speedBack=-1*l,this.iterations=d,this.onIterationsEnd=h||null,this.iterationCounter=0,this.infiniteScrollView=c,this.tickerRect=i,this.containerRect=s,this.delay=r,this.delayBack=n,this.direction=u,0!==this.iterations&&(a&&(this.wrapperEl.current.style["x"===this.axis?"left":"top"]=a+"px"),"x"===this.axis?this.wrapperEl.current.style.top="0px":this.wrapperEl.current.style.left="0px",this.isInited=!0)}backToStartPosition(t=!0,i,r=!1){var n,s;if(!this.isInited||!(null===(s=null===(n=this.wrapperEl)||void 0===n?void 0:n.current)||void 0===s?void 0:s.style))return;this.clearTimeouts();const a=this.speedBack;this.speedBack=r?1e3:this.speedBack,this.animate(e.Back,(()=>{this.speedBack=a,t?"function"==typeof i&&i():this.timeoutIds.push(setTimeout((()=>{this.animate(e.Forward)}),this.delay))}))}getCounter(){return this.iterationCounter}setCounter(e){this.iterationCounter=e}}const c=({children:c,smart:u=!0,autoFill:d=!1,rtl:h=!1,direction:p=(h?"right":"left"),speed:m=50,pauseOnHover:g=!1,playOnHover:v=!1,delay:f=0,delayBack:y=500,speedBack:w=200,iterations:x="infinite",recalcDeps:b=[],style:k,containerStyle:E,isText:S=!0,waitForFonts:R=!!S,multiLine:D=0,infiniteScrollView:T=!0,disableSelect:_=!1,disableDragging:A=!1,forwardedRef:C})=>{var B;u=u&&!d,g=!v&&g,S=!!D||S;const F="left"===(p=D?"top":p)||"right"===p?"x":"y",[I,O]=t.useState(!1),{containerRef:j,tickerRef:H,containerRect:P,tickerRect:V,isChildFit:L,amountToFill:N,isCalculated:q,recalc:M}=i.useSmartCheck({children:c,multiLine:D,infiniteScrollView:T,smart:u,waitForFonts:R,direction:p,autoFill:d,speed:m,recalcDeps:b}),W=t.useMemo((()=>!L||!u&&L&&T),[L,u,T]),{onMouseDownHandler:$,onTouchStartHandler:X,onContainerHoverHandler:Y,wrapperRef:z,isPaused:K,isAnimating:G,onVisibilityChangeHandler:U}=(({isCalculated:i,tickerRef:r,tickerRect:n,containerRect:s,delay:a,delayBack:o,speed:c,speedBack:u,direction:d,rtl:h,infiniteScrollView:p,iterations:m,playOnHover:g,pauseOnHover:v,canBeAnimated:f,onMouseDown:y,onMouseUp:w,forwardedRef:x})=>{const b="left"===d||"right"===d?"x":"y",k=t.useRef(new l),E=t.useRef(null),[S,R]=t.useState(!0),[D,T]=t.useState(!1),[_,A]=t.useState(!1);let C,B,F,I;t.useImperativeHandle(x,(()=>({play:()=>{R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))},pause:()=>{R(!0),T(!1),k.current.pause()},reset:(e=!0)=>{R(!1),T(!0),k.current.backToStartPosition(e,(()=>{R(e),e&&T(!1)}))}}))),t.useEffect((()=>()=>{removeEventListener("mousemove",C),removeEventListener("mouseup",I),removeEventListener("touchmove",B),removeEventListener("touchend",F),R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}),!0)}),[]),t.useLayoutEffect((()=>(i&&(k.current.init({tickerEl:r,wrapperEl:E,tickerRect:n,containerRect:s,infiniteScrollView:p,startPosition:0,speed:c,speedBack:u,delay:a,delayBack:o,direction:d,rtl:h,iterations:m,onIterationsEnd:()=>{_&&g?k.current.pause():(R(!0),T(!1))}}),!f||g&&!v||(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)})))),()=>{R(!0),T(!1)})),[i,a,o,c,u,m,p,d,h,v,g]),t.useLayoutEffect((()=>{S?(E.current&&(E.current.style.willChange="auto"),k.current.pause(),g&&k.current.setCounter(0)):f&&E.current&&(E.current.style.willChange="x"===b?"left":"top")}),[S,f]);const O=t.useCallback((e=>{A(e)}),[g,v]);t.useEffect((()=>{k.current.getIsDragging()||(g&&(_?(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))):(R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)})))),v&&(_?(R(!0),T(!1),k.current.pause()):(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)})))))}),[_]);const j=t=>{var i,r,a,o;let l=null!==(i=t.clientX)&&void 0!==i?i:null===(r=t.touches[0])||void 0===r?void 0:r.clientX,c=null!==(a=t.clientY)&&void 0!==a?a:null===(o=t.touches[0])||void 0===o?void 0:o.clientY,u=0,h=0;const m={y:{top:-(n.height-s.height),bottom:0},x:{left:-(n.width-s.width),right:0}},g={y:{top:0,bottom:n.height-s.height},x:{left:0,right:n.width-s.width}};return t=>{var i,r,n,s,a,o,v,f;u=l-Number(null!==(i=t.clientX)&&void 0!==i?i:null===(r=t.touches[0])||void 0===r?void 0:r.clientX),h=c-Number(null!==(n=t.clientY)&&void 0!==n?n:null===(s=t.touches[0])||void 0===s?void 0:s.clientY),l=null!==(a=t.clientX)&&void 0!==a?a:null===(o=t.touches[0])||void 0===o?void 0:o.clientX,c=null!==(v=t.clientY)&&void 0!==v?v:null===(f=t.touches[0])||void 0===f?void 0:f.clientY,requestAnimationFrame((()=>{if(p)E.current.style["x"===b?"left":"top"]=Number(E.current.style["x"===b?"left":"top"].replace("px",""))-("x"===b?u:h)+"px",k.current.alignPosition(e.Dragging);else{const e=Number(E.current.style["x"===b?"left":"top"].replace("px","")),t=e-("x"===b?u:h);(t<m[b][d]||t>g[b][d])&&(u/=50,h/=50),E.current.style["x"===b?"left":"top"]=e-("x"===b?u:h)+"px"}}))}},H=t.useCallback((()=>{k.current.toggleByVisibility()}),[]);return{onMouseDownHandler:e=>{"function"==typeof y&&y(),e.preventDefault(),k.current.setIsDragging(!0),E.current&&(E.current.style.willChange="x"===b?"left":"top"),addEventListener("mousemove",C=j(e)),addEventListener("mouseup",I=e=>{e.preventDefault(),"function"==typeof w&&w(),E.current&&(E.current.style.willChange="auto"),k.current.setIsDragging(!1),f&&!g&&("infinite"===m||k.current.getCounter()<m)?(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))):(R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}))),removeEventListener("mousemove",C),removeEventListener("mouseup",I)})},onMoveHandler:j,onTouchStartHandler:e=>{k.current.setIsDragging(!0),"function"==typeof y&&y(),E.current&&(E.current.style.willChange="x"===b?"left":"top"),addEventListener("touchmove",B=j(e)),addEventListener("touchend",F=e=>{e.preventDefault(),k.current.setIsDragging(!1),"function"==typeof w&&w(),E.current&&(E.current.style.willChange="auto"),f&&!g&&("infinite"===m||k.current.getCounter()<m)?(R(!1),T(!0),k.current.play((()=>{R(!0),T(!1)}))):(R(!1),T(!0),k.current.backToStartPosition(!0,(()=>{R(!0),T(!1)}))),removeEventListener("touchmove",B),removeEventListener("touchend",F)})},onContainerHoverHandler:O,onVisibilityChangeHandler:H,isPaused:S,isAnimating:D,wrapperRef:E,animation:k.current}})({isCalculated:q,tickerRef:H,tickerRect:V,containerRect:P,infiniteScrollView:T,delay:f,delayBack:y,speed:m,speedBack:w,canBeAnimated:W,direction:p,rtl:h,iterations:x,playOnHover:v,pauseOnHover:g,onMouseDown:function(){var e;null===(e=z.current)||void 0===e||e.classList.add(a),O(!0)},onMouseUp:function(){var e;null===(e=z.current)||void 0===e||e.classList.remove(a),O(!1)},forwardedRef:C}),Q=t.useCallback((()=>{M()}),[]);const J=t.useMemo((()=>d?new Array(N).fill(0).map(((e,i)=>t.createElement(t.Fragment,{key:i},c,"y"===F&&N>1&&S&&t.createElement("br",null)))):c),[c,d,N]),Z=t.useMemo((()=>!(!(("left"===p||"right"===p&&h)&&S&&K)||G||g||I||L||d||!q)),[F,S,K,g,I,L,q,G]),ee=t.useMemo((()=>!("top"!==p||!K||!S||G||g||I||L||!D||d||!q)),[F,S,K,g,I,D,L,q,G]),te=t.useMemo((()=>Z?"inline-block":ee?"-webkit-box":"flex"),[Z,ee]),ie=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},k),{display:te,flexWrap:"nowrap",overflow:"hidden",textSizeAdjust:"none",justifyItems:"flex-start",flexDirection:"x"===F?"row":"column",userSelect:_?"none":"unset",WebkitUserSelect:_?"none":"unset",WebkitTouchCallout:_?"none":"unset"}),"x"===F&&{minWidth:V.width,whiteSpace:"nowrap"}),"y"===F&&{minHeight:V.height,whiteSpace:"normal"}),{direction:h?"rtl":"ltr"}),Z&&{minWidth:P.width,maxWidth:P.width,display:te,textOverflow:"ellipsis"}),ee&&{display:te,WebkitLineClamp:D,WebkitBoxOrient:"vertical",maxHeight:P.height*D}),h&&"x"===F&&Object.assign({transform:`translate${F}(-100%)`,left:`${V.width}px`},Z&&{left:`${P.width}px`})),re=Object.assign(Object.assign({[p]:null===(B=null==z?void 0:z.current)||void 0===B?void 0:B.style[p],justifyItems:h?"flex-end":"flex-start",flexDirection:"x"===F?"row":"column",transform:`translate${F}(-${V["x"===F?"width":"height"]}px)`},Z&&{transform:`translate${F}(-${P["x"===F?"width":"height"]}px)`}),!T&&{transform:`translate${F}(0px)`});return u&&L&&q?t.createElement(i.TickerContainer,{containerRef:j,containerRect:P,direction:p,infiniteScrollView:T,style:E,onResizeHandler:Q},t.createElement("div",{ref:z,className:n+" "+o},t.createElement("div",{key:"ticker-simple",ref:H,"data-testid":"ticker-smart",className:r,style:ie},c))):t.createElement(i.TickerContainer,Object.assign({containerRef:j,containerRect:P,infiniteScrollView:T,direction:p,style:E,onResizeHandler:Q,onVisibilityChangeHandler:U,draggable:!0},(v||g)&&{onHoverHandler:Y}),t.createElement("div",Object.assign({ref:z,"data-testid":"ticker-wrapper",className:`${n} ${A?s:""}`,style:re},!A&&{onMouseDown:$},!A&&{onTouchStart:X}),t.createElement("div",{key:"ticker-1",ref:H,"data-testid":"ticker-1",className:r,style:ie},J),T&&t.createElement(t.Fragment,null,t.createElement("div",{"data-testid":"ticker-2",className:r,style:Object.assign(Object.assign({},ie),{display:q?te:"none"})},J),t.createElement("div",{"data-testid":"ticker-3",className:r,style:Object.assign(Object.assign({},ie),{display:q?te:"none"})},J))))};exports.SmartTickerDraggable=c,exports.default=c;
 //# sourceMappingURL=SmartTickerDraggable.js.map

package.json

 {
   "name": "react-smart-ticker",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "author": "Eugen Korolev <[e-mail]>",
@@ -5,0 +5,0 @@ "license": "MIT",

No alert changes

Improved metrics

Total package byte prevSize

258053

1.02%

Lines of code

622

0.32%

No dependency changes