1267677510559929
// --- Animation Components ---
const AnimatedElement: React.FC<{
children: React.ReactNode;
className?: string;
delay?: number;
direction?: 'up' | 'left' | 'right' | 'fade';
}> = ({
children,
className = '',
delay = 0,
direction = 'up'
}) => {
const ref = useRef(null);
const [isVisible, setIsVisible] = useState(false);
useEffect(() => {
const el = ref.current;
if (!el) return;
const observer = new IntersectionObserver(
([entry]) => {
if (entry.isIntersecting) {
setTimeout(() => setIsVisible(true), delay);
observer.unobserve(el);
}
},
{ threshold: 0.1, rootMargin: '50px' }
);
top of page
bottom of page
