morphing-scroll 1.0.9 → 1.1.1
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),g=e.useRef(null),p=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:p};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?g.current=setTimeout((()=>{a&&c&&c()}),i):a&&c&&c(),()=>{g.current&&clearTimeout(g.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:g="visible",sliderType:p=!1,lazyRender:d=!1,rootMargin:f=0,suspending:h=!1,fallback:b=null,scrollTop:v=1,infiniteScroll:x=!1,contentAlignCenter:$=!1,wrapAlignCenter:y=!1,edgeGradient:E,objectsWrapperMinSize:w,children:M,onScrollValue:T,thumbElement:O,arrows:R,pixelsForSwipe:j=8,progressBarSize:k=4,duration:z=200})=>{const N=e.useReducer((()=>({})),{})[1],S=e.useRef(null),C=e.useRef(null),A=e.useRef(null),L=e.useRef(null),Y=e.useRef(null),F=e.useRef(null);let D=!1;const B=e.useRef(null),V=e.useRef(""),q=e.useRef(0),[I,X]=e.useState(0),[H,_]=e.useState(0),P=e.useMemo((()=>e.Children.toArray(M).filter((e=>null!=e))),[M]),W=e.useMemo((()=>{if(P.length>0){const t=P[0];if(e.isValidElement(t))return t.key}}),[P]),G={size:40,className:"",element:e.createElement("div",{className:"arrow"})},J={color:"rgba(0,0,0,0.4)",size:40},K=Object.assign(Object.assign({},G),R),Q="object"==typeof E?Object.assign(Object.assign({},J),E):J,U={background:`linear-gradient(${Q.color}, transparent)`,height:`${Q.size}px`},Z="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,[ee,te,re,ne]=c?[Z[1],Z[2],Z[3],Z[0]]:Z,se=Z[1]+Z[3],le=ee+re,[oe,ce]=e.useMemo((()=>"number"==typeof i?[i,i]:c?[i?i[1]:0,i?i[0]:0]:[0,0]),[i,c]),ie=e.useMemo((()=>"string"==typeof m?[m]:m),[m]),ae=e.useMemo((()=>o||(c?[l?l[0]:null,l?l[1]-se:null]:[l?l[0]-se:null,null])),[o,l,se,c]),ue=ae?c?ae[0]:ae[1]:null,me=ae?c?ae[1]:ae[0]:null,ge=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,[pe,de]=ge&&f?c?[ge[3],ge[1]]:[ge[2],ge[0]]:[0,0],fe=e.useCallback((e=>ie.includes(e)),[ie]),he=e.useMemo((()=>{const[e,t]=l||ae;return fe("arrows")&&K.size?c?[e?e-2*K.size:e,t,e,t]:[e,t?t-2*K.size:t,e,t]:[e,t,e,t]}),[l,ae,c,R]),be=ae?e.useMemo((()=>{if(!he[0]||!he[1])return 1;const e=c?Math.floor((he[1]-se)/(ae[1]?ae[1]+oe:he[1]+oe)):Math.floor((he[0]-se)/(ae[0]?ae[0]+oe:he[0]+oe));return e>P.length?P.length:e<1?1:e}),[]):P.length,ve=c?he[0]||0:he[1]||0,xe=e.useMemo((()=>{if(!x||be<=1)return[];const e=P.map(((e,t)=>t));if(!e)return[];const t=Array.from({length:be},(()=>[]));return e.forEach((e=>{t[e%be].push(e)})),t}),[M,be,x]),$e=e.useMemo((()=>be>1?Math.ceil(P.length/be):P.length),[P.length,be]),ye=e.useMemo((()=>(me||0)*be+(be-1)*ce),[me,be,ce]),Ee=e.useMemo((()=>o?(ue||0)*$e+($e-1)*oe:H),[ue,$e,oe,H]),we=e.useMemo((()=>Ee+le),[Ee,le]),Me=e.useMemo((()=>"visible"===g||"hover"===g?0===Ee?0:ve?Math.round(ve/we*ve):0:0),[ve,we,g]),Te=e.useMemo((()=>ve?we-ve:we),[we,ve]),Oe=e.useMemo((()=>{if(v)return"number"==typeof v?v:"end"===v&&we>ve?Te:0}),[v,we,Te]),Re=e.useMemo((()=>he[0]&&he[1]?he[0]/2-he[1]/2:0),[he]),je=e.useMemo((()=>{let e=[],t=0;if(x&&$){const r=Array.from({length:P.length},((e,t)=>t)),n=Math.abs(Math.floor(P.length/be)*be-P.length);e=n?r.slice(-n):[],t=((me||0)+ce)*(be-n)/2}return P.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,xe),l=function(e){return 0!==e?((ue||0)+oe)*e+ee:ee}(x?be>1?s[1]:n:0),o=x&&ae[1]?l+ae[1]:0,i=x&&me&&be>1?me*s[0]+ce*s[0]+(c?Z[0]:Z[1])+($&&e.length>0&&e.includes(n)?t:0):0;return{elementTop:l,elementBottom:o,left:i}}))}),[M,xe,ae,i,x,be]);D=e.useMemo((()=>{if(!he[0]||!he[1])return!1;if(y&&l)if(c){if(he[0]>we)return!0}else if(he[1]>we)return!0;return!1}),[c,he,ae,i,we]);const ke=e.useCallback((e=>{const t=c?he[0]:he[1];if(!t)return null;return(e?Math.ceil:Math.floor)(Ee/t)}),[c,he,Ee]),ze=e.useCallback(((e,t)=>{const r=A.current,n=L.current;if(!r||!n)return;const s=r.scrollTop,l=n.clientHeight,o=ke(!0),c=e=>Fe(e,(()=>{}));"first"===e&&s>0&&c(s<=ve?0:s-ve),"last"===e&&o&&s+ve!==l&&c(s+ve>=ve*o?l:s+ve)}),[A,L,ke]),Ne=e.useCallback((()=>{var e;if(!E)return;const t=(null===(e=A.current)||void 0===e?void 0:e.scrollTop)||0,r=Math.round(t+ve)!==we;if(C.current&&(C.current.classList.toggle("edgeLast",r),C.current.classList.toggle("edgeFirst",t>1),fe("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>=ve*r&&t<ve*(r+1);e.classList.toggle("active",n)}))}n()}}),[E,ve,we]),Se=e.useCallback((()=>{if(A.current&&0!==Me&&("visible"===g||"hover"===g)){const e=Math.abs(Math.round(A.current.scrollTop/Te*(ve-Me)));e===I||p||X(e),0===A.current.scrollTop&&"none"===V.current&&(A.current.scrollTop=1),A.current.scrollTop>Te&&(A.current.scrollTop=Te),T&&T.forEach((([e,t])=>{A.current&&e(A.current.scrollTop)&&t()}))}Ne()}),[ve,Me,I]),Ce=e.useCallback((e=>{const t=A.current,r=ke();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=L.current;if(!r)return;const n=r.clientHeight,s=e=>Fe(e,(()=>{q.current=0,N()})),l=e=>{const r=t.scrollTop+e*ve;s(e>0?Math.min(r,n-ve):Math.max(r,0))};e.movementY>0&&q.current<j?(q.current+=e.movementY,q.current>=j&&t.scrollTop+ve!=n&&l(1)):e.movementY<0&&q.current>-j&&(q.current-=Math.abs(e.movementY),q.current<=-j&&0!=t.scrollTop&&l(-1))}}}),[c,A,ke]),Ae=e.useCallback((()=>{const e=F.current;e&&(e.classList.remove("grabbingElement"),window.removeEventListener("mousemove",Ce),window.removeEventListener("mouseup",Ae),document.body.style.removeProperty("cursor"),V.current="",N())}),[Ce,S]),Le=e.useCallback(((e,t,r)=>{r&&(F.current=r,V.current=t,N(),("hover"===g||"visible"===g)&&r.classList.add("grabbingElement"),window.addEventListener("mousemove",Ce),window.addEventListener("mouseup",Ae),document.body.style.cursor="grabbing")}),[Ce,Ae,S]),Ye=e.useCallback(((e,t)=>{_(t-le)}),[c,le,Ee]),Fe=e.useCallback(((e,t)=>{const r=A.current;if(!r)return;const n=r.scrollTop,s=performance.now(),l=o=>{const c=o-s,i=Math.min(c/z,1);(e||0===e)&&(r.scrollTop=n+(e-n)*i),c<z?requestAnimationFrame(l):t()};requestAnimationFrame(l)}),[A.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"===g&&(u&&e("progressReverse","progressVisibility `hidden`",!0),fe("progressElement")&&e("progressTrigger [`scrollThumb`]","progressVisibility `hidden`",!0),fe("arrows")&&e("progressTrigger [`arrows`]","progressVisibility `hidden`",!0)),!fe("arrows")&&R&&u&&e("arrows","progressTrigger [`arrows`]"),!h&&b&&u&&e("fallback","suspending"),x&&N(),Ne()}),[]),e.useEffect((()=>{if(v&&A.current&&P.length>0&&"end"===v){let e;const t=()=>{B.current=W};return null===B.current?e=requestAnimationFrame((()=>Fe(null!=Oe?Oe:0,t))):B.current!==W?Fe(NaN,t):B.current===W&&(e=requestAnimationFrame((()=>Fe(null!=Oe?Oe:0,(()=>{}))))),()=>cancelAnimationFrame(e)}}),[Ee]);const De=e.createElement("div",{className:"objectsWrapper",ref:L,onMouseDown:e=>fe("content")&&Le(e,"wrapp",L.current),style:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({padding:`${ee}px ${te}px ${re}px ${ne}px`},i&&{gap:`${oe}px ${ce}px`}),$&&!x&&{justifyContent:"center"}),ye&&{width:`${ye}px`}),o&&Ee&&{position:"absolute",height:`${Ee}px`}),w&&{minHeight:`calc(${w}px - ${le}px)`})},P.map(((t,r)=>{var n,l;const o=t.key,i={scrollElementRef:A,xyObjectReverse:me,xyObject:ue,rootMargin:f,suspending:h,fallback:b,mRootLocal:ge,localObjectXY:ae};if(!x||!A.current)return e.createElement(s,Object.assign({key:o},i,{lazyRender:d}),t);{const{elementTop:a,elementBottom:u,left:m}=je[r];if((c?null!==(n=he[0])&&void 0!==n?n:0:null!==(l=he[1])&&void 0!==l?l:0)+pe>a-A.current.scrollTop&&u-A.current.scrollTop>0-de)return e.createElement(s,Object.assign({key:o},i,{elementTop:a,left:m,infiniteScroll:x}),t)}})));return e.createElement("div",{className:`customScroll${c?" xDirection":" yDirection"}${fe("content")?" draggableContent":""}${"hover"===g?" progressOnHover":""} ${n}`,ref:S,style:{width:`${he[2]}px`,height:`${he[3]}px`}},e.createElement("div",{className:"scrollContent",ref:C,style:Object.assign(Object.assign({width:c?`${he[1]}px`:`${he[0]}px`,height:c?`${he[0]}px`:`${he[1]}px`},c&&{transform:`rotate(-90deg) translate(${Re}px, ${Re}px) scaleX(-1)`}),fe("arrows")&&K.size&&(c?{left:`${K.size}px`}:{top:`${K.size}px`}))},fe("arrows")&&["first","last"].map((t=>e.createElement("div",{key:t,className:`arrowBox ${t}${K.className?" "+K.className:""}`,style:{height:`${K.size}px`},onClick:()=>ze(t)},K.element))),("visible"===g||"hover"===g)&&Me<ve&&e.createElement(e.Fragment,null,p?e.createElement("div",{className:`sliderBar${u?" progressReverse":""}${fe("progressElement")?" draggable":""}`,ref:Y,onMouseDown:e=>Le(e,"slider",S.current)},Array.from({length:ke()||0},((t,r)=>e.createElement("div",{key:r,className:"sliderElem",style:{width:`${k}px`}},O)))):e.createElement("div",{className:`scrollBar${u?" progressReverse":""}${fe("progressElement")?" draggable":""}`,style:{width:`${k}px`}},e.createElement("div",{className:"scrollBarThumb"+(O?"":" defaultThumb"),onMouseDown:e=>fe("progressElement")&&Le(e,"thumb",S.current),style:{height:`${Me}px`,top:`${I}px`}},O,e.createElement("div",{className:"clickField"})))),e.createElement("div",{className:"scrollElement",ref:A,onScroll:Se,style:Object.assign(Object.assign({},D&&{alignItems:"center"}),fe("wheel")?{overflow:"hidden scroll"}:{overflow:"hidden hidden"})},o?De:e.createElement(r,{onResize:Ye},(()=>De))),E&&e.createElement("div",{className:"edge first",style:U}),E&&e.createElement("div",{className:"edge last",style:U})))},s=e.memo((({children:r,elementTop:n,left:s,mRootLocal:l,scrollElementRef:o,xyObject:c,xyObjectReverse:i,localObjectXY:a,rootMargin:u,suspending:m,fallback:g,infiniteScroll:p,lazyRender:d})=>{const f=m?e.createElement(e.Suspense,{fallback:g},r):r,h=a[0]?{width:`${a[0]}px`}:{},b={width:`${i}px`,height:`${c}px`},v={root:o.current,rootMargin:p?u:l,style:p?Object.assign(Object.assign(Object.assign({},b),{position:"absolute",top:`${n}px`}),null!==s?{left:`${s}px`}:{}):b},x=e.createElement("div",{style:h},f);return p?e.createElement("div",{style:Object.assign({position:"absolute",top:`${n}px`},null!==s?{left:`${s}px`}:{})},x):d?e.createElement(t,Object.assign({},v),x):e.createElement("div",{style:b},x)}));s.displayName="ScrollObject";const l={Scroll:n,ResizeTracker:r,IntersectionTracker:t};exports.IntersectionTracker=t,exports.ResizeTracker=r,exports.Scroll=n,exports.default=l;
|