GUIDE
하단 액션과 Modal 입력을 가리지 않는 레이아웃
insets 기능은 별도 @gj-kit/expo-ui/insets 서브패스에 있어 사용하지 않는 앱의 기본 번들에 safe-area peer를 끌어들이지 않습니다. 훅은 react-native-safe-area-context가 필요하고 순수 함수는 peer 없이 테스트할 수 있습니다.
Safe area를 디자인 여백에 더하기
useBottomInset은 웹에서 0을, 네이티브에서 실측 하단 inset을 반환합니다. StickyActionBar의 bottomInset 또는 useBottomSheetPadding에 연결합니다.
TypeScript
const bottomInset = useBottomInset();
<StickyActionBar bottomInset={bottomInset}>
<Button label="완료" onPress={submit} />
</StickyActionBar>Modal 키보드 겹침 대응
useModalKeyboardOverlap은 Android 엣지투엣지 Modal에서 하단 시트가 키보드에 가려지는 높이를 계산합니다. 반환값이 있으면 safe-area 패딩보다 우선해 적용합니다.
포커스 입력을 드러내는 순수 계산
computeKeyboardRevealOffset은 입력 위치, 현재 스크롤, 뷰포트와 키보드 높이로 목표 오프셋을 계산합니다.
- nativeBottomInset과 nativeBottomPadding은 플랫폼별 순수 함수
- 키보드 회피 애니메이션과 ScrollView 제어는 앱이 소유
- insets 서브패스를 쓸 때만 optional peer 설치