diff --git a/src/components/Componentes/use-sheet-scroll-lock.ts b/src/components/Componentes/use-sheet-scroll-lock.ts index cbd7dbf..ffd81f6 100644 --- a/src/components/Componentes/use-sheet-scroll-lock.ts +++ b/src/components/Componentes/use-sheet-scroll-lock.ts @@ -87,16 +87,16 @@ function isKeyboardInputTarget(target: EventTarget | null): boolean { } function syncQuestionInputOpenClass() { - if (hasFocusedKeyboardInput && keyboardHeight > 0) { + if (hasFocusedKeyboardInput) { document.body.classList.add("question-keyboard-open"); } else { document.body.classList.remove("question-keyboard-open"); } } -function syncKeyboardShift(height: number) { +function syncKeyboardShift(isOpen: boolean) { const root = document.documentElement; - if (height <= 0) { + if (!isOpen) { root.style.setProperty("--question-keyboard-shift", "0px"); return; } @@ -110,10 +110,7 @@ function syncKeyboardShift(height: number) { const contentTop = activeContent.getBoundingClientRect().top; const targetTop = snapList.getBoundingClientRect().top + 8; const requiredShift = Math.max(0, contentTop - targetTop); - root.style.setProperty( - "--question-keyboard-shift", - `${requiredShift}px`, - ); + root.style.setProperty("--question-keyboard-shift", `${requiredShift}px`); } /** @@ -124,14 +121,18 @@ export function useQuestionInputFocusSync() { useEffect(() => { const handleFocusIn = (event: FocusEvent) => { if (!isKeyboardInputTarget(event.target)) return; + const target = event.target as HTMLElement; + if (!target.closest('.question-snap-item[aria-current="step"]')) return; hasFocusedKeyboardInput = true; syncQuestionInputOpenClass(); + window.requestAnimationFrame(() => syncKeyboardShift(true)); }; const handleFocusOut = (event: FocusEvent) => { if (!isKeyboardInputTarget(event.target)) return; window.setTimeout(() => { hasFocusedKeyboardInput = isKeyboardInputTarget(document.activeElement); syncQuestionInputOpenClass(); + if (!hasFocusedKeyboardInput) syncKeyboardShift(false); }, 0); }; @@ -142,7 +143,7 @@ export function useQuestionInputFocusSync() { hasFocusedKeyboardInput = false; } syncQuestionInputOpenClass(); - window.requestAnimationFrame(() => syncKeyboardShift(keyboardHeight)); + if (keyboardHeight === 0) syncKeyboardShift(false); }); const initialViewportHeight = window.visualViewport?.height ?? 0;