SafeAreaView

A SafeAreaView component with dynamic theme-based styling for React Native.

Installation

Terminal

npx flexnative-cli add "https://registry.flexnative.com/c/safe-area-view.json"

Importing

import { SafeAreaView } from "@/components/ui/safe-area-view";

Using

<SafeAreaView>
<Text>Content inside SafeAreaView</Text>
</SafeAreaView>

A wrapper that adjusts the content area to account for safe areas on devices.

Prop	Type	Description	Default
`style`	`StyleProp<ViewStyle>`	Additional styles for the container.	-
`...props`	`React.ComponentProps<typeof RNSafeAreaView>`	Additional native SafeAreaView props.	-