From 2e75e28a77a706a7df9aa30927c02f374a728122 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 13:36:13 +0200
Subject: [PATCH 01/10] Add onInsetsChange prop to SafeAreaView

---
 .../Components/SafeAreaView/SafeAreaView.ios.js   | 15 ++++++++++++++-
 RNTester/js/SafeAreaViewExample.js                | 13 ++++++++++++-
 React/Views/SafeAreaView/RCTSafeAreaView.m        | 14 ++++++++++++++
 React/Views/SafeAreaView/RCTSafeAreaViewManager.m |  2 ++
 4 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 5fb0406b8d5125..31f1ae7b6ae288 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -4,6 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @providesModule SafeAreaView
  * @flow
  * @format
  */
@@ -12,12 +13,18 @@ const React = require('React');
 const ViewPropTypes = require('ViewPropTypes');
 const requireNativeComponent = require('requireNativeComponent');
 
+import PropTypes from 'prop-types';
 import type {ViewProps} from 'ViewPropTypes';
 
-const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
+const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView', {
+  nativeOnly: {
+    onInsetsChange: PropTypes.func,
+  },
+});
 
 type Props = ViewProps & {
   children: any,
+  onInsetsChange?: ?Function,
 };
 
 /**
@@ -29,6 +36,12 @@ type Props = ViewProps & {
 class SafeAreaView extends React.Component<Props> {
   static propTypes = {
     ...ViewPropTypes,
+    /**
+     * Callback that is called when the safe area view insets changed.
+     * This will be called with
+     * `{ nativeEvent: { insets: { left, top, right, bottom } } }`.
+     */
+    onInsetsChange: PropTypes.func,
   };
 
   render() {
diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index 927a26651a4f8f..1c50b358c4664d 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -30,12 +30,17 @@ class SafeAreaViewExample extends React.Component<
 > {
   state = {
     modalVisible: false,
+    safeAreaViewInsets: undefined,
   };
 
   _setModalVisible = visible => {
     this.setState({modalVisible: visible});
   };
 
+  _onSafeAreaViewInsetsChange = event => {
+    this.setState({insets: event.nativeEvent.insets});
+  };
+
   render() {
     return (
       <View>
@@ -45,8 +50,14 @@ class SafeAreaViewExample extends React.Component<
           animationType="slide"
           supportedOrientations={['portrait', 'landscape']}>
           <View style={styles.modal}>
-            <SafeAreaView style={styles.safeArea}>
+            <SafeAreaView
+              style={styles.safeArea}
+              onInsetsChange={this._onSafeAreaViewInsetsChange}>
               <View style={styles.safeAreaContent}>
+                <Text>
+                  {this.state.insets &&
+                    `safeAreaViewInsets:\n${JSON.stringify(this.state.insets)}`}
+                </Text>
                 <Button
                   onPress={this._setModalVisible.bind(this, false)}
                   title="Close"
diff --git a/React/Views/SafeAreaView/RCTSafeAreaView.m b/React/Views/SafeAreaView/RCTSafeAreaView.m
index e4fe4b6d17146a..7496a3377ed814 100644
--- a/React/Views/SafeAreaView/RCTSafeAreaView.m
+++ b/React/Views/SafeAreaView/RCTSafeAreaView.m
@@ -12,6 +12,12 @@
 
 #import "RCTSafeAreaViewLocalData.h"
 
+@interface RCTSafeAreaView ()
+
+@property (nonatomic, copy) RCTBubblingEventBlock onInsetsChange;
+
+@end
+
 @implementation RCTSafeAreaView {
   __weak RCTBridge *_bridge;
   UIEdgeInsets _currentSafeAreaInsets;
@@ -56,6 +62,14 @@ - (void)safeAreaInsetsDidChange
   RCTSafeAreaViewLocalData *localData =
     [[RCTSafeAreaViewLocalData alloc] initWithInsets:safeAreaInsets];
   [_bridge.uiManager setLocalData:localData forView:self];
+
+  if (_onInsetsChange) {
+    _onInsetsChange(@{ @"insets": @{
+                           @"left": @(safeAreaInsets.left),
+                           @"top": @(safeAreaInsets.top),
+                           @"right": @(safeAreaInsets.right),
+                           @"bottom": @(safeAreaInsets.right) } });
+  }
 }
 
 #endif
diff --git a/React/Views/SafeAreaView/RCTSafeAreaViewManager.m b/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
index 6bc64562358ccc..9a50769dcb43d4 100644
--- a/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
+++ b/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
@@ -25,4 +25,6 @@ - (RCTSafeAreaShadowView *)shadowView
   return [RCTSafeAreaShadowView new];
 }
 
+RCT_EXPORT_VIEW_PROPERTY(onInsetsChange, RCTBubblingEventBlock)
+
 @end

From 982f893c79bc1a7566b848e2505975f60e576822 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 13:44:22 +0200
Subject: [PATCH 02/10] Remove @providesModule

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 31f1ae7b6ae288..97444e3896b493 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -4,7 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @providesModule SafeAreaView
  * @flow
  * @format
  */

From 26a8d5c911f58667935bc8fc53b47522d8cd58e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 22:32:54 +0200
Subject: [PATCH 03/10] Fix issues to pass Flow tests

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 11 ++++-------
 RNTester/js/SafeAreaViewExample.js                    |  9 +++++++--
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 97444e3896b493..4548d65cc3e216 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -15,16 +15,13 @@ const requireNativeComponent = require('requireNativeComponent');
 import PropTypes from 'prop-types';
 import type {ViewProps} from 'ViewPropTypes';
 
-const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView', {
-  nativeOnly: {
-    onInsetsChange: PropTypes.func,
-  },
-});
+const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
 
-type Props = ViewProps & {
+type Props = $ReadOnly<{|
+  ...ViewProps,
   children: any,
   onInsetsChange?: ?Function,
-};
+|}>;
 
 /**
  * Renders nested content and automatically applies paddings reflect the portion of the view
diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index 1c50b358c4664d..aa890c7afefa57 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -24,13 +24,18 @@ exports.title = '<SafeAreaView>';
 exports.description =
   'SafeAreaView automatically applies paddings reflect the portion of the view that is not covered by other (special) ancestor views.';
 
+type Insets = {left: number, top: number, right: number, bottom: number} | void;
+
 class SafeAreaViewExample extends React.Component<
   {},
-  {|modalVisible: boolean|},
+  {|
+    modalVisible: boolean,
+    insets: Insets,
+  |},
 > {
   state = {
     modalVisible: false,
-    safeAreaViewInsets: undefined,
+    insets: undefined,
   };
 
   _setModalVisible = visible => {

From 70c6055a5cd983db7e24bb01f9992149973794f1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 13:36:13 +0200
Subject: [PATCH 04/10] Add onInsetsChange prop to SafeAreaView

---
 .../Components/SafeAreaView/SafeAreaView.ios.js   | 15 ++++++++++++++-
 RNTester/js/SafeAreaViewExample.js                | 13 ++++++++++++-
 React/Views/SafeAreaView/RCTSafeAreaView.m        | 14 ++++++++++++++
 React/Views/SafeAreaView/RCTSafeAreaViewManager.m |  2 ++
 4 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 5fb0406b8d5125..31f1ae7b6ae288 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -4,6 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
+ * @providesModule SafeAreaView
  * @flow
  * @format
  */
@@ -12,12 +13,18 @@ const React = require('React');
 const ViewPropTypes = require('ViewPropTypes');
 const requireNativeComponent = require('requireNativeComponent');
 
+import PropTypes from 'prop-types';
 import type {ViewProps} from 'ViewPropTypes';
 
-const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
+const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView', {
+  nativeOnly: {
+    onInsetsChange: PropTypes.func,
+  },
+});
 
 type Props = ViewProps & {
   children: any,
+  onInsetsChange?: ?Function,
 };
 
 /**
@@ -29,6 +36,12 @@ type Props = ViewProps & {
 class SafeAreaView extends React.Component<Props> {
   static propTypes = {
     ...ViewPropTypes,
+    /**
+     * Callback that is called when the safe area view insets changed.
+     * This will be called with
+     * `{ nativeEvent: { insets: { left, top, right, bottom } } }`.
+     */
+    onInsetsChange: PropTypes.func,
   };
 
   render() {
diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index be7ce97fa3b6aa..38202fdcf50366 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -30,12 +30,17 @@ class SafeAreaViewExample extends React.Component<
 > {
   state = {
     modalVisible: false,
+    safeAreaViewInsets: undefined,
   };
 
   _setModalVisible = visible => {
     this.setState({modalVisible: visible});
   };
 
+  _onSafeAreaViewInsetsChange = event => {
+    this.setState({insets: event.nativeEvent.insets});
+  };
+
   render() {
     return (
       <View>
@@ -45,8 +50,14 @@ class SafeAreaViewExample extends React.Component<
           animationType="slide"
           supportedOrientations={['portrait', 'landscape']}>
           <View style={styles.modal}>
-            <SafeAreaView style={styles.safeArea}>
+            <SafeAreaView
+              style={styles.safeArea}
+              onInsetsChange={this._onSafeAreaViewInsetsChange}>
               <View style={styles.safeAreaContent}>
+                <Text>
+                  {this.state.insets &&
+                    `safeAreaViewInsets:\n${JSON.stringify(this.state.insets)}`}
+                </Text>
                 <Button
                   onPress={this._setModalVisible.bind(this, false)}
                   title="Close"
diff --git a/React/Views/SafeAreaView/RCTSafeAreaView.m b/React/Views/SafeAreaView/RCTSafeAreaView.m
index e4fe4b6d17146a..7496a3377ed814 100644
--- a/React/Views/SafeAreaView/RCTSafeAreaView.m
+++ b/React/Views/SafeAreaView/RCTSafeAreaView.m
@@ -12,6 +12,12 @@
 
 #import "RCTSafeAreaViewLocalData.h"
 
+@interface RCTSafeAreaView ()
+
+@property (nonatomic, copy) RCTBubblingEventBlock onInsetsChange;
+
+@end
+
 @implementation RCTSafeAreaView {
   __weak RCTBridge *_bridge;
   UIEdgeInsets _currentSafeAreaInsets;
@@ -56,6 +62,14 @@ - (void)safeAreaInsetsDidChange
   RCTSafeAreaViewLocalData *localData =
     [[RCTSafeAreaViewLocalData alloc] initWithInsets:safeAreaInsets];
   [_bridge.uiManager setLocalData:localData forView:self];
+
+  if (_onInsetsChange) {
+    _onInsetsChange(@{ @"insets": @{
+                           @"left": @(safeAreaInsets.left),
+                           @"top": @(safeAreaInsets.top),
+                           @"right": @(safeAreaInsets.right),
+                           @"bottom": @(safeAreaInsets.right) } });
+  }
 }
 
 #endif
diff --git a/React/Views/SafeAreaView/RCTSafeAreaViewManager.m b/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
index 6bc64562358ccc..9a50769dcb43d4 100644
--- a/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
+++ b/React/Views/SafeAreaView/RCTSafeAreaViewManager.m
@@ -25,4 +25,6 @@ - (RCTSafeAreaShadowView *)shadowView
   return [RCTSafeAreaShadowView new];
 }
 
+RCT_EXPORT_VIEW_PROPERTY(onInsetsChange, RCTBubblingEventBlock)
+
 @end

From 758ae934363b32fc384a395c6a8f387ad150f4e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 13:44:22 +0200
Subject: [PATCH 05/10] Remove @providesModule

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 31f1ae7b6ae288..97444e3896b493 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -4,7 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @providesModule SafeAreaView
  * @flow
  * @format
  */

From 59faec288ca3246bb3e953d9418364f09bc165db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 8 Jun 2018 22:32:54 +0200
Subject: [PATCH 06/10] Fix issues to pass Flow tests

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 11 ++++-------
 RNTester/js/SafeAreaViewExample.js                    |  9 +++++++--
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 97444e3896b493..4548d65cc3e216 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -15,16 +15,13 @@ const requireNativeComponent = require('requireNativeComponent');
 import PropTypes from 'prop-types';
 import type {ViewProps} from 'ViewPropTypes';
 
-const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView', {
-  nativeOnly: {
-    onInsetsChange: PropTypes.func,
-  },
-});
+const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
 
-type Props = ViewProps & {
+type Props = $ReadOnly<{|
+  ...ViewProps,
   children: any,
   onInsetsChange?: ?Function,
-};
+|}>;
 
 /**
  * Renders nested content and automatically applies paddings reflect the portion of the view
diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index 38202fdcf50366..c1ff698fee9c6b 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -24,13 +24,18 @@ exports.title = '<SafeAreaView>';
 exports.description =
   'SafeAreaView automatically applies paddings reflect the portion of the view that is not covered by other (special) ancestor views.';
 
+type Insets = {left: number, top: number, right: number, bottom: number} | void;
+
 class SafeAreaViewExample extends React.Component<
   {},
-  {|modalVisible: boolean|},
+  {|
+    modalVisible: boolean,
+    insets: Insets,
+  |},
 > {
   state = {
     modalVisible: false,
-    safeAreaViewInsets: undefined,
+    insets: undefined,
   };
 
   _setModalVisible = visible => {

From c2d4cb6618cc1808cabcf011314ed132add80968 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Tue, 7 Aug 2018 18:08:54 +0200
Subject: [PATCH 07/10] Fix `children` is missing in props flow test error

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 4548d65cc3e216..a9f0dcf0aad92b 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -19,7 +19,7 @@ const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
 
 type Props = $ReadOnly<{|
   ...ViewProps,
-  children: any,
+  children?: any,
   onInsetsChange?: ?Function,
 |}>;
 

From ca61a6b116a26d01a3ea4a3fddb32a9914e54c21 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 10 Aug 2018 11:24:22 +0200
Subject: [PATCH 08/10] A better children PropType

---
 Libraries/Components/SafeAreaView/SafeAreaView.ios.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index a9f0dcf0aad92b..19ce62a6939aac 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -19,7 +19,7 @@ const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
 
 type Props = $ReadOnly<{|
   ...ViewProps,
-  children?: any,
+  children?: ?React.Node,
   onInsetsChange?: ?Function,
 |}>;
 

From 1a93364d942cab498ac5e17390d5f8cf68236551 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cl=C3=A9ment=20cyril?= <cyril@clmntcrl.io>
Date: Fri, 24 Aug 2018 09:52:31 +0200
Subject: [PATCH 09/10] Better Flow type for onInsetsChange

---
 .../Components/SafeAreaView/SafeAreaView.ios.js   |  3 ++-
 Libraries/Types/CoreEventTypes.js                 | 15 ++++++++++++++-
 RNTester/js/SafeAreaViewExample.js                |  6 +++---
 3 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
index 4c591a7c3a515a..4519f95da2749a 100644
--- a/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
+++ b/Libraries/Components/SafeAreaView/SafeAreaView.ios.js
@@ -15,13 +15,14 @@ const requireNativeComponent = require('requireNativeComponent');
 
 import PropTypes from 'prop-types';
 import type {ViewProps} from 'ViewPropTypes';
+import type {InsetsChangeEvent} from 'CoreEventTypes';
 
 const RCTSafeAreaView = requireNativeComponent('RCTSafeAreaView');
 
 type Props = $ReadOnly<{|
   ...ViewProps,
   children?: ?React.Node,
-  onInsetsChange?: ?Function,
+  onInsetsChange?: ?(event: InsetsChangeEvent) => Promise<void> | void,
 |}>;
 
 /**
diff --git a/Libraries/Types/CoreEventTypes.js b/Libraries/Types/CoreEventTypes.js
index 58a0cc5eda06dc..68e216c750df8d 100644
--- a/Libraries/Types/CoreEventTypes.js
+++ b/Libraries/Types/CoreEventTypes.js
@@ -26,7 +26,7 @@ export type SyntheticEvent<T> = $ReadOnly<{|
   persist: () => void,
   target: ?number,
   timeStamp: number,
-  type: ?string,
+  type?: ?string,
 |}>;
 
 export type Layout = $ReadOnly<{|
@@ -86,3 +86,16 @@ export type SwitchChangeEvent = SyntheticEvent<
     value: boolean,
   |}>,
 >;
+
+export type Insets = $ReadOnly<{|
+  left: number,
+  top: number,
+  right: number,
+  bottom: number,
+|}>;
+
+export type InsetsChangeEvent = SyntheticEvent<
+  $ReadOnly<{|
+    insets: Insets,
+  |}>,
+>;
diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index 5acdc5cccea777..621dba093875de 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -18,19 +18,19 @@ const StyleSheet = require('StyleSheet');
 const Text = require('Text');
 const View = require('View');
 
+import type {Insets} from 'CoreEventTypes';
+
 exports.displayName = (undefined: ?string);
 exports.framework = 'React';
 exports.title = '<SafeAreaView>';
 exports.description =
   'SafeAreaView automatically applies paddings reflect the portion of the view that is not covered by other (special) ancestor views.';
 
-type Insets = {left: number, top: number, right: number, bottom: number} | void;
-
 class SafeAreaViewExample extends React.Component<
   {},
   {|
     modalVisible: boolean,
-    insets: Insets,
+    insets: ?Insets,
   |},
 > {
   state = {

From c9b52f75e6dd0aa5559f9dcbd6cdf3858913f6c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A9ctor=20Ramos?=
 <165856+hramos@users.noreply.github.com>
Date: Wed, 27 Mar 2019 14:46:05 -0700
Subject: [PATCH 10/10] Update SafeAreaViewExample.js

---
 RNTester/js/SafeAreaViewExample.js | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/RNTester/js/SafeAreaViewExample.js b/RNTester/js/SafeAreaViewExample.js
index c1b0e5ceb1c0e9..e3983296d56b56 100644
--- a/RNTester/js/SafeAreaViewExample.js
+++ b/RNTester/js/SafeAreaViewExample.js
@@ -21,12 +21,6 @@ const View = require('View');
 
 import type {Insets} from 'CoreEventTypes';
 
-exports.displayName = (undefined: ?string);
-exports.framework = 'React';
-exports.title = '<SafeAreaView>';
-exports.description =
-  'SafeAreaView automatically applies paddings reflect the portion of the view that is not covered by other (special) ancestor views.';
-
 class SafeAreaViewExample extends React.Component<
   {},
   {|