{items[currentIndex]} ); } 22:T48b,'use client'; import { TextLoop } from '@/components/motion-primitives/text-loop'; import { Music } from 'lucide-react'; import { useState } from 'react'; export function TextLoopOnIndexChange() { const [direction, setDirection] = useState(-1); return ( { setDirection(index === 0 ? -1 : 1); }} variants={{ initial: { y: -direction * 20, rotateX: -direction * 90, opacity: 0, filter: 'blur(4px)', }, animate: { y: 0, rotateX: 0, opacity: 1, filter: 'blur(0px)', }, exit: { y: -direction * 20, rotateX: -direction * 90, opacity: 0, filter: 'blur(4px)', }, }} > A Little Lost・Arthur Russell La Trinité, Martinique ); } 23:T6e4,'use client'; import { cn } from '@/lib/utils'; import { motion, AnimatePresence, Transition, Variants, AnimatePresenceProps, } from 'motion/react'; import { useState, useEffect, Children } from 'react'; export type TextLoopProps = { children: React.ReactNode[]; className?: string; interval?: number; transition?: Transition; variants?: Variants; onIndexChange?: (index: number) => void; trigger?: boolean; mode?: AnimatePresenceProps['mode']; }; export function TextLoop({ ch