From bf9e7f8fc553eaf3a1566a0ced09a4a1c120b76a Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 11 Mar 2026 19:39:09 +0000
Subject: [PATCH] Update src/components/cardStack/hooks/useCardAnimation.ts

---
 .../cardStack/hooks/useCardAnimation.ts       | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/cardStack/hooks/useCardAnimation.ts b/src/components/cardStack/hooks/useCardAnimation.ts
index cfc6de5..8b888d1 100644
--- a/src/components/cardStack/hooks/useCardAnimation.ts
+++ b/src/components/cardStack/hooks/useCardAnimation.ts
@@ -1,17 +1,15 @@
 'use client';
 
 import { useEffect, useRef, useState } from 'react';
-
-interface UseCardAnimationReturn {
-  isActive: boolean;
-  isMobile: boolean;
-  itemRefs: React.RefObject<HTMLElement>[];
-}
+import { UseCardAnimationReturn } from '@/components/cardStack/types';
 
 export function useCardAnimation(): UseCardAnimationReturn {
   const [isActive, setIsActive] = useState(false);
   const [isMobile, setIsMobile] = useState(false);
-  const itemRefs = useRef<(HTMLElement | null)[]>([]);
+  const itemRefsArray = useRef<(HTMLElement | null)[]>([]);
+  const containerRef = useRef<HTMLElement>(null);
+  const perspectiveRef = useRef<HTMLElement>(null);
+  const bottomContentRef = useRef<HTMLElement>(null);
 
   useEffect(() => {
     const checkMobile = () => {
@@ -22,9 +20,16 @@ export function useCardAnimation(): UseCardAnimationReturn {
     return () => window.removeEventListener('resize', checkMobile);
   }, []);
 
+  const itemRefs = itemRefsArray.current.map((el) => ({
+    current: el,
+  })) as React.RefObject<HTMLElement>[];
+
   return {
     isActive,
     isMobile,
-    itemRefs: itemRefs.current.map((el) => ({ current: el })) as React.RefObject<HTMLElement>[],
+    itemRefs,
+    containerRef,
+    perspectiveRef,
+    bottomContentRef,
   };
 }