"use client";

import { useInView } from '@/hooks/useInView';
import { ReactNode } from 'react';

interface ScrollRevealProps {
  children: ReactNode;
  className?: string;
  stagger?: boolean;
}

const ScrollReveal = ({ children, className = '', stagger = false }: ScrollRevealProps) => {
  const { ref, inView } = useInView({ threshold: 0.15 });

  return (
    <div
      ref={ref}
      className={`${stagger ? 'stagger-children' : 'section-reveal'} ${inView ? 'in-view' : ''} ${className}`}
    >
      {children}
    </div>
  );
};

export default ScrollReveal;