diff --git a/CHANGELOG.md b/CHANGELOG.md
index aa83933..682628b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
+## [3.0.0]
+
+### Removed
+
+- No longer rendering the widgets inside of a SafeAreaView. Users of the widgets need to handle this.
+
+### Updated
+
+- Stopped using the deprecated react-native SafeAreaView in favor of react-native-safe-area-context
+
 ## [2.0.3]
 
 ### Added
diff --git a/example/app/budgets.tsx b/example/app/budgets.tsx
index 268ddeb..9078e40 100644
--- a/example/app/budgets.tsx
+++ b/example/app/budgets.tsx
@@ -1,5 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 
 import { BudgetsWidget } from "@mxenabled/react-native-widget-sdk"
 
diff --git a/example/app/connect.tsx b/example/app/connect.tsx
index 4f88fbc..5e44ef8 100644
--- a/example/app/connect.tsx
+++ b/example/app/connect.tsx
@@ -1,5 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import * as Linking from "expo-linking"
 
 import { ConnectWidget } from "@mxenabled/react-native-widget-sdk"
diff --git a/example/app/goals.tsx b/example/app/goals.tsx
index 2745921..bbc09f7 100644
--- a/example/app/goals.tsx
+++ b/example/app/goals.tsx
@@ -1,5 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 
 import { GoalsWidget } from "@mxenabled/react-native-widget-sdk"
 
diff --git a/example/app/index.tsx b/example/app/index.tsx
index 00b0235..c6930e6 100644
--- a/example/app/index.tsx
+++ b/example/app/index.tsx
@@ -1,5 +1,6 @@
 import React, { FC, PropsWithChildren } from "react"
-import { SafeAreaView, Text, View, StyleSheet } from "react-native"
+import { Text, View, StyleSheet } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import { Link } from "expo-router"
 
 const styles = StyleSheet.create({
diff --git a/example/app/pulse.tsx b/example/app/pulse.tsx
index 76593df..315ab94 100644
--- a/example/app/pulse.tsx
+++ b/example/app/pulse.tsx
@@ -1,6 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
-
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import { PulseWidget } from "@mxenabled/react-native-widget-sdk"
 
 const baseUrl = Platform.OS === "android" ? "http://10.0.2.2:8089" : "http://localhost:8089"
diff --git a/example/app/spending.tsx b/example/app/spending.tsx
index 791733f..f06f8fa 100644
--- a/example/app/spending.tsx
+++ b/example/app/spending.tsx
@@ -1,6 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
-
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import { SpendingWidget } from "@mxenabled/react-native-widget-sdk"
 
 const baseUrl = Platform.OS === "android" ? "http://10.0.2.2:8089" : "http://localhost:8089"
diff --git a/example/app/transactions.tsx b/example/app/transactions.tsx
index 490d01f..3e7f591 100644
--- a/example/app/transactions.tsx
+++ b/example/app/transactions.tsx
@@ -1,6 +1,6 @@
 import React from "react"
-import { SafeAreaView, StyleSheet, Platform } from "react-native"
-
+import { StyleSheet, Platform } from "react-native"
+import { SafeAreaView } from "react-native-safe-area-context"
 import { TransactionsWidget } from "@mxenabled/react-native-widget-sdk"
 
 const baseUrl = Platform.OS === "android" ? "http://10.0.2.2:8089" : "http://localhost:8089"
diff --git a/example/package-lock.json b/example/package-lock.json
index a47296d..8782d85 100644
--- a/example/package-lock.json
+++ b/example/package-lock.json
@@ -46,7 +46,7 @@
     },
     "..": {
       "name": "@mxenabled/react-native-widget-sdk",
-      "version": "2.0.2",
+      "version": "2.0.3",
       "license": "MIT",
       "dependencies": {
         "@mxenabled/widget-post-message-definitions": "^1.4.0",
diff --git a/package-lock.json b/package-lock.json
index d51332a..de85773 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@mxenabled/react-native-widget-sdk",
-  "version": "2.0.2",
+  "version": "3.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@mxenabled/react-native-widget-sdk",
-      "version": "2.0.2",
+      "version": "3.0.0",
       "license": "MIT",
       "dependencies": {
         "@mxenabled/widget-post-message-definitions": "^1.4.0",
diff --git a/package.json b/package.json
index 1aec094..072431d 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@mxenabled/react-native-widget-sdk",
   "description": "MX React Native Widget SDK",
-  "version": "2.0.3",
+  "version": "3.0.0",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
diff --git a/src/components/renderer.tsx b/src/components/renderer.tsx
index 94514e4..1a9e298 100644
--- a/src/components/renderer.tsx
+++ b/src/components/renderer.tsx
@@ -1,5 +1,5 @@
 import React, { useRef, MutableRefObject, ReactElement } from "react"
-import { SafeAreaView, StyleProp, ViewStyle } from "react-native"
+import { StyleProp, ViewStyle, View } from "react-native"
 import { WebView } from "react-native-webview"
 import { Payload } from "@mxenabled/widget-post-message-definitions"
 
@@ -35,7 +35,7 @@ export function useWidgetRendererWithRef<Configuration>(
   const style = props.style || fullscreenStyles
 
   if (!url) {
-    return [ref, <SafeAreaView style={style} />]
+    return [ref, <View style={style} />]
   }
 
   const scheme = props.uiMessageWebviewUrlScheme || "mx"
@@ -54,7 +54,7 @@ export function useWidgetRendererWithRef<Configuration>(
 
   return [
     ref,
-    <SafeAreaView testID="widget_view" style={style}>
+    <View testID="widget_view" style={style}>
       <WebView
         testID="widget_webview"
         style={props.webViewStyle}
@@ -70,6 +70,6 @@ export function useWidgetRendererWithRef<Configuration>(
         onShouldStartLoadWithRequest={handler}
         onError={props.onWebViewError}
       />
-    </SafeAreaView>,
+    </View>,
   ]
 }