37 lines
710 B
TypeScript

"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>
);
}