Skip to content

Commit b74a4a5

Browse files
hoxyqhoxyq
committed
bump[third_party/react-devtools]: 5.2.0
1 parent f657b1f commit b74a4a5

File tree

5 files changed

+9577
-9066
lines changed

5 files changed

+9577
-9066
lines changed

‎front_end/third_party/react-devtools/README.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,3 @@ https://github.com/facebook/react/tree/main/packages/react-devtools-fusebox
66
## How to update this package?
77
1. Clone [`react`](https://github.com/facebook/react) repo and run `yarn build` in [`packages/react-devtools-fusebox`](https://github.com/facebook/react/tree/main/packages/react-devtools-fusebox)
88
2. Copy all artifacts from `build` folder to `package` folder here.
9-
3. Update `frontend.d.ts` if needed, type definitions are not included in the build yet.

‎front_end/third_party/react-devtools/package/frontend.css

Lines changed: 103 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,6 @@
106106
padding: 0.125rem 0.25rem;
107107
line-height: normal;
108108
border-radius: 0.125rem;
109-
margin-right: 0.25rem;
110109
font-family: var(--font-family-monospace);
111110
font-size: var(--font-size-monospace-small);
112111
}
@@ -145,6 +144,7 @@
145144
--color-component-badge-background: var(
146145
--color-component-badge-background-inverted
147146
);
147+
--color-forget-badge-background: var(--color-forget-badge-background-inverted);
148148
--color-component-badge-count: var(--color-component-badge-count-inverted);
149149
--color-attribute-name: var(--color-attribute-name-inverted);
150150
--color-attribute-value: var(--color-attribute-value-inverted);
@@ -208,25 +208,6 @@
208208
color: var(--color-text);
209209
}
210210

211-
.sP6uS8ZOU4PkDlNU0AYK {
212-
background-color: var(--color-forget-badge);
213-
}
214-
215-
.SjNrJ30jUO5kUSCsWh4c {
216-
display: inline-flex;
217-
align-items: center;
218-
}
219-
220-
.SjNrJ30jUO5kUSCsWh4c *:not(:first-child) {
221-
margin-left: 0.25rem;
222-
}
223-
224-
.j9rH1DJ2jYY7I1tswNOx {
225-
font-family: var(--font-family-monospace);
226-
font-size: var(--font-size-monospace-small);
227-
color: var(--color-component-badge-count);
228-
}
229-
230211
.dPHAvUl3PSp59chvDv66,
231212
.rcOJ8fC0AbSrvixHIvdw,
232213
.V5OmBsGHEXanXzw77sNS {
@@ -290,6 +271,43 @@
290271
z-index: 10000002;
291272
}
292273

274+
.sP6uS8ZOU4PkDlNU0AYK {
275+
background-color: var(--color-forget-badge-background);
276+
color: var(--color-forget-text);
277+
padding-right: 1.75em;
278+
position: relative;
279+
}
280+
281+
.sP6uS8ZOU4PkDlNU0AYK::after {
282+
bottom: 0;
283+
content: '✨';
284+
position: absolute;
285+
right: 0.25em;
286+
}
287+
288+
.j3Lt3YqBHSwuvIVtnIxU {
289+
display: flex;
290+
}
291+
292+
.j3Lt3YqBHSwuvIVtnIxU > span { /* targets .ToggleContent */
293+
padding: 0;
294+
}
295+
296+
.SjNrJ30jUO5kUSCsWh4c {
297+
display: inline-flex;
298+
align-items: center;
299+
}
300+
301+
.SjNrJ30jUO5kUSCsWh4c *:not(:first-child) {
302+
margin-left: 0.25rem;
303+
}
304+
305+
.j9rH1DJ2jYY7I1tswNOx {
306+
font-family: var(--font-family-monospace);
307+
font-size: var(--font-size-monospace-small);
308+
color: var(--color-component-badge-count);
309+
}
310+
293311
.MOeHyomWH2dTqysCu6Ii {
294312
border: none;
295313
background: var(--color-button-background);
@@ -790,39 +808,7 @@
790808
font-size: var(--font-size-sans-large);
791809
}
792810

