@flrande/bak-extension 0.6.11 → 0.6.13
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/.bak-e2e-build-stamp +1 -1
- package/dist/background.global.js +588 -90
- package/dist/content.global.js +530 -12
- package/dist/manifest.json +1 -1
- package/dist/popup.global.js +233 -101
- package/dist/popup.html +260 -37
- package/package.json +2 -2
- package/public/popup.html +260 -37
- package/src/background.ts +344 -296
- package/src/content.ts +390 -22
- package/src/dynamic-data-tools.ts +790 -0
- package/src/popup.ts +291 -108
package/public/popup.html
CHANGED
|
@@ -5,155 +5,372 @@
|
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
6
|
<title>BAK Pairing</title>
|
|
7
7
|
<style>
|
|
8
|
+
:root {
|
|
9
|
+
color-scheme: light;
|
|
10
|
+
--ink: #0f172a;
|
|
11
|
+
--muted: #475569;
|
|
12
|
+
--line: #cbd5e1;
|
|
13
|
+
--panel: rgba(255, 255, 255, 0.88);
|
|
14
|
+
--panel-strong: #ffffff;
|
|
15
|
+
--success-bg: #dcfce7;
|
|
16
|
+
--success-ink: #166534;
|
|
17
|
+
--warning-bg: #fef3c7;
|
|
18
|
+
--warning-ink: #b45309;
|
|
19
|
+
--error-bg: #fee2e2;
|
|
20
|
+
--error-ink: #b91c1c;
|
|
21
|
+
--neutral-bg: #e2e8f0;
|
|
22
|
+
--neutral-ink: #334155;
|
|
23
|
+
}
|
|
24
|
+
|
|
8
25
|
body {
|
|
9
26
|
margin: 0;
|
|
10
27
|
padding: 14px;
|
|
11
|
-
width:
|
|
28
|
+
width: 360px;
|
|
12
29
|
font-family: "Segoe UI", sans-serif;
|
|
13
|
-
color:
|
|
14
|
-
background:
|
|
30
|
+
color: var(--ink);
|
|
31
|
+
background:
|
|
32
|
+
radial-gradient(circle at top left, rgba(59, 130, 246, 0.16), transparent 48%),
|
|
33
|
+
linear-gradient(165deg, #f8fafc, #edf4ff);
|
|
15
34
|
}
|
|
35
|
+
|
|
16
36
|
h1 {
|
|
17
37
|
margin: 0 0 12px;
|
|
18
38
|
font-size: 16px;
|
|
19
39
|
}
|
|
40
|
+
|
|
20
41
|
label {
|
|
21
42
|
display: block;
|
|
22
43
|
margin-top: 10px;
|
|
23
44
|
font-size: 12px;
|
|
24
45
|
}
|
|
46
|
+
|
|
25
47
|
input {
|
|
26
48
|
width: 100%;
|
|
27
49
|
box-sizing: border-box;
|
|
28
50
|
margin-top: 4px;
|
|
29
51
|
padding: 8px;
|
|
30
|
-
border: 1px solid
|
|
31
|
-
border-radius:
|
|
52
|
+
border: 1px solid var(--line);
|
|
53
|
+
border-radius: 8px;
|
|
32
54
|
font-size: 12px;
|
|
55
|
+
background: var(--panel-strong);
|
|
33
56
|
}
|
|
57
|
+
|
|
34
58
|
.toggle {
|
|
35
59
|
display: flex;
|
|
36
60
|
align-items: flex-start;
|
|
37
61
|
gap: 8px;
|
|
38
62
|
margin-top: 12px;
|
|
39
|
-
padding:
|
|
63
|
+
padding: 10px;
|
|
40
64
|
border: 1px solid #fbbf24;
|
|
41
|
-
border-radius:
|
|
65
|
+
border-radius: 8px;
|
|
42
66
|
background: #fffbeb;
|
|
43
67
|
}
|
|
68
|
+
|
|
44
69
|
.toggle input {
|
|
45
70
|
width: auto;
|
|
46
71
|
margin-top: 2px;
|
|
47
72
|
}
|
|
73
|
+
|
|
48
74
|
.toggle-text {
|
|
49
75
|
font-size: 11px;
|
|
50
76
|
color: #92400e;
|
|
51
77
|
}
|
|
78
|
+
|
|
52
79
|
.row {
|
|
53
80
|
display: flex;
|
|
54
81
|
gap: 8px;
|
|
55
82
|
margin-top: 12px;
|
|
56
83
|
}
|
|
84
|
+
|
|
57
85
|
.row[hidden] {
|
|
58
86
|
display: none;
|
|
59
87
|
}
|
|
88
|
+
|
|
60
89
|
button {
|
|
61
90
|
flex: 1;
|
|
62
91
|
border: none;
|
|
63
|
-
border-radius:
|
|
64
|
-
padding:
|
|
92
|
+
border-radius: 8px;
|
|
93
|
+
padding: 9px 10px;
|
|
65
94
|
font-size: 12px;
|
|
66
95
|
cursor: pointer;
|
|
67
96
|
}
|
|
97
|
+
|
|
68
98
|
button:disabled {
|
|
69
99
|
opacity: 0.55;
|
|
70
100
|
cursor: default;
|
|
71
101
|
}
|
|
102
|
+
|
|
72
103
|
#save {
|
|
73
104
|
background: #0f172a;
|
|
74
105
|
color: #fff;
|
|
75
106
|
}
|
|
107
|
+
|
|
76
108
|
#disconnect {
|
|
77
109
|
background: #e2e8f0;
|
|
78
110
|
color: #0f172a;
|
|
79
111
|
}
|
|
112
|
+
|
|
80
113
|
#reconnect {
|
|
81
114
|
background: #dbeafe;
|
|
82
115
|
color: #1d4ed8;
|
|
83
116
|
}
|
|
84
|
-
|
|
85
|
-
margin-top: 10px;
|
|
86
|
-
font-size: 12px;
|
|
87
|
-
font-weight: 600;
|
|
88
|
-
}
|
|
89
|
-
#statusNote {
|
|
90
|
-
margin-top: 4px;
|
|
91
|
-
font-size: 11px;
|
|
92
|
-
line-height: 1.45;
|
|
93
|
-
color: #475569;
|
|
94
|
-
}
|
|
117
|
+
|
|
95
118
|
.panel {
|
|
96
119
|
margin-top: 12px;
|
|
97
|
-
padding:
|
|
98
|
-
border: 1px solid
|
|
99
|
-
border-radius:
|
|
100
|
-
background:
|
|
120
|
+
padding: 12px;
|
|
121
|
+
border: 1px solid var(--line);
|
|
122
|
+
border-radius: 12px;
|
|
123
|
+
background: var(--panel);
|
|
124
|
+
backdrop-filter: blur(10px);
|
|
101
125
|
}
|
|
126
|
+
|
|
102
127
|
.panel h2 {
|
|
103
|
-
margin: 0 0
|
|
128
|
+
margin: 0 0 10px;
|
|
104
129
|
font-size: 12px;
|
|
105
130
|
}
|
|
131
|
+
|
|
132
|
+
.status-panel[data-tone="success"] {
|
|
133
|
+
border-color: #86efac;
|
|
134
|
+
background: linear-gradient(180deg, rgba(220, 252, 231, 0.92), rgba(255, 255, 255, 0.92));
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.status-panel[data-tone="warning"] {
|
|
138
|
+
border-color: #fcd34d;
|
|
139
|
+
background: linear-gradient(180deg, rgba(254, 243, 199, 0.92), rgba(255, 255, 255, 0.92));
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.status-panel[data-tone="error"] {
|
|
143
|
+
border-color: #fca5a5;
|
|
144
|
+
background: linear-gradient(180deg, rgba(254, 226, 226, 0.94), rgba(255, 255, 255, 0.92));
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
.status-panel[data-tone="neutral"] {
|
|
148
|
+
border-color: #cbd5e1;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
.status-header {
|
|
152
|
+
display: flex;
|
|
153
|
+
align-items: center;
|
|
154
|
+
gap: 8px;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
.status-badge {
|
|
158
|
+
display: inline-flex;
|
|
159
|
+
align-items: center;
|
|
160
|
+
border-radius: 999px;
|
|
161
|
+
padding: 4px 8px;
|
|
162
|
+
font-size: 10px;
|
|
163
|
+
font-weight: 700;
|
|
164
|
+
letter-spacing: 0.04em;
|
|
165
|
+
text-transform: uppercase;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.status-badge[data-tone="success"] {
|
|
169
|
+
background: var(--success-bg);
|
|
170
|
+
color: var(--success-ink);
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
.status-badge[data-tone="warning"] {
|
|
174
|
+
background: var(--warning-bg);
|
|
175
|
+
color: var(--warning-ink);
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
.status-badge[data-tone="error"] {
|
|
179
|
+
background: var(--error-bg);
|
|
180
|
+
color: var(--error-ink);
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
.status-badge[data-tone="neutral"] {
|
|
184
|
+
background: var(--neutral-bg);
|
|
185
|
+
color: var(--neutral-ink);
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
#status {
|
|
189
|
+
margin-top: 10px;
|
|
190
|
+
font-size: 14px;
|
|
191
|
+
font-weight: 700;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
#statusBody {
|
|
195
|
+
margin-top: 6px;
|
|
196
|
+
font-size: 11px;
|
|
197
|
+
line-height: 1.5;
|
|
198
|
+
color: var(--muted);
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
#recoveryList {
|
|
202
|
+
margin: 10px 0 0;
|
|
203
|
+
padding-left: 18px;
|
|
204
|
+
font-size: 11px;
|
|
205
|
+
line-height: 1.45;
|
|
206
|
+
color: var(--ink);
|
|
207
|
+
}
|
|
208
|
+
|
|
106
209
|
.meta-grid {
|
|
107
210
|
display: grid;
|
|
108
211
|
grid-template-columns: auto 1fr;
|
|
109
212
|
gap: 6px 10px;
|
|
110
213
|
font-size: 11px;
|
|
111
214
|
}
|
|
215
|
+
|
|
112
216
|
.meta-grid dt {
|
|
113
|
-
color:
|
|
217
|
+
color: var(--muted);
|
|
114
218
|
}
|
|
219
|
+
|
|
115
220
|
.meta-grid dd {
|
|
116
221
|
margin: 0;
|
|
117
|
-
color:
|
|
222
|
+
color: var(--ink);
|
|
118
223
|
word-break: break-word;
|
|
119
224
|
}
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
225
|
+
|
|
226
|
+
#sessionCards {
|
|
227
|
+
display: grid;
|
|
228
|
+
gap: 10px;
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
.session-empty {
|
|
232
|
+
border: 1px dashed var(--line);
|
|
233
|
+
border-radius: 10px;
|
|
234
|
+
padding: 12px;
|
|
123
235
|
font-size: 11px;
|
|
124
|
-
|
|
236
|
+
line-height: 1.45;
|
|
237
|
+
color: var(--muted);
|
|
238
|
+
background: rgba(255, 255, 255, 0.72);
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
.session-card {
|
|
242
|
+
border: 1px solid #dbe4f0;
|
|
243
|
+
border-radius: 12px;
|
|
244
|
+
padding: 10px;
|
|
245
|
+
background: rgba(255, 255, 255, 0.92);
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
.session-card[data-detached="true"] {
|
|
249
|
+
border-color: #f59e0b;
|
|
250
|
+
background: rgba(255, 251, 235, 0.95);
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
.session-card-header {
|
|
254
|
+
display: flex;
|
|
255
|
+
align-items: flex-start;
|
|
256
|
+
justify-content: space-between;
|
|
257
|
+
gap: 10px;
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
.session-card-title-wrap {
|
|
261
|
+
min-width: 0;
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
.session-card-title {
|
|
265
|
+
font-size: 12px;
|
|
266
|
+
font-weight: 700;
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
.session-card-subtitle {
|
|
270
|
+
margin-top: 2px;
|
|
271
|
+
font-size: 10px;
|
|
272
|
+
color: #64748b;
|
|
273
|
+
word-break: break-word;
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
.session-badge {
|
|
277
|
+
display: inline-flex;
|
|
278
|
+
align-items: center;
|
|
279
|
+
border-radius: 999px;
|
|
280
|
+
padding: 4px 8px;
|
|
281
|
+
font-size: 10px;
|
|
282
|
+
font-weight: 700;
|
|
283
|
+
white-space: nowrap;
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
.session-badge[data-detached="true"] {
|
|
287
|
+
background: #fef3c7;
|
|
288
|
+
color: #b45309;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
.session-badge[data-detached="false"] {
|
|
292
|
+
background: #dbeafe;
|
|
293
|
+
color: #1d4ed8;
|
|
125
294
|
}
|
|
126
|
-
|
|
127
|
-
|
|
295
|
+
|
|
296
|
+
.session-active-title {
|
|
297
|
+
margin-top: 10px;
|
|
298
|
+
font-size: 12px;
|
|
299
|
+
font-weight: 600;
|
|
300
|
+
color: var(--ink);
|
|
301
|
+
word-break: break-word;
|
|
302
|
+
}
|
|
303
|
+
|
|
304
|
+
.session-active-url {
|
|
305
|
+
margin-top: 4px;
|
|
306
|
+
font-size: 10px;
|
|
307
|
+
color: var(--muted);
|
|
308
|
+
word-break: break-all;
|
|
309
|
+
}
|
|
310
|
+
|
|
311
|
+
.session-meta-grid {
|
|
312
|
+
margin-top: 10px;
|
|
313
|
+
display: grid;
|
|
314
|
+
gap: 6px;
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
.session-meta-row {
|
|
318
|
+
display: grid;
|
|
319
|
+
grid-template-columns: 76px 1fr;
|
|
320
|
+
gap: 8px;
|
|
321
|
+
font-size: 11px;
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
.session-meta-label {
|
|
325
|
+
color: var(--muted);
|
|
326
|
+
}
|
|
327
|
+
|
|
328
|
+
.session-meta-value {
|
|
329
|
+
color: var(--ink);
|
|
330
|
+
word-break: break-word;
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
.session-card-footer {
|
|
334
|
+
margin-top: 10px;
|
|
335
|
+
padding-top: 8px;
|
|
336
|
+
border-top: 1px solid #e2e8f0;
|
|
337
|
+
font-size: 10px;
|
|
338
|
+
line-height: 1.45;
|
|
128
339
|
color: #64748b;
|
|
129
|
-
margin-left: -16px;
|
|
130
340
|
}
|
|
341
|
+
|
|
131
342
|
.hint {
|
|
132
343
|
margin-top: 10px;
|
|
133
344
|
font-size: 11px;
|
|
134
345
|
color: #334155;
|
|
135
346
|
}
|
|
347
|
+
|
|
136
348
|
.hint.compact {
|
|
137
349
|
margin-top: 8px;
|
|
138
350
|
}
|
|
351
|
+
|
|
139
352
|
details.panel {
|
|
140
353
|
padding-bottom: 12px;
|
|
141
354
|
}
|
|
355
|
+
|
|
142
356
|
details.panel summary {
|
|
143
357
|
cursor: pointer;
|
|
144
358
|
font-size: 12px;
|
|
145
359
|
font-weight: 600;
|
|
146
360
|
list-style: none;
|
|
147
361
|
}
|
|
362
|
+
|
|
148
363
|
details.panel summary::-webkit-details-marker {
|
|
149
364
|
display: none;
|
|
150
365
|
}
|
|
366
|
+
|
|
151
367
|
details.panel summary::after {
|
|
152
368
|
content: "Show";
|
|
153
369
|
float: right;
|
|
154
370
|
font-size: 11px;
|
|
155
371
|
color: #64748b;
|
|
156
372
|
}
|
|
373
|
+
|
|
157
374
|
details.panel[open] summary::after {
|
|
158
375
|
content: "Hide";
|
|
159
376
|
}
|
|
@@ -173,11 +390,17 @@
|
|
|
173
390
|
<input id="debugRichText" type="checkbox" />
|
|
174
391
|
<span class="toggle-text">Allow richer text capture for debugging (still redacted, off by default)</span>
|
|
175
392
|
</label>
|
|
176
|
-
<div id="status">Checking...</div>
|
|
177
|
-
<div id="statusNote">The extension reconnects automatically when the local bak runtime wakes up.</div>
|
|
178
393
|
<div class="row" id="saveRow" hidden>
|
|
179
394
|
<button id="save">Save settings</button>
|
|
180
395
|
</div>
|
|
396
|
+
<div class="panel status-panel" id="statusPanel" data-tone="neutral">
|
|
397
|
+
<div class="status-header">
|
|
398
|
+
<span class="status-badge" id="statusBadge" data-tone="neutral">Checking</span>
|
|
399
|
+
</div>
|
|
400
|
+
<div id="status">Checking...</div>
|
|
401
|
+
<div id="statusBody">The extension is checking local bak runtime health.</div>
|
|
402
|
+
<ul id="recoveryList"></ul>
|
|
403
|
+
</div>
|
|
181
404
|
<div class="panel">
|
|
182
405
|
<h2>Connection</h2>
|
|
183
406
|
<dl class="meta-grid">
|
|
@@ -203,7 +426,7 @@
|
|
|
203
426
|
<dt>Tracked</dt>
|
|
204
427
|
<dd id="sessionSummary">-</dd>
|
|
205
428
|
</dl>
|
|
206
|
-
<
|
|
429
|
+
<div id="sessionCards"></div>
|
|
207
430
|
</div>
|
|
208
431
|
<details class="panel" id="advancedPanel">
|
|
209
432
|
<summary>Advanced bridge controls</summary>
|