Files
textbee/web/components/AnimatedScrollWrapper.tsx
2023-10-16 10:15:17 +03:00

31 lines
642 B
TypeScript

import React, { ReactNode } from 'react'
import { motion } from 'framer-motion'
interface AnimatedScrollWrapperProps {
children: ReactNode
}
const AnimatedScrollWrapper = ({ children }: AnimatedScrollWrapperProps) => {
return (
<motion.div
variants={{
hidden: { opacity: 0, y: 10 },
visible: {
opacity: 1,
y: 0,
transition: {
duration: 0.5,
ease: 'easeInOut',
// delay: 0.25,
},
},
}}
initial='hidden'
whileInView='visible'
>
{children}
</motion.div>
)
}
export default AnimatedScrollWrapper