From 1dcbf41725a7296c0a0f33c4e0cc3a11e8780889 Mon Sep 17 00:00:00 2001
From: Dong-Hwan Kim <donghwan08@gmail.com>
Date: Wed, 24 Jul 2024 02:25:08 -0700
Subject: [PATCH] fix: add missing `submitBehavior` prop type and mark
 `blurOnSubmit` prop as deprecated in typescript declaration file of TextInput
 (#45588)

Summary:
Hi, I just found out that https://github.com/facebook/react-native/pull/33653 adds a new prop in `TextInput` that enables multiline `TextInput` be able to submit without blurring.

It does that by adding a new prop called `submitBehavior` which accepts `'submit' | 'blurAndSubmit' | 'newline'`:
https://github.com/facebook/react-native/blob/700b403e06fdcbcde2a4ade9570eb572431487ea/packages/react-native/Libraries/Components/TextInput/TextInput.js#L195

https://github.com/facebook/react-native/blob/700b403e06fdcbcde2a4ade9570eb572431487ea/packages/react-native/Libraries/Components/TextInput/TextInput.js#L910-L928

It also marks `blurOnSubmit` prop as deprecated since it can now be handled from `submitBehavior`:
https://github.com/facebook/react-native/blob/700b403e06fdcbcde2a4ade9570eb572431487ea/packages/react-native/Libraries/Components/TextInput/TextInput.js#L896-L908

However, that PR doesn't update `TextInput.d.ts` file which results Typescript to complain that the type doesn't exist:
<img width="760" alt="text_input_error" src="https://github.com/user-attachments/assets/2235cb36-1e4e-4ec9-a8b0-c09728a3336f">

So this PR adds and updates the types in declaration file to support them in Typescript
<img width="520" alt="fixed" src="https://github.com/user-attachments/assets/a7a3a0c4-9f3e-4644-bfac-ae60ac21d0f7">

## Changelog:

[GENERAL] [FIXED] - add missing `submitBehavior` prop and mark `blurOnSubmit` prop as deprecated in Typescript declaration file of `TextInput`

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

Test Plan:
Before:
<img width="295" alt="before" src="https://github.com/user-attachments/assets/90ed0cd1-c127-4667-bf72-6b5317ea4dd6">

After:
<img width="589" alt="after1" src="https://github.com/user-attachments/assets/826002a4-45dc-4f97-882d-7622238ac766">

<img width="833" alt="after2" src="https://github.com/user-attachments/assets/467eeecd-4b0b-4740-ac78-253e3c7aa901">

Reviewed By: christophpurrer

Differential Revision: D60107516

Pulled By: dmytrorykun

fbshipit-source-id: ce79e41aefc1ef39dc1d44179405cf6a8d5e12de
---
 .../Components/TextInput/TextInput.d.ts       | 34 +++++++++++++++++--
 1 file changed, 32 insertions(+), 2 deletions(-)

diff --git a/packages/react-native/Libraries/Components/TextInput/TextInput.d.ts b/packages/react-native/Libraries/Components/TextInput/TextInput.d.ts
index 0aa50fe80fc..75837e34171 100644
--- a/packages/react-native/Libraries/Components/TextInput/TextInput.d.ts
+++ b/packages/react-native/Libraries/Components/TextInput/TextInput.d.ts
@@ -90,6 +90,8 @@ type DataDetectorTypes =
   | 'none'
   | 'all';
 
+export type SubmitBehavior = 'submit' | 'blurAndSubmit' | 'newline';
+
 /**
  * DocumentSelectionState is responsible for maintaining selection information
  * for a document.
@@ -649,11 +651,39 @@ export interface TextInputProps
   autoFocus?: boolean | undefined;
 
   /**
-   * If true, the text field will blur when submitted.
-   * The default value is true.
+   * If `true`, the text field will blur when submitted.
+   * The default value is true for single-line fields and false for
+   * multiline fields. Note that for multiline fields, setting `blurOnSubmit`
+   * to `true` means that pressing return will blur the field and trigger the
+   * `onSubmitEditing` event instead of inserting a newline into the field.
+   *
+   * @deprecated
+   * Note that `submitBehavior` now takes the place of `blurOnSubmit` and will
+   * override any behavior defined by `blurOnSubmit`.
+   * @see submitBehavior
    */
   blurOnSubmit?: boolean | undefined;
 
+  /**
+   * When the return key is pressed,
+   *
+   * For single line inputs:
+   *
+   * - `'newline`' defaults to `'blurAndSubmit'`
+   * - `undefined` defaults to `'blurAndSubmit'`
+   *
+   * For multiline inputs:
+   *
+   * - `'newline'` adds a newline
+   * - `undefined` defaults to `'newline'`
+   *
+   * For both single line and multiline inputs:
+   *
+   * - `'submit'` will only send a submit event and not blur the input
+   * - `'blurAndSubmit`' will both blur the input and send a submit event
+   */
+  submitBehavior?: SubmitBehavior | undefined;
+
   /**
    * If true, caret is hidden. The default value is false.
    */