morphing-scroll 1.0.9 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.js +1 -1
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");const t=({children:t,root:r,threshold:n,rootMargin:s,style:l,visibleContent:o=!1,onVisible:c,intersectionDeley:i})=>{const[a,u]=e.useState(!1),m=e.useRef(null),p=e.useRef(null),g=s?"number"==typeof s?`${s}px ${s}px ${s}px ${s}px`:2===s.length?`${s[0]}px ${s[1]}px ${s[0]}px ${s[1]}px`:`${s[0]}px ${s[1]}px ${s[2]}px ${s[3]}px`:"",d=e=>{e.forEach((e=>{u(e.isIntersecting)}))},f={root:r,threshold:n,rootMargin:g};return e.useEffect((()=>{const e=new IntersectionObserver(d,f);return m.current&&e.observe(m.current),()=>{m.current&&e.unobserve(m.current)}}),[r,n,s]),e.useEffect((()=>(i?p.current=setTimeout((()=>{a&&c&&c()}),i):a&&c&&c(),()=>{p.current&&clearTimeout(p.current)})),[a]),e.createElement("div",{ref:m,style:l},(o||a)&&t)},r=({children:t,onResize:r,style:n})=>{const s=e.useRef(null),[l,o]=e.useState({width:0,height:0});return e.useEffect((()=>{const e=s.current;if(!e)return;const t=new ResizeObserver((e=>{for(const t of e){const e=t.contentRect.width,n=t.contentRect.height;o({width:e,height:n}),r&&r(e,n)}}));return t.observe(e),()=>{t.unobserve(e),t.disconnect()}}),[r]),e.createElement("div",{className:"resizeTracker",ref:s,style:Object.assign({width:"max-content",height:"max-content"},n)},t(l.width,l.height))},n=({scrollID:t="",className:n="",scrollXY:l,objectXY:o,xDirection:c=!1,gap:i,padding:a=[0,0,0,0],progressReverse:u=!1,progressTrigger:m="wheel",progressVisibility:p="visible",sliderType:g=!1,lazyRender:d=!1,rootMargin:f=0,suspending:h=!1,fallback:b=null,scrollTop:v=1,infiniteScroll:x=!1,contentAlignCenter:y=!1,wrapAlignCenter:$=!1,edgeGradient:E,objectsWrapperMinSize:w,children:M,onScrollValue:R,thumbElement:T,arrows:O,pixelsForSwipe:k=8,progressBarSize:j=4,duration:S=200})=>{const z=e.useRef(null),N=e.useRef(null),C=e.useRef(null),L=e.useRef(null),A=e.useRef(null),Y=e.useRef(null);let F=!1;const D=e.useRef(null),B=e.useRef(""),V=e.useRef(0),[X,q]=e.useState(!1),[I,H]=e.useState(0),[_,P]=e.useState(0),[W,G]=e.useState(!1),J=e.useMemo((()=>e.Children.toArray(M).filter((e=>null!=e))),[M]),K=e.useMemo((()=>{if(J.length>0){const t=J[0];if(e.isValidElement(t))return t.key}}),[J]),Q={size:40,className:"",element:e.createElement("div",{className:"arrow"})},U={color:"rgba(0,0,0,0.4)",size:40},Z=Object.assign(Object.assign({},Q),O),ee="object"==typeof E?Object.assign(Object.assign({},U),E):U,te={background:`linear-gradient(${ee.color}, transparent)`,height:`${ee.size}px`},re="number"==typeof a?[a,a,a,a]:2===a.length?[a[0],a[1],a[0],a[1]]:3===a.length?[a[0],a[1],a[2],a[1]]:a,[ne,se,le,oe]=c?[re[1],re[2],re[3],re[0]]:re,ce=re[1]+re[3],ie=ne+le,[ae,ue]=e.useMemo((()=>"number"==typeof i?[i,i]:c?[i?i[1]:0,i?i[0]:0]:[0,0]),[i,c]),me=e.useMemo((()=>"string"==typeof m?[m]:m),[m]),pe=e.useMemo((()=>o||(c?[l?l[0]:null,l?l[1]-ce:null]:[l?l[0]-ce:null,null])),[o,l,ce,c]),ge=pe?c?pe[0]:pe[1]:null,de=pe?c?pe[1]:pe[0]:null,fe=f?"number"==typeof f?[f,f,f,f]:c?2===f.length?[f[0],f[1],f[0],f[1]]:[f[1],f[0],f[3],f[2]]:2===f.length?[f[1],f[0],f[1],f[0]]:f:null,[he,be]=fe&&f?c?[fe[3],fe[1]]:[fe[2],fe[0]]:[0,0],ve=e.useCallback((e=>me.includes(e)),[me]),xe=e.useMemo((()=>{const[e,t]=l||pe;return ve("arrows")&&Z.size?c?[e?e-2*Z.size:e,t,e,t]:[e,t?t-2*Z.size:t,e,t]:[e,t,e,t]}),[l,pe,c,O]),ye=pe?e.useMemo((()=>{if(!xe[0]||!xe[1])return 1;const e=c?Math.abs(Math.floor((xe[1]-ce)/(xe[1]+ae))):Math.abs(Math.floor((xe[0]-ce)/(xe[0]+ae)));return e>J.length?J.length:e<1?1:e}),[]):J.length,$e=c?xe[0]||0:xe[1]||0,Ee=e.useMemo((()=>{if(!x||ye<=1)return[];const e=J.map(((e,t)=>t));if(!e)return[];const t=Array.from({length:ye},(()=>[]));return e.forEach((e=>{t[e%ye].push(e)})),t}),[M,ye,x]),we=e.useMemo((()=>ye>1?Math.ceil(J.length/ye):J.length),[J.length,ye]),Me=e.useMemo((()=>(de||0)*ye+(ye-1)*ue),[de,ye,ue]),Re=e.useMemo((()=>o?(ge||0)*we+(we-1)*ae:_),[ge,we,ae,_]),Te=e.useMemo((()=>Re+ie),[Re,ie]),Oe=e.useMemo((()=>"visible"===p||"hover"===p?0===Re?0:$e?Math.round($e/Te*$e):0:0),[$e,Te,p]),ke=e.useMemo((()=>$e?Te-$e:Te),[Te,$e]),je=e.useMemo((()=>{if(v)return"number"==typeof v?v:"end"===v&&Te>$e?ke:0}),[v,Te,ke]),Se=e.useMemo((()=>xe[0]&&xe[1]?xe[0]/2-xe[1]/2:0),[xe]),ze=e.useMemo((()=>{let e=[],t=0;if(x&&y){const r=Array.from({length:J.length},((e,t)=>t)),n=Math.abs(Math.floor(J.length/ye)*ye-J.length);e=n?r.slice(-n):[],t=((de||0)+ue)*(ye-n)/2}return J.map(((r,n)=>{const s=function(e,t){if(!t)return[0,e];for(let r=0;r<t.length;r++){const n=t[r].indexOf(e);if(-1!==n)return[r,n]}return[0,0]}(n,Ee),l=function(e){return 0!==e?((ge||0)+ae)*e+ne:0}(x?ye>1?s[1]:n:0),o=x&&pe[1]?l+pe[1]:0,i=x&&de&&ye>1?de*s[0]+ue*s[0]+(c?re[0]:re[1])+(y&&e.length>0&&e.includes(n)?t:0):0;return{elementTop:l,elementBottom:o,left:i}}))}),[M,Ee,pe,i,x,ye]);F=e.useMemo((()=>{if(!xe[0]||!xe[1])return!1;if($&&l)if(c){if(xe[0]>Te)return!0}else if(xe[1]>Te)return!0;return!1}),[c,xe,pe,i,Te]);const Ne=e.useCallback((e=>{const t=c?xe[0]:xe[1];if(!t)return null;return(e?Math.ceil:Math.floor)(Re/t)}),[c,xe,Re]),Ce=e.useCallback(((e,t)=>{const r=C.current,n=L.current;if(!r||!n)return;const s=r.scrollTop,l=n.clientHeight,o=Ne(!0),c=e=>Ve(e,(()=>{}));"first"===e&&s>0&&c(s<=$e?0:s-$e),"last"===e&&o&&s+$e!==l&&c(s+$e>=$e*o?l:s+$e)}),[C,L,Ne]),Le=e.useCallback((()=>{var e;if(!E)return;const t=(null===(e=C.current)||void 0===e?void 0:e.scrollTop)||0,r=Math.round(t+$e)!==Te;if(N.current&&(N.current.classList.toggle("edgeLast",r),N.current.classList.toggle("edgeFirst",t>1),ve("arrows")&&(N.current.classList.toggle("l_ArrOff",!r),N.current.classList.toggle("f_ArrOff",t<=1)),A.current)){function n(){var e;const r=null===(e=A.current)||void 0===e?void 0:e.querySelectorAll(".sliderElem");r&&r.forEach(((e,r)=>{const n=t>=$e*r&&t<$e*(r+1);e.classList.toggle("active",n)}))}n()}}),[E,$e,Te]),Ae=e.useCallback((()=>{if(C.current&&0!==Oe&&("visible"===p||"hover"===p)){const e=Math.abs(Math.round(C.current.scrollTop/ke*($e-Oe)));e===I||g||H(e),0===C.current.scrollTop&&"none"===B.current&&(C.current.scrollTop=1),C.current.scrollTop>ke&&(C.current.scrollTop=ke),R&&R.forEach((([e,t])=>{C.current&&e(C.current.scrollTop)&&t()}))}Le()}),[$e,Oe,I]),Ye=e.useCallback((e=>{const t=C.current,r=Ne();if(t&&r){if(["thumb","wrapp"].includes(B.current)){const n="thumb"===B.current?1:-1;t.scrollTop+=(c?e.movementX:e.movementY)*r*n}if("slider"===B.current){const r=L.current;if(!r)return;const n=r.clientHeight,s=e=>Ve(e,(()=>{V.current=0,q((e=>!e))})),l=e=>{const r=t.scrollTop+e*$e;s(e>0?Math.min(r,n-$e):Math.max(r,0))};e.movementY>0&&V.current<k?(V.current+=e.movementY,V.current>=k&&t.scrollTop+$e!=n&&l(1)):e.movementY<0&&V.current>-k&&(V.current-=Math.abs(e.movementY),V.current<=-k&&0!=t.scrollTop&&l(-1))}}}),[c,C,Ne]),Fe=e.useCallback((()=>{const e=Y.current;e&&(e.classList.remove("grabbingElement"),window.removeEventListener("mousemove",Ye),window.removeEventListener("mouseup",Fe),document.body.style.removeProperty("cursor"),B.current="",q((e=>!e)))}),[Ye,z]),De=e.useCallback(((e,t,r)=>{r&&(Y.current=r,B.current=t,q((e=>!e)),("hover"===p||"visible"===p)&&r.classList.add("grabbingElement"),window.addEventListener("mousemove",Ye),window.addEventListener("mouseup",Fe),document.body.style.cursor="grabbing")}),[Ye,Fe,z]),Be=e.useCallback(((e,t)=>{P(t-ie)}),[c,ie,Re]),Ve=e.useCallback(((e,t)=>{const r=C.current;if(!r)return;const n=r.scrollTop,s=performance.now(),l=o=>{const c=o-s,i=Math.min(c/S,1);(e||0===e)&&(r.scrollTop=n+(e-n)*i),c<S?requestAnimationFrame(l):t()};requestAnimationFrame(l)}),[C.current]);e.useEffect((()=>{function e(e,r,n=!1){console.warn(`You are using the ${e} ${n?"with":"without"} ${r}${t?` in ${t}`:""} 👺`)}!d&&f&&u&&e("rootMargin","lazyRender"),x&&d&&u&&e("lazyRender","infiniteScroll",!0),"hidden"===p&&(u&&e("progressReverse","progressVisibility `hidden`",!0),ve("progressElement")&&e("progressTrigger [`scrollThumb`]","progressVisibility `hidden`",!0),ve("arrows")&&e("progressTrigger [`arrows`]","progressVisibility `hidden`",!0)),!ve("arrows")&&O&&u&&e("arrows","progressTrigger [`arrows`]"),!h&&b&&u&&e("fallback","suspending"),x&&G(!0),Le()}),[]),e.useEffect((()=>{if(v&&C.current&&J.length>0&&"end"===v){let e;const t=()=>{D.current=K};return null===D.current?e=requestAnimationFrame((()=>Ve(null!=je?je:0,t))):D.current!==K?Ve(NaN,t):D.current===K&&(e=requestAnimationFrame((()=>Ve(null!=je?je:0,(()=>{}))))),()=>cancelAnimationFrame(e)}}),[Re]);const Xe=e.createElement("div",{className:"objectsWrapper",ref:L,onMouseDown:e=>ve("content")&&De(e,"wrapp",L.current),style:Object.assign(Object.assign(Object.assign(Object.assign({padding:`${ne}px ${se}px ${le}px ${oe}px`},i?{gap:`${ae}px ${ue}px`}:{}),Me?{width:`${Me}px`}:{}),o&&Re&&{position:"absolute",height:`${Re}px`}),w&&{minHeight:`calc(${w}px - ${ie}px)`})},J.map(((t,r)=>{var n,l;const o=t.key;if(!x||!W)return e.createElement(s,{key:o,scrollElementRef:C,xyObjectReverse:de,xyObject:ge,rootMargin:f,suspending:h,fallback:b,mRootLocal:fe,localObjectXY:pe,lazyRender:d},t);{const{elementTop:i,elementBottom:a,left:u}=ze[r];if((c?null!==(n=xe[0])&&void 0!==n?n:0:null!==(l=xe[1])&&void 0!==l?l:0)+he>i-C.current.scrollTop&&a-C.current.scrollTop>0-be)return e.createElement(s,{key:o,scrollElementRef:C,xyObjectReverse:de,xyObject:ge,rootMargin:f,suspending:h,fallback:b,elementTop:i,left:u,mRootLocal:fe,infiniteScroll:x,infiniteScrollState:W,localObjectXY:pe},t)}})));return e.createElement("div",{className:`customScroll${c?" xDirection":" yDirection"}${ve("content")?" draggableContent":""}${"hover"===p?" progressOnHover":""} ${n}`,ref:z,style:{width:`${xe[2]}px`,height:`${xe[3]}px`}},e.createElement("div",{className:"scrollContent",ref:N,style:Object.assign(Object.assign({width:c?`${xe[1]}px`:`${xe[0]}px`,height:c?`${xe[0]}px`:`${xe[1]}px`},c&&{transform:`rotate(-90deg) translate(${Se}px, ${Se}px) scaleX(-1)`}),ve("arrows")&&Z.size&&(c?{left:`${Z.size}px`}:{top:`${Z.size}px`}))},ve("arrows")&&["first","last"].map((t=>e.createElement("div",{key:t,className:`arrowBox ${t}${Z.className?" "+Z.className:""}`,style:{height:`${Z.size}px`},onClick:()=>Ce(t)},Z.element))),E&&e.createElement("div",{className:"edge first",style:te}),E&&e.createElement("div",{className:"edge last",style:te}),("visible"===p||"hover"===p)&&Oe<$e&&e.createElement(e.Fragment,null,g?e.createElement("div",{className:`sliderBar${u?" progressReverse":""}${ve("progressElement")?" draggable":""}`,ref:A,onMouseDown:e=>De(e,"slider",z.current)},Array.from({length:Ne()||0},((t,r)=>e.createElement("div",{key:r,className:"sliderElem",style:{width:`${j}px`}},T)))):e.createElement("div",{className:`scrollBar${u?" progressReverse":""}${ve("progressElement")?" draggable":""}`,style:{width:`${j}px`}},e.createElement("div",{className:"scrollBarThumb"+(T?"":" defaultThumb"),onMouseDown:e=>ve("progressElement")&&De(e,"thumb",z.current),style:{height:`${Oe}px`,top:`${I}px`}},T,e.createElement("div",{className:"clickField"})))),e.createElement("div",{className:"scrollElement",ref:C,onScroll:Ae,style:Object.assign(Object.assign({},F&&{alignItems:"center"}),ve("wheel")?{overflow:"hidden scroll"}:{overflow:"hidden hidden"})},o?Xe:e.createElement(r,{onResize:Be},(()=>Xe)))))},s=e.memo((({children:r,elementTop:n,left:s,mRootLocal:l,scrollElementRef:o,infiniteScrollState:c,xyObject:i,xyObjectReverse:a,localObjectXY:u,rootMargin:m,suspending:p,fallback:g,infiniteScroll:d,lazyRender:f})=>{const h=p?e.createElement(e.Suspense,{fallback:g},r):r;if(d&&c)return e.createElement(t,{root:o.current,rootMargin:m,style:Object.assign({position:"absolute",width:`${a}px`,height:`${i}px`,top:`${n}px`},null!==s?{left:`${s}px`}:{})},e.createElement("div",{style:{width:`${a}px`}},h));{const r=u[0]?{width:`${u[0]}px`}:{},n={width:`${a}px`,height:`${i}px`};return f?e.createElement(t,{root:o.current,rootMargin:l,style:n},e.createElement("div",{style:r},h)):e.createElement("div",{style:n},e.createElement("div",{style:r},h))}}));s.displayName="ScrollObject";const l={Scroll:n,ResizeTracker:r,IntersectionTracker:t};exports.IntersectionTracker=t,exports.ResizeTracker=r,exports.Scroll=n,exports.default=l;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");const t=({children:t,root:r,threshold:n,rootMargin:s,style:l,visibleContent:o=!1,onVisible:c,intersectionDeley:i})=>{const[a,u]=e.useState(!1),m=e.useRef(null),p=e.useRef(null),g=s?"number"==typeof s?`${s}px ${s}px ${s}px ${s}px`:2===s.length?`${s[0]}px ${s[1]}px ${s[0]}px ${s[1]}px`:`${s[0]}px ${s[1]}px ${s[2]}px ${s[3]}px`:"",d=e=>{e.forEach((e=>{u(e.isIntersecting)}))},f={root:r,threshold:n,rootMargin:g};return e.useEffect((()=>{const e=new IntersectionObserver(d,f);return m.current&&e.observe(m.current),()=>{m.current&&e.unobserve(m.current)}}),[r,n,s]),e.useEffect((()=>(i?p.current=setTimeout((()=>{a&&c&&c()}),i):a&&c&&c(),()=>{p.current&&clearTimeout(p.current)})),[a]),e.createElement("div",{ref:m,style:l},(o||a)&&t)},r=({children:t,onResize:r,style:n})=>{const s=e.useRef(null),[l,o]=e.useState({width:0,height:0});return e.useEffect((()=>{const e=s.current;if(!e)return;const t=new ResizeObserver((e=>{for(const t of e){const e=t.contentRect.width,n=t.contentRect.height;o({width:e,height:n}),r&&r(e,n)}}));return t.observe(e),()=>{t.unobserve(e),t.disconnect()}}),[r]),e.createElement("div",{className:"resizeTracker",ref:s,style:Object.assign({width:"max-content",height:"max-content"},n)},t(l.width,l.height))},n=({scrollID:t="",className:n="",scrollXY:l,objectXY:o,xDirection:c=!1,gap:i,padding:a=[0,0,0,0],progressReverse:u=!1,progressTrigger:m="wheel",progressVisibility:p="visible",sliderType:g=!1,lazyRender:d=!1,rootMargin:f=0,suspending:h=!1,fallback:b=null,scrollTop:v=1,infiniteScroll:x=!1,contentAlignCenter:y=!1,wrapAlignCenter:$=!1,edgeGradient:E,objectsWrapperMinSize:w,children:M,onScrollValue:R,thumbElement:T,arrows:O,pixelsForSwipe:j=8,progressBarSize:k=4,duration:S=200})=>{const z=e.useReducer((()=>({})),{})[1],N=e.useRef(null),C=e.useRef(null),L=e.useRef(null),A=e.useRef(null),Y=e.useRef(null),F=e.useRef(null);let D=!1;const B=e.useRef(null),V=e.useRef(""),X=e.useRef(0),[q,I]=e.useState(0),[H,_]=e.useState(0),[P,W]=e.useState(!1),G=e.useMemo((()=>e.Children.toArray(M).filter((e=>null!=e))),[M]),J=e.useMemo((()=>{if(G.length>0){const t=G[0];if(e.isValidElement(t))return t.key}}),[G]),K={size:40,className:"",element:e.createElement("div",{className:"arrow"})},Q={color:"rgba(0,0,0,0.4)",size:40},U=Object.assign(Object.assign({},K),O),Z="object"==typeof E?Object.assign(Object.assign({},Q),E):Q,ee={background:`linear-gradient(${Z.color}, transparent)`,height:`${Z.size}px`},te="number"==typeof a?[a,a,a,a]:2===a.length?[a[0],a[1],a[0],a[1]]:3===a.length?[a[0],a[1],a[2],a[1]]:a,[re,ne,se,le]=c?[te[1],te[2],te[3],te[0]]:te,oe=te[1]+te[3],ce=re+se,[ie,ae]=e.useMemo((()=>"number"==typeof i?[i,i]:c?[i?i[1]:0,i?i[0]:0]:[0,0]),[i,c]),ue=e.useMemo((()=>"string"==typeof m?[m]:m),[m]),me=e.useMemo((()=>o||(c?[l?l[0]:null,l?l[1]-oe:null]:[l?l[0]-oe:null,null])),[o,l,oe,c]),pe=me?c?me[0]:me[1]:null,ge=me?c?me[1]:me[0]:null,de=f?"number"==typeof f?[f,f,f,f]:c?2===f.length?[f[0],f[1],f[0],f[1]]:[f[1],f[0],f[3],f[2]]:2===f.length?[f[1],f[0],f[1],f[0]]:f:null,[fe,he]=de&&f?c?[de[3],de[1]]:[de[2],de[0]]:[0,0],be=e.useCallback((e=>ue.includes(e)),[ue]),ve=e.useMemo((()=>{const[e,t]=l||me;return be("arrows")&&U.size?c?[e?e-2*U.size:e,t,e,t]:[e,t?t-2*U.size:t,e,t]:[e,t,e,t]}),[l,me,c,O]),xe=me?e.useMemo((()=>{if(!ve[0]||!ve[1])return 1;const e=c?Math.floor((ve[1]-oe)/(me[1]?me[1]+ie:ve[1]+ie)):Math.floor((ve[0]-oe)/(me[0]?me[0]+ie:ve[0]+ie));return e>G.length?G.length:e<1?1:e}),[]):G.length,ye=c?ve[0]||0:ve[1]||0,$e=e.useMemo((()=>{if(!x||xe<=1)return[];const e=G.map(((e,t)=>t));if(!e)return[];const t=Array.from({length:xe},(()=>[]));return e.forEach((e=>{t[e%xe].push(e)})),t}),[M,xe,x]),Ee=e.useMemo((()=>xe>1?Math.ceil(G.length/xe):G.length),[G.length,xe]),we=e.useMemo((()=>(ge||0)*xe+(xe-1)*ae),[ge,xe,ae]),Me=e.useMemo((()=>o?(pe||0)*Ee+(Ee-1)*ie:H),[pe,Ee,ie,H]),Re=e.useMemo((()=>Me+ce),[Me,ce]),Te=e.useMemo((()=>"visible"===p||"hover"===p?0===Me?0:ye?Math.round(ye/Re*ye):0:0),[ye,Re,p]),Oe=e.useMemo((()=>ye?Re-ye:Re),[Re,ye]),je=e.useMemo((()=>{if(v)return"number"==typeof v?v:"end"===v&&Re>ye?Oe:0}),[v,Re,Oe]),ke=e.useMemo((()=>ve[0]&&ve[1]?ve[0]/2-ve[1]/2:0),[ve]),Se=e.useMemo((()=>{let e=[],t=0;if(x&&y){const r=Array.from({length:G.length},((e,t)=>t)),n=Math.abs(Math.floor(G.length/xe)*xe-G.length);e=n?r.slice(-n):[],t=((ge||0)+ae)*(xe-n)/2}return G.map(((r,n)=>{const s=function(e,t){if(!t)return[0,e];for(let r=0;r<t.length;r++){const n=t[r].indexOf(e);if(-1!==n)return[r,n]}return[0,0]}(n,$e),l=function(e){return 0!==e?((pe||0)+ie)*e+re:re}(x?xe>1?s[1]:n:0),o=x&&me[1]?l+me[1]:0,i=x&&ge&&xe>1?ge*s[0]+ae*s[0]+(c?te[0]:te[1])+(y&&e.length>0&&e.includes(n)?t:0):0;return{elementTop:l,elementBottom:o,left:i}}))}),[M,$e,me,i,x,xe]);D=e.useMemo((()=>{if(!ve[0]||!ve[1])return!1;if($&&l)if(c){if(ve[0]>Re)return!0}else if(ve[1]>Re)return!0;return!1}),[c,ve,me,i,Re]);const ze=e.useCallback((e=>{const t=c?ve[0]:ve[1];if(!t)return null;return(e?Math.ceil:Math.floor)(Me/t)}),[c,ve,Me]),Ne=e.useCallback(((e,t)=>{const r=L.current,n=A.current;if(!r||!n)return;const s=r.scrollTop,l=n.clientHeight,o=ze(!0),c=e=>Be(e,(()=>{}));"first"===e&&s>0&&c(s<=ye?0:s-ye),"last"===e&&o&&s+ye!==l&&c(s+ye>=ye*o?l:s+ye)}),[L,A,ze]),Ce=e.useCallback((()=>{var e;if(!E)return;const t=(null===(e=L.current)||void 0===e?void 0:e.scrollTop)||0,r=Math.round(t+ye)!==Re;if(C.current&&(C.current.classList.toggle("edgeLast",r),C.current.classList.toggle("edgeFirst",t>1),be("arrows")&&(C.current.classList.toggle("l_ArrOff",!r),C.current.classList.toggle("f_ArrOff",t<=1)),Y.current)){function n(){var e;const r=null===(e=Y.current)||void 0===e?void 0:e.querySelectorAll(".sliderElem");r&&r.forEach(((e,r)=>{const n=t>=ye*r&&t<ye*(r+1);e.classList.toggle("active",n)}))}n()}}),[E,ye,Re]),Le=e.useCallback((()=>{if(L.current&&0!==Te&&("visible"===p||"hover"===p)){const e=Math.abs(Math.round(L.current.scrollTop/Oe*(ye-Te)));e===q||g||I(e),0===L.current.scrollTop&&"none"===V.current&&(L.current.scrollTop=1),L.current.scrollTop>Oe&&(L.current.scrollTop=Oe),R&&R.forEach((([e,t])=>{L.current&&e(L.current.scrollTop)&&t()}))}Ce()}),[ye,Te,q]),Ae=e.useCallback((e=>{const t=L.current,r=ze();if(t&&r){if(["thumb","wrapp"].includes(V.current)){const n="thumb"===V.current?1:-1;t.scrollTop+=(c?e.movementX:e.movementY)*r*n}if("slider"===V.current){const r=A.current;if(!r)return;const n=r.clientHeight,s=e=>Be(e,(()=>{X.current=0,z()})),l=e=>{const r=t.scrollTop+e*ye;s(e>0?Math.min(r,n-ye):Math.max(r,0))};e.movementY>0&&X.current<j?(X.current+=e.movementY,X.current>=j&&t.scrollTop+ye!=n&&l(1)):e.movementY<0&&X.current>-j&&(X.current-=Math.abs(e.movementY),X.current<=-j&&0!=t.scrollTop&&l(-1))}}}),[c,L,ze]),Ye=e.useCallback((()=>{const e=F.current;e&&(e.classList.remove("grabbingElement"),window.removeEventListener("mousemove",Ae),window.removeEventListener("mouseup",Ye),document.body.style.removeProperty("cursor"),V.current="",z())}),[Ae,N]),Fe=e.useCallback(((e,t,r)=>{r&&(F.current=r,V.current=t,z(),("hover"===p||"visible"===p)&&r.classList.add("grabbingElement"),window.addEventListener("mousemove",Ae),window.addEventListener("mouseup",Ye),document.body.style.cursor="grabbing")}),[Ae,Ye,N]),De=e.useCallback(((e,t)=>{_(t-ce)}),[c,ce,Me]),Be=e.useCallback(((e,t)=>{const r=L.current;if(!r)return;const n=r.scrollTop,s=performance.now(),l=o=>{const c=o-s,i=Math.min(c/S,1);(e||0===e)&&(r.scrollTop=n+(e-n)*i),c<S?requestAnimationFrame(l):t()};requestAnimationFrame(l)}),[L.current]);e.useEffect((()=>{function e(e,r,n=!1){console.warn(`You are using the ${e} ${n?"with":"without"} ${r}${t?` in ${t}`:""} 👺`)}!d&&f&&u&&e("rootMargin","lazyRender"),x&&d&&u&&e("lazyRender","infiniteScroll",!0),"hidden"===p&&(u&&e("progressReverse","progressVisibility `hidden`",!0),be("progressElement")&&e("progressTrigger [`scrollThumb`]","progressVisibility `hidden`",!0),be("arrows")&&e("progressTrigger [`arrows`]","progressVisibility `hidden`",!0)),!be("arrows")&&O&&u&&e("arrows","progressTrigger [`arrows`]"),!h&&b&&u&&e("fallback","suspending"),x&&W(!0),Ce()}),[]),e.useEffect((()=>{if(v&&L.current&&G.length>0&&"end"===v){let e;const t=()=>{B.current=J};return null===B.current?e=requestAnimationFrame((()=>Be(null!=je?je:0,t))):B.current!==J?Be(NaN,t):B.current===J&&(e=requestAnimationFrame((()=>Be(null!=je?je:0,(()=>{}))))),()=>cancelAnimationFrame(e)}}),[Me]);const Ve=e.createElement("div",{className:"objectsWrapper",ref:A,onMouseDown:e=>be("content")&&Fe(e,"wrapp",A.current),style:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({padding:`${re}px ${ne}px ${se}px ${le}px`},i?{gap:`${ie}px ${ae}px`}:{}),y&&!x?{justifyContent:"center"}:{}),we?{width:`${we}px`}:{}),o&&Me&&{position:"absolute",height:`${Me}px`}),w&&{minHeight:`calc(${w}px - ${ce}px)`})},G.map(((t,r)=>{var n,l;const o=t.key;if(!x||!P)return e.createElement(s,{key:o,scrollElementRef:L,xyObjectReverse:ge,xyObject:pe,rootMargin:f,suspending:h,fallback:b,mRootLocal:de,localObjectXY:me,lazyRender:d},t);{const{elementTop:i,elementBottom:a,left:u}=Se[r];if((c?null!==(n=ve[0])&&void 0!==n?n:0:null!==(l=ve[1])&&void 0!==l?l:0)+fe>i-L.current.scrollTop&&a-L.current.scrollTop>0-he)return e.createElement(s,{key:o,scrollElementRef:L,xyObjectReverse:ge,xyObject:pe,rootMargin:f,suspending:h,fallback:b,elementTop:i,left:u,mRootLocal:de,infiniteScroll:x,infiniteScrollState:P,localObjectXY:me},t)}})));return e.createElement("div",{className:`customScroll${c?" xDirection":" yDirection"}${be("content")?" draggableContent":""}${"hover"===p?" progressOnHover":""} ${n}`,ref:N,style:{width:`${ve[2]}px`,height:`${ve[3]}px`}},e.createElement("div",{className:"scrollContent",ref:C,style:Object.assign(Object.assign({width:c?`${ve[1]}px`:`${ve[0]}px`,height:c?`${ve[0]}px`:`${ve[1]}px`},c&&{transform:`rotate(-90deg) translate(${ke}px, ${ke}px) scaleX(-1)`}),be("arrows")&&U.size&&(c?{left:`${U.size}px`}:{top:`${U.size}px`}))},be("arrows")&&["first","last"].map((t=>e.createElement("div",{key:t,className:`arrowBox ${t}${U.className?" "+U.className:""}`,style:{height:`${U.size}px`},onClick:()=>Ne(t)},U.element))),("visible"===p||"hover"===p)&&Te<ye&&e.createElement(e.Fragment,null,g?e.createElement("div",{className:`sliderBar${u?" progressReverse":""}${be("progressElement")?" draggable":""}`,ref:Y,onMouseDown:e=>Fe(e,"slider",N.current)},Array.from({length:ze()||0},((t,r)=>e.createElement("div",{key:r,className:"sliderElem",style:{width:`${k}px`}},T)))):e.createElement("div",{className:`scrollBar${u?" progressReverse":""}${be("progressElement")?" draggable":""}`,style:{width:`${k}px`}},e.createElement("div",{className:"scrollBarThumb"+(T?"":" defaultThumb"),onMouseDown:e=>be("progressElement")&&Fe(e,"thumb",N.current),style:{height:`${Te}px`,top:`${q}px`}},T,e.createElement("div",{className:"clickField"})))),e.createElement("div",{className:"scrollElement",ref:L,onScroll:Le,style:Object.assign(Object.assign({},D&&{alignItems:"center"}),be("wheel")?{overflow:"hidden scroll"}:{overflow:"hidden hidden"})},o?Ve:e.createElement(r,{onResize:De},(()=>Ve))),E&&e.createElement("div",{className:"edge first",style:ee}),E&&e.createElement("div",{className:"edge last",style:ee})))},s=e.memo((({children:r,elementTop:n,left:s,mRootLocal:l,scrollElementRef:o,infiniteScrollState:c,xyObject:i,xyObjectReverse:a,localObjectXY:u,rootMargin:m,suspending:p,fallback:g,infiniteScroll:d,lazyRender:f})=>{const h=p?e.createElement(e.Suspense,{fallback:g},r):r;if(d&&c)return e.createElement(t,{root:o.current,rootMargin:m,style:Object.assign({position:"absolute",width:`${a}px`,height:`${i}px`,top:`${n}px`},null!==s?{left:`${s}px`}:{})},e.createElement("div",{style:{width:`${a}px`}},h));{const r=u[0]?{width:`${u[0]}px`}:{},n={width:`${a}px`,height:`${i}px`};return f?e.createElement(t,{root:o.current,rootMargin:l,style:n},e.createElement("div",{style:r},h)):e.createElement("div",{style:n},e.createElement("div",{style:r},h))}}));s.displayName="ScrollObject";const l={Scroll:n,ResizeTracker:r,IntersectionTracker:t};exports.IntersectionTracker=t,exports.ResizeTracker=r,exports.Scroll=n,exports.default=l;
|