From 1bd3c511ac86de44083973eae3efcf7db5071af4 Mon Sep 17 00:00:00 2001 From: Janic Duplessis Date: Fri, 9 Oct 2026 19:35:50 -0400 Subject: [PATCH] Remove the native SafeAreaView and the deprecated public export `SafeAreaView` has been deprecated for several releases in favour of `react-native-safe-area-context`, and the previous change moved the core surfaces that cannot use the library onto a JavaScript implementation built on the safe area insets prop. Nothing needs the native component now. Removed: the C++ shadow node, state and component descriptor, the iOS component view, the Android view and view manager, the codegen spec and every registration of them, plus the long-deprecated public export from `index.js`, the Flow and TypeScript surfaces, the deprecated type stubs, the Babel lazy import list and the ESLint import map. The private component drops its `_INTERNAL_DO_NOT_USE` suffix now that it is the only one left. This is a breaking change for anyone still importing `SafeAreaView` from `react-native`; the replacement is `react-native-safe-area-context`, or the `experimental_onSafeAreaInsetsChange` prop directly. --- packages/eslint-plugin-react-native/utils.js | 4 - .../src/configs/lazy-imports.js | 1 - .../RCTSafeAreaViewNativeComponent.js | 12 -- .../Components/SafeAreaView/SafeAreaView.js | 35 ------ packages/react-native/Package.swift | 11 +- packages/react-native/React/Base/RCTBridge.mm | 1 - .../RCTFabricComponentsPlugins.h | 1 - .../RCTFabricComponentsPlugins.mm | 1 - .../RCTSafeAreaViewComponentView.h | 21 ---- .../RCTSafeAreaViewComponentView.mm | 100 ----------------- .../ReactAndroid/api/ReactAndroid.api | 8 -- .../facebook/react/shell/MainReactPackage.kt | 4 - .../views/safeareaview/ReactSafeAreaView.kt | 70 ------------ .../safeareaview/ReactSafeAreaViewManager.kt | 53 --------- .../ReactAndroid/src/main/jni/CMakeLists.txt | 3 - .../jni/react/newarchdefaults/CMakeLists.txt | 1 - .../CoreComponentsRegistry.cpp | 3 - .../React-FabricComponents.podspec | 7 -- .../components/safeareaview/CMakeLists.txt | 41 ------- .../SafeAreaViewComponentDescriptor.h | 32 ------ .../safeareaview/SafeAreaViewShadowNode.cpp | 15 --- .../safeareaview/SafeAreaViewShadowNode.h | 30 ----- .../safeareaview/SafeAreaViewState.cpp | 19 ---- .../safeareaview/SafeAreaViewState.h | 43 -------- packages/react-native/ReactNativeApi.d.ts | 12 +- packages/react-native/__typetests__/index.tsx | 26 ----- packages/react-native/index.js | 14 --- packages/react-native/index.js.flow | 3 - .../scripts/ios-prebuild/headers-config.js | 7 -- .../specs/RCTSafeAreaViewNativeComponent.js | 27 ----- .../Components/SafeAreaView/SafeAreaView.d.ts | 33 ------ .../react-native/types_DEPRECATED/index.d.ts | 1 - .../SafeAreaView/SafeAreaViewExample.js | 103 ------------------ .../rn-tester/js/utils/RNTesterList.ios.js | 4 - .../api-snapshots/ReactAndroidDebugCxx.api | 10 -- .../ReactAndroidFrameworksCxx.api | 10 -- .../api-snapshots/ReactAndroidNewarchCxx.api | 10 -- .../api-snapshots/ReactAndroidReleaseCxx.api | 10 -- .../api-snapshots/ReactAppleDebugCxx.api | 14 --- .../api-snapshots/ReactAppleFrameworksCxx.api | 14 --- .../api-snapshots/ReactAppleNewarchCxx.api | 14 --- .../api-snapshots/ReactAppleReleaseCxx.api | 14 --- 42 files changed, 2 insertions(+), 840 deletions(-) delete mode 100644 packages/react-native/Libraries/Components/SafeAreaView/RCTSafeAreaViewNativeComponent.js delete mode 100644 packages/react-native/Libraries/Components/SafeAreaView/SafeAreaView.js delete mode 100644 packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.h delete mode 100644 packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.mm delete mode 100644 packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaView.kt delete mode 100644 packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaViewManager.kt delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/CMakeLists.txt delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewComponentDescriptor.h delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.cpp delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.h delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.cpp delete mode 100644 packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.h delete mode 100644 packages/react-native/src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent.js delete mode 100644 packages/react-native/types_DEPRECATED/Libraries/Components/SafeAreaView/SafeAreaView.d.ts delete mode 100644 packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js diff --git a/packages/eslint-plugin-react-native/utils.js b/packages/eslint-plugin-react-native/utils.js index 12f0f3c2c417..fa824f8bba76 100644 --- a/packages/eslint-plugin-react-native/utils.js +++ b/packages/eslint-plugin-react-native/utils.js @@ -143,10 +143,6 @@ const publicAPIMapping = { 'RefreshControlPropsIOS', ], }, - 'Libraries/Components/SafeAreaView/SafeAreaView': { - default: 'SafeAreaView', - types: ['SafeAreaViewInstance'], - }, 'Libraries/Components/ScrollView/ScrollView': { default: 'ScrollView', types: [ diff --git a/packages/react-native-babel-preset/src/configs/lazy-imports.js b/packages/react-native-babel-preset/src/configs/lazy-imports.js index 95cb75e262c2..23833aa2c14d 100644 --- a/packages/react-native-babel-preset/src/configs/lazy-imports.js +++ b/packages/react-native-babel-preset/src/configs/lazy-imports.js @@ -29,7 +29,6 @@ module.exports = new Set([ 'Pressable', 'ProgressBarAndroid', 'ProgressViewIOS', - 'SafeAreaView', 'ScrollView', 'SectionList', 'Slider', diff --git a/packages/react-native/Libraries/Components/SafeAreaView/RCTSafeAreaViewNativeComponent.js b/packages/react-native/Libraries/Components/SafeAreaView/RCTSafeAreaViewNativeComponent.js deleted file mode 100644 index feb40f24ecef..000000000000 --- a/packages/react-native/Libraries/Components/SafeAreaView/RCTSafeAreaViewNativeComponent.js +++ /dev/null @@ -1,12 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow strict-local - * @format - */ - -export * from '../../../src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent'; -export {default} from '../../../src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent'; diff --git a/packages/react-native/Libraries/Components/SafeAreaView/SafeAreaView.js b/packages/react-native/Libraries/Components/SafeAreaView/SafeAreaView.js deleted file mode 100644 index 2b141c8c8494..000000000000 --- a/packages/react-native/Libraries/Components/SafeAreaView/SafeAreaView.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow strict-local - * @format - */ - -import type {HostInstance} from '../../../src/private/types/HostInstance'; -import type {ViewProps} from '../View/ViewPropTypes'; - -import Platform from '../../Utilities/Platform'; -import View from '../View/View'; -import * as React from 'react'; - -export type SafeAreaViewInstance = HostInstance; - -/** - * Renders content within the safe area boundaries of a device. Currently only applicable to iOS devices with iOS version 11 or later. Automatically applies padding to reflect the portion of the view not covered by navigation bars, tab bars, toolbars, and other ancestor views. - * - * @see https://reactnative.dev/docs/safeareaview - * @deprecated Use `react-native-safe-area-context` instead. - * @platform ios - */ -const SafeAreaView: component( - ref?: React.RefSetter, - ...props: ViewProps -) = Platform.select({ - ios: require('./RCTSafeAreaViewNativeComponent').default, - default: View, -}); - -export default SafeAreaView; diff --git a/packages/react-native/Package.swift b/packages/react-native/Package.swift index ac1611c59c07..c40cd40aea7a 100644 --- a/packages/react-native/Package.swift +++ b/packages/react-native/Package.swift @@ -492,7 +492,6 @@ let reactFabric = RNTarget( "components/inputaccessory", "components/modal", "components/rncore", - "components/safeareaview", "components/switch", "components/text", "components/textinput", @@ -530,12 +529,6 @@ let reactFabricSwitch = RNTarget( dependencies: [.reactNativeDependencies, .reactCore, .reactJsiExecutor, .reactTurboModuleCore, .jsi, .logger, .reactDebug, .reactFeatureFlags, .reactUtils, .reactRuntimeScheduler, .reactCxxReact, .yoga, .reactRendererDebug, .reactGraphics, .reactFabric, .reactTurboModuleBridging] ) -let reactFabricSafeAreaView = RNTarget( - name: .reactFabricSafeAreaView, - path: "ReactCommon/react/renderer/components/safeareaview", - dependencies: [.reactNativeDependencies, .reactCore, .reactJsiExecutor, .reactTurboModuleCore, .jsi, .logger, .reactDebug, .reactFeatureFlags, .reactUtils, .reactRuntimeScheduler, .reactCxxReact, .yoga, .reactRendererDebug, .reactGraphics, .reactFabric, .reactTurboModuleBridging] -) - let reactFabricTextLayoutManager = RNTarget( name: .reactFabricTextLayoutManager, path: "ReactCommon/react/renderer/textlayoutmanager", @@ -588,7 +581,7 @@ let reactRCTFabric = RNTarget( name: .reactRCTFabric, path: "React/Fabric", searchPaths: [virtualViewPath], - dependencies: [.reactNativeDependencies, .reactCore, .reactRCTImage, .yoga, .reactRCTText, .jsi, .reactFabricInputAccessory, .reactFabricModal, .reactFabricSafeAreaView, .reactFabricSwitch, .reactFabricText, .reactFabricTextInput, .reactFabricUnimplementedView, .reactFabricTextLayoutManager, .reactGraphics, .reactImageManager, .reactDebug, .reactUtils, .reactPerformanceTimeline, .reactRendererDebug, .reactRendererConsistency, .reactRuntimeScheduler, .reactRCTAnimation, .reactJsInspector, .reactJsInspectorNetwork, .reactJsInspectorTracing, .reactFabric, .reactFabricImage, .rctSwiftUIWrapper] + dependencies: [.reactNativeDependencies, .reactCore, .reactRCTImage, .yoga, .reactRCTText, .jsi, .reactFabricInputAccessory, .reactFabricModal, .reactFabricSwitch, .reactFabricText, .reactFabricTextInput, .reactFabricUnimplementedView, .reactFabricTextLayoutManager, .reactGraphics, .reactImageManager, .reactDebug, .reactUtils, .reactPerformanceTimeline, .reactRendererDebug, .reactRendererConsistency, .reactRuntimeScheduler, .reactRCTAnimation, .reactJsInspector, .reactJsInspectorNetwork, .reactJsInspectorTracing, .reactFabric, .reactFabricImage, .rctSwiftUIWrapper] ) /// React-ImageManagerApple.podspec @@ -711,7 +704,6 @@ let targets = [ reactFabricImage, reactFabricInputAccessory, reactFabricModal, - reactFabricSafeAreaView, reactFabricSwitch, reactFabricTextLayoutManager, reactFabricText, @@ -898,7 +890,6 @@ extension String { static let reactFabricImage = "React-FabricImage" static let reactFabricInputAccessory = "React-FabricInputAccessory" static let reactFabricModal = "React-FabricModal" - static let reactFabricSafeAreaView = "React-FabricSafeAreaView" static let reactFabricSwitch = "React-FabricSwitch" static let reactFabricTextLayoutManager = "React-FabricTextLayoutManager" static let reactFabricText = "React-FabricText" diff --git a/packages/react-native/React/Base/RCTBridge.mm b/packages/react-native/React/Base/RCTBridge.mm index 7f9a46b78d8b..e0c434258c9c 100644 --- a/packages/react-native/React/Base/RCTBridge.mm +++ b/packages/react-native/React/Base/RCTBridge.mm @@ -52,7 +52,6 @@ @"RCTDebuggingOverlayManager", @"RCTModalHostViewManager", @"RCTRefreshControlManager", - @"RCTSafeAreaViewManager", @"RCTScrollContentViewManager", @"RCTScrollViewManager", @"RCTSwitchManager", diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.h b/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.h index 6b8a6ff6d6dc..d03b01686f51 100644 --- a/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.h +++ b/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.h @@ -34,7 +34,6 @@ Class RCTDebuggingOverlayCls(void) __attribute__((used Class RCTInputAccessoryCls(void) __attribute__((used)); Class RCTParagraphCls(void) __attribute__((used)); Class RCTPullToRefreshViewCls(void) __attribute__((used)); -Class RCTSafeAreaViewCls(void) __attribute__((used)); Class RCTScrollViewCls(void) __attribute__((used)); Class RCTSwitchCls(void) __attribute__((used)); Class RCTTextInputCls(void) __attribute__((used)); diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.mm b/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.mm index 442c2e6e3962..fe9746644671 100644 --- a/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.mm +++ b/packages/react-native/React/Fabric/Mounting/ComponentViews/RCTFabricComponentsPlugins.mm @@ -23,7 +23,6 @@ {"InputAccessoryView", RCTInputAccessoryCls}, {"Paragraph", RCTParagraphCls}, {"PullToRefreshView", RCTPullToRefreshViewCls}, - {"SafeAreaView", RCTSafeAreaViewCls}, {"ScrollView", RCTScrollViewCls}, {"Switch", RCTSwitchCls}, {"TextInput", RCTTextInputCls}, diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.h b/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.h deleted file mode 100644 index 542b88cf14fa..000000000000 --- a/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.h +++ /dev/null @@ -1,21 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#import - -#import - -NS_ASSUME_NONNULL_BEGIN - -/** - * UIView class for root component. - */ -@interface RCTSafeAreaViewComponentView : RCTViewComponentView - -@end - -NS_ASSUME_NONNULL_END diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.mm b/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.mm deleted file mode 100644 index 4c05633d8cbb..000000000000 --- a/packages/react-native/React/Fabric/Mounting/ComponentViews/SafeAreaView/RCTSafeAreaViewComponentView.mm +++ /dev/null @@ -1,100 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#import "RCTSafeAreaViewComponentView.h" - -#import -#import -#import -#import "RCTConversions.h" -#import "RCTFabricComponentsPlugins.h" - -using namespace facebook::react; - -@implementation RCTSafeAreaViewComponentView { - SafeAreaViewShadowNode::ConcreteState::Shared _state; -} - -- (instancetype)initWithFrame:(CGRect)frame -{ - if (self = [super initWithFrame:frame]) { - _props = SafeAreaViewShadowNode::defaultSharedProps(); - } - - return self; -} - -- (void)safeAreaInsetsDidChange -{ - [super safeAreaInsetsDidChange]; - - [self _updateStateIfNecessary]; -} - -- (void)_updateStateIfNecessary -{ - if (!_state) { - return; - } - - UIEdgeInsets insets = self.safeAreaInsets; - insets.left = RCTRoundPixelValue(insets.left); - insets.top = RCTRoundPixelValue(insets.top); - insets.right = RCTRoundPixelValue(insets.right); - insets.bottom = RCTRoundPixelValue(insets.bottom); - - auto newPadding = RCTEdgeInsetsFromUIEdgeInsets(insets); - auto threshold = 1.0 / RCTScreenScale() + 0.01; // Size of a pixel plus some small threshold. - - _state->updateState( - [=](const SafeAreaViewShadowNode::ConcreteState::Data &oldData) - -> SafeAreaViewShadowNode::ConcreteState::SharedData { - auto oldPadding = oldData.padding; - auto deltaPadding = newPadding - oldPadding; - - if (std::abs(deltaPadding.left) < threshold && std::abs(deltaPadding.top) < threshold && - std::abs(deltaPadding.right) < threshold && std::abs(deltaPadding.bottom) < threshold) { - return nullptr; - } - - auto newData = oldData; - newData.padding = newPadding; - return std::make_shared(newData); - }); -} - -#pragma mark - RCTComponentViewProtocol - -+ (ComponentDescriptorProvider)componentDescriptorProvider -{ - return concreteComponentDescriptorProvider(); -} - -- (void)updateState:(const facebook::react::State::Shared &)state - oldState:(const facebook::react::State::Shared &)oldState -{ - _state = std::static_pointer_cast(state); -} - -- (void)finalizeUpdates:(RNComponentViewUpdateMask)updateMask -{ - [super finalizeUpdates:updateMask]; - [self _updateStateIfNecessary]; -} - -- (void)prepareForRecycle -{ - [super prepareForRecycle]; - _state.reset(); -} - -@end - -Class RCTSafeAreaViewCls(void) -{ - return RCTSafeAreaViewComponentView.class; -} diff --git a/packages/react-native/ReactAndroid/api/ReactAndroid.api b/packages/react-native/ReactAndroid/api/ReactAndroid.api index a5fa388742a7..838caf9477bc 100644 --- a/packages/react-native/ReactAndroid/api/ReactAndroid.api +++ b/packages/react-native/ReactAndroid/api/ReactAndroid.api @@ -5120,14 +5120,6 @@ public abstract interface class com/facebook/react/viewmanagers/ModalHostViewMan public abstract fun setVisible (Landroid/view/View;Z)V } -public class com/facebook/react/viewmanagers/SafeAreaViewManagerDelegate : com/facebook/react/uimanager/BaseViewManagerDelegate { - public fun (Lcom/facebook/react/uimanager/BaseViewManager;)V - public fun setProperty (Landroid/view/View;Ljava/lang/String;Ljava/lang/Object;)V -} - -public abstract interface class com/facebook/react/viewmanagers/SafeAreaViewManagerInterface : com/facebook/react/uimanager/ViewManagerWithGeneratedInterface { -} - public class com/facebook/react/viewmanagers/UnimplementedNativeViewManagerDelegate : com/facebook/react/uimanager/BaseViewManagerDelegate { public fun (Lcom/facebook/react/uimanager/BaseViewManager;)V public fun setProperty (Landroid/view/View;Ljava/lang/String;Ljava/lang/Object;)V diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/shell/MainReactPackage.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/shell/MainReactPackage.kt index 14b053b4196f..535ffb3a8fbf 100644 --- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/shell/MainReactPackage.kt +++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/shell/MainReactPackage.kt @@ -50,7 +50,6 @@ import com.facebook.react.views.drawer.ReactDrawerLayoutManager import com.facebook.react.views.image.ReactImageManager import com.facebook.react.views.modal.ReactModalHostManager import com.facebook.react.views.progressbar.ReactProgressBarViewManager -import com.facebook.react.views.safeareaview.ReactSafeAreaViewManager import com.facebook.react.views.scroll.ReactHorizontalScrollContainerViewManager import com.facebook.react.views.scroll.ReactHorizontalScrollViewManager import com.facebook.react.views.scroll.ReactNestedScrollViewManager @@ -148,7 +147,6 @@ constructor(private val config: MainPackageConfig? = null) : if (ReactNativeFeatureFlags.useNestedScrollViewAndroid()) ReactNestedScrollViewManager() else ReactScrollViewManager(), ReactSwitchManager(), - ReactSafeAreaViewManager(), SwipeRefreshLayoutManager(), // Native equivalents ReactImageManager(), @@ -178,8 +176,6 @@ constructor(private val config: MainPackageConfig? = null) : ModuleSpec.viewManagerSpec { ReactHorizontalScrollContainerViewManager() }, ReactProgressBarViewManager.REACT_CLASS to ModuleSpec.viewManagerSpec { ReactProgressBarViewManager() }, - ReactSafeAreaViewManager.REACT_CLASS to - ModuleSpec.viewManagerSpec { ReactSafeAreaViewManager() }, ReactScrollViewManager.REACT_CLASS to ModuleSpec.viewManagerSpec { if (ReactNativeFeatureFlags.useNestedScrollViewAndroid()) diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaView.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaView.kt deleted file mode 100644 index 034879ca96e7..000000000000 --- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaView.kt +++ /dev/null @@ -1,70 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -package com.facebook.react.views.safeareaview - -import android.view.ViewGroup -import androidx.annotation.UiThread -import androidx.core.graphics.Insets -import androidx.core.view.ViewCompat -import androidx.core.view.WindowInsetsCompat -import androidx.core.view.WindowInsetsCompat.CONSUMED -import com.facebook.react.bridge.GuardedRunnable -import com.facebook.react.bridge.WritableNativeMap -import com.facebook.react.common.build.ReactBuildConfig -import com.facebook.react.uimanager.PixelUtil.pxToDp -import com.facebook.react.uimanager.StateWrapper -import com.facebook.react.uimanager.ThemedReactContext - -internal class ReactSafeAreaView(val reactContext: ThemedReactContext) : ViewGroup(reactContext) { - internal var stateWrapper: StateWrapper? = null - - override fun onAttachedToWindow() { - super.onAttachedToWindow() - - ViewCompat.setOnApplyWindowInsetsListener(this) { _, windowInsets -> - val insets = - windowInsets.getInsets( - WindowInsetsCompat.Type.systemBars() or WindowInsetsCompat.Type.displayCutout(), - ) - updateState(insets) - CONSUMED - } - requestApplyInsets() - } - - override fun onLayout(p0: Boolean, p1: Int, p2: Int, p3: Int, p4: Int): Unit = Unit - - override fun shouldDelayChildPressedState(): Boolean = false - - @Suppress("DEPRECATION") - @UiThread - private fun updateState(insets: Insets) { - val sw = stateWrapper - if (sw != null) { - WritableNativeMap().apply { - putDouble("left", insets.left.toFloat().pxToDp().toDouble()) - putDouble("top", insets.top.toFloat().pxToDp().toDouble()) - putDouble("bottom", insets.bottom.toFloat().pxToDp().toDouble()) - putDouble("right", insets.right.toFloat().pxToDp().toDouble()) - - sw.updateState(this) - } - } else if (!ReactBuildConfig.UNSTABLE_ENABLE_MINIFY_LEGACY_ARCHITECTURE) { - // paper - reactContext.runOnNativeModulesQueueThread( - object : GuardedRunnable(reactContext) { - override fun runGuarded() { - this@ReactSafeAreaView.reactContext.reactApplicationContext - .getNativeModule(com.facebook.react.uimanager.UIManagerModule::class.java) - ?.updateInsetsPadding(id, insets.top, insets.left, insets.bottom, insets.right) - } - }, - ) - } - } -} diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaViewManager.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaViewManager.kt deleted file mode 100644 index 4e0c7154b88e..000000000000 --- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/safeareaview/ReactSafeAreaViewManager.kt +++ /dev/null @@ -1,53 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -package com.facebook.react.views.safeareaview - -import com.facebook.react.module.annotations.ReactModule -import com.facebook.react.uimanager.ReactStylesDiffMap -import com.facebook.react.uimanager.StateWrapper -import com.facebook.react.uimanager.ThemedReactContext -import com.facebook.react.uimanager.ViewGroupManager -import com.facebook.react.uimanager.ViewManagerDelegate -import com.facebook.react.viewmanagers.SafeAreaViewManagerDelegate -import com.facebook.react.viewmanagers.SafeAreaViewManagerInterface - -/** View manager for [ReactSafeAreaView] components. */ -@ReactModule(name = ReactSafeAreaViewManager.REACT_CLASS) -internal class ReactSafeAreaViewManager : - ViewGroupManager(), SafeAreaViewManagerInterface { - - private val delegate: ViewManagerDelegate = SafeAreaViewManagerDelegate(this) - - override fun getDelegate(): ViewManagerDelegate = delegate - - override fun createViewInstance(context: ThemedReactContext): ReactSafeAreaView = - ReactSafeAreaView(context) - - override fun getName(): String = REACT_CLASS - - @Suppress("DEPRECATION") - override fun createShadowNodeInstance(): com.facebook.react.uimanager.LayoutShadowNode = - com.facebook.react.uimanager.LayoutShadowNode() - - @Suppress("DEPRECATION") - override fun getShadowNodeClass(): Class = - com.facebook.react.uimanager.LayoutShadowNode::class.java - - override fun updateState( - view: ReactSafeAreaView, - props: ReactStylesDiffMap, - stateWrapper: StateWrapper, - ): Any? { - view.stateWrapper = stateWrapper - return null - } - - internal companion object { - const val REACT_CLASS: String = "RCTSafeAreaView" - } -} diff --git a/packages/react-native/ReactAndroid/src/main/jni/CMakeLists.txt b/packages/react-native/ReactAndroid/src/main/jni/CMakeLists.txt index 4c5be342c0bd..d2963cd779f6 100644 --- a/packages/react-native/ReactAndroid/src/main/jni/CMakeLists.txt +++ b/packages/react-native/ReactAndroid/src/main/jni/CMakeLists.txt @@ -121,7 +121,6 @@ add_react_common_subdir(react/renderer/components/text) add_react_common_subdir(react/renderer/components/unimplementedview) add_react_common_subdir(react/renderer/components/modal) add_react_common_subdir(react/renderer/components/scrollview) -add_react_common_subdir(react/renderer/components/safeareaview) add_react_common_subdir(react/renderer/leakchecker) add_react_common_subdir(react/renderer/observers/events) add_react_common_subdir(react/renderer/observers/intersection) @@ -258,7 +257,6 @@ add_library(reactnative $ $ $ - $ $ $ $ @@ -362,7 +360,6 @@ target_include_directories(reactnative $ $ $ - $ $ $ $ diff --git a/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CMakeLists.txt b/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CMakeLists.txt index 62b76deff23f..e2746bdc1c1c 100644 --- a/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CMakeLists.txt +++ b/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CMakeLists.txt @@ -35,7 +35,6 @@ target_link_libraries(react_newarchdefaults rrc_image rrc_modal rrc_progressbar - rrc_safeareaview rrc_scrollview rrc_switch rrc_text diff --git a/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CoreComponentsRegistry.cpp b/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CoreComponentsRegistry.cpp index 5eacbff0b81d..d5f46c9c7344 100644 --- a/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CoreComponentsRegistry.cpp +++ b/packages/react-native/ReactAndroid/src/main/jni/react/newarchdefaults/CoreComponentsRegistry.cpp @@ -14,7 +14,6 @@ #include #include #include -#include #include #include #include @@ -62,8 +61,6 @@ void addCoreComponents( concreteComponentDescriptorProvider()); providerRegistry->add( concreteComponentDescriptorProvider()); - providerRegistry->add( - concreteComponentDescriptorProvider()); providerRegistry->add( concreteComponentDescriptorProvider()); providerRegistry->add( diff --git a/packages/react-native/ReactCommon/React-FabricComponents.podspec b/packages/react-native/ReactCommon/React-FabricComponents.podspec index 95d9c1c4548f..64beddcf37e6 100644 --- a/packages/react-native/ReactCommon/React-FabricComponents.podspec +++ b/packages/react-native/ReactCommon/React-FabricComponents.podspec @@ -107,13 +107,6 @@ Pod::Spec.new do |s| sss.header_dir = "react/renderer/components/modal" end - ss.subspec "safeareaview" do |sss| - sss.source_files = podspec_sources("react/renderer/components/safeareaview/**/*.{m,mm,cpp,h}", "react/renderer/components/safeareaview/**/*.h") - # Exclude tests to avoid conflicts with the react-native-safe-area-context package - sss.exclude_files = "react/renderer/components/safeareaview/tests" - sss.header_dir = "react/renderer/components/safeareaview" - end - ss.subspec "text" do |sss| sss.source_files = podspec_sources(["react/renderer/components/text/*.{m,mm,cpp,h}", "react/renderer/components/text/platform/cxx/**/*.{m,mm,cpp,h}"], diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/CMakeLists.txt b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/CMakeLists.txt deleted file mode 100644 index 733778153df9..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/CMakeLists.txt +++ /dev/null @@ -1,41 +0,0 @@ -# Copyright (c) Meta Platforms, Inc. and affiliates. -# -# This source code is licensed under the MIT license found in the -# LICENSE file in the root directory of this source tree. - -cmake_minimum_required(VERSION 3.13) -set(CMAKE_VERBOSE_MAKEFILE on) - -include(${REACT_COMMON_DIR}/cmake-utils/react-native-flags.cmake) - -file(GLOB rrc_safeareaview_SRCS CONFIGURE_DEPENDS *.cpp) - -add_library( - rrc_safeareaview - STATIC - ${rrc_safeareaview_SRCS} -) - -target_include_directories(rrc_safeareaview PUBLIC .) - -target_link_libraries( - rrc_safeareaview - glog - fbjni - folly_runtime - glog_init - react_codegen_rncore - react_cxxstableapi - react_debug - react_renderer_componentregistry - react_renderer_core - react_renderer_debug - react_renderer_graphics - react_renderer_uimanager - reactnativejni - rrc_view - yoga -) - -target_compile_reactnative_options(rrc_safeareaview PRIVATE) -target_compile_options(rrc_safeareaview PRIVATE -Wpedantic) diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewComponentDescriptor.h b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewComponentDescriptor.h deleted file mode 100644 index 42ece0a34f95..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewComponentDescriptor.h +++ /dev/null @@ -1,32 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#pragma once - -#include - -#include -#include - -namespace facebook::react { - -/* - * Descriptor for component. - */ -class SafeAreaViewComponentDescriptor final : public ConcreteComponentDescriptor { - using ConcreteComponentDescriptor::ConcreteComponentDescriptor; - void adopt(ShadowNode &shadowNode) const override - { - auto &layoutableShadowNode = static_cast(shadowNode); - auto &stateData = static_cast(*shadowNode.getState()).getData(); - layoutableShadowNode.setPadding(stateData.padding); - - ConcreteComponentDescriptor::adopt(shadowNode); - } -}; - -} // namespace facebook::react diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.cpp b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.cpp deleted file mode 100644 index 52a347fba9ef..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.cpp +++ /dev/null @@ -1,15 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#include "SafeAreaViewShadowNode.h" - -namespace facebook::react { - -// NOLINTNEXTLINE(modernize-avoid-c-arrays) -const char SafeAreaViewComponentName[] = "SafeAreaView"; - -} // namespace facebook::react diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.h b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.h deleted file mode 100644 index ef9c2b668ec2..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewShadowNode.h +++ /dev/null @@ -1,30 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#pragma once - -#include - -#include -#include -#include -#include - -namespace facebook::react { - -// NOLINTNEXTLINE(modernize-avoid-c-arrays) -extern const char SafeAreaViewComponentName[]; - -/* - * `ShadowNode` for component. - */ -class SafeAreaViewShadowNode final - : public ConcreteViewShadowNode { - using ConcreteViewShadowNode::ConcreteViewShadowNode; -}; - -} // namespace facebook::react diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.cpp b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.cpp deleted file mode 100644 index 44b7721404b7..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.cpp +++ /dev/null @@ -1,19 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#include "SafeAreaViewState.h" - -namespace facebook::react { - -#ifdef ANDROID -folly::dynamic SafeAreaViewState::getDynamic() const { - return folly::dynamic::object("left", padding.left)("top", padding.top)( - "right", padding.right)("bottom", padding.bottom); -} -#endif - -} // namespace facebook::react diff --git a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.h b/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.h deleted file mode 100644 index 1d51d12d328a..000000000000 --- a/packages/react-native/ReactCommon/react/renderer/components/safeareaview/SafeAreaViewState.h +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#pragma once - -#include - -#include - -#ifdef ANDROID -#include -#endif - -namespace facebook::react { - -/* - * State for component. - */ -class SafeAreaViewState final { - public: -#ifdef ANDROID - SafeAreaViewState() = default; - - SafeAreaViewState(const SafeAreaViewState & /*previousState*/, folly::dynamic data) - : padding( - EdgeInsets{ - (Float)data["left"].getDouble(), - (Float)data["top"].getDouble(), - (Float)data["right"].getDouble(), - (Float)data["bottom"].getDouble(), - }) {}; - - folly::dynamic getDynamic() const; -#endif - - EdgeInsets padding{}; -}; - -} // namespace facebook::react diff --git a/packages/react-native/ReactNativeApi.d.ts b/packages/react-native/ReactNativeApi.d.ts index 990cc271b158..2502f39b7a8c 100644 --- a/packages/react-native/ReactNativeApi.d.ts +++ b/packages/react-native/ReactNativeApi.d.ts @@ -4,7 +4,7 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @generated SignedSource<> + * @generated SignedSource<<36aacdbc8b256097c8f8f34cd2006e94>> * * This file was generated by scripts/js-api/build-types/index.js. */ @@ -355,12 +355,6 @@ declare const requireNativeComponent_default: ( uiViewClassName: string, ) => HostComponent declare const RootTagContext: React.Context -declare const SafeAreaView: typeof SafeAreaView_default -declare const SafeAreaView_default: ( - props: ViewProps & { - ref?: React.Ref - }, -) => React.ReactNode declare const ScrollView: typeof ScrollViewWrapper & ScrollViewComponentStatics declare const ScrollViewContext_default: React.Context declare const ScrollViewWrapper: ( @@ -4255,8 +4249,6 @@ declare type SafeAreaInsets = { declare type SafeAreaInsetsChangeEvent = NativeSyntheticEvent<{ readonly insets: SafeAreaInsets }> -declare type SafeAreaView = typeof SafeAreaView -declare type SafeAreaViewInstance = HostInstance declare type ScaledSize = DisplayMetrics declare type ScheduleLocalNotificationDetails = PresentLocalNotificationDetails & { @@ -5982,8 +5974,6 @@ export { Runnables, // 4367c557 SafeAreaInsets, // 64d7a605 SafeAreaInsetsChangeEvent, // 4ffd35e5 - SafeAreaView, // dda99293 - SafeAreaViewInstance, // 2b5d4391 ScaledSize, // 07e417c7 ScrollEvent, // 956fdb27 ScrollResponderType, // 52c38666 diff --git a/packages/react-native/__typetests__/index.tsx b/packages/react-native/__typetests__/index.tsx index 75e5dce1634c..cef01c25a0ab 100644 --- a/packages/react-native/__typetests__/index.tsx +++ b/packages/react-native/__typetests__/index.tsx @@ -115,7 +115,6 @@ import { UIManager, View, ViewStyle, - SafeAreaView, VirtualizedList, findNodeHandle, requireNativeComponent, @@ -1582,31 +1581,6 @@ class BridgedComponentTest extends React.Component { } } -const SafeAreaViewTest = () => { - const viewRef = React.createRef>(); - - return ( - <> - ; - ; - { - ref?.focus(); - ref?.blur(); - ref?.measure( - (x, y, width, height, pageX, pageY): number => - x + y + width + height + pageX + pageY, - ); - ref?.measureInWindow( - (x, y, width, height): number => x + y + width + height, - ); - ref?.setNativeProps({focusable: false}); - }} - /> - - ); -}; - const SwitchRefTest = () => { const switchRef = React.createRef>(); diff --git a/packages/react-native/index.js b/packages/react-native/index.js index a86064115ca6..3a19c7724f87 100644 --- a/packages/react-native/index.js +++ b/packages/react-native/index.js @@ -118,20 +118,6 @@ module.exports = { return require('./Libraries/Components/RefreshControl/RefreshControl') .default; }, - /** - * @deprecated SafeAreaView has been deprecated and will be removed in a future release. - * Please use 'react-native-safe-area-context' instead. - * See https://github.com/AppAndFlow/react-native-safe-area-context - */ - get SafeAreaView() { - warnOnce( - 'safe-area-view-deprecated', - 'SafeAreaView has been deprecated and will be removed in a future release. ' + - "Please use 'react-native-safe-area-context' instead. " + - 'See https://github.com/AppAndFlow/react-native-safe-area-context', - ); - return require('./Libraries/Components/SafeAreaView/SafeAreaView').default; - }, get ScrollView() { return require('./Libraries/Components/ScrollView/ScrollView').default; }, diff --git a/packages/react-native/index.js.flow b/packages/react-native/index.js.flow index 1bf4e01d9788..8dd55c3cd126 100644 --- a/packages/react-native/index.js.flow +++ b/packages/react-native/index.js.flow @@ -108,9 +108,6 @@ export type { } from './Libraries/Components/RefreshControl/RefreshControl'; export {default as RefreshControl} from './Libraries/Components/RefreshControl/RefreshControl'; -export type {SafeAreaViewInstance} from './Libraries/Components/SafeAreaView/SafeAreaView'; -export {default as SafeAreaView} from './Libraries/Components/SafeAreaView/SafeAreaView'; - export type { ScrollViewImperativeMethods, ScrollViewInstance, diff --git a/packages/react-native/scripts/ios-prebuild/headers-config.js b/packages/react-native/scripts/ios-prebuild/headers-config.js index 61addbc7a4c4..d7719f6126f6 100644 --- a/packages/react-native/scripts/ios-prebuild/headers-config.js +++ b/packages/react-native/scripts/ios-prebuild/headers-config.js @@ -381,13 +381,6 @@ const PodspecExceptions /*: {[key: string]: PodSpecConfiguration} */ = { headerDir: 'react/renderer/components/modal', }, - { - name: 'safeareaview', - headerPatterns: ['react/renderer/components/safeareaview/**/*.h'], - excludePatterns: ['react/renderer/components/safeareaview/tests'], - headerDir: 'react/renderer/components/safeareaview', - }, - { name: 'scrollview', headerPatterns: [ diff --git a/packages/react-native/src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent.js b/packages/react-native/src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent.js deleted file mode 100644 index 0e5ef68ef9ed..000000000000 --- a/packages/react-native/src/private/components/safeareaview/specs/RCTSafeAreaViewNativeComponent.js +++ /dev/null @@ -1,27 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow strict-local - * @format - */ - -import type {ViewProps} from '../../../../../Libraries/Components/View/ViewPropTypes'; -import type {HostComponent} from '../../../types/HostComponent'; - -import codegenNativeComponent from '../../../../../Libraries/Utilities/codegenNativeComponent'; - -type RCTSafeAreaViewNativeProps = Readonly<{ - ...ViewProps, - - // No props -}>; - -export default codegenNativeComponent( - 'SafeAreaView', - { - interfaceOnly: true, - }, -) as HostComponent; diff --git a/packages/react-native/types_DEPRECATED/Libraries/Components/SafeAreaView/SafeAreaView.d.ts b/packages/react-native/types_DEPRECATED/Libraries/Components/SafeAreaView/SafeAreaView.d.ts deleted file mode 100644 index 590928373daf..000000000000 --- a/packages/react-native/types_DEPRECATED/Libraries/Components/SafeAreaView/SafeAreaView.d.ts +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @format - */ - -import type * as React from 'react'; -import {Constructor} from '../../../private/Utilities'; -import {HostInstance} from '../../../public/ReactNativeTypes'; -import {ViewProps} from '../View/ViewPropTypes'; - -/** - * @deprecated - * Use `react-native-safe-area-context` instead. This component is deprecated and will be removed in a future release. - * - * Renders nested content and automatically applies paddings reflect the portion of the view - * that is not covered by navigation bars, tab bars, toolbars, and other ancestor views. - * Moreover, and most importantly, Safe Area's paddings reflect physical limitation of the screen, - * such as rounded corners or camera notches (aka sensor housing area on iPhone X). - */ -declare class SafeAreaViewComponent extends React.Component {} - -declare const SafeAreaViewBase: Constructor & - typeof SafeAreaViewComponent; - -/** - * @deprecated - * Use `react-native-safe-area-context` instead. This component is deprecated and will be removed in a future release. - */ -export class SafeAreaView extends SafeAreaViewBase {} diff --git a/packages/react-native/types_DEPRECATED/index.d.ts b/packages/react-native/types_DEPRECATED/index.d.ts index a98e1f004510..77884d22816e 100644 --- a/packages/react-native/types_DEPRECATED/index.d.ts +++ b/packages/react-native/types_DEPRECATED/index.d.ts @@ -89,7 +89,6 @@ export * from './Libraries/Components/LayoutConformance/LayoutConformance'; export * from './Libraries/Components/Pressable/Pressable'; export * from './Libraries/Components/ProgressBarAndroid/ProgressBarAndroid'; export * from './Libraries/Components/RefreshControl/RefreshControl'; -export * from './Libraries/Components/SafeAreaView/SafeAreaView'; export * from './Libraries/Components/ScrollView/ScrollView'; export * from './Libraries/Components/StatusBar/StatusBar'; export * from './Libraries/Components/Switch/Switch'; diff --git a/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js b/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js deleted file mode 100644 index 0acfd5776968..000000000000 --- a/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js +++ /dev/null @@ -1,103 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow strict-local - * @format - */ - -'use strict'; - -import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; - -import RNTesterText from '../../components/RNTesterText'; -import * as React from 'react'; -import {useState} from 'react'; -import {Button, DeviceInfo, Modal, StyleSheet, View} from 'react-native'; - -function SafeAreaViewExample(): React.Node { - const {SafeAreaView} = require('react-native'); - const [modalVisible, setModalVisible] = useState(false); - - const toggleModal = (visible: boolean) => { - setModalVisible(visible); - }; - - return ( - - toggleModal(false)} - animationType="slide" - supportedOrientations={['portrait', 'landscape']}> - - - -