[251115] fix: TScrollerDetail Scroll

🕐 커밋 시간: 2025. 11. 15. 16:20:16

📊 변경 통계:
  • 총 파일: 1개
  • 추가: +15줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/views/DetailPanel/components/TScroller/TScrollerDetail.jsx

🔧 주요 변경 내용:
  • UI 컴포넌트 아키텍처 개선

com.twin.app.shoptime/src/views/DetailPanel/components/TScroller/TScrollerDetail.jsx

@@ -6,6 +6,7 @@ import { useSelector } from 'react-redux';
 import { off, on } from '@enact/core/dispatcher';
 import { Job } from '@enact/core/util';
 import Scroller from '@enact/sandstone/Scroller';
+import Spotlight from '@enact/spotlight';
 
 import AutoScrollAreaDetail, { POSITION } from '../AutoScrollAreaDetail/AutoScrollAreaDetail';
 import css from './TScrollerDetail.module.less';
@@ -41,6 +42,7 @@ const TScrollerDetail = forwardRef(
 
     const isScrolling = useRef(false);
     const scrollPosition = useRef('top');
+    const thumbElementRef = useRef(null); // 스크롤바 thumb 요소 저장
 
     const scrollToRef = useRef(null);
     const scrollHorizontalPos = useRef(0);
@@ -100,6 +102,12 @@ const TScrollerDetail = forwardRef(
 
     const _onScrollStart = useCallback(
       (e) => {
+        // 스크롤 시작 시 현재 포커스된 요소가 thumb인지 확인하고 저장
+        const currentFocused = Spotlight.getCurrent();
+        if (currentFocused && currentFocused.getAttribute('aria-label')?.includes('scroll')) {
+          thumbElementRef.current = currentFocused;
+        }
+
         if (onScrollStart) {
           onScrollStart(e);
         }
@@ -148,6 +156,13 @@ const TScrollerDetail = forwardRef(
         if (setCheckScrollPosition && prevPosition !== scrollPosition.current) {
           setCheckScrollPosition(scrollPosition.current);
         }
+
+        // 스크롤 완료 후 thumb으로 포커스 복구
+        if (thumbElementRef.current) {
+          setTimeout(() => {
+            Spotlight.focus(thumbElementRef.current);
+          }, 50);
+        }
       },
       [onScrollStop]
     );