[251024] fix: SearchInputOvelray 및 focus-within 대체
🕐 커밋 시간: 2025. 10. 24. 20:37:16 📊 변경 통계: • 총 파일: 7개 • 추가: +107줄 • 삭제: -32줄 📝 수정된 파일: ~ com.twin.app.shoptime/src/views/SearchPanel/SearchInputOverlay.jsx ~ com.twin.app.shoptime/src/views/SearchPanel/SearchPanel.new.v2.jsx ~ com.twin.app.shoptime/src/views/SearchPanel/TInput/TInputSimple.jsx ~ com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.jsx ~ com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.module.less ~ com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/modes/VoicePromptScreen.module.less ~ com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/modes/VoiceResponse.module.less 🔧 함수 변경 내용: 📄 com.twin.app.shoptime/src/views/SearchPanel/SearchInputOverlay.jsx (javascript): 🔄 Modified: Spottable() 📄 com.twin.app.shoptime/src/views/SearchPanel/TInput/TInputSimple.jsx (javascript): 🔄 Modified: Spottable() 📄 com.twin.app.shoptime/src/views/SearchPanel/VoiceInputOverlay/VoiceInputOverlay.jsx (javascript): 🔄 Modified: clearAllTimers()
This commit is contained in:
@@ -294,9 +294,18 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
|
||||
|
||||
// ✨ [Phase 4] Enter/OK 키 처리 - SearchInputOverlay 표시
|
||||
if (e.key === 'Enter' || e.keyCode === 13) {
|
||||
console.log('[DEBUG] [SearchPanel] handleKeydown: Enter/OK 키 누름');
|
||||
console.log(
|
||||
'[DEBUG] [SearchPanel] TInputSimple에서 Enter/OK 키 감지 → SearchInputOverlay 오픈'
|
||||
);
|
||||
e.preventDefault();
|
||||
|
||||
// ✨ [Phase 6] SearchInputOverlay 오픈 후 자동으로 입력 준비 완료
|
||||
// SearchInputOverlay가 열리면 자동으로:
|
||||
// 1. DOM 렌더링
|
||||
// 2. useEffect에서 input.focus() 호출 (50ms 후)
|
||||
// 3. 사용자가 바로 입력 가능한 상태
|
||||
setIsSearchOverlayVisible(true);
|
||||
|
||||
// ✅ 수정: Enter 키 누를 때에도 inputFocus 유지 (VOICE_RESULT 모드에서 키보드 이벤트 수신 가능)
|
||||
// setInputFocus(false);
|
||||
return;
|
||||
@@ -611,6 +620,9 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
|
||||
* Search overlay close handler
|
||||
*/
|
||||
const handleSearchOverlayClose = useCallback(() => {
|
||||
if (DEBUG_MODE) {
|
||||
console.log('[DEBUG] 🚪 SearchInputOverlay closing');
|
||||
}
|
||||
setIsSearchOverlayVisible(false);
|
||||
// VoiceInputOverlay와 동일하게 닫힐 때 TInput으로 포커스 이동
|
||||
setTimeout(() => {
|
||||
@@ -1253,9 +1265,10 @@ export default function SearchPanel({ panelInfo, isOnTop, spotlightId }) {
|
||||
currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT
|
||||
} // 🎯 VOICE_RESULT & SEARCH_RESULT 모드에서 항상 텍스트 표시
|
||||
inputFocus={
|
||||
currentMode === SEARCH_PANEL_MODES.INITIAL ||
|
||||
currentMode === SEARCH_PANEL_MODES.VOICE_RESULT ||
|
||||
currentMode === SEARCH_PANEL_MODES.SEARCH_RESULT
|
||||
} // ✅ VOICE_RESULT & SEARCH_RESULT 모드에서 TInputSimple 내부 포커스 활성화
|
||||
} // ✅ INITIAL, VOICE_RESULT & SEARCH_RESULT 모드에서 TInputSimple 내부 포커스 활성화
|
||||
onKeyDown={handleKeydown}
|
||||
spotlightId={SPOTLIGHT_IDS.SEARCH_INPUT_BOX}
|
||||
forcedSpotlight="recent-keyword-0"
|
||||
|
||||
Reference in New Issue
Block a user