refactor: use ESM exports in ReactNativeViewConfigRegistry (#27508)
## Summary When transpiling `react-native` with `swc` this file caused some trouble as it mixes ESM and CJS import/export syntax. This PR addresses this by converting CJS exports to ESM exports. As `ReactNativeViewConfigRegistry` is synced from `react` to `react-native` repository, it's required to make the change here. I've also aligned the mock of `ReactNativeViewConfigRegistry` to reflect current implementation. Related PR in `react-native`: https://github.com/facebook/react-native/pull/40787
Jakub Romańczyk committed
Oct 12, 2023 at 18:28 UTC
ea8a8619ce51a0f8f0a78f87485e4e2a6f9d8c27
2 files changed
+16
-31
packages/react-native-renderer/src/__mocks__/react-native/Libraries/ReactPrivate/ReactNativeViewConfigRegistry.js
+10
-22
@@ -9,26 +9,16 @@
9
10
'use strict';
11
12
-import type {
13
- ReactNativeBaseComponentViewConfig,
14
- ViewConfigGetter,
15
-} from './ReactNativeTypes';
12
+import {type ViewConfig} from './ReactNativeTypes';
13
14
// Event configs
18
-const customBubblingEventTypes = {};
19
-const customDirectEventTypes = {};
20
-const eventTypes = {};
21
-
22
-exports.customBubblingEventTypes = customBubblingEventTypes;
23
-exports.customDirectEventTypes = customDirectEventTypes;
24
-exports.eventTypes = eventTypes;
15
+export const customBubblingEventTypes = {};
16
+export const customDirectEventTypes = {};
17
18
const viewConfigCallbacks = new Map();
19
const viewConfigs = new Map();
20
29
-function processEventTypes(
30
- viewConfig: ReactNativeBaseComponentViewConfig<>,
31
-): void {
21
+function processEventTypes(viewConfig: ViewConfig): void {
22
const {bubblingEventTypes, directEventTypes} = viewConfig;
23
24
if (__DEV__) {
@@ -46,7 +36,7 @@ function processEventTypes(
36
if (bubblingEventTypes != null) {
37
for (const topLevelType in bubblingEventTypes) {
38
if (customBubblingEventTypes[topLevelType] == null) {
49
- eventTypes[topLevelType] = customBubblingEventTypes[topLevelType] =
39
+ customBubblingEventTypes[topLevelType] =
40
bubblingEventTypes[topLevelType];
41
}
42
}
@@ -55,8 +45,7 @@ function processEventTypes(
45
if (directEventTypes != null) {
46
for (const topLevelType in directEventTypes) {
47
if (customDirectEventTypes[topLevelType] == null) {
58
- eventTypes[topLevelType] = customDirectEventTypes[topLevelType] =
59
- directEventTypes[topLevelType];
48
+ customDirectEventTypes[topLevelType] = directEventTypes[topLevelType];
49
}
50
}
51
}
@@ -66,9 +55,8 @@ function processEventTypes(
55
* Registers a native view/component by name.
56
* A callback is provided to load the view config from UIManager.
57
* The callback is deferred until the view is actually rendered.
69
- * This is done to avoid causing Prepack deopts.
58
*/
71
-exports.register = function (name: string, callback: ViewConfigGetter): string {
59
+export function register(name: string, callback: () => ViewConfig): string {
60
if (viewConfigCallbacks.has(name)) {
61
throw new Error(`Tried to register two views with the same name ${name}`);
62
}
@@ -83,14 +71,14 @@ exports.register = function (name: string, callback: ViewConfigGetter): string {
71
72
viewConfigCallbacks.set(name, callback);
73
return name;
86
-};
74
+}
75
76
/**
77
* Retrieves a config for the specified view.
78
* If this is the first time the view has been used,
79
* This configuration will be lazy-loaded from UIManager.
80
*/
93
-exports.get = function (name: string): ReactNativeBaseComponentViewConfig<> {
81
+export function get(name: string): ViewConfig {
82
let viewConfig;
83
if (!viewConfigs.has(name)) {
84
const callback = viewConfigCallbacks.get(name);
@@ -121,4 +109,4 @@ exports.get = function (name: string): ReactNativeBaseComponentViewConfig<> {
109
}
110
111
return viewConfig;
124
-};
112
+}
scripts/rollup/shims/react-native/ReactNativeViewConfigRegistry.js
+6
-9
@@ -14,7 +14,7 @@ import {type ViewConfig} from './ReactNativeTypes';
14
import invariant from 'invariant';
15
16
// Event configs
17
-const customBubblingEventTypes: {
17
+export const customBubblingEventTypes: {
18
[eventName: string]: $ReadOnly<{
19
phasedRegistrationNames: $ReadOnly<{
20
captured: string,
@@ -24,16 +24,13 @@ const customBubblingEventTypes: {
24
}>,
25
...
26
} = {};
27
-const customDirectEventTypes: {
27
+export const customDirectEventTypes: {
28
[eventName: string]: $ReadOnly<{
29
registrationName: string,
30
}>,
31
...
32
} = {};
33
34
-exports.customBubblingEventTypes = customBubblingEventTypes;
35
-exports.customDirectEventTypes = customDirectEventTypes;
36
-
34
const viewConfigCallbacks = new Map<string, ?() => ViewConfig>();
35
const viewConfigs = new Map<string, ViewConfig>();
36
@@ -75,7 +72,7 @@ function processEventTypes(viewConfig: ViewConfig): void {
72
* A callback is provided to load the view config from UIManager.
73
* The callback is deferred until the view is actually rendered.
74
*/
78
-exports.register = function (name: string, callback: () => ViewConfig): string {
75
+export function register(name: string, callback: () => ViewConfig): string {
76
invariant(
77
!viewConfigCallbacks.has(name),
78
'Tried to register two views with the same name %s',
@@ -89,14 +86,14 @@ exports.register = function (name: string, callback: () => ViewConfig): string {
86
);
87
viewConfigCallbacks.set(name, callback);
88
return name;
92
-};
89
+}
90
91
/**
92
* Retrieves a config for the specified view.
93
* If this is the first time the view has been used,
94
* This configuration will be lazy-loaded from UIManager.
95
*/
99
-exports.get = function (name: string): ViewConfig {
96
+export function get(name: string): ViewConfig {
97
let viewConfig;
98
if (!viewConfigs.has(name)) {
99
const callback = viewConfigCallbacks.get(name);
@@ -124,4 +121,4 @@ exports.get = function (name: string): ViewConfig {
121
}
122
invariant(viewConfig, 'View config not found for name %s', name);
123
return viewConfig;
127
-};
124
+}