20 lines
501 B
JavaScript
20 lines
501 B
JavaScript
import { useEffect, useRef } from 'react';
|
|
import { useAnimation, useInView } from 'framer-motion';
|
|
import { debouncedAnimation } from '../utils/performance';
|
|
|
|
export const useInViewAnimation = () => {
|
|
const ref = useRef(null);
|
|
const isInView = useInView(ref, { once: true });
|
|
const controls = useAnimation();
|
|
|
|
useEffect(() => {
|
|
if (isInView) {
|
|
debouncedAnimation(() => {
|
|
controls.start("visible");
|
|
});
|
|
}
|
|
}, [isInView, controls]);
|
|
|
|
return { ref, controls };
|
|
};
|