Commit Graph

296 Commits

Author SHA1 Message Date
Gabriel Donadel Dall'Agnol de75a7a22e feat: Add readOnly prop to TextInput component (#34444)
Summary:
This adds the `readOnly` prop to  TextInput as requested on https://github.com/facebook/react-native/issues/34424 mapping the existing `editable` prop to `readOnly` so that `readOnly={false}` maps to `editable={true}` and `readOnly={true}` represents ` editable={false}`. This PR also updates the TextInputExample on the RNTest in order to facilitate the manual QA of this.

## Changelog

[General] [Added] - Add readOnly prop to TextInput component

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

Test Plan:
1. Open the RNTester app and navigate to the TextInput page
2. Test the `TextInput` component through the `Editable and Read only` section

https://user-images.githubusercontent.com/11707729/185295132-036443c8-1d5e-4567-a15e-5f1173cb0526.mov

Reviewed By: lunaleaps

Differential Revision: D38912786

Pulled By: necolas

fbshipit-source-id: faeb59ed8695732be682ec55406a2de0cb7e619a
2022-08-23 18:50:51 -07:00
Tony Du 1e3cb91707 Allow multiline TextInputs be submittable without blurring (#33653)
Summary:
For multiline TextInputs, it's possible to send the submit event when pressing the return key only with `blurOnSubmit`. However, there's currently no way to do so without blurring the input and dismissing the keyboard. This problem is apparent when we want to use a TextInput to span multiple lines but still have it be submittable (but not blurrable), like one might want for a TODO list.

![multiline-momentary-blur](https://user-images.githubusercontent.com/22553678/163596940-aae779f5-4d2a-4425-8ed0-e4aa77b90699.gif)

## 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] [Added] - Add `returnKeyAction` prop to `TextInput` component
[General] [Deprecated] - Remove usages of `blurOnSubmit` in native code and convert `blurOnSubmit` to `returnKeyAction` in the JavaScript conversion layer

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

Test Plan:
Verified old usages of combinations of `blurOnSubmit` and `multiline` matched previous behavior and that the new `returnKeyAction` prop behaves as expected.

| Android | iOS |
| --- | -- |
| ![android-returnkeyaction-test](https://user-images.githubusercontent.com/22553678/163597864-2e306f98-7b6e-4ddf-8a35-625d397d3dce.gif) | ![ios-returnkeyaction-test](https://user-images.githubusercontent.com/22553678/163598407-9e059f74-3549-4b46-8e03-c19bfaa6dd3d.gif)  |

With the changes, the TODO list example from before now looks like this:

![multiline-no-momentary-blur](https://user-images.githubusercontent.com/22553678/163598810-f3a71d62-5514-486e-bf6a-79169fe86378.gif)

Reviewed By: yungsters

Differential Revision: D35735249

Pulled By: makovkastar

fbshipit-source-id: 1f2237a2a5e11dd141165d7568c91c9824bd6f25
2022-07-22 13:08:45 -07:00
Garrett Forbes Monroe 191eb62edb Revert D37801394: Multisect successfully blamed D37801394 for test or build failures
Summary:
This diff is reverting D37801394 (https://github.com/facebook/react-native/commit/51f49ca9982f24de08f5a5654a5210e547bb5b86)
D37801394 (https://github.com/facebook/react-native/commit/51f49ca9982f24de08f5a5654a5210e547bb5b86) has been identified to be causing the following test or build failures:
Tests affected:
- https://www.internalfb.com/intern/test/844424989736255/

Here's the Multisect link:
https://www.internalfb.com/intern/testinfra/multisect/1062919
Here are the tasks that are relevant to this breakage:
T116036972: 105 tests started failing for oncall bridgeless_jest_e2e_tests in the last 2 weeks
We're generating a revert to back out the changes in this diff, please note the backout may land if someone accepts it.

**To Address Land blocker from previous version (see pic):**
{F752642767}

```
Changelog:
[General][Change] - Revert breaking change in MPay order creation screen (user input in duplicated, and then not deletable. See T126127801 for more details)
```

Reviewed By: philIip

Differential Revision: D37863306

fbshipit-source-id: 24f2448d7bc9761ec31edd6f6b97c668171027d3
2022-07-15 08:20:20 -07:00
George Zahariev f392ba6725 Codemod {...null} to {} in xplat/js
Summary:
Now that [exact_empty_objects has been enabled](https://fb.workplace.com/groups/flowlang/posts/1092665251339137), we can codemod `{...null}` to `{}` - they are now equivalent.

1) Run my one-off jscodeshift codemod
2) `scripts/flow/tool update-suppressions .` (as some suppressions move around due to the change)

drop-conflicts

Reviewed By: bradzacher

Differential Revision: D37834078

fbshipit-source-id: 6bf4913910e5597e5dd9d5161cd35deece6a7581
2022-07-14 17:00:28 -07:00
Nick Gerleman 51f49ca998 Fix TextInput dropping text when used as uncontrolled component with defaultValue
Summary:
A layout-impacting style change will trigger a layout effect hook within `TextInput`. This hook fires a ViewManager command to set the text input based on the known JS value: https://github.com/facebook/react-native/blob/d82cd3cbce1597512bb2868fde49b5b3850892a0/Libraries/Components/TextInput/TextInput.js#L1009

The JS value is determined using `value` if set, falling back to `defaultValue`. If a component uses `TextInput` as an uncontrolled component, and does not set this value, the command wipes text input back to the default value. This does not happen on re-render of the JS side, despite setting text prop, since the underlying native property never changes/triggers a rerender.

This change alters the logic to prefer `lastNativeText` instead of `defaultValue` when available, to retain the updated `TextInput` content on relayout.

Reviewed By: javache

Differential Revision: D37801394

fbshipit-source-id: d56c719d56bebac64553c731ce9fca8efc7feae9
2022-07-13 16:41:17 -07:00
Hetan Thakkar 2fb107c9a6 Fixed Textinput not properly handling padding and paddingVertical in style props (#33564)
Summary:
Fixes https://github.com/facebook/react-native/issues/33562 #21720. Earlier this [`paddingTop`](https://github.com/facebook/react-native/blob/d5da70e17e8c8210cd79a4d7b09c6a5ded4b5607/Libraries/Components/TextInput/TextInput.js#L1367) used to override the  `paddingTop` of `padding` and `paddingVertical` of the style props. Using `Stylesheet.flatten` will solve this problem.

## 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
-->

[iOS] [Fixed] - Fixed paddingTop not being applied when using padding and paddingVertical in multiline textinput

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

Reviewed By: christophpurrer, cortinico

Differential Revision: D36018667

Pulled By: kacieb

fbshipit-source-id: 0af0ed8ea536ec4e813325b1cf93c7cb2481eb07
2022-05-17 03:26:34 -07:00
Christian Ruink f2e23215ca Adding missing prop for RN Android TextInput behavior
Summary:
An issue that popped up working on:
D36140890
There is already behavior implemented to set the TextInput caret/cursor color independently from the selection box color in Android.
However this handy prop, was not documented or added as one of the available props for the TextInput component.

Associated behavior can be found here:
https://www.internalfb.com/code/fbsource/[f116d651b2e8]/xplat/js/react-native-github/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java?lines=512

## **Changelog**
[Android] - Add android-only prop documentation at the TextInput js level.

Reviewed By: genkikondo

Differential Revision: D36208656

fbshipit-source-id: a54a2646351d897e0d598d5e1979f2a0c443e9d6
2022-05-10 16:48:20 -07:00
George Zahariev 20d9d3aa6a Fixes to non-product code (e.g React Native)
Summary:
We are working on making the empty object literal `{}` have the type `{}` - i.e. exact empty object - rather than being unsealed.

Some manual fixes, in particular to React Native code, which is used and can be synced to other repos (e.g. WWW).

With these changes, error diff in Xplat is down to ~1990 errors

Note that after I roll out `exact_empty_objects`, I'll codemod all the `{...null}` (the only way to get an exact empty object currently) back to `{}`

Changelog: [Internal]

Reviewed By: SamChou19815

Differential Revision: D36142838

fbshipit-source-id: 054caf370db230f42a4c5f5706c88979ef246537
2022-05-04 16:13:07 -07:00
Moti Zilberman 1814bffcc2 Minor changes to Flow types
Summary: Changelog: [Internal]

Reviewed By: arushikesarwani94

Differential Revision: D34171528

fbshipit-source-id: c3fdc4a8c77731f1f43f0e6d830d172906ed79a1
2022-02-15 08:50:55 -08:00
Tim Yung 3e229f27bc RN: Remove propTypes from Image, Text, and TextInput
Summary:
Removes the `propTypes` member from the `Image`, `Text`, and `TextInput` components.

They have been deprecated since React Native v0.66.

Changelog:
[General][Removed] - Removed `Image.propTypes`, `Text.propTypes`, and `TextInput.propTypes`.

Reviewed By: kacieb

Differential Revision: D33750298

fbshipit-source-id: 085f83ad838196bdd531b097b8ce5957270c3ad1
2022-02-01 16:19:01 -08:00
Andres Suarez 8bd3edec88 Update copyright headers from Facebook to Meta
Reviewed By: aaronabramov

Differential Revision: D33367752

fbshipit-source-id: 4ce94d184485e5ee0a62cf67ad2d3ba16e285c8f
2021-12-30 15:11:21 -08:00
Samuel Susla 8c6a98400e Introduce TextInput.onChangeSync
Summary:
changelog: [internal]

Add experimental `TextInput.onChangeSync` which delivers onChange event synchronously.

Reviewed By: ShikaSD

Differential Revision: D33188083

fbshipit-source-id: 1e1dcd0d71c7eec98d3d5f69967659e07ac4e6a6
2021-12-30 06:38:50 -08:00
Samuel Susla f5f6fd70f2 Introduce TextInput.onKeyPressSync
Summary:
changelog: [internal]

Introduce a way to execute `onKeyPress` synchronously. This feature is experimental and will be changed in the future. It is not decided if marking native events as "sync" is going to be path forward with synchronous access.

NOTE: This is experimental API.

Reviewed By: ShikaSD

Differential Revision: D32882092

fbshipit-source-id: 68c66a9bb7c97758219e085c88a77f3c475c1eb3
2021-12-07 13:42:18 -08:00
Liron Yahdav 771ca921b5 Add TextInput.setSelection method
Summary:
Adds a `setSelection` imperative method to `TextInput`.

Changelog:
[General][Added] - Adds a setSelection imperative method to TextInput

Reviewed By: JoshuaGross

Differential Revision: D32186514

fbshipit-source-id: 549a7d93b1c55363cf01d804b1e3d735e55c4481
2021-12-03 11:54:01 -08:00
Marcel Lasaj 9eb0881c8f fix(android): Updated TextInput prop types to accomodate for new autoComplete values (#32575)
Summary:
<!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? -->
This fixes the "Failed prop type: Invalid prop `autoComplete` of value `[any-of-the-new-values]`" warning, as mentioned in https://github.com/facebook/react-native/issues/32557.

[This commit](https://github.com/facebook/react-native/commit/d9e0ea77f0111fd8400c65d68e45d54e2f84287b) introduced new HintConstants for autofill, but added those only to [`TextInput.js`](https://github.com/facebook/react-native/blob/main/Libraries/Components/TextInput/TextInput.js#L331) and forgot to add them (and the new docs' description) to either [`AndroidTextInputNativeComponent`](https://github.com/facebook/react-native/blob/main/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js#L99) or [`DeprecatedTextInputPropTypes.js`](https://github.com/facebook/react-native/blob/main/Libraries/DeprecatedPropTypes/DeprecatedTextInputPropTypes.js#L67). I know, the latter has clearly been deprecated, but until it is actually being removed, it shouldn't throw warnings like that.

## 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
-->

[Android] [Fixed] - Updated TextInput prop types to accomodate for new autoComplete values

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

Test Plan: There is no warning after these changes.

Reviewed By: yungsters

Differential Revision: D32324108

Pulled By: lunaleaps

fbshipit-source-id: df27cbbd54788f26471029c9201c6a27ca8b7893
2021-11-11 15:41:44 -08:00
Tim Yung 148c98ec80 RN: Resolve Outstanding ESLint Warnings
Summary:
Resolves outstanding ESLint warnings in React Native.

Changelog:
[Internal]

Reviewed By: lunaleaps

Differential Revision: D32291912

fbshipit-source-id: 61337d5a5a0e6ed55f732675e029f4b76d850af9
2021-11-09 21:46:21 -08:00
Tim Yung 77ecc7ede1 JS: Format with Prettier v2.4.1 [3/n]
Summary:
Changelog:
[General][Internal]

Reviewed By: zertosh

Differential Revision: D31883447

fbshipit-source-id: cbbf85e4bf935096d242336f41bf0cc5d6f92359
2021-11-02 22:14:16 -07:00
Tim Yung 3f629049ba RN: Deprecate Prop Types
Summary:
Deprecates `prop-types` from React Native.

Existing use cases will be presented with a warning to migrate to the newly published `deprecated-react-native-prop-types` module.

In a subsequent release, these will be removed from React Native.

Changelog:
[General][Changed] - Accessing `Image.propTypes`, `Text.propTypes`, `TextInput.propTypes`, `ColorPropType`, `EdgeInsetsPropType`, `PointPropType`, or `ViewPropTypes` now emits a deprecation warning.

Reviewed By: kacieb

Differential Revision: D29019309

fbshipit-source-id: 21e518e588fa05c498cc75ba81f69cfa8a9d0613
2021-10-21 17:45:47 -07:00
fabriziobertoglio1987 3560753559 Fix TextInput Cursor jumping to the right when the placeholder null (#28995)
Summary:
This issue fixes https://github.com/facebook/react-native/issues/28794 fixes https://github.com/facebook/react-native/issues/27658
Flow type ?Stringish allows to set the placeholder value to null. The null value causes the cursor to jump to the right in a TextInput. The fix replaces the placeholder null value with an empty string which avoid calling setHint(null) as causes the placeholder to jump to the right.

## 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
-->

[Android] [Fixed] - avoid calling setHint with a null parameter causing cursor to jump to the right

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

Test Plan:
**<details><summary>CLICK TO OPEN TESTS RESULTS (28 May 2020 20a9473aaa)</summary>**
<p>

More videos and information included in issue https://github.com/facebook/react-native/issues/28794
The below test cases are from the [following repository](https://github.com/fabriziobertoglio1987/AwesomeProject)

| **BEFORE** |
|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/83123470-3e2f8000-a0d5-11ea-8718-11e6a0575a0c.gif" />|

| **AFTER** |
|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/83123554-599a8b00-a0d5-11ea-9701-6557f0d76044.gif" />|

Extensive testing on `RNTester` did not identify any regression.

| **AFTER** |
|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/83123586-628b5c80-a0d5-11ea-92eb-449d499dcc7d.gif" />|

</p>
</details>

**<details><summary>CLICK TO OPEN TESTS RESULTS (15 February 2021 https://github.com/facebook/react-native/pull/28995/commits/20a9473aaa330ad9b6e7a0b42ebd9c4ed41ce60b)</summary>**
<p>

| **BEFORE** |
|:-------------------------:|
| <video src="https://user-images.githubusercontent.com/24992535/107960803-5d44a980-6fa5-11eb-90e2-f0d665e35291.mp4" />|

| **AFTER** |
|:-------------------------:|
| <video src="https://user-images.githubusercontent.com/24992535/107960602-1f478580-6fa5-11eb-8f39-b985fafa6a6c.mp4" />|

</p>
</details>

Reviewed By: charlesbdudley

Differential Revision: D30095877

Pulled By: lunaleaps

fbshipit-source-id: 38a3e788443a22d48a4335063cd4315638bd8e97
2021-08-11 22:53:16 -07:00
jeswinsimon 27fec9569e Updated TextInput autoCompleteType prop to autoComplete 2/2 (#26010)
Summary:
Fix for bug https://github.com/facebook/react-native/issues/26003 Rename TextInput prop "autoCompleteType" to "autoComplete".

## Changelog

[Android] [Breaking] - Updated `autoCompleteType` prop of `TextInput` to `autoComplete`

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

Test Plan: Sandcastle

Reviewed By: mdvacca

Differential Revision: D29795575

Pulled By: lunaleaps

fbshipit-source-id: 6eba7030968e9b7384529a43a6cd1b3c9e8b2a2c
2021-08-11 17:53:37 -07:00
Jason Safaiyeh d9e0ea77f0 Migrate to androidx.autofill.HintConstants & Support all constant types (#28008)
Summary:
Fix for https://github.com/facebook/react-native/issues/27952.

Noticed more than just `AUTOFILL_HINT_NEW_PASSWORD` were missing, this PR will support every `AUTOFILL_HINT_*` type.

## Changelog

[Android] [Added] - Added all autofill types to TextEdit

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

Reviewed By: sturmen

Differential Revision: D29766235

Pulled By: mdvacca

fbshipit-source-id: d5171aef8092d37716fddcb6f3443637a4af8481
2021-07-21 15:14:41 -07:00
Adrián Cuesta 1465c8f387 Add support to URI keyboard type in Android (#31781)
Summary:
Android react-native `TextInput` component does nothing if prop `keyboardType` is `url` value. This PR solves that problem.

## Changelog

[Android] [Added] - Add support to URI keyboard type in Android

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

Test Plan:
Before change:

{F630980679}

After Change:

{F630986399}

Reviewed By: lunaleaps

Differential Revision: D29517822

Pulled By: sshic

fbshipit-source-id: 1bda29584a3799570f34e772b5589b59ac80c524
2021-07-16 05:13:07 -07:00
Joshua Gross afafbf8ec4 Log soft exception instead of crashing if ref is null on TextInput onPress
Summary:
See title.

Changelog: [internal]

Reviewed By: yungsters

Differential Revision: D29410457

fbshipit-source-id: 0b9a9836baa0b5b7deb88cd73f4f634ca10c5868
2021-06-25 19:49:04 -07:00
Kacie Bawiec 0afd71a18d Convert require to import in Libraries/Components
Summary:
Changelog:
[General][Changed] Convert require statements to use import from in Libraries/Components

Reviewed By: lunaleaps

Differential Revision: D27921557

fbshipit-source-id: 3f1618455a47a56c4a090f3ececfef88476c0b8a
2021-04-26 12:50:59 -07:00
Luna Wei bac2c2c801 Update FlowFixMes to use error codes in react-native-github
Summary:
Changelog:
[Internal] - Add error codes to existing FlowFixMe's

Reviewed By: kacieb

Differential Revision: D27445689

fbshipit-source-id: 2b19692e1cb822ab6785efcc5f93ee33e7dce1e5
2021-03-31 18:21:47 -07:00
Luna Wei 321de15803 Delete unused FlowFixMes in xplat/js/react-native-github
Summary:
Changelog:
[Internal] - Remove unused FlowFixMes

Reviewed By: kacieb

Differential Revision: D27445690

fbshipit-source-id: c1fbf4495ae020b30a458c2ef4870547fd5d5c6e
2021-03-31 18:21:47 -07:00
Nadiia D 397bfa6ad7 Hide caret during test runs
Summary:
Changelog:
[General][Changed] Hide caret in the TextInput during test runs.

Reviewed By: lunaleaps

Differential Revision: D26728766

fbshipit-source-id: b75827f00b4d5c6243d93106093f97b40dc4b366
2021-03-02 18:04:28 -08:00
Nadiia D 7b09eb54e7 Use flow strict-local
Summary:
Changelog:
[General][Changed] TextInput: use flow strict-local

Reviewed By: kacieb

Differential Revision: D26573763

fbshipit-source-id: 9d7d48310dd41949d07ad7616c4713b521c2545d
2021-02-22 18:30:01 -08:00
Nadiia D c4aa411ee3 Replace Touchable with usePressability hook
Summary:
Changelog:
[General][Changed] textInput component changes:
- use Pressability hook directly
- no more cloning the component

Reviewed By: yungsters, kacieb

Differential Revision: D26573762

fbshipit-source-id: 17b47c8b0b9af22796d6e1528e8e3c16b5ed5d51
2021-02-22 15:39:57 -08:00
Micha Reiser cb0764eeb0 Upgrade react-hooks rules
Summary:
Upgrades the `react-hooks` eslint-rules to `4.2.0`

Changelog:
[Internal]

Reviewed By: GijsWeterings

Differential Revision: D26366235

fbshipit-source-id: 04628e8f2a6c56eacba516d877df143c6c81adb8
2021-02-10 07:43:52 -08:00
Nadiia D 881860886c TextInput: sort props
Summary:
Changelog:
[General][Changed] - Refactor TextInput component

Reviewed By: lunaleaps

Differential Revision: D26009114

fbshipit-source-id: 25676a93d59d43ec6c5073fc481d4b9cd20e2f9a
2021-01-22 13:13:57 -08:00
Nadiia D 9be3356e02 replace defaultProps usage in functional components
Summary:
Changelog:
[General] [Removed] - Replace defaultProps usage in functional components

Reviewed By: kacieb

Differential Revision: D24907836

fbshipit-source-id: 05c7381b66c7738790eff5fea594791c3ecfa12e
2020-11-13 17:07:11 -08:00
Tim Yung b7b0e23202 TextInput: Add onPressIn and onPressOut
Summary:
Introduces support for `onPressIn` and `onPressOut` on the `TextInput` component.

This makes it possible to add visual feedback when users touch interact with `TextInput` components.

Changelog:
[General][Added] - TextInput now supports `onPressIn` and `onPressOut`.

Reviewed By: TheSavior

Differential Revision: D23514333

fbshipit-source-id: 1790e977b78f1c293d5476aef8613547f27d6731
2020-09-08 15:57:07 -07:00
Lulu Wu b5b4a70410 Set caretHidden to true to fix the Xiaomi crash
Summary:
After monitoring scuba for a few days,  previous fixes(D23301714 D23331828 (https://github.com/facebook/react-native/commit/07a597ad185c8c31ac38bdd4d022b0b880d02859)) don't work as expected.

I managed to test this issue on a Xiaomi device, the crash didn't happen but the there was a popup "Frequetly used email" on top of email edit text:

{F317216473}

Getting rid of the popup probably be the right fix.

For more context see https://github.com/facebook/react-native/issues/27204

Changelog: [Android] - Set caretHidden to true to fix the Xiaomi crash

Reviewed By: mdvacca

Differential Revision: D23451929

fbshipit-source-id: 521931422f3a46a056a9faa4b10fe93cf4732db0
2020-09-02 05:28:49 -07:00
Lulu Wu 07a597ad18 Fix Xiaomi TextInput crash in native
Summary:
Long term fix in native for Error: android_crash:java.lang.NullPointerException:android.widget.Editor$SelectionModifierCursorController.access$300

For more detail please see T68183343 D23301714

Changelog:
[Android][Changed] - Fix Xiaomi TextInput crash in native

Reviewed By: mdvacca

Differential Revision: D23331828

fbshipit-source-id: 914f2d431772f49711b940d47a2b3ef57ab82cdc
2020-08-28 01:44:37 -07:00
Rick Hanlon 208ebed074 Switch TextInput to useLayoutEffect
Summary:
This diff fixes an issue in `TextInput` where `TextInputState.currentlyFocusedInputRef` could maintain a ref to a view that no longer exists. This issue was exposed when upgrading React, where cleanups for passive effects are deferred. This change means that `inputRef.current` would no longer reference the host view *to be* destroyed; it would be null because the view was *already destroyed*.

There are two fixes here that would independently fix the bug and fix the issue better together.

First, we convert `useEffect` to `useLayoutEffect`. `useLayoutEffect` is intended to fire synchronously after all host view mutations, and the cleanup function is intended to fire synchronously before the host view is destroyed, similar to the behavior assumed before. This change is now the correct function to use semantically. However, if we made this change without the second then any change in the order the effects fire would surface the same bug.

So second, move the `inputRefValue).blur()` call to the same effect as unregistering. This is because we currently require the `blur` effect to be called to null out `currentlyFocusedInputRef` in addition to calling `unregisterInput`. That makes the semantic ordering of effects in `TextInput` meaningful. Instead, when a TextInput is unregistered we should always `blur` to clear the `currentlyFocusedInputRef`, which will prevent dispatching events to a view that doesn't exist. If we made this change without the first then there's would be a race condition between calling blur on a TextInput and when that TextInput has been unregistered.

Changelog: [Internal]

Reviewed By: JoshuaGross

Differential Revision: D23035358

fbshipit-source-id: ab686b8046d85e2becd8b879b0b4b7e69e672754
2020-08-13 20:02:22 -07:00
Vojtech Novak 92160f3144 use React.Children.count for counting children (#28991)
Summary:
just a minor change - uses the [count api](https://reactjs.org/docs/react-api.html#reactchildrencount)

> Returns the total number of components in children, equal to the number of times that a callback passed to map or forEach would be invoked.

## Changelog

not needed I think
Pull Request resolved: https://github.com/facebook/react-native/pull/28991

Test Plan: tested locally

Differential Revision: D21794081

Pulled By: TheSavior

fbshipit-source-id: bf6d11b2bc854d938aed7268911f89a00bb3f596
2020-05-29 15:00:58 -07:00
Manvir Singh d54113d8c4 implemented showSoftInputOnFocus for iOS (#28834)
Summary:
`showSoftInputOnFocus` was added in https://github.com/facebook/react-native/issues/25028, but it was only added for Android. There was a lot of discussion on the original issue being addressed (https://github.com/facebook/react-native/issues/14045), that there is a need for this on iOS as well. The issue with iOS was brought up again on https://github.com/facebook/react-native/issues/27243.

On a related note, when searching this repo's issues for `showSoftInputOnFocus`, it appears that there are several closed issues that claim that the Android implementation doesn't work (https://github.com/facebook/react-native/issues/25685, https://github.com/facebook/react-native/issues/25687, https://github.com/facebook/react-native/issues/26643). So perhaps the Android implementation needs to be looked at as well (I myself have not gotten around to confirming whether it works or not)

## Changelog

[iOS] [Added] - Add showSoftInputOnFocus to TextInput
Pull Request resolved: https://github.com/facebook/react-native/pull/28834

Test Plan:
You'd use this just like you would in the Android implementation:
```jsx
<TextInput showSoftInputOnFocus={false} />
```

## GIFs
### Before change
![May-04-2020 20-52-49](https://user-images.githubusercontent.com/4932784/81034028-9d89cf80-8e4a-11ea-906c-64f62504f80c.gif)

### After change
![May-04-2020 20-54-27](https://user-images.githubusercontent.com/4932784/81034035-a11d5680-8e4a-11ea-918e-119a1c9e2a19.gif)

Differential Revision: D21418763

Pulled By: shergin

fbshipit-source-id: 561e72fc2cf16b30446132f6b96b8aa2b4a92daf
2020-05-11 09:01:33 -07:00
Tim Yung a1ac2518a3 TextInput: Default blurOnSubmit in JS
Summary:
Consolidates the logic for the default value of `blurOnSubmit` on `TextInput` in the JavaScript component.

This only materially impacts Fabric.

Changelog:
[Internal]

Reviewed By: mdvacca

Differential Revision: D21491482

fbshipit-source-id: 16d8aba32e7d0321a4583e87e03405ea587e35d4
2020-05-09 17:24:19 -07:00
Zack Argyle 0a67133124 Make ColorValue public in StyleSheet.js
Summary:
This diff makes the ColorValue export "official" by exporting it from StyleSheet in order to encourage its use in product code.

Changelog: Moved ColorValue export from StyleSheetTypes to StyleSheet

Reviewed By: TheSavior

Differential Revision: D21076969

fbshipit-source-id: 972ef5a1b13bd9f6b7691a279a73168e7ce9d9ab
2020-04-17 13:03:47 -07:00
Samuel Susla 9c54bf4199 Remove redundant input from TextInput
Summary:
`const ReactNative` is assigned to but never used. Let's get rid of it.

Changelog: [Internal]

Reviewed By: JoshuaGross

Differential Revision: D21016502

fbshipit-source-id: afcb0cfc501adf07e0c4d4452a831160e1cda088
2020-04-14 10:59:43 -07:00
Samuel Susla c7f259526b Migrate setNativeProps to commands in iOS text input
Summary: Changelog: Move from setNativeProps to ViewCommands.

Reviewed By: JoshuaGross

Differential Revision: D20843018

fbshipit-source-id: 9be9d2bbee01f2e15279e3c3ae785c1a5b163765
2020-04-09 03:44:56 -07:00
Samuel Susla 00c4d950cf Implement event count for TextInput
Summary:
Changelog: [Internal]

Implementation of event count for Fabric's Text input.

Reviewed By: JoshuaGross

Differential Revision: D20800185

fbshipit-source-id: 988692cb2fc786649821cccb06e629b40b9b0479
2020-04-09 03:44:55 -07:00
Michael Bolin 0b9ea60b4f Back out "Upgrade Prettier from 1.17 to 2.0.2."
Differential Revision: D20639755

fbshipit-source-id: 5028563f9cf0527a30b4259daac50cdc03934bfd
2020-03-24 21:47:35 -07:00
Michael Bolin cf44650b3f Upgrade Prettier from 1.17 to 2.0.2.
Summary:
This gets us on the latest Prettier 2.x:
https://prettier.io/blog/2020/03/21/2.0.0.html

Notably, this adds support for TypeScript 3.8,
which introduces new syntax, such as `import type`.

Reviewed By: zertosh

Differential Revision: D20636268

fbshipit-source-id: fca5833d003804333a05ba16325bbbe0e06d6c8a
2020-03-24 20:24:47 -07:00
Nick Gerleman 161b910494 Do not explicitly include ".js" in Library imports (#28311)
Summary:
A few recent imports have explicitly added ".js" to the end of their path. This prevents Metro from resolving platform-specific JS files, e.g. "Foo.android.js" or "Foo.windows.js" instead of "Foo.js".

React Native Windows provides its own implementation of files in a few cases where stock React Native will share them between Android and iOS. We hope to reduce/eliminate these long term, but requiring explicit ".js" files currently breaks us in a couple of places where we have custom implementations.

This change is a quick regex replace of ES6 and CommonJS imports in 'Libraries/" to eliminate ".js".

## Changelog

[General] [Fixed] - Do not explicitly include ".js" in Library imports
Pull Request resolved: https://github.com/facebook/react-native/pull/28311

Test Plan: I haven't done any manual validation of this, but `flow-check` should catch any issues with this during CI.

Reviewed By: cpojer

Differential Revision: D20486466

Pulled By: TheSavior

fbshipit-source-id: 31e1ccc307967417d7d09c34c859f0b2b69eac84
2020-03-17 02:11:53 -07:00
Joshua Gross f3a53fd338 TextInput: keep less stateful data on the View
Summary:
Allow JS to keep track of mostRecentEventCount and pass it into each event or prop update. We really don't want to separately keep track of that data.

In non-Fabric, the ShadowNode will keep track of the mostRecentEventCount associated to prop updates. In Fabric, that happens on the C++ ShadowNode.

Changelog: [Internal] Simplification to TextInput native state

Reviewed By: mdvacca

Differential Revision: D20374573

fbshipit-source-id: 385fba6ec69a071c78832a686b397699a6c55d67
2020-03-11 12:32:40 -07:00
Janic Duplessis 0569d4c431 Remove JS autoFocus implementation (#27923)
Summary:
Follow up to https://github.com/facebook/react-native/issues/27803 and https://github.com/facebook/react-native/issues/27924. We no longer need to call focus on mount from JS as both iOS and Android implements it natively now.

## Changelog

[General] [Fixed] - Remove JS autoFocus implementation
Pull Request resolved: https://github.com/facebook/react-native/pull/27923

Test Plan: Test that focus works in RN Tester with this, https://github.com/facebook/react-native/issues/27803 and https://github.com/facebook/react-native/issues/27924

Differential Revision: D19956373

Pulled By: TheSavior

fbshipit-source-id: 5d99ead55011663b3edaf499ac7616765a24cb50
2020-03-02 11:34:36 -08:00
Hans Halverson a3d9e91203 Move suppression to primary locations in xplat/js
Summary:
We will soon be enforcing that flow suppressions will only apply when on an error's primary location ([post](https://fb.workplace.com/groups/179614562644215/permalink/559286354677032/)). This diff uses the codemod created in D20008770 to move all suppression comments to their primary locations in the  `xplat/js` flow root, and deletes suppression comments that are not on any primary locations.

This diff was generated with:
```
~/fbsource/fbcode/flow/packages/flow-dev-tools/bin/tool suppression-primary-locations --json-file ~/www/errors.json  ~/fbsource/xplat/js
hg st -n | xargs grep -l -P '@(partially-)?generated' | xargs hg revert
hg st -n | xargs grep -l 'format' | xargs prettier --write
```

Changelog: [Internal]

bypass-lint

Reviewed By: dsainati1

Differential Revision: D20122544

fbshipit-source-id: d94e409aadb18bb399a1ddbf9f3f2494fe4fb54c
2020-02-27 12:14:57 -08:00
Joshua Gross ed5f9eeb2a TextInput: use commands instead of setNativeProps on Android
Summary:
Use codegen'd ViewCommands added in previous diff as a replacement for setNativeProps.

Changelog: [Internal]

Reviewed By: mdvacca

Differential Revision: D18619298

fbshipit-source-id: 08069e828e92ac3cca9813bbcdca99d99fb50883
2020-02-24 16:19:36 -08:00