From f2fd2327a0ea2b8ee81f39f9f525d2fbf55c121f Mon Sep 17 00:00:00 2001
From: Michael Gold <goldmichael@gmail.com>
Date: Mon, 30 Sep 2024 13:51:29 -0400
Subject: [PATCH] fix: type error for inViewMargin

---
 src/components/magicui/blur-fade.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/magicui/blur-fade.tsx b/src/components/magicui/blur-fade.tsx
index 5ab3a71..dd5a352 100644
--- a/src/components/magicui/blur-fade.tsx
+++ b/src/components/magicui/blur-fade.tsx
@@ -2,6 +2,9 @@
 
 import { AnimatePresence, motion, useInView, Variants } from "framer-motion";
 import { useRef } from "react";
+type MarginValue = `${number}${'px' | '%'}`;
+type MarginType = MarginValue | `${MarginValue} ${MarginValue}` | `${MarginValue} ${MarginValue} ${MarginValue}` | `${MarginValue} ${MarginValue} ${MarginValue} ${MarginValue}`;
+
 
 interface BlurFadeProps {
   children: React.ReactNode;
@@ -14,7 +17,7 @@ interface BlurFadeProps {
   delay?: number;
   yOffset?: number;
   inView?: boolean;
-  inViewMargin?: string;
+  inViewMargin?: MarginType;
   blur?: string;
 }
 const BlurFade = ({