From 9c5e177a79c64c77f281ce727538973e8222e975 Mon Sep 17 00:00:00 2001
From: Jeffrey Hyer <jeffrey.hyer@rainfocus.com>
Date: Tue, 23 Nov 2021 18:14:04 -0800
Subject: [PATCH] Fix how KeyboardAvoidingView handles the onLayout prop.
 (#32609)

Summary:
Resolves https://github.com/facebook/react-native/issues/32608

This PR updates the `KeyboardAvoidingView` to correctly handle the `onLayout` prop.

## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->

[General] [Fixed] - `onLayout` prop is handled correctly in `<KeyboardAvoidingView>`

Pull Request resolved: https://github.com/facebook/react-native/pull/32609

Test Plan:
| Current Behavior with the `onLayout` prop specified | After applying fix |
|---|---|
| ![Simulator Screen Recording - iPhone 11 - 2021-11-17 at 14 44 09](https://user-images.githubusercontent.com/1406082/142287541-0dbcf137-4d72-4ab6-9367-ac42bdf5aed9.gif) | ![Simulator Screen Recording - iPhone 11 - 2021-11-17 at 14 44 28](https://user-images.githubusercontent.com/1406082/142287611-c7424a6c-b590-48f7-8d74-e96543eab41c.gif) |

Reviewed By: kacieb

Differential Revision: D32481315

Pulled By: philIip

fbshipit-source-id: 2f65440f4996152e4133211136f2920026149ee9
---
 Libraries/Components/Keyboard/KeyboardAvoidingView.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index 3de920aa843a5e..1b25f0795a4892 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -101,6 +101,10 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
     if (wasFrameNull) {
       this._updateBottomIfNecesarry();
     }
+
+    if (this.props.onLayout) {
+      this.props.onLayout(event);
+    }
   };
 
   _updateBottomIfNecesarry = () => {
@@ -157,6 +161,8 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
       // eslint-disable-next-line no-unused-vars
       keyboardVerticalOffset = 0,
       style,
+      // eslint-disable-next-line no-unused-vars
+      onLayout,
       ...props
     } = this.props;
     const bottomHeight = enabled === true ? this.state.bottom : 0;