fix for last failed build 1

This commit is contained in:
Pratyay360
2024-08-13 15:45:14 +05:30
parent dcf79a220a
commit 7247eed3e1

View File

@@ -1,60 +1,60 @@
'use client' "use client";
import { useRef } from 'react' import { useRef } from "react";
import type { Variants } from 'framer-motion' import type { Variants } from "framer-motion";
import { AnimatePresence, motion, useInView } from 'framer-motion' import { AnimatePresence, motion, useInView } from "framer-motion";
interface BlurFadeProps { interface BlurFadeProps {
children: React.ReactNode children: React.ReactNode;
className?: string className?: string;
variant?: { variant?: {
hidden: { y: number } hidden: { y: number };
visible: { y: number } visible: { y: number };
} };
duration?: number duration?: number;
delay?: number delay?: number;
yOffset?: number yOffset?: number;
inView?: boolean inView?: boolean;
inViewMargin?: string inViewMargin?: any;
blur?: string blur?: string;
} }
export default function BlurFade({ export default function BlurFade({
children, children,
className, className,
variant, variant,
duration = 0.4, duration = 0.4,
delay = 0, delay = 0,
yOffset = 6, yOffset = 6,
inView = false, inView = false,
inViewMargin = '-50px', inViewMargin = "-50px",
blur = '6px', blur = "6px",
}: BlurFadeProps) { }: BlurFadeProps) {
const ref = useRef(null) const ref = useRef(null);
const inViewResult = useInView(ref, { once: true, margin: inViewMargin }) const inViewResult = useInView(ref, { once: true, margin: inViewMargin });
const isInView = !inView || inViewResult const isInView = !inView || inViewResult;
const defaultVariants: Variants = { const defaultVariants: Variants = {
hidden: { y: yOffset, opacity: 0, filter: `blur(${blur})` }, hidden: { y: yOffset, opacity: 0, filter: `blur(${blur})` },
visible: { y: -yOffset, opacity: 1, filter: `blur(0px)` }, visible: { y: -yOffset, opacity: 1, filter: `blur(0px)` },
} };
const combinedVariants = variant || defaultVariants const combinedVariants = variant || defaultVariants;
return ( return (
<AnimatePresence> <AnimatePresence>
<motion.div <motion.div
ref={ref} ref={ref}
initial="hidden" initial="hidden"
animate={isInView ? 'visible' : 'hidden'} animate={isInView ? "visible" : "hidden"}
exit="hidden" exit="hidden"
variants={combinedVariants} variants={combinedVariants}
transition={{ transition={{
delay: 0.04 + delay, delay: 0.04 + delay,
duration, duration,
ease: 'easeOut', ease: "easeOut",
}} }}
className={className} className={className}
> >
{children} {children}
</motion.div> </motion.div>
</AnimatePresence> </AnimatePresence>
) );
} }