From 415a75f95accb55beb440498e51eb837cc52337f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rub=C3=A9n=20Norte?= Date: Mon, 21 Sep 2026 05:50:51 -0700 Subject: [PATCH 1/4] Expose renderer through unstable internals Summary: Expose the renderer proxy as `Renderer` from `react-native/unstable-internals-do-not-use`. Generated Codegen modules can be emitted into consumer packages and need a package entry point for dispatching renderer commands without deep imports. Changelog: [Internal] Differential Revision: D120991150 --- .../src/unstable-internals-do-not-use.d.ts | 51 +++++++++++++++++++ .../src/unstable-internals-do-not-use.js | 30 +++++++++++ .../src/unstable-internals-do-not-use.js.flow | 6 +++ 3 files changed, 87 insertions(+) diff --git a/packages/react-native/src/unstable-internals-do-not-use.d.ts b/packages/react-native/src/unstable-internals-do-not-use.d.ts index 6c1f3bf54c40..6ca8ac9f1a01 100644 --- a/packages/react-native/src/unstable-internals-do-not-use.d.ts +++ b/packages/react-native/src/unstable-internals-do-not-use.d.ts @@ -14,6 +14,8 @@ // ---------------------------------------------------------------------------- import type * as React from 'react'; +import type {ColorValue} from '../types_generated/Libraries/StyleSheet/StyleSheet'; +import type {ProcessedColorValue} from '../types_generated/Libraries/StyleSheet/processColor'; // #region AppContainer @@ -64,6 +66,17 @@ export class AssetSourceResolver { static pickScale(scales: number[], deviceScale?: number): number; } +// #endregion +// #region ConditionallyIgnoredEventHandlers + +/** + * Marks generated event-handler view-config attributes as conditionally + * ignored on platforms that do not synthesize them from native view managers. + */ +export function ConditionallyIgnoredEventHandlers< + T extends Readonly>, +>(value: T): T | undefined; + // #endregion // #region customDirectEventTypes @@ -212,3 +225,41 @@ interface PressabilityDebugViewProps { export const PressabilityDebugView: React.ComponentType; // #endregion +// #region Renderer + +/** Renderer APIs used by generated Codegen modules. */ +export * as Renderer from '../types_generated/Libraries/ReactNative/RendererImplementation'; + +// #endregion +// #region Codegen view config helpers + +export const colorAttribute: + | true + | Readonly<{ + process: typeof import('../types_generated/Libraries/StyleSheet/processColor').default; + }>; + +export function processColorArray( + colors: ReadonlyArray | null | undefined, +): ReadonlyArray | null; + +type Point = { + x: number | null | undefined; + y: number | null | undefined; +}; + +export function pointsDiffer( + one: Point | null | undefined, + two: Point | null | undefined, +): boolean; + +type EdgeInsets = { + top: number | null | undefined; + left: number | null | undefined; + right: number | null | undefined; + bottom: number | null | undefined; +}; + +export function insetsDiffer(one: EdgeInsets, two: EdgeInsets): boolean; + +// #endregion diff --git a/packages/react-native/src/unstable-internals-do-not-use.js b/packages/react-native/src/unstable-internals-do-not-use.js index 96c7b48e1ab0..a83bbb9b9d02 100644 --- a/packages/react-native/src/unstable-internals-do-not-use.js +++ b/packages/react-native/src/unstable-internals-do-not-use.js @@ -40,15 +40,21 @@ // and unstable-internals-do-not-use.js.flow. // ---------------------------------------------------------------------------- +import typeof {colorAttribute} from '../Libraries/Components/View/ReactNativeStyleAttributes'; import typeof getDevServer from '../Libraries/Core/Devtools/getDevServer'; import typeof NativeExceptionsManager from '../Libraries/Core/NativeExceptionsManager'; import typeof AssetSourceResolver from '../Libraries/Image/AssetSourceResolver'; +import typeof {ConditionallyIgnoredEventHandlers} from '../Libraries/NativeComponent/ViewConfigIgnore'; import typeof NativeRedBox from '../Libraries/NativeModules/specs/NativeRedBox'; import typeof NativeSourceCode from '../Libraries/NativeModules/specs/NativeSourceCode'; import typeof {PressabilityDebugView} from '../Libraries/Pressability/PressabilityDebug'; import typeof AppContainer from '../Libraries/ReactNative/AppContainer'; +import typeof * as Renderer from '../Libraries/ReactNative/RendererProxy'; import typeof {customDirectEventTypes} from '../Libraries/Renderer/shims/ReactNativeViewConfigRegistry'; +import typeof processColorArray from '../Libraries/StyleSheet/processColorArray'; import typeof DevLoadingView from '../Libraries/Utilities/DevLoadingView'; +import typeof insetsDiffer from '../Libraries/Utilities/differ/insetsDiffer'; +import typeof pointsDiffer from '../Libraries/Utilities/differ/pointsDiffer'; import typeof HMRClient from '../Libraries/Utilities/HMRClient'; // flowlint unsafe-getters-setters:off @@ -60,6 +66,12 @@ module.exports = { get AssetSourceResolver(): AssetSourceResolver { return require('../Libraries/Image/AssetSourceResolver').default; }, + get ConditionallyIgnoredEventHandlers(): ConditionallyIgnoredEventHandlers<{ + readonly [name: string]: true, + }> { + return require('../Libraries/NativeComponent/ViewConfigIgnore') + .ConditionallyIgnoredEventHandlers; + }, get customDirectEventTypes(): customDirectEventTypes { return require('../Libraries/Renderer/shims/ReactNativeViewConfigRegistry') .customDirectEventTypes; @@ -86,4 +98,22 @@ module.exports = { return require('../Libraries/Pressability/PressabilityDebug') .PressabilityDebugView; }, + // Generated Codegen modules can be emitted outside this package, so they + // cannot use package-relative imports to access these implementations. + get colorAttribute(): colorAttribute { + return require('../Libraries/Components/View/ReactNativeStyleAttributes') + .colorAttribute; + }, + get insetsDiffer(): insetsDiffer { + return require('../Libraries/Utilities/differ/insetsDiffer').default; + }, + get pointsDiffer(): pointsDiffer { + return require('../Libraries/Utilities/differ/pointsDiffer').default; + }, + get processColorArray(): processColorArray { + return require('../Libraries/StyleSheet/processColorArray').default; + }, + get Renderer(): Renderer { + return require('../Libraries/ReactNative/RendererProxy'); + }, }; diff --git a/packages/react-native/src/unstable-internals-do-not-use.js.flow b/packages/react-native/src/unstable-internals-do-not-use.js.flow index b5f6ddec6a15..5e18d997a876 100644 --- a/packages/react-native/src/unstable-internals-do-not-use.js.flow +++ b/packages/react-native/src/unstable-internals-do-not-use.js.flow @@ -16,6 +16,8 @@ export {default as AppContainer} from '../Libraries/ReactNative/AppContainer'; export {default as AssetSourceResolver} from '../Libraries/Image/AssetSourceResolver'; +export {colorAttribute} from '../Libraries/Components/View/ReactNativeStyleAttributes'; +export {ConditionallyIgnoredEventHandlers} from '../Libraries/NativeComponent/ViewConfigIgnore'; export {customDirectEventTypes} from '../Libraries/Renderer/shims/ReactNativeViewConfigRegistry'; export {default as DevLoadingView} from '../Libraries/Utilities/DevLoadingView'; export {default as getDevServer} from '../Libraries/Core/Devtools/getDevServer'; @@ -24,3 +26,7 @@ export {default as NativeExceptionsManager} from '../Libraries/Core/NativeExcept export {default as NativeRedBox} from '../Libraries/NativeModules/specs/NativeRedBox'; export {default as NativeSourceCode} from '../Libraries/NativeModules/specs/NativeSourceCode'; export {PressabilityDebugView} from '../Libraries/Pressability/PressabilityDebug'; +export {default as insetsDiffer} from '../Libraries/Utilities/differ/insetsDiffer'; +export {default as pointsDiffer} from '../Libraries/Utilities/differ/pointsDiffer'; +export {default as processColorArray} from '../Libraries/StyleSheet/processColorArray'; +export * as Renderer from '../Libraries/ReactNative/RendererProxy'; From 24835716215ed49c274fa6eda52ff07cddf05045 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rub=C3=A9n=20Norte?= Date: Mon, 21 Sep 2026 05:50:53 -0700 Subject: [PATCH 2/4] Remove deep imports from the Jest preset Summary: Use the React Native root and supported secondary entry points for public APIs used by the Jest preset. Resolve implementation modules through package-relative paths so the preset does not depend on unsupported package subpaths. Changelog: [Internal] Differential Revision: D120717568 --- jest.config.js | 2 ++ packages/jest-preset/jest/mocks/ActivityIndicator.js | 2 +- packages/jest-preset/jest/mocks/Image.js | 2 +- packages/jest-preset/jest/mocks/Modal.js | 2 +- packages/jest-preset/jest/mocks/RefreshControl.js | 2 +- packages/jest-preset/jest/mocks/ScrollView.js | 2 +- packages/jest-preset/jest/mocks/Text.js | 2 +- packages/jest-preset/jest/mocks/TextInput.js | 2 +- packages/jest-preset/jest/mocks/View.js | 2 +- packages/jest-preset/jest/mocks/ViewNativeComponent.js | 2 +- 10 files changed, 11 insertions(+), 9 deletions(-) diff --git a/jest.config.js b/jest.config.js index 6e98ae747ea4..a91ef75838af 100644 --- a/jest.config.js +++ b/jest.config.js @@ -32,6 +32,8 @@ module.exports = { '/packages/react-native/src/react-private-interface.js', '^react-native/setup-env$': '/packages/react-native/src/setup-env.js', + '^react-native/unstable-internals-do-not-use$': + '/packages/react-native/src/unstable-internals-do-not-use.js', }, setupFiles: ['./packages/jest-preset/jest/local-setup.js'], fakeTimers: { diff --git a/packages/jest-preset/jest/mocks/ActivityIndicator.js b/packages/jest-preset/jest/mocks/ActivityIndicator.js index 42b6075a5a51..71499a60a321 100644 --- a/packages/jest-preset/jest/mocks/ActivityIndicator.js +++ b/packages/jest-preset/jest/mocks/ActivityIndicator.js @@ -9,7 +9,7 @@ */ import typeof * as TmockComponent from '../mockComponent'; -import typeof TActivityIndicator from 'react-native/Libraries/Components/ActivityIndicator/ActivityIndicator'; +import typeof {ActivityIndicator as TActivityIndicator} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/Image.js b/packages/jest-preset/jest/mocks/Image.js index 8d65ba8a488a..39e335889979 100644 --- a/packages/jest-preset/jest/mocks/Image.js +++ b/packages/jest-preset/jest/mocks/Image.js @@ -9,7 +9,7 @@ */ import typeof * as TmockComponent from '../mockComponent'; -import typeof TImage from 'react-native/Libraries/Image/Image'; +import typeof {Image as TImage} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/Modal.js b/packages/jest-preset/jest/mocks/Modal.js index d8514d27a44c..e099887ded47 100644 --- a/packages/jest-preset/jest/mocks/Modal.js +++ b/packages/jest-preset/jest/mocks/Modal.js @@ -9,7 +9,7 @@ */ import typeof * as TmockComponent from '../mockComponent'; -import type {ModalProps} from 'react-native/Libraries/Modal/Modal'; +import type {ModalProps} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/RefreshControl.js b/packages/jest-preset/jest/mocks/RefreshControl.js index cb9800dbbb75..d7a1c072660d 100644 --- a/packages/jest-preset/jest/mocks/RefreshControl.js +++ b/packages/jest-preset/jest/mocks/RefreshControl.js @@ -8,7 +8,7 @@ * @format */ -import type {RefreshControlProps} from 'react-native/Libraries/Components/RefreshControl/RefreshControl'; +import type {RefreshControlProps} from 'react-native'; import type {HostComponent} from 'react-native/src/private/types/HostComponent'; import * as React from 'react'; diff --git a/packages/jest-preset/jest/mocks/ScrollView.js b/packages/jest-preset/jest/mocks/ScrollView.js index 39d8f69af9d1..06a1bf85e4dc 100644 --- a/packages/jest-preset/jest/mocks/ScrollView.js +++ b/packages/jest-preset/jest/mocks/ScrollView.js @@ -10,7 +10,7 @@ import typeof * as TmockComponent from '../mockComponent'; import typeof * as TMockNativeMethods from '../MockNativeMethods'; -import typeof TScrollView from 'react-native/Libraries/Components/ScrollView/ScrollView'; +import typeof {ScrollView as TScrollView} from 'react-native'; import type {ScrollViewNativeProps} from 'react-native/Libraries/Components/ScrollView/ScrollViewNativeComponentType'; import * as React from 'react'; diff --git a/packages/jest-preset/jest/mocks/Text.js b/packages/jest-preset/jest/mocks/Text.js index da56850e8a30..89f33c0b35e0 100644 --- a/packages/jest-preset/jest/mocks/Text.js +++ b/packages/jest-preset/jest/mocks/Text.js @@ -10,7 +10,7 @@ import typeof * as TmockComponent from '../mockComponent'; import typeof * as TMockNativeMethods from '../MockNativeMethods'; -import typeof TText from 'react-native/Libraries/Text/Text'; +import typeof {Text as TText} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/TextInput.js b/packages/jest-preset/jest/mocks/TextInput.js index fc34a8b65dcf..b74e7ab8a926 100644 --- a/packages/jest-preset/jest/mocks/TextInput.js +++ b/packages/jest-preset/jest/mocks/TextInput.js @@ -10,7 +10,7 @@ import typeof * as TmockComponent from '../mockComponent'; import typeof * as TMockNativeMethods from '../MockNativeMethods'; -import typeof TTextInput from 'react-native/Libraries/Components/TextInput/TextInput'; +import typeof {TextInput as TTextInput} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/View.js b/packages/jest-preset/jest/mocks/View.js index dca384233d21..fce3ca9fca0c 100644 --- a/packages/jest-preset/jest/mocks/View.js +++ b/packages/jest-preset/jest/mocks/View.js @@ -10,7 +10,7 @@ import typeof * as TmockComponent from '../mockComponent'; import typeof * as TMockNativeMethods from '../MockNativeMethods'; -import typeof TView from 'react-native/Libraries/Components/View/View'; +import typeof {View as TView} from 'react-native'; const mockComponent = jest.requireActual('../mockComponent').default; diff --git a/packages/jest-preset/jest/mocks/ViewNativeComponent.js b/packages/jest-preset/jest/mocks/ViewNativeComponent.js index 716bd4c89a3c..4f6ca6f36eae 100644 --- a/packages/jest-preset/jest/mocks/ViewNativeComponent.js +++ b/packages/jest-preset/jest/mocks/ViewNativeComponent.js @@ -8,7 +8,7 @@ * @format */ -import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes'; +import type {ViewProps} from 'react-native'; import * as React from 'react'; import {createElement} from 'react'; From 5a5378dc531e715149225ce158a5ec9a0d67daac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rub=C3=A9n=20Norte?= Date: Mon, 21 Sep 2026 05:50:53 -0700 Subject: [PATCH 3/4] Remove deep imports from generated Codegen modules Summary: Generate view configs and Codegen fixtures using supported React Native entry points or values derived from their exports. Generated view config modules can be emitted into arbitrary consumer package locations, so they cannot use a package-relative path back into React Native. Keep `ConditionallyIgnoredEventHandlers` centralized and expose it from the explicitly unstable compatibility entry point instead of duplicating its platform-specific semantics in generated output. Changelog: [Internal] Differential Revision: D120717571 --- .../__snapshots__/index-test.js.snap | 40 +++--- .../__tests__/react-native-modules-test.js | 5 +- packages/jest-preset/jest-preset.js | 10 +- .../src/__tests__/transform-snapshot-test.js | 8 +- .../GenerateViewConfigJs-test.js.snap | 58 ++++---- .../GenerateViewConfigJs-test.js.snap | 58 ++++---- .../components/GenerateViewConfigJs.js | 29 ++-- .../GenerateViewConfigJs-test.js.snap | 124 +++++++++--------- .../parsers/__tests__/parsers-commons-test.js | 12 +- .../js/PopupMenuAndroid.android.js | 3 +- ...PopupMenuAndroidNativeComponent.android.js | 16 +-- .../Types/CodegenTypesNamespace.d.ts | 3 +- .../types_DEPRECATED/modules/Codegen.d.ts | 3 +- .../simple-scenario-frontend-test.ts | 3 +- 14 files changed, 187 insertions(+), 185 deletions(-) diff --git a/packages/babel-plugin-codegen/__tests__/__snapshots__/index-test.js.snap b/packages/babel-plugin-codegen/__tests__/__snapshots__/index-test.js.snap index c038ee55988e..f86c0eaa8a0b 100644 --- a/packages/babel-plugin-codegen/__tests__/__snapshots__/index-test.js.snap +++ b/packages/babel-plugin-codegen/__tests__/__snapshots__/index-test.js.snap @@ -15,7 +15,9 @@ interface NativeCommands { +seek: (viewRef: React.ElementRef, position: number) => void, +stop: (viewRef: React.ElementRef) => void, } -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const { + NativeComponentRegistry +} = require('react-native'); let nativeComponentName = 'Module'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"Module\\", @@ -39,7 +41,9 @@ interface NativeCommands { +pause: (viewRef: React.ElementRef) => void, +play: (viewRef: React.ElementRef) => void, } -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const { + NativeComponentRegistry +} = require('react-native'); let nativeComponentName = 'Module'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"Module\\", @@ -63,7 +67,9 @@ interface NativeCommands { +mute: (viewRef: React.ElementRef) => void, +unmute: (viewRef: React.ElementRef) => void, } -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const { + NativeComponentRegistry +} = require('react-native'); let nativeComponentName = 'Module'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"Module\\", @@ -93,13 +99,15 @@ interface NativeCommands { +hotspotUpdate: (viewRef: React.ElementRef, x: Int32, y: Int32) => void, +scrollTo: (viewRef: React.ElementRef, y: Int32, animated: boolean) => void, } -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); const { ConditionallyIgnoredEventHandlers -} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +} = require('react-native/unstable-internals-do-not-use'); const { - dispatchCommand -} = require(\\"react-native/Libraries/ReactNative/RendererProxy\\"); + NativeComponentRegistry +} = require('react-native'); +const { + Renderer +} = require(\\"react-native/unstable-internals-do-not-use\\"); let nativeComponentName = 'RCTModule'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"RCTModule\\", @@ -127,10 +135,10 @@ export const __INTERNAL_VIEW_CONFIG = { export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); export const Commands = { hotspotUpdate(ref, x, y) { - dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); + Renderer.dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); }, scrollTo(ref, y, animated) { - dispatchCommand(ref, \\"scrollTo\\", [y, animated]); + Renderer.dispatchCommand(ref, \\"scrollTo\\", [y, animated]); } };" `; @@ -156,13 +164,15 @@ interface NativeCommands { +hotspotUpdate: (viewRef: React.ElementRef, x: Int32, y: Int32) => void, +scrollTo: (viewRef: React.ElementRef, y: Int32, animated: boolean) => void, } -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); const { ConditionallyIgnoredEventHandlers -} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +} = require('react-native/unstable-internals-do-not-use'); +const { + NativeComponentRegistry +} = require('react-native'); const { - dispatchCommand -} = require(\\"react-native/Libraries/ReactNative/RendererProxy\\"); + Renderer +} = require(\\"react-native/unstable-internals-do-not-use\\"); let nativeComponentName = 'RCTModule'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"RCTModule\\", @@ -190,10 +200,10 @@ export const __INTERNAL_VIEW_CONFIG = { export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); export const Commands = { hotspotUpdate(ref, x, y) { - dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); + Renderer.dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); }, scrollTo(ref, y, animated) { - dispatchCommand(ref, \\"scrollTo\\", [y, animated]); + Renderer.dispatchCommand(ref, \\"scrollTo\\", [y, animated]); } };" `; diff --git a/packages/eslint-plugin-specs/__tests__/react-native-modules-test.js b/packages/eslint-plugin-specs/__tests__/react-native-modules-test.js index 7785db83139f..3235c1969427 100644 --- a/packages/eslint-plugin-specs/__tests__/react-native-modules-test.js +++ b/packages/eslint-plugin-specs/__tests__/react-native-modules-test.js @@ -20,11 +20,10 @@ const eslintTester = new ESLintTester(); const VALID_SPECS = [ { code: ` -import {TurboModuleRegistry, type TurboModule} from 'react-native'; -import type {UnsafeObject} from 'react-native/Libraries/Types/CodegenTypes'; +import {TurboModuleRegistry, type CodegenTypes, type TurboModule} from 'react-native'; export interface Spec extends TurboModule { - func1(a: string): UnsafeObject, + func1(a: string): CodegenTypes.UnsafeObject, } export default TurboModuleRegistry.get('XYZ'); `, diff --git a/packages/jest-preset/jest-preset.js b/packages/jest-preset/jest-preset.js index 720a73efdca4..81f226a8e43c 100644 --- a/packages/jest-preset/jest-preset.js +++ b/packages/jest-preset/jest-preset.js @@ -18,13 +18,13 @@ module.exports = { platforms: ['android', 'ios', 'native'], }, moduleNameMapper: { - // `setup-env` and `react-private-interface` are secondary entry points - // exposed via the package's `exports`, but `./jest/resolver.js` strips - // `exports` and the generic mapper below resolves subpaths as literal - // directory paths. Alias them explicitly so they resolve to their `src/` - // implementations. + // These secondary entry points are exposed via the package's `exports`, + // but `./jest/resolver.js` strips `exports` and the generic mapper below + // resolves subpaths as literal directory paths. Alias them explicitly so + // they resolve to their `src/` implementations. '^react-native/react-private-interface$': `${path.dirname(require.resolve('react-native'))}/src/react-private-interface.js`, '^react-native/setup-env$': `${path.dirname(require.resolve('react-native'))}/src/setup-env.js`, + '^react-native/unstable-internals-do-not-use$': `${path.dirname(require.resolve('react-native'))}/src/unstable-internals-do-not-use.js`, '^react-native($|/.*)': `${path.dirname(require.resolve('react-native'))}/$1`, }, resolver: require.resolve('./jest/resolver.js'), diff --git a/packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js b/packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js index fb50cec1c5f4..55390bcabf23 100644 --- a/packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js +++ b/packages/react-native-babel-preset/src/__tests__/transform-snapshot-test.js @@ -316,9 +316,11 @@ describe('react-native-babel-preset transform snapshots', () => { it('runs codegen when the type arguments are separated by trivia', () => { const code = ` // @flow strict-local - import type {ViewProps} from 'react-native'; - import type {HostComponent} from 'react-native'; - import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; + import { + codegenNativeComponent, + type HostComponent, + type ViewProps, + } from 'react-native'; type NativeProps = Readonly<{ ...ViewProps, diff --git a/packages/react-native-codegen/e2e/deep_imports/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap b/packages/react-native-codegen/e2e/deep_imports/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap index bb0a9098fc04..7eb32dcd4bc1 100644 --- a/packages/react-native-codegen/e2e/deep_imports/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap +++ b/packages/react-native-codegen/e2e/deep_imports/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap @@ -16,7 +16,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -27,7 +27,7 @@ export const __INTERNAL_VIEW_CONFIG = { progress: true, radii: true, colors: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) + process: require('react-native/unstable-internals-do-not-use').processColorArray }, srcs: true, points: true, @@ -60,7 +60,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'BooleanPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -91,13 +91,13 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ColorPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ColorPropNativeComponentView\\", validAttributes: { - tintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute + tintColor: require('react-native/unstable-internals-do-not-use').colorAttribute } }; export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); @@ -121,7 +121,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'DimensionPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -151,7 +151,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EdgeInsetsPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -179,7 +179,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EnumPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -210,8 +210,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventNestedObjectPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -252,8 +252,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -322,7 +322,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'FloatPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -358,14 +358,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ImagePropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ImagePropNativeComponentView\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource } } }; @@ -390,7 +390,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'IntegerPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -422,8 +422,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'RCTInterfaceOnlyComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -464,7 +464,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MixedPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -494,19 +494,19 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MultiNativePropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"MultiNativePropNativeComponentView\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource }, - color: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, - thumbTintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, + color: require('react-native/unstable-internals-do-not-use').colorAttribute, + thumbTintColor: require('react-native/unstable-internals-do-not-use').colorAttribute, point: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -531,7 +531,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'NoPropsNoEventsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -559,7 +559,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ObjectPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -591,14 +591,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'PointPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"PointPropNativeComponentView\\", validAttributes: { startPoint: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -623,7 +623,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'StringPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { diff --git a/packages/react-native-codegen/e2e/namespaced/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap b/packages/react-native-codegen/e2e/namespaced/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap index 054bd1a003bf..4864828d5d67 100644 --- a/packages/react-native-codegen/e2e/namespaced/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap +++ b/packages/react-native-codegen/e2e/namespaced/__tests__/components/__snapshots__/GenerateViewConfigJs-test.js.snap @@ -16,7 +16,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -27,7 +27,7 @@ export const __INTERNAL_VIEW_CONFIG = { progress: true, radii: true, colors: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) + process: require('react-native/unstable-internals-do-not-use').processColorArray }, srcs: true, points: true, @@ -60,7 +60,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'BooleanPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -91,13 +91,13 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ColorPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ColorPropNativeComponentView\\", validAttributes: { - tintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute + tintColor: require('react-native/unstable-internals-do-not-use').colorAttribute } }; export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); @@ -121,7 +121,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'DimensionPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -151,7 +151,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EdgeInsetsPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -179,7 +179,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EnumPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -210,8 +210,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventNestedObjectPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -252,8 +252,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -322,7 +322,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'FloatPropsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -358,14 +358,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ImagePropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ImagePropNativeComponentView\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource } } }; @@ -390,7 +390,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'IntegerPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -422,8 +422,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'RCTInterfaceOnlyComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -464,7 +464,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MixedPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -494,19 +494,19 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MultiNativePropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"MultiNativePropNativeComponentView\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource }, - color: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, - thumbTintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, + color: require('react-native/unstable-internals-do-not-use').colorAttribute, + thumbTintColor: require('react-native/unstable-internals-do-not-use').colorAttribute, point: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -531,7 +531,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'NoPropsNoEventsNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { @@ -559,7 +559,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ObjectPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -591,14 +591,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'PointPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"PointPropNativeComponentView\\", validAttributes: { startPoint: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -623,7 +623,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'StringPropNativeComponentView'; export const __INTERNAL_VIEW_CONFIG = { diff --git a/packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js b/packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js index 50d8d53b0f9c..d9e4de50bf98 100644 --- a/packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js +++ b/packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js @@ -55,7 +55,9 @@ ${componentConfig} // We use this to add to a set. Need to make sure we aren't importing // this multiple times. -const UIMANAGER_IMPORT = 'const {UIManager} = require("react-native")'; +const UIMANAGER_IMPORT = 'const {UIManager} = require("react-native");'; +const RENDERER_IMPORT = + 'const {Renderer} = require("react-native/unstable-internals-do-not-use");'; function expression(input: string) { return core.template.expression(input)(); @@ -77,21 +79,21 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) { switch (typeAnnotation.name) { case 'ColorPrimitive': return expression( - "require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute", + "require('react-native/unstable-internals-do-not-use').colorAttribute", ); case 'ImageSourcePrimitive': return expression( - "{ process: ((req) => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) }", + "{ process: require('react-native').Image.resolveAssetSource }", ); case 'ImageRequestPrimitive': throw new Error('ImageRequest should not be used in props'); case 'PointPrimitive': return expression( - "{ diff: ((req) => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) }", + "{ diff: require('react-native/unstable-internals-do-not-use').pointsDiffer }", ); case 'EdgeInsetsPrimitive': return expression( - "{ diff: ((req) => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/insetsDiffer')) }", + "{ diff: require('react-native/unstable-internals-do-not-use').insetsDiffer }", ); case 'DimensionPrimitive': return t.booleanLiteral(true); @@ -106,7 +108,7 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) { switch (typeAnnotation.elementType.name) { case 'ColorPrimitive': return expression( - "{ process: ((req) => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) }", + "{ process: require('react-native/unstable-internals-do-not-use').processColorArray }", ); case 'ImageSourcePrimitive': case 'PointPrimitive': @@ -192,8 +194,10 @@ function getValidAttributesForEvents( events: ReadonlyArray, imports: Set, ) { + // Generated files can live outside the React Native package, so they cannot + // use a relative import for this implementation detail. imports.add( - "const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore');", + "const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use');", ); const validAttributes = t.objectExpression( @@ -264,7 +268,7 @@ function buildViewConfig( switch (extendProps.knownTypeName) { case 'ReactNativeCoreViewProps': imports.add( - "const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry');", + "const {NativeComponentRegistry} = require('react-native');", ); return; @@ -366,9 +370,7 @@ function buildCommands( return null; } - imports.add( - 'const {dispatchCommand} = require("react-native/Libraries/ReactNative/RendererProxy");', - ); + imports.add(RENDERER_IMPORT); const commandsObject = t.objectExpression( commands.map(command => { @@ -376,7 +378,10 @@ function buildCommands( const params = command.typeAnnotation.params; const dispatchCommandCall = t.callExpression( - t.identifier('dispatchCommand'), + t.memberExpression( + t.identifier('Renderer'), + t.identifier('dispatchCommand'), + ), [ t.identifier('ref'), t.stringLiteral(commandName), diff --git a/packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap b/packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap index 7b3d95c37134..2e366a12f550 100644 --- a/packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap +++ b/packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap @@ -16,7 +16,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'AllProp'; export const __INTERNAL_VIEW_CONFIG = { @@ -62,7 +62,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'AllPropWithOptionalGen'; export const __INTERNAL_VIEW_CONFIG = { @@ -108,7 +108,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'AllPropWithOptionalObjectGen'; export const __INTERNAL_VIEW_CONFIG = { @@ -154,7 +154,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -165,7 +165,7 @@ export const __INTERNAL_VIEW_CONFIG = { progress: true, radii: true, colors: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) + process: require('react-native/unstable-internals-do-not-use').processColorArray }, srcs: true, points: true, @@ -198,7 +198,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -228,7 +228,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsOptionalGenNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -258,7 +258,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsOptionalObjectGenNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -288,7 +288,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsWithOptionalGenNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -299,7 +299,7 @@ export const __INTERNAL_VIEW_CONFIG = { progress: true, radii: true, colors: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) + process: require('react-native/unstable-internals-do-not-use').processColorArray }, srcs: true, points: true, @@ -332,7 +332,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ArrayPropsWithOptionalObjectGenNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -343,7 +343,7 @@ export const __INTERNAL_VIEW_CONFIG = { progress: true, radii: true, colors: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/StyleSheet/processColorArray')) + process: require('react-native/unstable-internals-do-not-use').processColorArray }, srcs: true, points: true, @@ -376,7 +376,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'BooleanPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -406,13 +406,13 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ColorPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ColorPropNativeComponent\\", validAttributes: { - tintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute + tintColor: require('react-native/unstable-internals-do-not-use').colorAttribute } }; export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); @@ -436,8 +436,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {dispatchCommand} = require(\\"react-native/Libraries/ReactNative/RendererProxy\\"); +const {NativeComponentRegistry} = require('react-native'); +const {Renderer} = require(\\"react-native/unstable-internals-do-not-use\\"); let nativeComponentName = 'CommandNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -447,10 +447,10 @@ export const __INTERNAL_VIEW_CONFIG = { export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); export const Commands = { flashScrollIndicators(ref) { - dispatchCommand(ref, \\"flashScrollIndicators\\", []); + Renderer.dispatchCommand(ref, \\"flashScrollIndicators\\", []); }, allTypes(ref, x, y, z, message, animated, locations) { - dispatchCommand(ref, \\"allTypes\\", [x, y, z, message, animated, locations]); + Renderer.dispatchCommand(ref, \\"allTypes\\", [x, y, z, message, animated, locations]); } }; ", @@ -473,8 +473,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {dispatchCommand} = require(\\"react-native/Libraries/ReactNative/RendererProxy\\"); +const {NativeComponentRegistry} = require('react-native'); +const {Renderer} = require(\\"react-native/unstable-internals-do-not-use\\"); let nativeComponentName = 'CommandNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -486,13 +486,13 @@ export const __INTERNAL_VIEW_CONFIG = { export default NativeComponentRegistry.get(nativeComponentName, () => __INTERNAL_VIEW_CONFIG); export const Commands = { handleRootTag(ref, rootTag) { - dispatchCommand(ref, \\"handleRootTag\\", [rootTag]); + Renderer.dispatchCommand(ref, \\"handleRootTag\\", [rootTag]); }, hotspotUpdate(ref, x, y) { - dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); + Renderer.dispatchCommand(ref, \\"hotspotUpdate\\", [x, y]); }, addItems(ref, items) { - dispatchCommand(ref, \\"addItems\\", [items]); + Renderer.dispatchCommand(ref, \\"addItems\\", [items]); } }; ", @@ -515,7 +515,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'DimensionPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -545,7 +545,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'DoublePropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -580,8 +580,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventsNestedObjectNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -622,8 +622,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'EventsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -692,8 +692,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'RCTInterfaceOnlyComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -739,7 +739,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ExcludedAndroidComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -767,7 +767,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ExcludedAndroidIosComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -795,7 +795,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ExcludedIosComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -832,7 +832,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'FloatPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -867,14 +867,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ImagePropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ImagePropNativeComponent\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource } } }; @@ -899,14 +899,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'InsetsPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"InsetsPropNativeComponent\\", validAttributes: { contentInset: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/insetsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').insetsDiffer } } }; @@ -931,7 +931,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'Int32EnumPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -961,7 +961,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'IntegerPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -993,8 +993,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {ConditionallyIgnoredEventHandlers} = require('react-native/Libraries/NativeComponent/ViewConfigIgnore'); +const {ConditionallyIgnoredEventHandlers} = require('react-native/unstable-internals-do-not-use'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'RCTInterfaceOnlyComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1035,7 +1035,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MixedPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1065,19 +1065,19 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ImageColorPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"ImageColorPropNativeComponent\\", validAttributes: { thumbImage: { - process: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Image/resolveAssetSource')) + process: require('react-native').Image.resolveAssetSource }, - color: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, - thumbTintColor: require('react-native/Libraries/Components/View/ReactNativeStyleAttributes').colorAttribute, + color: require('react-native/unstable-internals-do-not-use').colorAttribute, + thumbTintColor: require('react-native/unstable-internals-do-not-use').colorAttribute, point: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -1102,7 +1102,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'NoPropsNoEventsComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1130,7 +1130,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ObjectProps'; export const __INTERNAL_VIEW_CONFIG = { @@ -1160,7 +1160,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ObjectPropsWithOptionalGen'; export const __INTERNAL_VIEW_CONFIG = { @@ -1190,7 +1190,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'ObjectPropsWithOptionalObjectGen'; export const __INTERNAL_VIEW_CONFIG = { @@ -1220,14 +1220,14 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'PointPropNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { uiViewClassName: \\"PointPropNativeComponent\\", validAttributes: { startPoint: { - diff: (req => 'default' in req ? req.default : req)(require('react-native/Libraries/Utilities/differ/pointsDiffer')) + diff: require('react-native/unstable-internals-do-not-use').pointsDiffer } } }; @@ -1252,7 +1252,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'StringEnumPropsNativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1282,7 +1282,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'StringPropComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1313,7 +1313,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MultiFile1NativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1352,7 +1352,7 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); +const {NativeComponentRegistry} = require('react-native'); let nativeComponentName = 'MultiComponent1NativeComponent'; export const __INTERNAL_VIEW_CONFIG = { @@ -1391,8 +1391,8 @@ Map { 'use strict'; -const NativeComponentRegistry = require('react-native/Libraries/NativeComponent/NativeComponentRegistry'); -const {UIManager} = require(\\"react-native\\") +const {NativeComponentRegistry} = require('react-native'); +const {UIManager} = require(\\"react-native\\"); let nativeComponentName = 'NativeComponentName'; if (UIManager.hasViewManagerConfig('NativeComponentName')) { diff --git a/packages/react-native-codegen/src/parsers/__tests__/parsers-commons-test.js b/packages/react-native-codegen/src/parsers/__tests__/parsers-commons-test.js index 34d76c575a37..dad048f3be18 100644 --- a/packages/react-native-codegen/src/parsers/__tests__/parsers-commons-test.js +++ b/packages/react-native-codegen/src/parsers/__tests__/parsers-commons-test.js @@ -801,8 +801,7 @@ describe('buildSchema', () => { describe('when there is a TurboModule', () => { const contents = ` - import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport'; - import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry'; + import {TurboModuleRegistry, type TurboModule} from 'react-native'; export interface Spec extends TurboModule { +getArray: (a: Array) => Array; @@ -1094,8 +1093,7 @@ describe('buildModuleSchema', () => { const [, tryParse] = createParserErrorCapturer(); const language = flowParser.language(); const NATIVE_MODULE = ` - import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport'; - import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry'; + import {TurboModuleRegistry, type TurboModule} from 'react-native'; export interface Spec extends TurboModule { +getArray: (a: Array) => Array; @@ -1144,8 +1142,7 @@ describe('buildModuleSchema', () => { describe('throwIfMoreThanOneModuleInterfaceParser', () => { it('should throw an error if mulitple module interfaces are found', () => { const contents = ` - import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport'; - import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry'; + import {TurboModuleRegistry, type TurboModule} from 'react-native'; export interface Spec extends TurboModule { +getBool: (arg: boolean) => boolean; } @@ -1194,8 +1191,7 @@ describe('buildModuleSchema', () => { describe('throwIfModuleInterfaceIsMisnamed', () => { it('should throw an error if module interface is misnamed', () => { const contents = ` - import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport'; - import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry'; + import {TurboModuleRegistry, type TurboModule} from 'react-native'; export interface MisnamedSpec extends TurboModule { +getArray: (a: Array) => Array; diff --git a/packages/react-native-popup-menu-android/js/PopupMenuAndroid.android.js b/packages/react-native-popup-menu-android/js/PopupMenuAndroid.android.js index 379448c3650e..ceebecbe1b23 100644 --- a/packages/react-native-popup-menu-android/js/PopupMenuAndroid.android.js +++ b/packages/react-native-popup-menu-android/js/PopupMenuAndroid.android.js @@ -9,8 +9,7 @@ */ import type {RefObject} from 'react'; -import type {HostInstance} from 'react-native'; -import type {NativeSyntheticEvent} from 'react-native/Libraries/Types/CoreEventTypes'; +import type {HostInstance, NativeSyntheticEvent} from 'react-native'; import PopupMenuAndroidNativeComponent, { Commands, diff --git a/packages/react-native-popup-menu-android/js/PopupMenuAndroidNativeComponent.android.js b/packages/react-native-popup-menu-android/js/PopupMenuAndroidNativeComponent.android.js index 76eaae6edace..a9bba9b495ad 100644 --- a/packages/react-native-popup-menu-android/js/PopupMenuAndroidNativeComponent.android.js +++ b/packages/react-native-popup-menu-android/js/PopupMenuAndroidNativeComponent.android.js @@ -8,19 +8,13 @@ * @format */ -import type {HostComponent} from 'react-native'; -import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes'; -import type { - DirectEventHandler, - Int32, -} from 'react-native/Libraries/Types/CodegenTypes'; +import type {CodegenTypes, HostComponent, ViewProps} from 'react-native'; import * as React from 'react'; -import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands'; -import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; +import {codegenNativeCommands, codegenNativeComponent} from 'react-native'; type PopupMenuSelectionEvent = Readonly<{ - item: Int32, + item: CodegenTypes.Int32, }>; type PopupMenuDismissEvent = Readonly<{}>; @@ -31,8 +25,8 @@ type NativeProps = Readonly<{ //Props menuItems?: ?ReadonlyArray, - onPopupMenuSelectionChange?: DirectEventHandler, - onPopupMenuDismiss?: DirectEventHandler, + onPopupMenuSelectionChange?: CodegenTypes.DirectEventHandler, + onPopupMenuDismiss?: CodegenTypes.DirectEventHandler, }>; type ComponentType = HostComponent; diff --git a/packages/react-native/types_DEPRECATED/Libraries/Types/CodegenTypesNamespace.d.ts b/packages/react-native/types_DEPRECATED/Libraries/Types/CodegenTypesNamespace.d.ts index 1727e69eae2f..79b7b50478d3 100644 --- a/packages/react-native/types_DEPRECATED/Libraries/Types/CodegenTypesNamespace.d.ts +++ b/packages/react-native/types_DEPRECATED/Libraries/Types/CodegenTypesNamespace.d.ts @@ -7,8 +7,7 @@ * @format */ -import type {NativeSyntheticEvent} from 'react-native'; -import type {EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter'; +import type {EventSubscription, NativeSyntheticEvent} from 'react-native'; // Event types // We're not using the PaperName, it is only used to codegen view config settings diff --git a/packages/react-native/types_DEPRECATED/modules/Codegen.d.ts b/packages/react-native/types_DEPRECATED/modules/Codegen.d.ts index 698c922fe6b7..e507d95bf188 100644 --- a/packages/react-native/types_DEPRECATED/modules/Codegen.d.ts +++ b/packages/react-native/types_DEPRECATED/modules/Codegen.d.ts @@ -40,8 +40,7 @@ declare module 'react-native/Libraries/Utilities/codegenNativeComponent' { } declare module 'react-native/Libraries/Types/CodegenTypes' { - import type {NativeSyntheticEvent} from 'react-native'; - import type {EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter'; + import type {EventSubscription, NativeSyntheticEvent} from 'react-native'; // Event types // We're not using the PaperName, it is only used to codegen view config settings diff --git a/private/react-native-codegen-typescript-test/src/__tests__/simple-scenario-frontend-test.ts b/private/react-native-codegen-typescript-test/src/__tests__/simple-scenario-frontend-test.ts index ea2d0f30abb9..4dbfef2d9be4 100644 --- a/private/react-native-codegen-typescript-test/src/__tests__/simple-scenario-frontend-test.ts +++ b/private/react-native-codegen-typescript-test/src/__tests__/simple-scenario-frontend-test.ts @@ -13,8 +13,7 @@ import {TypeScriptParser} from '@react-native/codegen/lib/parsers/typescript/par test(`@rn/codegen should parse an empty TypeScript module`, () => { const tsInput = ` -import type {TurboModule} from 'react-native/Libraries/TurboModule/RCTExport'; -import * as TurboModuleRegistry from 'react-native/Libraries/TurboModule/TurboModuleRegistry'; +import {TurboModuleRegistry, type TurboModule} from 'react-native'; export interface Spec extends TurboModule {} export default TurboModuleRegistry.getEnforcing('SampleTurboModule'); From cfa65ecbee063bf17d1fbfa192425ed930329210 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rub=C3=A9n=20Norte?= Date: Mon, 21 Sep 2026 08:32:34 -0700 Subject: [PATCH 4/4] Remove React Native deep imports from Fantom (#58605) Summary: Pull Request resolved: https://github.com/react/react-native/pull/58605 Use global DOM APIs, supported React Native entry points, and package-relative implementation imports throughout Fantom. Use the renderer-only private interface for the existing public-instance conversion helpers instead of importing Node internals. Changelog: [Internal] Reviewed By: cipolleschi Differential Revision: D120717572 --- .../__tests__/TouchableOpacity-itest.js | 2 +- .../TouchableWithoutFeedback-itest.js | 8 +- .../Components/__tests__/Button-itest.js | 10 +-- .../LogBox/__tests__/fantomHelpers.js | 16 ++-- .../__tests__/EventTimingAPI-itest.js | 24 ++++-- .../react-native-fantom/__docs__/README.md | 11 ++- .../react-native-fantom/runtime/repl-setup.js | 2 +- private/react-native-fantom/runtime/setup.js | 8 +- private/react-native-fantom/src/Benchmark.js | 2 +- .../src/HighResTimeStampMock.js | 2 +- private/react-native-fantom/src/TimerMock.js | 2 +- .../src/__tests__/Fantom-itest.js | 5 +- .../src/getFantomRenderedOutput.js | 2 +- private/react-native-fantom/src/index.js | 74 ++++++++++--------- .../src/setUpDefaultReactNativeEnvironment.js | 2 +- 15 files changed, 95 insertions(+), 75 deletions(-) diff --git a/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableOpacity-itest.js b/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableOpacity-itest.js index 0bfba7aa9868..2e7b6367e806 100644 --- a/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableOpacity-itest.js +++ b/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableOpacity-itest.js @@ -189,7 +189,7 @@ describe('', () => { }); const element = nullthrows( - root.document.documentElement.firstElementChild, + nullthrows(root.document.documentElement).firstElementChild, ); expect(element.childNodes.length).toBe(1); diff --git a/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableWithoutFeedback-itest.js b/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableWithoutFeedback-itest.js index f49793c9d438..f01cd2d7326e 100644 --- a/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableWithoutFeedback-itest.js +++ b/packages/react-native/Libraries/Components/Touchable/__tests__/TouchableWithoutFeedback-itest.js @@ -141,7 +141,9 @@ describe('', () => { }); expect( - nullthrows(root.document.documentElement.firstElementChild).tagName, + nullthrows( + nullthrows(root.document.documentElement).firstElementChild, + ).tagName, ).toBe('RN:Paragraph'); Fantom.runTask(() => { @@ -155,7 +157,9 @@ describe('', () => { }); expect( - nullthrows(root.document.documentElement.firstElementChild).tagName, + nullthrows( + nullthrows(root.document.documentElement).firstElementChild, + ).tagName, ).toBe('RN:View'); }); }); diff --git a/packages/react-native/Libraries/Components/__tests__/Button-itest.js b/packages/react-native/Libraries/Components/__tests__/Button-itest.js index 5ff8d88e138f..67285d757d40 100644 --- a/packages/react-native/Libraries/Components/__tests__/Button-itest.js +++ b/packages/react-native/Libraries/Components/__tests__/Button-itest.js @@ -77,7 +77,7 @@ describe('