Import source: cshare-app/src/hooks/useLenis
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,37 @@
|
||||
import { useEffect } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import Lenis from 'lenis';
|
||||
|
||||
let lenis = null;
|
||||
|
||||
export function useLenis() {
|
||||
const { pathname } = useLocation();
|
||||
|
||||
useEffect(() => {
|
||||
lenis = new Lenis({
|
||||
duration: 1.2,
|
||||
easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
|
||||
smoothWheel: true,
|
||||
wheelMultiplier: 1,
|
||||
touchMultiplier: 1.5,
|
||||
});
|
||||
|
||||
function raf(time) {
|
||||
lenis.raf(time);
|
||||
requestAnimationFrame(raf);
|
||||
}
|
||||
|
||||
const rafId = requestAnimationFrame(raf);
|
||||
|
||||
return () => {
|
||||
cancelAnimationFrame(rafId);
|
||||
lenis.destroy();
|
||||
lenis = null;
|
||||
};
|
||||
}, []);
|
||||
|
||||
// Scroll to top on route change
|
||||
useEffect(() => {
|
||||
if (lenis) lenis.scrollTo(0, { immediate: true });
|
||||
}, [pathname]);
|
||||
}
|
||||
Reference in New Issue
Block a user