"use client";

import React from "react";
import { motion } from "motion/react";
import type { Variants } from "motion/react";
import { fadeInUp } from "@/lib/animation";

type RevealProps = {
  delay?: number;
  distance?: number;
  className?: string;
  children: React.ReactNode;
  once?: boolean;
};

export function Reveal({
  delay = 0,
  distance = 20,
  className,
  children,
  once = true,
}: RevealProps) {
  const variants: Variants = fadeInUp(delay, distance);

  return (
    <motion.div
      className={className}
      initial="initial"
      whileInView="animate"
      viewport={{ once, margin: "0px 0px -10% 0px" }}
      variants={variants}
    >
      {children}
    </motion.div>
  );
}