Added inline comments for types
Brian Vaughn committed
Jan 29, 2019 at 14:04 UTC
f542f879d61ecc0dacc9dee350a099990ecea6b4
1 file changed
+33
-7
src/devtools/types.js
+33
-7
@@ -11,31 +11,57 @@ export const ElementTypeProfiler = 6;
11
export const ElementTypeRoot = 7;
12
export const ElementTypeSuspense = 8;
13
14
+// Different types of elements displayed in the Elements tree.
15
+// These types may be used to visually distinguish types,
16
+// or to enable/disable certain functionality.
17
export type ElementType = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
18
16
-// TODO: Add profiling node
17
-
19
+// Each element on the frontend corresponds to a Fiber on the backend.
20
+// Some of its information (e.g. id, type, displayName) come from the backend.
21
+// Other bits (e.g. weight and depth) are computed on the frontend for windowing and display purposes.
22
+// Elements are udpated on a push basis– meaning the backend pushes updates to the frontend when needed.
23
export type Element = {|
19
- children: Array<number>,
20
- depth: number,
21
- displayName: string | null,
24
id: number,
23
- key: number | string | null,
25
parentID: number,
26
+ children: Array<number>,
27
type: ElementType,
28
+ displayName: string | null,
29
+ key: number | string | null,
30
+
31
+ // How many levels deep within the tree is this element?
32
+ // This determines how much indentation (left padding) should be used in the Elements tree.
33
+ depth: number,
34
+
35
+ // How many nodes (including itself) are below this Element within the tree.
36
+ // This property is used to quickly determine the total number of Elements,
37
+ // and the Element at any given index (for windowing purposes).
38
weight: number,
39
|};
40
41
export type InspectedElement = {|
42
id: number,
43
+
44
+ // Does the current renderer support editable props/state/hooks?
45
+ canEditValues: boolean,
46
+
47
+ // Inspectable properties.
48
context: Object | null,
49
hooks: Object | null,
50
props: Object | null,
51
state: Object | null,
35
- canEditProps: boolean,
52
+
53
+ // List of owners
54
+ owners: Array<number>,
55
+
56
+ // Location of component in source coude.
57
source: Object,
58
|};
59
60
+// TODO: Add profiling type
61
+
62
+// The frontend Store is mutable.
63
+// This wrapper object is recreated whenever the store's tree is mutated.
64
+// It is used to trigger a re-render of the virtualized Elements tree.
65
export type TreeMetadataType = {|
66
size: number,
67
store: Store,