@guruhotel/aura-hooks/esm/use-scroll-into-view/use-scroll-into-view.js

🪝 Hooks library designed by the Guruhotel team for Aura UI

import{useCallback as r,useRef as e,useEffect as t}from"react";import{useReducedMotion as n}from"../use-reduced-motion/use-reduced-motion";import{useWindowEvent as o}from"../use-window-event/use-window-event";import{easeInOutQuad as i}from"./utils/ease-in-out-quad";import{getRelativePosition as c}from"./utils/get-relative-position";import{getScrollStart as u}from"./utils/get-scroll-start";import{setScrollParam as s}from"./utils/set-scroll-param";export function useScrollIntoView({duration:a=1250,axis:l="y",onScrollFinish:m,easing:f=i,offset:p=0,cancelable:d=!0,isList:w=!1}={}){const g=e(0),v=e(0),x=e(!1),h=e(null),F=e(null),b=n(),q=()=>{g.current&&cancelAnimationFrame(g.current)},y=r((({alignment:r="start"}={})=>{var e;x.current=!1,g.current&&q();const t=null!=(e=u({parent:h.current,axis:l}))?e:0,n=c({parent:h.current,target:F.current,axis:l,alignment:r,offset:p,isList:w})-(h.current?0:t);!function r(){0===v.current&&(v.current=performance.now());const e=performance.now()-v.current,o=b||0===a?1:e/a,i=t+n*f(o);s({parent:h.current,axis:l,distance:i}),!x.current&&o<1?g.current=requestAnimationFrame(r):("function"==typeof m&&m(),v.current=0,g.current=0,q())}()}),[h.current]),A=()=>{d&&(x.current=!0)};return o("wheel",A,{passive:!0}),o("touchmove",A,{passive:!0}),t((()=>q),[]),{scrollableRef:h,targetRef:F,scrollIntoView:y,cancel:q}}