page-transition.tsx•507 B
"use client"
import { motion } from "framer-motion"
import { usePathname } from "next/navigation"
import type { ReactNode } from "react"
export function PageTransition({ children }: { children: ReactNode }) {
const pathname = usePathname()
return (
<motion.div
key={pathname}
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0, y: 20 }}
transition={{ duration: 0.3, ease: "easeInOut" }}
>
{children}
</motion.div>
)
}