793-
.pVySJG3jMP40bWLFGBla {
794-
position: absolute;
795-
background-color: var(--color-context-background);
796-
box-shadow: 1px 1px 2px var(--color-shadow);
797-
border-radius: 0.25rem;
798-
overflow: hidden;
799-
z-index: 10000002;
800-
user-select: none;
801-
}
802-
.omYdOiQA4INhfDwXiCGT {
803-
display: flex;
804-
align-items: center;
805-
color: var(--color-context-text);
806-
padding: 0.5rem 0.75rem;
807-
cursor: default;
808-
border-top: 1px solid var(--color-context-border);
809-
font-family: var(--font-family-sans);
810-
font-size: var(--font-size-sans-normal);
811-
}
812-
.omYdOiQA4INhfDwXiCGT:first-of-type {
813-
border-top: none;
814-
}
815-
.omYdOiQA4INhfDwXiCGT:hover,
816-
.omYdOiQA4INhfDwXiCGT:focus {
817-
outline: 0;
818-
background-color: var(--color-context-background-hover);
819-
}
820-
.omYdOiQA4INhfDwXiCGT:active {
821-
background-color: var(--color-context-background-selected);
822-
color: var(--color-context-text-selected);
823-
}
824811
.eKXhn2sbXs1thQ1xt1b6 {
825-
padding: 0.25rem;
826812
user-select: none;
827813
display: inline-flex;
828814
}
@@ -983,9 +969,51 @@
983969
.YOB3sdCfSr_qYyMcvl9Z {
984970
color: var(--color-component-name);
985971
}
972+
.omYdOiQA4INhfDwXiCGT {
973+
display: flex;
974+
align-items: center;
975+
color: var(--color-context-text);
976+
padding: 0.5rem 0.75rem;
977+
cursor: default;
978+
border-top: 1px solid var(--color-context-border);
979+
font-family: var(--font-family-sans);
980+
font-size: var(--font-size-sans-normal);
981+
}
982+
983+
.omYdOiQA4INhfDwXiCGT:first-of-type {
984+
border-top: none;
985+
}
986+
987+
.omYdOiQA4INhfDwXiCGT:hover,
988+
.omYdOiQA4INhfDwXiCGT:focus {
989+
outline: 0;
990+
background-color: var(--color-context-background-hover);
991+
}
992+
993+
.omYdOiQA4INhfDwXiCGT:active {
994+
background-color: var(--color-context-background-selected);
995+
color: var(--color-context-text-selected);
996+
}
997+
998+
.pVySJG3jMP40bWLFGBla {
999+
position: absolute;
1000+
background-color: var(--color-context-background);
1001+
box-shadow: 1px 1px 2px var(--color-shadow);
1002+
border-radius: 0.25rem;
1003+
overflow: hidden;
1004+
z-index: 10000002;
1005+
user-select: none;
1006+
}
1007+
1008+
.ZplKR_6Ki52aunUdBR3W {
1009+
display: flex;
1010+
flex-direction: row;
1011+
align-items: center;
1012+
gap: 0.5rem;
1013+
}
1014+
9861015
.ltOoJtAx5EC08rarvM4p {
9871016
padding: 0.25rem;
988-
border-top: 1px solid var(--color-border);
9891017
}
9901018
.ltOoJtAx5EC08rarvM4p:first-of-type {
9911019
border-top: none;
@@ -1371,6 +1399,11 @@
13711399
line-height: var(--line-height-data);
13721400
}
13731401

1402+
.s7UqGwXK0u5IO8pB45HE:not(:empty) {
1403+
padding: 0.25rem;
1404+
border-bottom: 1px solid var(--color-border);
1405+
}
1406+
13741407
.G1iPSTGC6eNcmT5RjA6C {
13751408
border-radius: 0.25rem;
13761409
padding: 0.125rem 0.25rem;
@@ -1406,10 +1439,6 @@
14061439
background-color: var(--color-background-hover);
14071440
}
14081441

