Move type DOMContainer to HostConfig (#18112)
Exports from ReactDOM represents React's public API. This include types exported by React. At some point we'll start building Flow types from these files. The duplicate name between DOMContainer and Container seems confusing too since it was used in the same files even though they're the same.
Sebastian Markbåge committed
Feb 24, 2020 at 08:57 UTC
ccab49473897aacae43bb4d55c1061065892403c
5 files changed
+24
-26
packages/react-dom/src/client/ReactDOM.js
+2
-6
@@ -7,8 +7,8 @@
7
* @flow
8
*/
9
10
-import type {RootType} from './ReactDOMRoot';
10
import type {ReactNodeList} from 'shared/ReactTypes';
11
+import type {Container} from './ReactDOMHostConfig';
12
13
import '../shared/checkReact';
14
import './ReactDOMClientInjection';
@@ -116,13 +116,9 @@ setBatchingImplementation(
116
batchedEventUpdates,
117
);
118
119
-export type DOMContainer =
120
- | (Element & {_reactRootContainer: ?RootType, ...})
121
- | (Document & {_reactRootContainer: ?RootType, ...});
122
-
119
function createPortal(
120
children: ReactNodeList,
125
- container: DOMContainer,
121
+ container: Container,
122
key: ?string = null,
123
) {
124
invariant(
packages/react-dom/src/client/ReactDOMHostConfig.js
+6
-3
@@ -7,6 +7,8 @@
7
* @flow
8
*/
9
10
+import type {RootType} from './ReactDOMRoot';
11
+
12
import {
13
precacheFiberNode,
14
updateFiberProps,
@@ -45,7 +47,6 @@ import {
47
} from '../shared/HTMLNodeType';
48
import dangerousStyleValue from '../shared/dangerousStyleValue';
49
48
-import type {DOMContainer} from './ReactDOM';
50
import type {
51
ReactDOMEventResponder,
52
ReactDOMEventResponderInstance,
@@ -99,7 +100,9 @@ export type EventTargetChildElement = {
100
},
101
...
102
};
102
-export type Container = DOMContainer;
103
+export type Container =
104
+ | (Element & {_reactRootContainer: ?RootType, ...})
105
+ | (Document & {_reactRootContainer: ?RootType, ...});
106
export type Instance = Element;
107
export type TextInstance = Text;
108
export type SuspenseInstance = Comment & {_reactRetry?: () => void, ...};
@@ -419,7 +422,7 @@ export function appendChild(
422
}
423
424
export function appendChildToContainer(
422
- container: DOMContainer,
425
+ container: Container,
426
child: Instance | TextInstance,
427
): void {
428
let parentNode;
packages/react-dom/src/client/ReactDOMLegacy.js
+8
-8
@@ -7,7 +7,7 @@
7
* @flow
8
*/
9
10
-import type {DOMContainer} from './ReactDOM';
10
+import type {Container} from './ReactDOMHostConfig';
11
import type {RootType} from './ReactDOMRoot';
12
import type {ReactNodeList} from 'shared/ReactTypes';
13
@@ -43,7 +43,7 @@ let topLevelUpdateWarnings;
43
let warnedAboutHydrateAPI = false;
44
45
if (__DEV__) {
46
- topLevelUpdateWarnings = (container: DOMContainer) => {
46
+ topLevelUpdateWarnings = (container: Container) => {
47
if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) {
48
const hostInstance = findHostInstanceWithNoPortals(
49
container._reactRootContainer._internalRoot.current,
@@ -111,7 +111,7 @@ function shouldHydrateDueToLegacyHeuristic(container) {
111
}
112
113
function legacyCreateRootFromDOMContainer(
114
- container: DOMContainer,
114
+ container: Container,
115
forceHydrate: boolean,
116
): RootType {
117
const shouldHydrate =
@@ -175,7 +175,7 @@ function warnOnInvalidCallback(callback: mixed, callerName: string): void {
175
function legacyRenderSubtreeIntoContainer(
176
parentComponent: ?React$Component<any, any>,
177
children: ReactNodeList,
178
- container: DOMContainer,
178
+ container: Container,
179
forceHydrate: boolean,
180
callback: ?Function,
181
) {
@@ -255,7 +255,7 @@ export function findDOMNode(
255
256
export function hydrate(
257
element: React$Node,
258
- container: DOMContainer,
258
+ container: Container,
259
callback: ?Function,
260
) {
261
invariant(
@@ -286,7 +286,7 @@ export function hydrate(
286
287
export function render(
288
element: React$Element<any>,
289
- container: DOMContainer,
289
+ container: Container,
290
callback: ?Function,
291
) {
292
invariant(
@@ -317,7 +317,7 @@ export function render(
317
export function unstable_renderSubtreeIntoContainer(
318
parentComponent: React$Component<any, any>,
319
element: React$Element<any>,
320
- containerNode: DOMContainer,
320
+ containerNode: Container,
321
callback: ?Function,
322
) {
323
invariant(
@@ -337,7 +337,7 @@ export function unstable_renderSubtreeIntoContainer(
337
);
338
}
339
340
-export function unmountComponentAtNode(container: DOMContainer) {
340
+export function unmountComponentAtNode(container: Container) {
341
invariant(
342
isValidContainer(container),
343
'unmountComponentAtNode(...): Target container is not a DOM element.',
packages/react-dom/src/client/ReactDOMRoot.js
+7
-7
@@ -7,7 +7,7 @@
7
* @flow
8
*/
9
10
-import type {DOMContainer} from './ReactDOM';
10
+import type {Container} from './ReactDOMHostConfig';
11
import type {RootTag} from 'shared/ReactRootTags';
12
import type {ReactNodeList} from 'shared/ReactTypes';
13
// TODO: This type is shared between the reconciler and ReactDOM, but will
@@ -49,12 +49,12 @@ import {createContainer, updateContainer} from 'react-reconciler/inline.dom';
49
import invariant from 'shared/invariant';
50
import {BlockingRoot, ConcurrentRoot, LegacyRoot} from 'shared/ReactRootTags';
51
52
-function ReactDOMRoot(container: DOMContainer, options: void | RootOptions) {
52
+function ReactDOMRoot(container: Container, options: void | RootOptions) {
53
this._internalRoot = createRootImpl(container, ConcurrentRoot, options);
54
}
55
56
function ReactDOMBlockingRoot(
57
- container: DOMContainer,
57
+ container: Container,
58
tag: RootTag,
59
options: void | RootOptions,
60
) {
@@ -108,7 +108,7 @@ ReactDOMRoot.prototype.unmount = ReactDOMBlockingRoot.prototype.unmount = functi
108
};
109
110
function createRootImpl(
111
- container: DOMContainer,
111
+ container: Container,
112
tag: RootTag,
113
options: void | RootOptions,
114
) {
@@ -129,7 +129,7 @@ function createRootImpl(
129
}
130
131
export function createRoot(
132
- container: DOMContainer,
132
+ container: Container,
133
options?: RootOptions,
134
): RootType {
135
invariant(
@@ -141,7 +141,7 @@ export function createRoot(
141
}
142
143
export function createBlockingRoot(
144
- container: DOMContainer,
144
+ container: Container,
145
options?: RootOptions,
146
): RootType {
147
invariant(
@@ -153,7 +153,7 @@ export function createBlockingRoot(
153
}
154
155
export function createLegacyRoot(
156
- container: DOMContainer,
156
+ container: Container,
157
options?: RootOptions,
158
): RootType {
159
return new ReactDOMBlockingRoot(container, LegacyRoot, options);
packages/react-dom/src/events/ReactDOMEventReplaying.js
+1
-2
@@ -12,7 +12,6 @@ import type {Container, SuspenseInstance} from '../client/ReactDOMHostConfig';
12
import type {DOMTopLevelEventType} from 'legacy-events/TopLevelEventTypes';
13
import type {EventSystemFlags} from 'legacy-events/EventSystemFlags';
14
import type {FiberRoot} from 'react-reconciler/src/ReactFiberRoot';
15
-import type {DOMContainer} from '../client/ReactDOM';
15
16
import {
17
enableDeprecatedFlareAPI,
@@ -238,7 +237,7 @@ function trapReplayableEventForDocument(
237
}
238
239
export function eagerlyTrapReplayableEvents(
241
- container: DOMContainer,
240
+ container: Container,
241
document: Document,
242
) {
243
const listenerMapForDoc = getListenerMapForElement(document);