Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51570
As the title suggests: adds support strictly to `View` components on Android for `onFocus` and `onBlur` events. This is especially helpful for apps that respond to controller or remote inputs and aligns with existing support for the `focusable` prop.
In order to make this change cross-compatible with text inputs, `TextInputFocusEvent` has been deprecated in favor of the `BlurEvent`/`FocusEvent` types now available from core. Their type signatures are identical but `BlurEvent`/`FocusEvent` should be the type going forward for all views that intend to support focus/blur. Text inputs intentionally do not forward information about their state upon focus/blur and docs specifically call out `onEndEditing` as a means of reading state synchronously when blurring. Therefore, the changes to the native side to remove the event type specifically for text inputs is not breaking.
Changelog: [Android][Added] - Support for `onFocus` and `onBlur` function calls in `View` components
Reviewed By: mdvacca
Differential Revision: D75238291
fbshipit-source-id: b991d1f24fc094ba9d5d466201ecd058f59258e9
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50215
Backwards compatible updates to `CoreEventTypes`, `Image`, `Switch`, `TextInput` to align types and reduce root exports.
The effects of this change can be seen in `packages/react-native/types/__typetests__/index.tsx` (smoke test file against current manual TypeScript definitions).
Under Flow, exports on each `*EventData` type are directly removed (unreferenced).
Changelog:
[General][Deprecated] - Deprecate `*EventData` types on `Image`, `Switch`, `TextInput` components. These can be substituted for `*Event`, e.g. `NativeSyntheticEvent<ImageLoadEventData>` becomes `ImageLoadEvent`.
Reviewed By: NickGerleman
Differential Revision: D71734361
fbshipit-source-id: 287c775e840319242984d248169c267abf8f032b
Summary:
**iOS** does offer a native property for **UITextField** called `inputAssistantItem`. According to the [documentation](https://developer.apple.com/documentation/uikit/uitextinputassistantitem), we can hide the **"shortcuts"** by setting the `leadingBarButtonGroups` and `trailingBarButtonGroups` properties to empty arrays.
I propose adding a new property for **TextInput** in **React Native**, which would set these native properties to empty arrays. This new property could be called `disableInputAssistant` or `disableKeyboardShortcuts` and would be a `boolean`.
Developers can manage this behavior (the redo & undo buttons and suggestions pop-up hiding) after applying these native props.
https://github.com/react-native-community/discussions-and-proposals/discussions/830
## Changelog:
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[IOS] [ADDED] - [TextInput] Integrate a new property - `disableKeyboardShortcuts`. It can disable the keyboard shortcuts on iPads.
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[IOS] [ADDED] - [TextInput] Integrate a new property - `disableKeyboardShortcuts`. It can disable the keyboard shortcuts on iPads.
Pull Request resolved: https://github.com/facebook/react-native/pull/47671
Test Plan:
Manual
1. Open TextInput examples.
2. Scroll down and reach the "Keyboard shortcuts" section.
3. Test each case.
Note: **TextInput** behaves the same as now when the new prop is not passed or is `false`.
https://github.com/user-attachments/assets/5e814516-9e6c-4495-9d46-8175425c4456
Reviewed By: javache
Differential Revision: D67451609
Pulled By: cipolleschi
fbshipit-source-id: 59ba3a5cc1644ed176420f82dc98232d88341c6e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46742
Migrates type definitions in React Native to use the newly created `HostInstance` type instead of `NativeMethods` and `React.ElementRef<HostComponent<T>>`.
Changelog:
[General][Changed] - Simplified Flow types to use `HostInstance` (which changing nominal types).
Reviewed By: NickGerleman
Differential Revision: D63646763
fbshipit-source-id: 904894dc40da4d2e70bcb6df47018fc6248ea972
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46170
This PR expose to JS a few missing text content types on iOS (available from iOS 15)
- dateTime
- flightNumber
- shipmentTrackingNumber
## Changelog
[General][Added] - Expose missing text content type to JS
Reviewed By: blakef
Differential Revision: D61657788
fbshipit-source-id: 1a0ea0e76efaf715d88bcbf249f7cb20b5f3607b
Summary:
Solves this issue: https://github.com/facebook/react-native/issues/44107
## Changelog:
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[IOS] [ADDED] - Line break mode for TextInput components. **This includes JS APIs for the new mode.**
This PR is a breakdown of [this](https://github.com/facebook/react-native/pull/45968) PR.
Pull Request resolved: https://github.com/facebook/react-native/pull/46128
Test Plan:
- Added unit tests to cover the new JS APIs.
- Verified that the new mode functions as expected through manual testing.
Reviewed By: andrewdacenko
Differential Revision: D61657004
Pulled By: cipolleschi
fbshipit-source-id: 9fc5c40fc077bee8e1abc51b6eae2e0f0fcd9b8f
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44480
TextInputs' onTextInput callback was removed way back in React Native 0.62 with https://github.com/facebook/react-native/commit/3f7e0a2c9601fc186f25bfd794cd0008ac3983ab , but remnants of the implementation exists.
Fully remove references on JS side now that no older clients are emitting this event
Changelog: [General][Removed] Remove viewconfigs for onTextInput callbacks
Reviewed By: cipolleschi
Differential Revision: D57092733
fbshipit-source-id: 62dae37d8e8f155969a1ca65131d4ee9a1d5f1c4
Summary:
TextInputs' `onTextInput` callback was removed way back in React Native 0.62 with https://github.com/facebook/react-native/commit/3f7e0a2c9601fc186f25bfd794cd0008ac3983ab , but remnants of the implementation exists. Let's just remove it altogether?
## Changelog:
[IOS] [REMOVED] - Remove deprecated onTextInput callback
Pull Request resolved: https://github.com/facebook/react-native/pull/44351
Test Plan: CI should pass
Reviewed By: NickGerleman
Differential Revision: D56804590
Pulled By: javache
fbshipit-source-id: 89101fa53cdc628a97ba176cf3deca691784bfdd
Summary:
This PR addresses the problem raised in the https://github.com/facebook/react-native/issues/41004 issue.
The current logic is that `selectionColor` on iOS sets the color of the selection, handles, and cursor. On Android it looks similar, while it doesn't change the color of the handles if the API level is higher than 27. In addition, on Android there was an option to set the color of the cursor by `cursorColor` prop, but it didn't work if the `selectionCursor` was set.
## Changelog:
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[GENERAL] [ADDED] - Make same behavior of the `selectionColor` prop on Android as iOS
[ANDROID] [ADDED] - Introduced `selectionHandleColor` as a separate prop
[ANDROID] [CHANGED] - Allowing `cursorColor` and `selectionHandleColor` to override `selectionColor` on Android
Pull Request resolved: https://github.com/facebook/react-native/pull/41092
Test Plan:
Manual tests in rn-tester:
### `selectionColor` same as iOS, sets selection, handles and cursor color
_There is a way to set only "rectangle" color by setting other props as null_

### `selectionHandleColor`

### `cursorColor`

Reviewed By: NickGerleman
Differential Revision: D51253298
Pulled By: javache
fbshipit-source-id: 290284aa38c6ba0aa6998b937258788ce6376431
Summary:
This PR is in response to https://github.com/facebook/react-native/pull/39758#discussion_r1344839022 .
`RCTConvert.h` currently takes an import of `<Webkit/Webkit.h>` for... one enum: `WKDataDetectorTypes`. This has a few problems:
1) RCTConvert is JS engine agnostic, it shouldn't be depending on Webkit
2) As far as I can tell, this code is dead, we also define (and use) the UIKit equivalent `UIDataDetectorTypes`.
Let's just combine the two, update some JS typing, and get rid of the Webkit header import.
## Changelog:
[IOS] [CHANGED] - Remove `<Webkit/Webkit.h>` import in `RCTConvert.h`
Pull Request resolved: https://github.com/facebook/react-native/pull/39794
Test Plan: CI should pass
Reviewed By: rshest
Differential Revision: D49898701
Pulled By: NickGerleman
fbshipit-source-id: 5420cb62317e1186426aae019bcc43d27c49ea26
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/39701
TextInput already uses Pressability, but doesn't expose the onPress prop. Link:https://github.com/facebook/react-native/blob/main/packages/react-native/Libraries/Components/TextInput/TextInput.js#L1381-L1414.
Currently TextInput only exposes the onPressIn() and onPressOut() props from Pressability. While onPressOut() can serve the same purpose as onPress() in most cases, it doesn't fare well with PanResponder...say a swipe gesture implemented using PanResponder.
When the pointer/cursor exits the hit test bounds of TextInput, onPressOut() will be triggered even though the desired behavior could be that we only want to invoke the event handler when the user lifts their finger from the screen (while still in the hit test bounds of the TextInput).
Example of TextInput in a PanResponder:
https://snack.expo.dev/jambalaya/panresponder
Changelog: [General][Added] Add onPress prop to TextInput
Reviewed By: NickGerleman
Differential Revision: D49653011
fbshipit-source-id: 28477416c6c0f17a0737986cab49e51a55094ba7
Summary:
While setting up a credit card form in RN, I discovered that iOS 17 supports a number of new content types ([`UITextContentType` docs](https://developer.apple.com/documentation/uikit/uitextcontenttype?language=objc)). In the docs these are marked with the `Beta` flag.
Setting up the new content types is relatively straightforward, but a change is required in https://github.com/facebook/react-native-deprecated-modules to update the `TextInput` prop types. ~~I will open a PR in that repo shortly.~~ I have [opened a PR](https://github.com/facebook/react-native-deprecated-modules/pull/23) to update the prop types. ~~Once that PR is merged, a version bump for that dependency will need to be added to this PR.~~ The PR is merged and the dependency in this PR has been updated.
## Changelog:
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[IOS] [ADDED] - Added support for iOS 17+ text content types
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
Pull Request resolved: https://github.com/facebook/react-native/pull/38354
Test Plan: The `rn-tester` app builds and runs successfully. I have added a few new examples of inputs using the new text content types.
Reviewed By: javache
Differential Revision: D47554161
Pulled By: philIip
fbshipit-source-id: 8d4414dc6229063f81164f2d8727921c8294c92e
Summary:
Since v0.71 the autoComplete prop on TextInput is available on iOS ([release notes](https://reactnative.dev/blog/2023/01/12/version-071#component-specific-behavior)). However, this change is not reflected in the types.
Original types PR here - https://github.com/DefinitelyTyped/DefinitelyTyped/pull/65144 by chwallen
## Changelog:
[GENERAL] [FIXED] - Fix autoComplete type for TextInput
Pull Request resolved: https://github.com/facebook/react-native/pull/36931
Test Plan: Setting the autoComplete prop on TextInput to `nickname`, `organization`, `organization-title`, or `url` should not result in typescript errors.
Reviewed By: NickGerleman
Differential Revision: D45052350
Pulled By: javache
fbshipit-source-id: 40993833b4ed14f91e3bf3521a264ea93517a0c9
Summary:
I added missing type `lineBreakStrategyIOS` for Text and TextInput. ([Text docs](https://reactnative.dev/docs/text))
## Changelog
[GENERAL] [FIXED] - add `lineBreakStrategyIOS` prop type for Text and TextInput
<!-- Help reviewers and the release process by writing your own changelog entry.
Pick one each for the category and type tags:
[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message
For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
Pull Request resolved: https://github.com/facebook/react-native/pull/36526
Test Plan: Ran `yarn test-typescript` and `yarn test-typescript-offline` with no errors.
Reviewed By: jacdebug
Differential Revision: D44213791
Pulled By: javache
fbshipit-source-id: 8d0d44e2cdd1fa362c54935326e86dde88c5ba0b