1409-
.kMxnwph9G_5khS9rwjns {
1410-
margin-right: 0.5rem;
1411-
}
1412-
14131442
.P14TYiR8U2gzEkHw_ISN {
14141443
padding-left: 1.25rem;
14151444
white-space: nowrap;
@@ -1940,10 +1969,6 @@
19401969
transition: all ease-in-out 250ms;
19411970
}
19421971

1943-
.hMgAJyZBpTlsirz54AIg {
1944-
margin-bottom: 0.5rem;
1945-
}
1946-
19471972
.IkCgTd3uBjVma0pkjIWQ {
19481973
margin-top: 0.25rem;
19491974
}
@@ -1972,10 +1997,20 @@
19721997

19731998
.ANH3uQmqdejNNBMFVElK {
19741999
padding: 0.25rem 0;
1975-
margin-bottom: 0.25rem;
19762000
flex: 0 0 auto;
19772001
display: flex;
1978-
align-items: center;
2002+
flex-direction: column;
2003+
gap: 0.25rem;
2004+
}
2005+
2006+
.ktt_CXlygBWE6kn8NPge {
2007+
display: flex;
2008+
flex-direction: column;
2009+
gap: 0.25rem;
2010+
}
2011+
2012+
.ktt_CXlygBWE6kn8NPge:not(:empty) {
2013+
padding-bottom: 0.25rem;
19792014
border-bottom: 1px solid var(--color-border);
19802015
}
19812016

@@ -1992,10 +2027,11 @@
19922027
white-space: nowrap;
19932028
overflow-x: hidden;
19942029
text-overflow: ellipsis;
2030+
padding-bottom: 0.25rem;
2031+
border-bottom: 1px solid var(--color-border);
19952032
}
19962033

19972034
.WfcYLToZgb8sJXT8vsc0 {
1998-
margin: 0.25rem 0;
19992035
display: block;
20002036
width: 100%;
20012037
text-align: left;
@@ -2718,6 +2754,9 @@
27182754
padding: 0.5rem;
27192755
user-select: none;
27202756
overflow-y: auto;
2757+
display: flex;
2758+
flex-direction: column;
2759+
gap: 0.5rem;
27212760
}
27222761

27232762
.ISf33Slct6dgSxu6Jgnp {

‎front_end/third_party/react-devtools/package/frontend.d.ts

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
1-
export type MessagePayload = null | string | number | boolean | {[key: string]: MessagePayload} | MessagePayload[];
2-
export type Message = {event: string, payload?: MessagePayload};
1+
/**
2+
* Copyright (c) Meta Platforms, Inc. and affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*/
7+
8+
export type MessagePayload = null | string | number | boolean | { [key: string]: MessagePayload } | MessagePayload[];
9+
export type Message = { event: string, payload?: MessagePayload };
310

411
export type WallListener = (message: Message) => void;
512
export type Wall = {
@@ -16,10 +23,31 @@ export type BrowserTheme = 'dark' | 'light';
1623
export function createBridge(wall: Wall): Bridge;
1724
export function createStore(bridge: Bridge): Store;
1825

26+
export type Source = {
27+
sourceURL: string,
28+
line: number,
29+
column: number,
30+
};
31+
export type ViewElementSource = (
32+
source: Source,
33+
symbolicatedSource: Source | null,
34+
) => void;
35+
export type ViewAttributeSource = (
36+
id: number,
37+
path: Array<string | number>,
38+
) => void;
39+
export type CanViewElementSource = (
40+
source: Source,
41+
symbolicatedSource: Source | null,
42+
) => boolean;
43+
1944
export type InitializationOptions = {
2045
bridge: Bridge,
2146
store: Store,
2247
theme?: BrowserTheme,
48+
viewAttributeSourceFunction?: ViewAttributeSource,
49+
viewElementSourceFunction?: ViewElementSource,
50+
canViewElementSourceFunction?: CanViewElementSource,
2351
};
24-
export function initialize(node: Element | Document, options: InitializationOptions): void;
2552

53+
export function initialize(node: Element | Document, options: InitializationOptions): void;

0 commit comments

Comments
 (0)