Summary:
Migrated ReactClippingViewGroupHelper.java to Kotlin as part of the React Native Kotlin migration initiative.
This change helps modernize the React Native Android codebase and improve maintainability.
No functional changes were introduced—only a language conversion while preserving the original logic and behavior.
## Changelog:
[ANDROID] [CHANGED] - Migrated ReactClippingViewGroupHelper.java to Kotlin
Pull Request resolved: https://github.com/facebook/react-native/pull/50679
Test Plan:
✅ Ran yarn && yarn android in the root directory and verified RNTester builds successfully.
✅ Opened RNTester on an Android emulator/device and navigated through various screens to ensure the app works as expected.
✅ Specifically tested views with removeClippedSubviews enabled to confirm runtime behavior remains unchanged.
✅ Used [KtFmt](https://github.com/facebook/ktfmt) to format the Kotlin file properly.
Reviewed By: arushikesarwani94
Differential Revision: D72973621
Pulled By: cortinico
fbshipit-source-id: e6f426a0cb7eb583935a560660900b29786df4c3
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50105
Pull Request resolved: https://github.com/facebook/react-native/pull/49543
When using `ReactScrollView` or `ReactHorizontalScrollView` Views with `removeClippedSubviews` keyboard navigation didn't work.
This is because keyboard navigation relies on Android's View hierarchy to find the next focusable element. With `removeClippedSubviews` the next View might've been removed from the hierarchy.
With this change we delegate the job of figuring out the next focusable element to the Shadow Tree, which will always contain layout information of the next element of the ScrollView.
We then prevent the clipping of the topmost parent of the next focusable view to lay out the entire containing element in case we have some necessary context in the parent
Changelog: [Android][Fixed] - Fix keyboard navigation on lists with `removeClippedSubviews` enabled
Reviewed By: joevilches
Differential Revision: D71324219
fbshipit-source-id: b55b7735a30714b2a5e1c9e0ed4ae84ab43f6694
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50404
Add another function to fabric to get the topmost stacking context parent given a root and a child.
This is to be used on focus searching algorithm in the case where the next focusable child is deeper in the hierarchy meaning we need to find the top most parent in the Android hierarchy and lay that out as well before transferring focus.
If we don't lay out the parent as well as the next focusable view:
- The next focusable view might lack context given by the parent
- If the parent is a scrollview and has removeClippedSubviews enabled then laying out the next focusable view will not work
- If the view is deeper in the android hierarchy in some cases it won't be layed out unless the parent is
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D72178408
fbshipit-source-id: 7b91ea695e236f3a92f9703bcc9ca943bf0dec24
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50196
Currently when `removeClippedSubviews` is enabled on Android keyboard navigation breaks and we can never focus the elements that are clipped. iOS has a similar issue but not as drastic, it only happens when elements on the FlatList have a lot of margin between them.
This algorithm aims to find the next focusable view and return it to native so that we can prevent the clipping of the view on the view clipping algorithm and hence fix keyboard navigation. For more information see D71324219
Fabric algorithm to find the next focusable view given:
`parentTag`: Top most relevant parent of the focused view
`focusedTag`: Tag of the currently focused view
`direction`: Direction in which focus is moving
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D71558965
fbshipit-source-id: 1a13c82d067834337e7f7936860780f467c9a15d
Summary:
Introduce a trait to be able to tell if a ShadowNode is focusable by keyboard. This will be used for focus ordering that delegates the work to the shadow tree when Native platforms don't have enough information to define the next focusable node
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D72258544
fbshipit-source-id: dcc2410b408eab5dbefc4512e0680cbe7f18c811
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50638
There were two issues with inset shadows here that I fixed
* If spread was big enough it would "invert" the clear region. [RectF's inset](https://developer.android.com/reference/android/graphics/RectF#inset(float,%20float)) method does not bound to a 0x0 rect, it will instead start making the rect bigger if the inset value is large enough.
* If the clear region was outside the rect the shadow disappeared. This is because [Canvas's drawDoubleRoundRect](https://developer.android.com/reference/android/graphics/Canvas#drawDoubleRoundRect(android.graphics.RectF,%20float[],%20android.graphics.RectF,%20float[],%20android.graphics.Paint)) will fail to draw if the inner rect is not completely inside of the outer.
Changelog: [Android][Fixed] - Fix inset shadow edge cases
Reviewed By: GijsWeterings
Differential Revision: D72833275
fbshipit-source-id: 3f42fb767630319c51a380f8ea28d682df9771a6
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50666
This diff updates the assert message in ReactNativeNewArchitectureFeatureFlags to reflect the behavior required by the assert
changelog: [internal] internal
Reviewed By: mlord93
Differential Revision: D72868428
fbshipit-source-id: 7a43aa9d3b3a2ee60e88cf77d117d97edc955af3
Summary:
Fixes https://github.com/facebook/react-native/issues/45857
The general idea behind this PR is the same for both platforms: dirty all nodes with `MeasurableYogaNode` trait when the layout is constrained with a new `fontSizeMultiplier`. There were a few caveats:
- `ParagraphShadowNode` marks its layout as clean in the constructor in most cases. To prevent that from using a stale measurement I'm using the font scale multiplier stored in `content_` property of the node. That value is then compared with the scale used to create the attributed string kept in the node's state. If those differ, the layout is not cleared.
- On Android, font scale wasn't passed down to the `SurfaceHandler`
- On Android, text measurement relies on cached `DisplayMetrics` which were not updated when the system font scale changed.
- `AndroidTextInputShadowNode` wasn't using `fontSizeMultiplier` at all. I needed to add it in all places where an `AttributedString` is constructed.
## Changelog:
[GENERAL] [FIXED] - Fixed text not updating correctly after changing font scale in settings
Pull Request resolved: https://github.com/facebook/react-native/pull/45978
Test Plan:
So far tested on the following code:
```jsx
function App() {
const [counter,setCounter] = useState(0);
const [text,setText] = useState('TextInput');
const [flag,setFlag] = useState(true);
return (
<SafeAreaView
style={{
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
}}
>
<Text style={{fontSize: 24}}>RN 24 Label Testing {flag ? 'A' : 'B'}</Text>
<TextInput value={text} onChangeText={setText} style={{fontSize: 24, borderWidth: 1}} placeholder="Placeholder" />
<Pressable onPress={() => setCounter(prevState => prevState + 1)} style={{backgroundColor: counter % 2 === 0 ? 'red' : 'blue', width: 200, height: 50}} />
<Pressable onPress={() => setFlag(!flag)} style={{backgroundColor: 'green', width: 200, height: 50}} />
</SafeAreaView>
);
}
```
Reviewed By: NickGerleman
Differential Revision: D71727907
Pulled By: j-piasecki
fbshipit-source-id: 240fb5fa4967a9182bce7e885798b233d1e25aea
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50377
Configures the Hermes Parser to target React 19, which changes components written with Component Syntax to stop generating `forwardRef` calls (because `ref` is now a prop).
Changelog:
[General][Changed] - Configured Hermes Parser to target React 19, resulting in Component Syntax no longer producing `forwardRef` calls.
Reviewed By: javache, SamChou19815
Differential Revision: D72070021
fbshipit-source-id: b891789d4ff1cbcb8eebea3525361ab14e628b51
Summary:
Migrated FrescoBasedReactTextInlineImageShadowNode.java to Kotlin as part of the React Native Kotlin migration initiative.
This change helps modernize the React Native Android codebase and improve maintainability.
No functional changes were introduced—only a language conversion while preserving the original logic and behavior.
## Changelog:
[ANDROID] [CHANGED] - Migrated FrescoBasedReactTextInlineImageShadowNode.java to Kotlin
Pull Request resolved: https://github.com/facebook/react-native/pull/50693
Test Plan:
✅ Ran yarn && yarn android in the root directory and verified RNTester builds successfully.
✅ Opened RNTester on an Android emulator/device and navigated through various screens to ensure the app works as expected.
✅ Specifically tested views with FrescoBasedReactTextInlineImageShadowNode enabled to confirm runtime behavior remains unchanged.
✅ Used [KtFmt](https://github.com/facebook/ktfmt) to format the Kotlin file properly.
Reviewed By: cortinico
Differential Revision: D72948067
Pulled By: rshest
fbshipit-source-id: ed56e6b328804d7b70271b669d101f70d6190d7f
Summary:
On Android, when resource shrinking is enabled, all resources added by Metro may be removed as react-native is accessing resources based on strings rather than references, so AGP can't see its usage.
Example output of `android/app/build/outputs/mapping/release/resources.txt `when `shrinkResources` is enabled.
```
raw/__node_modules_expo_vectoricons_build_vendor_reactnativevectoricons_fonts_materialcommunityicons : reachable=false
drawable/__common_assets_haptics_icon : reachable=false
```
It’s a coincidence that most of the resources are currently working, as many file names begin with strings that already exist in the String Pool. For example, `node_modules...` is flagged as used because 'node' is present in the String Pool, causing it to be whitelisted. However, this does not guarantee that the same will apply to all files - especially in a monorepo setup, where paths are significantly different. For example
* `__node_modules_expo_vectoricons_build_vendor_reactnativevectoricons_fonts_materialcommunityicons`
* `__common_assets_haptics_icon`
To prevent that behavior, metro during assets export should create `keep.xml` listing all resources generated by metro.
https://developer.android.com/build/shrink-code#keep-resources
We have already made a similar change in expo cli: https://github.com/expo/expo/pull/35465
## Changelog:
[ANDROID][ADDED] - Generate keep.xml to prevent resource shrinking
Pull Request resolved: https://github.com/facebook/react-native/pull/50620
Test Plan:
1. Enable resource shrinking in RNTester by adding this to `android.buildTypes.release` to `packages/rn-tester/android/app/build.gradle.kts`
```gradle
isMinifyEnabled = true
isShrinkResources = true
```
2. Use some resources in playground, for example:
```diff
diff --git a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js
index 9dbacb99701..9ac9c231f3f 100644
--- a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js
+++ b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js
@@ -11,16 +11,14 @@
import type {RNTesterModuleExample} from '../../types/RNTesterTypes';
-import RNTesterText from '../../components/RNTesterText';
import * as React from 'react';
import {StyleSheet, View} from 'react-native';
+import {Header} from "react-native/Libraries/NewAppScreen";
function Playground() {
return (
<View style={styles.container}>
- <RNTesterText>
- Edit "RNTesterPlayground.js" to change this file
- </RNTesterText>
+ <Header />
</View>
);
}
```
3. Build app using `hermesRelease` variant
4. See Playground screen
| Before | After |
|---|---|
| <img width="488" alt="Zrzut ekranu 2025-04-10 o 12 17 53" src="https://github.com/user-attachments/assets/24fcaa7b-6ddb-4ba6-9fe5-65c27bcbc931" /> | <img width="488" alt="Zrzut ekranu 2025-04-10 o 12 15 58" src="https://github.com/user-attachments/assets/09a1ce77-be26-4571-a4b8-c466bf19e026" /> |
5. Inspect `packages/rn-tester/android/app/build/outputs/mapping/hermesRelease/resources.txt`
| Before | After |
|---|---|
| `drawable/_reactnative_libraries_newappscreen_components_logo : reachable=false` | `drawable/_reactnative_libraries_newappscreen_components_logo : reachable=true` |
Reviewed By: cortinico
Differential Revision: D72960028
Pulled By: huntie
fbshipit-source-id: df725fa2ea50150cd67687a97986976ffbbb5b40
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50698
Changelog: [internal]
This cleans up the flag to enable paint time reporting for Event Timing API entries, as this reporting fixes a bug and we've verified is stable/performant enough.
Reviewed By: rshest
Differential Revision: D72960337
fbshipit-source-id: 976810382208b9403c01c80324b540570bbc0e42
Summary:
Avoid incorrectly updating caret position
Pull Request resolved: https://github.com/facebook/react-native/issues/50641
The caret position is updated incorrectly when a user is first typing if an zero-length selection is set.
## Changelog:
[IOS] [CHANGED] - Typing into TextInput now will not cause the caret position to update to the beginning when a zero-length selection is set.
Pull Request resolved: https://github.com/facebook/react-native/pull/50680
Test Plan:
Tested with the following code(a simplified version from the code in https://github.com/facebook/react-native/issues/50641)
```js
const [selection, setSelection] = useState({start: -1, end: -1});
const onSelectionChange = (
evt: NativeSyntheticEvent<TextInputSelectionChangeEventData>,
) => {
const {selection} = evt.nativeEvent;
const {start, end} = selection;
console.log('selection change: ', start, end);
setSelection(selection);
};
return (
<View style={{ position: 'absolute', top: 50, left: 30 }}>
<TextInput
placeholder="test"
selection={selection}
onSelectionChange={onSelectionChange}
/>
</View>
);
```
When using the main branch, the caret position will jump back to the beginning after the first typing.
It works fine after applying this commit.
Reviewed By: fabriziocucci
Differential Revision: D72957245
Pulled By: cipolleschi
fbshipit-source-id: 3586797332b35e86b17f386a35e7d192ff758f7e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50699
Changelog: [internal]
Just changing the template to include emojis in the top level titles to make it easier to scan the doc
Reviewed By: lenaic
Differential Revision: D72961870
fbshipit-source-id: 64c45e7ac769c38af06ea318cdb581a04e230f90
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50656
This is going to convert to Kotlin one of the biggest class we have: ReactTextInputManager
As this class is quite big, I suspect there will be breakages.
https://github.com/search?type=code&q=%22%3A+ReactTextInputManager%22
I will investigate further and adjust the class as necessary.
Changelog:
[Android] [Breaking] - ReactTextInputManager is now in Kotlin
Reviewed By: rshest
Differential Revision: D72859925
fbshipit-source-id: 140d1a48ef891f1e6a401e3be59a11d3f9e24078
Summary:
Static code analysis detected obsolete SDK version checks.
Since [the minimum supported SDK version is API 24](https://github.com/react-native-community/discussions-and-proposals/discussions/802), these checks for API 21 are no longer necessary and can be safely removed.
## Changelog:
[INTERNAL] - Remove obsolete TargetApi annotations for LOLLIPOP (API 21)
Pull Request resolved: https://github.com/facebook/react-native/pull/50686
Test Plan:
```sh
yarn test-android
yarn android
```
CI should be green.
Reviewed By: cortinico
Differential Revision: D72948073
Pulled By: rshest
fbshipit-source-id: 1dd1415364d19f115771de3643cdc023a247d851
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50645
While we were refactoring the generation of the podspec, we made a mistake and we started generating the ReactCodegen.podspec for both libraries and apps.
This must be generated only for apps.
## Changelog:
[iOS][Fixed] - Generate `ReactCodegen.podspec` only for apps.
Reviewed By: fabriziocucci
Differential Revision: D72854074
fbshipit-source-id: 5a1d1120e576d4fe4cf8f733793f5a2619278c2b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50542
After TS types generation is completed, react native deep imports will be deprecated. This rule produces warnings to let users know to use root imports instead. For more information about why this rule was added, please check [RFC](https://github.com/react-native-community/discussions-and-proposals/pull/894).
Changelog:
[General][Added] - Added no-deep-imports rule to eslint-plugin-react-native.
Reviewed By: robhogan
Differential Revision: D71398004
fbshipit-source-id: 69104f69b1b1c59b5b0f115dcdd708a46d8d614d
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50657
The ReactTextInputManager file is huge and really hard to migrate to Kotlin.
Here I'm extracting 4 private inner classes to separate files and converting them to Kotlin.
This will make reviewing the Kotlin migration of ReactTextInputManager a bit easier.
Changelog:
[Internal] [Changed] -
Reviewed By: rshest
Differential Revision: D72858396
fbshipit-source-id: 1fcca1b8421c810aa4bf9fdca7656f4e805565d8
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50647
This diff makes the following file internal - ReactTextInputShadowNode
as part of our ongoing effort of reducing the API surface.
There is only one usage in OSS: `react-native-aztec`. The library is abandoned
with little weekly download so we should be good marking this as internal.
Changelog:
[Internal] [Changed] - ReactTextInputShadowNode is now internal.
Reviewed By: javache
Differential Revision: D72854896
fbshipit-source-id: 27512704ed84e893ae72d26469527276133a6295
Summary:
We fixed the previous layout issue when it wasn't in a ScrollView (I think text caching problem?) Let's enable for more than just Catalyst, and re-enable this test for iOS!
Changelog: [Internal]
Reviewed By: GijsWeterings
Differential Revision: D72683455
fbshipit-source-id: 538f8e23226c07510d382e45eb29f1710822849e
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50673
Because, this is less a pain then trying to shrink every example to fit in to the tiny window given to us by Jest E2E.
Changelog: [Internal]
Reviewed By: joevilches
Differential Revision: D72683487
fbshipit-source-id: 5c08bd04445fc573086bc780194c893d0cb6ea19
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50672
We have precious little screen real estate, esp in E2E tests where we get 320x192 dips. Let's clean this up.
Changelog: [Internal]
Reviewed By: cortinico, GijsWeterings
Differential Revision: D72683491
fbshipit-source-id: 222a77f937dfb9dcceb627d8f084c58df7c07b56
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50669
Fixes a bug that was introduced while migrating from Java to Kotlin.
Changelog:
[Android][Changed] - Fixed a bug with synchronously fetching resources from Metro.
Reviewed By: cortinico, mdvacca
Differential Revision: D72878362
fbshipit-source-id: feb881fa51f6eaa2cb5c7ba87ac93b7fdc29dc2c
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50636
A while ago someone on GitHub reported that box shadow on iOS was causing frame drops when animating a large, pretty blurry shadow: https://github.com/facebook/react-native/issues/49128. This week I finally got around to fixing this!
The slowness was happening since we were using CG to draw this shadow, which is very CPU intensive and, to my knowledge, does not take advantage of GPUs to do anything. Couple that with an animating, large, blurry shadow and we have frame issues. These shadows were taking very long to draw, to get the image of the shadow (which then needs to be copied into some texture 3 times as big, composited, put on the screen etc) took 12-14ms :o, thats very slow.
To fix this I figured out how to get CA's shadow APIs working, which take advantage of the GPU. The enable inset shadows and spread you have to get creative with a mix of `shadowPath` and `mask` with a `CAShapeLayer`, but we got it done! Things are much faster, I am not sure how to time this but using a real device shows no frame drops :D
Changelog: [iOS][Fixed] - Box shadows on iOS are faster
Reviewed By: lenaic
Differential Revision: D72823334
fbshipit-source-id: 460339c9d77e7423ce59a1a9178b6b3ad527e4b0
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50665
Changelog: [internal]
Just a stylistic change of the link back to the documentation home.
It also changes the link in the template to make sure it's incorrect so people are forced to edit it when creating new docs.
Reviewed By: lenaic
Differential Revision: D72866823
fbshipit-source-id: fa7be286f996049b3f06e2defa5a8c486d63091b
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50663
Changelog: [internal]
Adds additional documentation about pragmas and feature flags for Fantom.
Changes the diagram to mention that feature flags are passed to the Fantom CLI.
Reviewed By: andrewdacenko
Differential Revision: D72865960
fbshipit-source-id: abfd167279195495064f3c4dbdcaff92dd865bcf
Summary:
This PR introduces a rewrite of `DynamicFromMap.java` to Kotlin as requested in https://github.com/facebook/react-native/issues/50513.
## Changelog:
[ANDROID] [CHANGED] - Migrated `DynamicFromMap.java` to Kotlin
Pull Request resolved: https://github.com/facebook/react-native/pull/50597
Test Plan:
1. Implement unit tests for `DynamicFromMap.kt` - `DynamicFromMapTests.kt`
2. Ensure the tests pass: `./gradlew test`
3. Run the RN tester app on new & on old architectures
Reviewed By: javache, rshest
Differential Revision: D72853616
Pulled By: cortinico
fbshipit-source-id: 855acdc7fa7810ab9f223b0be7778c028a646de5
priyanka.raghuvanshi
Jorge Cabiedes Acosta
Joe Vilches
David Vacca
Omar Bafagih
Mateo Guzmán
Alan Lee
Ruslan Shestopalyuk
Jakub Piasecki
Jakub Piasecki
Tim Yung
Andrew Datsenko
Nitin Shukla
Jakub Grzywacz
Rubén Norte
Wang Chuan
Nicola Corti
Riccardo Cipolleschi
Dawid Małecki
Panos Vekris
Nick Gerleman
Zeya Peng
artus9033