atom.io 0.33.7 → 0.33.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/introspection/index.d.ts +2 -2
- package/dist/introspection/index.d.ts.map +1 -1
- package/dist/introspection/index.js +2 -1
- package/dist/introspection/index.js.map +1 -1
- package/dist/react-devtools/index.css +58 -21
- package/dist/react-devtools/index.css.map +1 -1
- package/dist/react-devtools/index.js +8 -3
- package/dist/react-devtools/index.js.map +1 -1
- package/package.json +1 -1
- package/src/introspection/attach-introspection-states.ts +2 -1
- package/src/introspection/attach-type-selectors.ts +10 -4
- package/src/react-devtools/StateIndex.tsx +22 -17
- package/src/react-devtools/devtools.css +58 -21
|
@@ -1,15 +1,21 @@
|
|
|
1
1
|
main[data-css="atom_io_devtools"] {
|
|
2
|
-
--fg-color: #
|
|
2
|
+
--fg-color: #ccc;
|
|
3
|
+
--fg-light: #aaa;
|
|
4
|
+
--fg-faint: #555;
|
|
3
5
|
--bg-color: #111;
|
|
6
|
+
--bg-accent: #00f;
|
|
4
7
|
--bg-tint1: #222;
|
|
5
8
|
--fg-border: 1px solid var(--fg-color);
|
|
6
9
|
@media (prefers-color-scheme: light) {
|
|
7
10
|
--fg-color: #444;
|
|
11
|
+
--fg-light: #777;
|
|
12
|
+
--fg-faint: #999;
|
|
8
13
|
--bg-color: #ddd;
|
|
14
|
+
--bg-accent: #0ff;
|
|
9
15
|
--bg-tint1: #e3e3e3;
|
|
10
16
|
}
|
|
11
|
-
pointer-events: all;
|
|
12
17
|
& {
|
|
18
|
+
pointer-events: all;
|
|
13
19
|
box-sizing: border-box;
|
|
14
20
|
color: var(--fg-color);
|
|
15
21
|
background-color: var(--bg-color);
|
|
@@ -29,10 +35,9 @@ main[data-css="atom_io_devtools"] {
|
|
|
29
35
|
font-size: 16px;
|
|
30
36
|
font-family: theia, monospace;
|
|
31
37
|
line-height: 1em;
|
|
38
|
+
color: var(--fg-color);
|
|
32
39
|
}
|
|
33
40
|
> header {
|
|
34
|
-
padding: 5px;
|
|
35
|
-
padding-left: 10px;
|
|
36
41
|
padding-bottom: 0;
|
|
37
42
|
display: flex;
|
|
38
43
|
justify-content: space-between;
|
|
@@ -74,17 +79,21 @@ main[data-css="atom_io_devtools"] {
|
|
|
74
79
|
.node .node {
|
|
75
80
|
border-right: var(--fg-border);
|
|
76
81
|
padding-right: 0;
|
|
77
|
-
background: #
|
|
82
|
+
background: #ffffff08;
|
|
83
|
+
@media (prefers-color-scheme: light) {
|
|
84
|
+
background: #00000004;
|
|
85
|
+
}
|
|
78
86
|
}
|
|
79
87
|
.node > .node {
|
|
80
|
-
margin:
|
|
81
|
-
margin-left: 12px;
|
|
88
|
+
margin: 0px 2px 2px 18px;
|
|
82
89
|
border-left: var(--fg-border);
|
|
90
|
+
&:last-of-type {
|
|
91
|
+
margin-bottom: 6px;
|
|
92
|
+
}
|
|
83
93
|
}
|
|
84
94
|
.node {
|
|
85
95
|
border-top: var(--fg-border);
|
|
86
|
-
overflow
|
|
87
|
-
padding: 5px;
|
|
96
|
+
overflow: visible;
|
|
88
97
|
&:last-of-type {
|
|
89
98
|
border-bottom: var(--fg-border);
|
|
90
99
|
}
|
|
@@ -94,44 +103,74 @@ main[data-css="atom_io_devtools"] {
|
|
|
94
103
|
header {
|
|
95
104
|
display: flex;
|
|
96
105
|
flex-flow: row;
|
|
97
|
-
gap: 5px;
|
|
98
106
|
position: sticky;
|
|
99
107
|
z-index: 999;
|
|
100
108
|
top: 0;
|
|
109
|
+
height: 22px;
|
|
101
110
|
button.carat {
|
|
102
111
|
cursor: pointer;
|
|
103
112
|
background: none;
|
|
104
113
|
border: none;
|
|
105
114
|
width: 20px;
|
|
115
|
+
color: var(--fg-light);
|
|
106
116
|
&.open {
|
|
107
117
|
transform: rotate(90deg);
|
|
108
118
|
}
|
|
109
119
|
&:disabled {
|
|
110
120
|
cursor: default;
|
|
121
|
+
color: var(--fg-faint);
|
|
111
122
|
}
|
|
112
123
|
}
|
|
113
124
|
> main {
|
|
114
125
|
display: flex;
|
|
115
126
|
flex-flow: row;
|
|
116
|
-
gap: 5px;
|
|
117
127
|
cursor: help;
|
|
118
|
-
align-items:
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
display:
|
|
128
|
+
align-items: center;
|
|
129
|
+
* {
|
|
130
|
+
height: 100%;
|
|
131
|
+
display: flex;
|
|
132
|
+
align-items: center;
|
|
133
|
+
align-content: center;
|
|
134
|
+
justify-content: center;
|
|
135
|
+
}
|
|
136
|
+
h2 {
|
|
122
137
|
margin: 0;
|
|
123
|
-
}
|
|
138
|
+
}
|
|
124
139
|
.detail {
|
|
140
|
+
margin-left: 5px;
|
|
125
141
|
color: #777;
|
|
126
142
|
@media (prefers-color-scheme: light) {
|
|
127
143
|
color: #999;
|
|
128
144
|
}
|
|
129
145
|
}
|
|
130
146
|
}
|
|
147
|
+
> .json_viewer {
|
|
148
|
+
color: var(--fg-light);
|
|
149
|
+
}
|
|
150
|
+
> .json_editor,
|
|
151
|
+
> .json_viewer {
|
|
152
|
+
display: flex;
|
|
153
|
+
align-items: center;
|
|
154
|
+
border-left: 1px solid var(--fg-light);
|
|
155
|
+
background-color: var(--bg-tint1);
|
|
156
|
+
* {
|
|
157
|
+
display: flex;
|
|
158
|
+
height: 100%;
|
|
159
|
+
}
|
|
160
|
+
> span {
|
|
161
|
+
padding: 0px 5px;
|
|
162
|
+
border-left: var(--fg-color);
|
|
163
|
+
z-index: 0;
|
|
164
|
+
&:focus-within {
|
|
165
|
+
outline: 4px solid var(--fg-color);
|
|
166
|
+
background: var(--bg-accent);
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
input {
|
|
170
|
+
outline: none;
|
|
171
|
+
}
|
|
172
|
+
}
|
|
131
173
|
}
|
|
132
|
-
/* main {
|
|
133
|
-
margin-left: 15px;
|
|
134
|
-
} */
|
|
135
174
|
}
|
|
136
175
|
section.transaction_log {
|
|
137
176
|
margin-top: 0;
|
|
@@ -244,8 +283,6 @@ main[data-css="atom_io_devtools"] {
|
|
|
244
283
|
.json_editor {
|
|
245
284
|
input {
|
|
246
285
|
font-family: theia, monospace;
|
|
247
|
-
border: none;
|
|
248
|
-
border-bottom: 1px solid;
|
|
249
286
|
background: none;
|
|
250
287
|
&:disabled {
|
|
251
288
|
border: none;
|