fix: Ensure type consistency by adding 'as const' to transition type in HeroSection; refactor transitionVariants structure for clarity

Author: usari14

src/components/motion-primitives/cursor.tsx

@@ -1,4 +1,5 @@
 "use client";
+/* eslint-disable react-hooks/exhaustive-deps */
 import React, { useEffect, useState, useRef } from "react";
 import {
   motion,

src/components/sections/home/hero-section.tsx

@@ -20,7 +20,7 @@ const transitionVariants = {
       filter: "blur(0px)",
       y: 0,
       transition: {
-        type: "spring",
+        type: "spring" as const,
         bounce: 0.3,
         duration: 1.5,
       },
@@ -52,7 +52,7 @@ export default function HeroSection() {
                     opacity: 1,
                     y: 0,
                     transition: {
-                      type: "spring",
+                      type: "spring" as const,
                       bounce: 0.3,
                       duration: 2,
                     },
@@ -135,7 +135,23 @@ export default function HeroSection() {
                         },
                       },
                     },
-                    ...transitionVariants,
+                    item: {
+                      hidden: {
+                        opacity: 0,
+                        filter: "blur(12px)",
+                        y: 12,
+                      },
+                      visible: {
+                        opacity: 1,
+                        filter: "blur(0px)",
+                        y: 0,
+                        transition: {
+                          type: "spring" as const,
+                          bounce: 0.3,
+                          duration: 1.5,
+                        },
+                      },
+                    },
                   }}
                   className="mt-12 flex flex-col items-center justify-center gap-2 md:flex-row"
                 >
@@ -193,7 +209,23 @@ export default function HeroSection() {
                   },
                 },
               },
-              ...transitionVariants,
+              item: {
+                hidden: {
+                  opacity: 0,
+                  filter: "blur(12px)",
+                  y: 12,
+                },
+                visible: {
+                  opacity: 1,
+                  filter: "blur(0px)",
+                  y: 0,
+                  transition: {
+                    type: "spring" as const,
+                    bounce: 0.3,
+                    duration: 1.5,
+                  },
+                },
+              },
             }}
           >
             <div className="relative -mr-56 mt-8 overflow-hidden px-2 sm:mr-0 sm:mt-12 md:mt-20">