1function useCarouselAnimation({ slides, autoPlayInterval = 3000 }) {
2  const [currentIndex, setCurrentIndex] = useState(0);
3  const [isPlaying, setIsPlaying] = useState(true);
4  const animationFrame = useRef();
5  const lastTimestamp = useRef();
6
7  const animate = useCallback((timestamp) => {
8    if (!lastTimestamp.current) {
9      lastTimestamp.current = timestamp;
10    }
11
12    const elapsed = timestamp - lastTimestamp.current;
13
14    if (elapsed >= autoPlayInterval && isPlaying) {
15      setCurrentIndex(prev => (prev + 1) % slides.length);
16      lastTimestamp.current = timestamp;
17    }
18
19    animationFrame.current = requestAnimationFrame(animate);
20  }, [isPlaying, slides.length]);
21
22  useEffect(() => {
23    animationFrame.current = requestAnimationFrame(animate);
24    
25    return () => {
26      cancelAnimationFrame(animationFrame.current);
27    };
28  }, [animate]);
29
30  const togglePlay = () => setIsPlaying(prev => !prev);
31
32  return {
33    currentIndex,
34    isPlaying,
35    togglePlay
36  };
37}