"use client";
import { motion } from "framer-motion";
import type { ReactNode } from "react";

export function Reveal({ children, className = "", delay = 0, direction = "up" }: { children: ReactNode; className?: string; delay?: number; direction?: "up" | "left" | "right" | "scale" }) {
  const initial = direction === "left" ? { opacity: 0, x: -32 } : direction === "right" ? { opacity: 0, x: 32 } : direction === "scale" ? { opacity: 0, scale: .94 } : { opacity: 0, y: 28 };
  return <motion.div initial={initial} whileInView={{ opacity: 1, x: 0, y: 0, scale: 1 }} viewport={{ once: true, margin: "-80px" }} transition={{ duration: .65, delay, ease: [0.22, 1, 0.36, 1] }} className={className}>{children}</motion.div>;
}