/
types.js
107 lines (90 loc) · 2.99 KB
/
types.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
// @flow
import type { ElementType, InspectedElement } from 'src/devtools/types';
type BundleType =
| 0 // PROD
| 1; // DEV
// TODO: Better type for Fiber
export type Fiber = Object;
// TODO: If it's useful for the frontend to know which types of data an Element has
// (e.g. props, state, context, hooks) then we could add a bitmask field for this
// to keep the number of attributes small.
export type FiberData = {|
key: React$Key | null,
displayName: string | null,
type: ElementType,
|};
export type Interaction = {|
name: string,
timestamp: number,
|};
export type NativeType = {};
export type RendererID = number;
type Dispatcher = any;
export type ReactRenderer = {
findHostInstanceByFiber: (fiber: Object) => ?NativeType,
findFiberByHostInstance: (hostInstance: NativeType) => ?Fiber,
version: string,
bundleType: BundleType,
// 16.9+
overrideHook?: ?(
fiber: Object,
nativeHookIndex: number,
path: Array<string | number>,
value: any
) => void,
// 16.7+
overrideProps?: ?(
fiber: Object,
path: Array<string | number>,
value: any
) => void,
// Only injected by React v16.8+ in order to support hooks inspection.
currentDispatcherRef?: {| current: null | Dispatcher |},
};
export type RendererInterface = {
cleanup: () => void,
getNativeFromReactElement?: ?(component: Fiber) => ?NativeType,
getFiberIDFromNative: (
component: NativeType,
findNearestUnfilteredAncestor?: boolean
) => number | null,
handleCommitFiberRoot: (fiber: Object) => void,
handleCommitFiberUnmount: (fiber: Object) => void,
inspectElement: (id: number) => InspectedElement | null,
renderer: ReactRenderer | null,
selectElement: (id: number) => void,
setInContext: (id: number, path: Array<string | number>, value: any) => void,
setInHook: (
id: number,
nativeHookIndex: number,
path: Array<string | number>,
value: any
) => void,
setInProps: (id: number, path: Array<string | number>, value: any) => void,
setInState: (id: number, path: Array<string | number>, value: any) => void,
walkTree: () => void,
};
export type Handler = (data: any) => void;
export type DevToolsHook = {
listeners: { [key: string]: Array<Handler> },
rendererInterfaces: Map<RendererID, RendererInterface>,
renderers: Map<RendererID, ReactRenderer>,
emit: (event: string, data: any) => void,
getFiberRoots: (rendererID: RendererID) => Set<Object>,
inject: (renderer: ReactRenderer) => number | null,
on: (event: string, handler: Handler) => void,
off: (event: string, handler: Handler) => void,
reactDevtoolsAgent?: ?Object,
sub: (event: string, handler: Handler) => () => void,
// React uses these methods.
checkDCE: (fn: Function) => void,
onCommitFiberUnmount: (rendererID: RendererID, fiber: Object) => void,
onCommitFiberRoot: (rendererID: RendererID, fiber: Object) => void,
};
export type HooksNode = {
nativeHookIndex: number,
name: string,
value: mixed,
subHooks: Array<HooksNode>,
};
export type HooksTree = Array<HooksNode>;