Skip to content

Commit c44e4a2

Browse files
sebmarkbagesebmarkbage
authored
Move Built-in Props Types to React Types (facebook#32841)
Stacked on facebook#32838. We don't always type the Props of built-ins. This adds typing for most of the built-ins. When we did type them, we used to put it in the `ReactFiber...Component` files but any public API like this can be implemented in other renderers too such as Fizz. So I moved them to `shared/ReactTypes` which is where we put other public API types (that are not already built-in to Flow). That way Fizz can import them and assert properly when it accesses the props.
1 parent 31ecc98 commit c44e4a2

13 files changed

+132
-103
lines changed

‎packages/react-reconciler/src/ReactFiber.js‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,23 +8,25 @@
88
*/
99

1010
import type {ReactElement} from 'shared/ReactElementType';
11-
import type {ReactFragment, ReactPortal, ReactScope} from 'shared/ReactTypes';
11+
import type {
12+
ReactFragment,
13+
ReactPortal,
14+
ReactScope,
15+
ViewTransitionProps,
16+
ActivityProps,
17+
} from 'shared/ReactTypes';
1218
import type {Fiber} from './ReactInternalTypes';
1319
import type {RootTag} from './ReactRootTags';
1420
import type {WorkTag} from './ReactWorkTags';
1521
import type {TypeOfMode} from './ReactTypeOfMode';
1622
import type {Lanes} from './ReactFiberLane';
1723
import type {SuspenseInstance} from './ReactFiberConfig';
18-
import type {ActivityProps} from './ReactFiberActivityComponent';
1924
import type {
2025
LegacyHiddenProps,
2126
OffscreenProps,
2227
OffscreenInstance,
2328
} from './ReactFiberOffscreenComponent';
24-
import type {
25-
ViewTransitionProps,
26-
ViewTransitionState,
27-
} from './ReactFiberViewTransitionComponent';
29+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
2830
import type {TracingMarkerInstance} from './ReactFiberTracingMarkerComponent';
2931

3032
import {

‎packages/react-reconciler/src/ReactFiberActivityComponent.js‎

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎packages/react-reconciler/src/ReactFiberApplyGesture.js‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,15 @@
77
* @flow
88
*/
99

10+
import type {ViewTransitionProps} from 'shared/ReactTypes';
11+
1012
import type {Fiber, FiberRoot} from './ReactInternalTypes';
1113

1214
import type {Instance, TextInstance, Props} from './ReactFiberConfig';
1315

1416
import type {OffscreenState} from './ReactFiberOffscreenComponent';
1517

16-
import type {
17-
ViewTransitionState,
18-
ViewTransitionProps,
19-
} from './ReactFiberViewTransitionComponent';
18+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
2019

2120
import {
2221
cloneMutableInstance,

‎packages/react-reconciler/src/ReactFiberBeginWork.js‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,12 @@ import type {
1111
ReactConsumerType,
1212
ReactContext,
1313
ReactNodeList,
14+
ViewTransitionProps,
15+
ActivityProps,
16+
SuspenseProps,
17+
TracingMarkerProps,
18+
CacheProps,
19+
ProfilerProps,
1420
} from 'shared/ReactTypes';
1521
import type {LazyComponent as LazyComponentType} from 'react/src/ReactLazy';
1622
import type {Fiber, FiberRoot} from './ReactInternalTypes';
@@ -22,18 +28,14 @@ import type {
2228
SuspenseListTailMode,
2329
} from './ReactFiberSuspenseComponent';
2430
import type {SuspenseContext} from './ReactFiberSuspenseContext';
25-
import type {ActivityProps} from './ReactFiberActivityComponent';
2631
import type {
2732
LegacyHiddenProps,
2833
OffscreenProps,
2934
OffscreenState,
3035
OffscreenQueue,
3136
OffscreenInstance,
3237
} from './ReactFiberOffscreenComponent';
33-
import type {
34-
ViewTransitionProps,
35-
ViewTransitionState,
36-
} from './ReactFiberViewTransitionComponent';
38+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
3739
import {assignViewTransitionAutoName} from './ReactFiberViewTransitionComponent';
3840
import type {
3941
Cache,
@@ -977,7 +979,9 @@ function updateCacheComponent(
977979
}
978980
}
979981

980-
const nextChildren = workInProgress.pendingProps.children;
982+
const nextProps: CacheProps = workInProgress.pendingProps;
983+
984+
const nextChildren = nextProps.children;
981985
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
982986
return workInProgress.child;
983987
}
@@ -992,6 +996,8 @@ function updateTracingMarkerComponent(
992996
return null;
993997
}
994998

999+
const nextProps: TracingMarkerProps = workInProgress.pendingProps;
1000+
9951001
// TODO: (luna) Only update the tracing marker if it's newly rendered or it's name changed.
9961002
// A tracing marker is only associated with the transitions that rendered
9971003
// or updated it, so we can create a new set of transitions each time
@@ -1002,7 +1008,7 @@ function updateTracingMarkerComponent(
10021008
tag: TransitionTracingMarker,
10031009
transitions: new Set(currentTransitions),
10041010
pendingBoundaries: null,
1005-
name: workInProgress.pendingProps.name,
1011+
name: nextProps.name,
10061012
aborts: null,
10071013
};
10081014
workInProgress.stateNode = markerInstance;
@@ -1015,7 +1021,7 @@ function updateTracingMarkerComponent(
10151021
}
10161022
} else {
10171023
if (__DEV__) {
1018-
if (current.memoizedProps.name !== workInProgress.pendingProps.name) {
1024+
if (current.memoizedProps.name !== nextProps.name) {
10191025
console.error(
10201026
'Changing the name of a tracing marker after mount is not supported. ' +
10211027
'To remount the tracing marker, pass it a new key.',
@@ -1028,7 +1034,7 @@ function updateTracingMarkerComponent(
10281034
if (instance !== null) {
10291035
pushMarkerInstance(workInProgress, instance);
10301036
}
1031-
const nextChildren = workInProgress.pendingProps.children;
1037+
const nextChildren = nextProps.children;
10321038
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
10331039
return workInProgress.child;
10341040
}
@@ -1076,7 +1082,7 @@ function updateProfiler(
10761082
stateNode.passiveEffectDuration = -0;
10771083
}
10781084
}
1079-
const nextProps = workInProgress.pendingProps;
1085+
const nextProps: ProfilerProps = workInProgress.pendingProps;
10801086
const nextChildren = nextProps.children;
10811087
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
10821088
return workInProgress.child;
@@ -2084,7 +2090,7 @@ function updateSuspenseComponent(
20842090
workInProgress: Fiber,
20852091
renderLanes: Lanes,
20862092
) {
2087-
const nextProps = workInProgress.pendingProps;
2093+
const nextProps: SuspenseProps = workInProgress.pendingProps;
20882094

20892095
// This is used by DevTools to force a boundary to suspend.
20902096
if (__DEV__) {
@@ -2677,7 +2683,7 @@ function updateDehydratedSuspenseComponent(
26772683
workInProgress: Fiber,
26782684
didSuspend: boolean,
26792685
didPrimaryChildrenDefer: boolean,
2680-
nextProps: any,
2686+
nextProps: SuspenseProps,
26812687
suspenseInstance: SuspenseInstance,
26822688
suspenseState: SuspenseState,
26832689
renderLanes: Lanes,

‎packages/react-reconciler/src/ReactFiberCommitEffects.js‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,19 @@
77
* @flow
88
*/
99

10+
import type {
11+
ViewTransitionProps,
12+
ProfilerProps,
13+
ProfilerPhase,
14+
} from 'shared/ReactTypes';
1015
import type {Fiber} from './ReactInternalTypes';
1116
import type {UpdateQueue} from './ReactFiberClassUpdateQueue';
1217
import type {FunctionComponentUpdateQueue} from './ReactFiberHooks';
1318
import type {HookFlags} from './ReactHookEffectTags';
1419
import type {FragmentInstanceType} from './ReactFiberConfig';
15-
import {
16-
getViewTransitionName,
17-
type ViewTransitionState,
18-
type ViewTransitionProps,
19-
} from './ReactFiberViewTransitionComponent';
20+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
21+
22+
import {getViewTransitionName} from './ReactFiberViewTransitionComponent';
2023

2124
import {
2225
enableProfilerTimer,
@@ -938,9 +941,9 @@ function commitProfiler(
938941
commitStartTime: number,
939942
effectDuration: number,
940943
) {
941-
const {id, onCommit, onRender} = finishedWork.memoizedProps;
944+
const {id, onCommit, onRender} = (finishedWork.memoizedProps: ProfilerProps);
942945

943-
let phase = current === null ? 'mount' : 'update';
946+
let phase: ProfilerPhase = current === null ? 'mount' : 'update';
944947
if (enableProfilerNestedUpdatePhase) {
945948
if (isCurrentUpdateNested()) {
946949
phase = 'nested-update';
@@ -951,21 +954,19 @@ function commitProfiler(
951954
onRender(
952955
id,
953956
phase,
957+
// $FlowFixMe: This should be always a number in profiling mode
954958
finishedWork.actualDuration,
959+
// $FlowFixMe: This should be always a number in profiling mode
955960
finishedWork.treeBaseDuration,
961+
// $FlowFixMe: This should be always a number in profiling mode
956962
finishedWork.actualStartTime,
957963
commitStartTime,
958964
);
959965
}
960966

961967
if (enableProfilerCommitHooks) {
962968
if (typeof onCommit === 'function') {
963-
onCommit(
964-
finishedWork.memoizedProps.id,
965-
phase,
966-
effectDuration,
967-
commitStartTime,
968-
);
969+
onCommit(id, phase, effectDuration, commitStartTime);
969970
}
970971
}
971972
}

‎packages/react-reconciler/src/ReactFiberCommitViewTransitions.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,10 @@
77
* @flow
88
*/
99

10+
import type {ViewTransitionProps} from 'shared/ReactTypes';
1011
import type {Instance, InstanceMeasurement, Props} from './ReactFiberConfig';
1112
import type {Fiber} from './ReactInternalTypes';
12-
import type {
13-
ViewTransitionProps,
14-
ViewTransitionState,
15-
} from './ReactFiberViewTransitionComponent';
13+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
1614

1715
import {
1816
HostComponent,

‎packages/react-reconciler/src/ReactFiberCommitWork.js‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import {
2525
import type {SuspenseState, RetryQueue} from './ReactFiberSuspenseComponent';
2626
import type {UpdateQueue} from './ReactFiberClassUpdateQueue';
2727
import type {FunctionComponentUpdateQueue} from './ReactFiberHooks';
28-
import type {Wakeable} from 'shared/ReactTypes';
28+
import type {Wakeable, ViewTransitionProps} from 'shared/ReactTypes';
2929
import type {
3030
OffscreenState,
3131
OffscreenInstance,
@@ -38,10 +38,7 @@ import type {
3838
TracingMarkerInstance,
3939
TransitionAbort,
4040
} from './ReactFiberTracingMarkerComponent';
41-
import type {
42-
ViewTransitionProps,
43-
ViewTransitionState,
44-
} from './ReactFiberViewTransitionComponent';
41+
import type {ViewTransitionState} from './ReactFiberViewTransitionComponent';
4542

4643
import {
4744
alwaysThrottleRetries,

‎packages/react-reconciler/src/ReactFiberDuplicateViewTransitions.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
*/
99

1010
import type {Fiber} from './ReactInternalTypes';
11-
import type {ViewTransitionProps} from './ReactFiberViewTransitionComponent';
11+
import type {ViewTransitionProps} from 'shared/ReactTypes';
1212
import {runWithFiberInDEV} from './ReactCurrentFiber';
1313

1414
// Use in DEV to track mounted named ViewTransitions. This is used to warn for

‎packages/react-reconciler/src/ReactFiberSuspenseComponent.js‎

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @flow
88
*/
99

10-
import type {ReactNodeList, Wakeable} from 'shared/ReactTypes';
10+
import type {Wakeable} from 'shared/ReactTypes';
1111
import type {Fiber} from './ReactInternalTypes';
1212
import type {SuspenseInstance} from './ReactFiberConfig';
1313
import type {Lane} from './ReactFiberLane';
@@ -21,18 +21,6 @@ import {
2121
isSuspenseInstanceFallback,
2222
} from './ReactFiberConfig';
2323

24-
export type SuspenseProps = {
25-
children?: ReactNodeList,
26-
fallback?: ReactNodeList,
27-
28-
// TODO: Add "unstable_" prefix?
29-
suspenseCallback?: (Set<Wakeable> | null) => mixed,
30-
31-
unstable_avoidThisFallback?: boolean,
32-
unstable_expectedLoadTime?: number,
33-
unstable_name?: string,
34-
};
35-
3624
// A null SuspenseState represents an unsuspended normal Suspense boundary.
3725
// A non-null SuspenseState means that it is blocked for one reason or another.
3826
// - A non-null dehydrated field means it's blocked pending hydration.

‎packages/react-reconciler/src/ReactFiberSuspenseContext.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,10 @@
77
* @flow
88
*/
99

10+
import type {SuspenseProps} from 'shared/ReactTypes';
1011
import type {Fiber} from './ReactInternalTypes';
1112
import type {StackCursor} from './ReactFiberStack';
12-
import type {SuspenseProps, SuspenseState} from './ReactFiberSuspenseComponent';
13+
import type {SuspenseState} from './ReactFiberSuspenseComponent';
1314
import type {OffscreenState} from './ReactFiberOffscreenComponent';
1415

1516
import {enableSuspenseAvoidThisFallback} from 'shared/ReactFeatureFlags';

0 commit comments

Comments
 (0)