import { ReactNode } from 'react'; import { Platform, ScrollView, StyleProp, ViewStyle } from 'react-native'; import { useKeyboardHeight } from '../hooks/useKeyboardHeight'; /** * Universal-Wrapper für Forms/Pages mit TextInput. * * Für Vollbild-Formulare (Auth, Profile-Edit) reicht das alleine: * - iOS: `automaticallyAdjustKeyboardInsets` (iOS 14+) verschiebt focused Input aktiv. * - Android: `paddingBottom: keyboardHeight` + `windowSoftInputMode=adjustResize` * im Manifest. * * Für FIXED-HEIGHT Sheets/Modals reicht das nicht — der Sheet selbst muss * zusätzlich nach oben verschoben werden. Pattern: * ```tsx * const keyboardHeight = useKeyboardHeight(); * * * {form content} * * * ``` * * Siehe `EditMailAccountSheet.tsx` für vollständiges Sheet-Pattern. * * Anti-Pattern: KeyboardAvoidingView mit `behavior="padding"` greift bei * Vollbild-Layouts mit `paddingTop: insets.top` nicht — siehe * `docs/internal/RECOVERY_LOG_2026-05-10.md` §7.2. */ export interface KeyboardAdjustedViewProps { children: ReactNode; /** Style für den ScrollView (outer container). */ style?: StyleProp; /** Style für den ScrollView-Inhalt (Padding gehört hier rein, nicht in `style`). */ contentContainerStyle?: StyleProp; /** Extra Padding bottom on top of keyboard height (z.B. wenn fixed CTA-Bar drüber sitzt). */ extraBottomOffset?: number; /** Default 'handled' — Tap auf nicht-Input-Bereich schließt Keyboard. */ keyboardShouldPersistTaps?: 'always' | 'never' | 'handled'; } export function KeyboardAdjustedView({ children, style, contentContainerStyle, extraBottomOffset = 0, keyboardShouldPersistTaps = 'handled', }: KeyboardAdjustedViewProps) { const keyboardHeight = useKeyboardHeight(); const bottomPad = keyboardHeight > 0 ? keyboardHeight + extraBottomOffset : 0; return ( {children} ); }