fix: bottom sheet ref 타입 충돌 해결

Author: manNomi

apps/web/src/components/ui/BottomSheet/hooks/useHandleModal.ts

@@ -1,12 +1,11 @@
-import { type MutableRefObject, type RefObject, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { type MutableRefObject, useCallback, useEffect, useMemo, useRef, useState } from "react";
 
 // 드래그 핸들에서 제외해야 하는 인터랙티브 엘리먼트 판별
 const isInteractiveElement = (el: EventTarget | null): boolean => {
   return el instanceof HTMLElement && ["INPUT", "TEXTAREA", "SELECT", "BUTTON", "A", "LABEL"].includes(el.tagName);
 };
 
 interface UseHandleModalReturn {
-  elementRef: RefObject<HTMLDivElement>;
   isVisible: boolean;
   translateY: number;
   isDraggingRef: MutableRefObject<boolean>;
@@ -23,7 +22,6 @@ const useHandleModal = (onClose: () => void, snap: number[] = [0]): UseHandleMod
   const startYRef = useRef<number>(0); // 시작 Y좌표
   const currentYRef = useRef<number>(0); // 현재 Y좌표
   const isDraggingRef = useRef<boolean>(false); // 드래그 상태
-  const elementRef = useRef<HTMLDivElement>(null);
 
   const snapPoints = useMemo((): number[] => {
     if (typeof window === "undefined") return [0]; // SSR 대응
@@ -115,7 +113,6 @@ const useHandleModal = (onClose: () => void, snap: number[] = [0]): UseHandleMod
   }, [isVisible, translateY, snapPoints, handleClose]);
 
   return {
-    elementRef,
     isVisible,
     translateY,
     isDraggingRef,

apps/web/src/components/ui/BottomSheet/index.tsx

@@ -14,16 +14,8 @@ interface BottomSheetProps {
 const DEFAULT_SNAP = [0];
 
 const BottomSheet = ({ isOpen, onClose, children, titleChild, snap = DEFAULT_SNAP }: BottomSheetProps) => {
-  const {
-    elementRef,
-    isVisible,
-    translateY,
-    isDraggingRef,
-    handleClose,
-    handleTouchStart,
-    handleTouchMove,
-    handleTouchEnd,
-  } = useHandleModal(onClose, snap);
+  const { isVisible, translateY, isDraggingRef, handleClose, handleTouchStart, handleTouchMove, handleTouchEnd } =
+    useHandleModal(onClose, snap);
 
   if (!isOpen) return null;
 
@@ -45,7 +37,6 @@ const BottomSheet = ({ isOpen, onClose, children, titleChild, snap = DEFAULT_SNA
 
       {/* 바텀 시트 */}
       <div
-        ref={elementRef}
         className={clsx(
           "fixed bottom-0 left-0 z-50 flex h-[90vh] max-h-screen w-full flex-col rounded-t-2xl bg-white shadow-2xl",
           !isDraggingRef.current && "transition-transform duration-300 ease-out",