codex-overleaf-link 1.9.5 → 1.9.7
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/README.md +23 -23
- package/extension/bootstrap/background.js +4 -0
- package/extension/bootstrap/manifest.template.json +1 -1
- package/extension/bootstrap/popup.css +169 -19
- package/extension/bootstrap/popup.html +5 -5
- package/extension/bootstrap/update.css +366 -0
- package/extension/bootstrap/update.html +55 -0
- package/extension/bootstrap/update.js +334 -0
- package/extension/src/backgroundUpdateCoordinator.js +68 -7
- package/extension/src/popup.js +135 -7
- package/extension/src/shared/compatibility.js +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,366 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
color-scheme: dark;
|
|
3
|
+
--canvas: #101310;
|
|
4
|
+
--surface: #171b17;
|
|
5
|
+
--line: rgba(215, 230, 217, 0.13);
|
|
6
|
+
--line-strong: rgba(215, 230, 217, 0.24);
|
|
7
|
+
--text: #f1f4ef;
|
|
8
|
+
--muted: #a4aca4;
|
|
9
|
+
--quiet: #747d75;
|
|
10
|
+
--green: #86dc94;
|
|
11
|
+
--blue: #6eb5ff;
|
|
12
|
+
--amber: #e2bc70;
|
|
13
|
+
--red: #f28b82;
|
|
14
|
+
--shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
|
|
15
|
+
font-family: "Avenir Next", "Segoe UI", sans-serif;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
* {
|
|
19
|
+
box-sizing: border-box;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
html,
|
|
23
|
+
body {
|
|
24
|
+
min-width: 390px;
|
|
25
|
+
min-height: 500px;
|
|
26
|
+
margin: 0;
|
|
27
|
+
background:
|
|
28
|
+
radial-gradient(circle at 88% 5%, rgba(70, 131, 105, 0.17), transparent 34%),
|
|
29
|
+
radial-gradient(circle at 8% 88%, rgba(53, 100, 151, 0.13), transparent 38%),
|
|
30
|
+
var(--canvas);
|
|
31
|
+
color: var(--text);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
body {
|
|
35
|
+
padding: 0;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
button {
|
|
39
|
+
font: inherit;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.update-shell {
|
|
43
|
+
width: min(100%, 440px);
|
|
44
|
+
min-height: 500px;
|
|
45
|
+
margin: 0 auto;
|
|
46
|
+
padding: 26px 26px 22px;
|
|
47
|
+
display: flex;
|
|
48
|
+
flex-direction: column;
|
|
49
|
+
animation: shell-enter 180ms ease-out both;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.update-header {
|
|
53
|
+
display: flex;
|
|
54
|
+
align-items: flex-start;
|
|
55
|
+
justify-content: space-between;
|
|
56
|
+
gap: 20px;
|
|
57
|
+
padding-bottom: 22px;
|
|
58
|
+
border-bottom: 1px solid var(--line);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.eyebrow,
|
|
62
|
+
.update-kind,
|
|
63
|
+
.version-route,
|
|
64
|
+
.update-detail,
|
|
65
|
+
.persistence-note {
|
|
66
|
+
margin: 0;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.eyebrow {
|
|
70
|
+
color: var(--text);
|
|
71
|
+
font-size: 15px;
|
|
72
|
+
font-weight: 700;
|
|
73
|
+
letter-spacing: -0.01em;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.update-kind {
|
|
77
|
+
margin-top: 3px;
|
|
78
|
+
color: var(--muted);
|
|
79
|
+
font-size: 12px;
|
|
80
|
+
letter-spacing: 0.08em;
|
|
81
|
+
text-transform: uppercase;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.status-badge {
|
|
85
|
+
min-height: 26px;
|
|
86
|
+
padding: 5px 9px;
|
|
87
|
+
border: 1px solid var(--line-strong);
|
|
88
|
+
border-radius: 999px;
|
|
89
|
+
color: var(--muted);
|
|
90
|
+
background: rgba(255, 255, 255, 0.025);
|
|
91
|
+
font-size: 11px;
|
|
92
|
+
font-weight: 700;
|
|
93
|
+
letter-spacing: 0.02em;
|
|
94
|
+
white-space: nowrap;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.status-badge[data-tone="success"] {
|
|
98
|
+
border-color: rgba(134, 220, 148, 0.34);
|
|
99
|
+
color: var(--green);
|
|
100
|
+
background: rgba(72, 143, 84, 0.11);
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.status-badge[data-tone="active"] {
|
|
104
|
+
border-color: rgba(110, 181, 255, 0.34);
|
|
105
|
+
color: var(--blue);
|
|
106
|
+
background: rgba(60, 115, 170, 0.12);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.status-badge[data-tone="warning"] {
|
|
110
|
+
border-color: rgba(226, 188, 112, 0.34);
|
|
111
|
+
color: var(--amber);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.status-badge[data-tone="error"] {
|
|
115
|
+
border-color: rgba(242, 139, 130, 0.38);
|
|
116
|
+
color: var(--red);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.update-summary {
|
|
120
|
+
padding: 27px 0 18px;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
.version-route {
|
|
124
|
+
color: var(--green);
|
|
125
|
+
font: 600 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
126
|
+
letter-spacing: 0.01em;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
h1 {
|
|
130
|
+
margin: 8px 0 8px;
|
|
131
|
+
max-width: 350px;
|
|
132
|
+
font-size: 27px;
|
|
133
|
+
line-height: 1.13;
|
|
134
|
+
letter-spacing: -0.035em;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.update-detail {
|
|
138
|
+
max-width: 370px;
|
|
139
|
+
color: var(--muted);
|
|
140
|
+
font-size: 13px;
|
|
141
|
+
line-height: 1.55;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.progress-track {
|
|
145
|
+
position: relative;
|
|
146
|
+
width: 100%;
|
|
147
|
+
height: 3px;
|
|
148
|
+
margin: 1px 0 24px;
|
|
149
|
+
overflow: hidden;
|
|
150
|
+
border-radius: 999px;
|
|
151
|
+
background: rgba(255, 255, 255, 0.09);
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.progress-fill {
|
|
155
|
+
display: block;
|
|
156
|
+
width: 0;
|
|
157
|
+
height: 100%;
|
|
158
|
+
border-radius: inherit;
|
|
159
|
+
background: linear-gradient(90deg, var(--blue), var(--green));
|
|
160
|
+
box-shadow: 0 0 15px rgba(110, 181, 255, 0.38);
|
|
161
|
+
transition: width 240ms ease;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
.progress-track[data-indeterminate="true"] .progress-fill {
|
|
165
|
+
width: 36%;
|
|
166
|
+
animation: progress-scan 1.25s ease-in-out infinite;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
.update-stages {
|
|
170
|
+
margin: 0;
|
|
171
|
+
padding: 0;
|
|
172
|
+
list-style: none;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
.update-stages li {
|
|
176
|
+
position: relative;
|
|
177
|
+
display: grid;
|
|
178
|
+
grid-template-columns: 28px 1fr;
|
|
179
|
+
gap: 12px;
|
|
180
|
+
min-height: 62px;
|
|
181
|
+
color: var(--quiet);
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.update-stages li:not(:last-child)::after {
|
|
185
|
+
content: "";
|
|
186
|
+
position: absolute;
|
|
187
|
+
top: 27px;
|
|
188
|
+
bottom: 1px;
|
|
189
|
+
left: 13px;
|
|
190
|
+
width: 1px;
|
|
191
|
+
background: var(--line-strong);
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.stage-marker {
|
|
195
|
+
position: relative;
|
|
196
|
+
z-index: 1;
|
|
197
|
+
display: grid;
|
|
198
|
+
place-items: center;
|
|
199
|
+
width: 27px;
|
|
200
|
+
height: 27px;
|
|
201
|
+
border: 1px solid var(--line-strong);
|
|
202
|
+
border-radius: 50%;
|
|
203
|
+
background: var(--canvas);
|
|
204
|
+
color: var(--quiet);
|
|
205
|
+
font: 700 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.update-stages strong,
|
|
209
|
+
.update-stages small {
|
|
210
|
+
display: block;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
.update-stages strong {
|
|
214
|
+
padding-top: 2px;
|
|
215
|
+
color: inherit;
|
|
216
|
+
font-size: 13px;
|
|
217
|
+
line-height: 1.25;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.update-stages small {
|
|
221
|
+
margin-top: 4px;
|
|
222
|
+
color: var(--quiet);
|
|
223
|
+
font-size: 11px;
|
|
224
|
+
line-height: 1.35;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
.update-stages li[data-state="active"] {
|
|
228
|
+
color: var(--text);
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
.update-stages li[data-state="active"] .stage-marker {
|
|
232
|
+
border-color: var(--blue);
|
|
233
|
+
color: var(--canvas);
|
|
234
|
+
background: var(--blue);
|
|
235
|
+
box-shadow: 0 0 0 4px rgba(110, 181, 255, 0.1);
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
.update-stages li[data-state="done"] {
|
|
239
|
+
color: var(--green);
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
.update-stages li[data-state="done"] .stage-marker {
|
|
243
|
+
border-color: rgba(134, 220, 148, 0.5);
|
|
244
|
+
color: var(--green);
|
|
245
|
+
background: rgba(82, 155, 94, 0.14);
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
.update-stages li[data-state="error"] {
|
|
249
|
+
color: var(--red);
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
.update-stages li[data-state="error"] .stage-marker {
|
|
253
|
+
border-color: rgba(242, 139, 130, 0.62);
|
|
254
|
+
color: var(--red);
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
.persistence-note {
|
|
258
|
+
margin-top: 5px;
|
|
259
|
+
padding: 12px 0 15px;
|
|
260
|
+
border-top: 1px solid var(--line);
|
|
261
|
+
color: var(--muted);
|
|
262
|
+
font-size: 11px;
|
|
263
|
+
line-height: 1.45;
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
.technical-details {
|
|
267
|
+
margin: 0 0 14px;
|
|
268
|
+
color: var(--muted);
|
|
269
|
+
font-size: 11px;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.technical-details summary {
|
|
273
|
+
cursor: pointer;
|
|
274
|
+
color: var(--muted);
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
.technical-details pre {
|
|
278
|
+
max-height: 100px;
|
|
279
|
+
margin: 9px 0 0;
|
|
280
|
+
padding: 10px;
|
|
281
|
+
overflow: auto;
|
|
282
|
+
border-radius: 8px;
|
|
283
|
+
background: rgba(0, 0, 0, 0.24);
|
|
284
|
+
color: #cbd1cb;
|
|
285
|
+
font: 10px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
286
|
+
white-space: pre-wrap;
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
.update-actions {
|
|
290
|
+
display: flex;
|
|
291
|
+
justify-content: flex-end;
|
|
292
|
+
gap: 9px;
|
|
293
|
+
margin-top: auto;
|
|
294
|
+
padding-top: 4px;
|
|
295
|
+
}
|
|
296
|
+
|
|
297
|
+
.update-actions button {
|
|
298
|
+
min-height: 36px;
|
|
299
|
+
padding: 0 15px;
|
|
300
|
+
border: 1px solid var(--line-strong);
|
|
301
|
+
border-radius: 8px;
|
|
302
|
+
color: var(--text);
|
|
303
|
+
background: rgba(255, 255, 255, 0.035);
|
|
304
|
+
font-size: 12px;
|
|
305
|
+
font-weight: 700;
|
|
306
|
+
cursor: pointer;
|
|
307
|
+
transition: border-color 140ms ease, background 140ms ease, transform 140ms ease;
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
.update-actions button:hover {
|
|
311
|
+
border-color: rgba(215, 230, 217, 0.38);
|
|
312
|
+
background: rgba(255, 255, 255, 0.075);
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
.update-actions button:active {
|
|
316
|
+
transform: translateY(1px);
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
.update-actions button:focus-visible,
|
|
320
|
+
.technical-details summary:focus-visible {
|
|
321
|
+
outline: 2px solid var(--blue);
|
|
322
|
+
outline-offset: 2px;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
.update-actions button[data-kind="primary"] {
|
|
326
|
+
border-color: #4f9ce5;
|
|
327
|
+
color: #08131e;
|
|
328
|
+
background: linear-gradient(180deg, #77bdff, #5aa8ee);
|
|
329
|
+
}
|
|
330
|
+
|
|
331
|
+
.update-actions button[data-kind="primary"]:hover {
|
|
332
|
+
border-color: #8bc9ff;
|
|
333
|
+
background: linear-gradient(180deg, #87c7ff, #67b1f3);
|
|
334
|
+
}
|
|
335
|
+
|
|
336
|
+
.update-actions button[data-kind="quiet"] {
|
|
337
|
+
border-color: transparent;
|
|
338
|
+
color: var(--muted);
|
|
339
|
+
background: transparent;
|
|
340
|
+
}
|
|
341
|
+
|
|
342
|
+
.update-actions button:disabled {
|
|
343
|
+
opacity: 0.5;
|
|
344
|
+
cursor: default;
|
|
345
|
+
transform: none;
|
|
346
|
+
}
|
|
347
|
+
|
|
348
|
+
@keyframes shell-enter {
|
|
349
|
+
from { opacity: 0; transform: translateY(5px); }
|
|
350
|
+
to { opacity: 1; transform: translateY(0); }
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
@keyframes progress-scan {
|
|
354
|
+
from { transform: translateX(-120%); }
|
|
355
|
+
to { transform: translateX(380%); }
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
@media (prefers-reduced-motion: reduce) {
|
|
359
|
+
*,
|
|
360
|
+
*::before,
|
|
361
|
+
*::after {
|
|
362
|
+
animation-duration: 0.01ms !important;
|
|
363
|
+
animation-iteration-count: 1 !important;
|
|
364
|
+
transition-duration: 0.01ms !important;
|
|
365
|
+
}
|
|
366
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
+
<title>Codex Overleaf Link Update</title>
|
|
7
|
+
<link rel="stylesheet" href="update.css">
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<main class="update-shell" aria-labelledby="update-title">
|
|
11
|
+
<header class="update-header">
|
|
12
|
+
<div>
|
|
13
|
+
<p class="eyebrow">Codex Overleaf Link</p>
|
|
14
|
+
<p class="update-kind">Stable Update</p>
|
|
15
|
+
</div>
|
|
16
|
+
<span id="status-badge" class="status-badge" data-tone="neutral">Ready</span>
|
|
17
|
+
</header>
|
|
18
|
+
|
|
19
|
+
<section class="update-summary" aria-live="polite" aria-atomic="true">
|
|
20
|
+
<p id="version-route" class="version-route">Checking installed version</p>
|
|
21
|
+
<h1 id="update-title">Checking for updates</h1>
|
|
22
|
+
<p id="update-detail" class="update-detail">Reading the latest saved update state.</p>
|
|
23
|
+
</section>
|
|
24
|
+
|
|
25
|
+
<div id="progress-track" class="progress-track" role="progressbar" aria-label="Update progress" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" hidden>
|
|
26
|
+
<span id="progress-fill" class="progress-fill"></span>
|
|
27
|
+
</div>
|
|
28
|
+
|
|
29
|
+
<ol id="update-stages" class="update-stages" aria-label="Update stages">
|
|
30
|
+
<li data-stage="download">
|
|
31
|
+
<span class="stage-marker" aria-hidden="true">1</span>
|
|
32
|
+
<span><strong>Download and verify</strong><small>Fetch the signed stable release and verify its manifest.</small></span>
|
|
33
|
+
</li>
|
|
34
|
+
<li data-stage="safe-point">
|
|
35
|
+
<span class="stage-marker" aria-hidden="true">2</span>
|
|
36
|
+
<span><strong>Wait for a safe point</strong><small>Protect active Overleaf work before changing runtime files.</small></span>
|
|
37
|
+
</li>
|
|
38
|
+
<li data-stage="restart">
|
|
39
|
+
<span class="stage-marker" aria-hidden="true">3</span>
|
|
40
|
+
<span><strong>Restart and health check</strong><small>Activate Extension and Native Host together, then verify both.</small></span>
|
|
41
|
+
</li>
|
|
42
|
+
</ol>
|
|
43
|
+
|
|
44
|
+
<p id="persistence-note" class="persistence-note">This window can stay open while work continues elsewhere. Progress is saved automatically.</p>
|
|
45
|
+
|
|
46
|
+
<details id="technical-details" class="technical-details" hidden>
|
|
47
|
+
<summary>Technical details</summary>
|
|
48
|
+
<pre id="technical-message"></pre>
|
|
49
|
+
</details>
|
|
50
|
+
|
|
51
|
+
<footer id="update-actions" class="update-actions" aria-label="Update actions"></footer>
|
|
52
|
+
</main>
|
|
53
|
+
<script src="update.js"></script>
|
|
54
|
+
</body>
|
|
55
|
+
</html>
|