Skip to content

Add support for blur and focus on View #51570

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from

Conversation

Abbondanzo
Copy link
Contributor

Summary:
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

Differential Revision: D75238291

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label May 23, 2025
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D75238291

Abbondanzo added a commit to Abbondanzo/react-native that referenced this pull request May 23, 2025
Summary:

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
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D75238291

@Abbondanzo
Copy link
Contributor Author

cc @douglowder since there's some overlap with TV. However, this change only adds support for Android at the moment, and only targets the View component rather than others like Image. I'm keeping this change as minimal as possible, not baking it into the BaseViewManager because not all components emit focus and blur events.

I also haven't fully settled onto an appropriate solution for iOS, but I'd like there to be true support for focusable/keyboard navigation on there first.

@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D75238291

Abbondanzo added a commit to Abbondanzo/react-native that referenced this pull request May 27, 2025
Summary:

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
Abbondanzo added a commit to Abbondanzo/react-native that referenced this pull request May 27, 2025
Summary:

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
Summary:

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
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D75238291

@facebook-github-bot
Copy link
Contributor

This pull request has been merged in af0a76c.

@facebook-github-bot facebook-github-bot added the Merged This PR has been merged. label May 29, 2025
@react-native-bot
Copy link
Collaborator

This pull request was successfully merged by @Abbondanzo in af0a76c

When will my fix make it into a release? | How to file a pick request?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. fb-exported Merged This PR has been merged. p: Facebook Partner: Facebook Partner
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants