@codemem/server 0.22.1 → 0.22.2
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/package.json +2 -2
- package/static/app.js +786 -348
- package/static/index.html +154 -6
package/static/index.html
CHANGED
|
@@ -522,10 +522,15 @@
|
|
|
522
522
|
background: var(--control-bg);
|
|
523
523
|
color: var(--control-text);
|
|
524
524
|
padding: 5px 12px;
|
|
525
|
+
min-width: 28px;
|
|
526
|
+
min-height: 28px;
|
|
525
527
|
border-radius: var(--radius-pill);
|
|
526
528
|
font-size: 12px;
|
|
527
529
|
font-family: var(--font-sans);
|
|
528
530
|
cursor: pointer;
|
|
531
|
+
display: inline-flex;
|
|
532
|
+
align-items: center;
|
|
533
|
+
justify-content: center;
|
|
529
534
|
transition: background 0.15s ease, border-color 0.15s ease;
|
|
530
535
|
white-space: nowrap;
|
|
531
536
|
}
|
|
@@ -945,6 +950,25 @@
|
|
|
945
950
|
.sync-action + .sync-action { margin-top: var(--sp-2); }
|
|
946
951
|
|
|
947
952
|
.health-action-text, .sync-action-text { font-size: 13px; color: var(--text-primary); flex: 1; min-width: 0; }
|
|
953
|
+
.sync-section-heading {
|
|
954
|
+
display: flex;
|
|
955
|
+
align-items: center;
|
|
956
|
+
gap: var(--sp-2);
|
|
957
|
+
margin-top: var(--sp-2);
|
|
958
|
+
flex-wrap: wrap;
|
|
959
|
+
}
|
|
960
|
+
.sync-section-label {
|
|
961
|
+
margin-top: 0;
|
|
962
|
+
font-size: 12px;
|
|
963
|
+
font-weight: 700;
|
|
964
|
+
letter-spacing: 0.04em;
|
|
965
|
+
text-transform: uppercase;
|
|
966
|
+
color: var(--text-tertiary);
|
|
967
|
+
}
|
|
968
|
+
.sync-section-count {
|
|
969
|
+
font-size: 11px;
|
|
970
|
+
padding: 2px 8px;
|
|
971
|
+
}
|
|
948
972
|
.health-action-command, .sync-action-command { display: block; margin-top: 2px; font-family: var(--font-mono); font-size: 12px; color: var(--text-tertiary); }
|
|
949
973
|
.health-action-buttons { display: flex; gap: 6px; flex-shrink: 0; }
|
|
950
974
|
|
|
@@ -989,8 +1013,14 @@
|
|
|
989
1013
|
.peer-scope-input { width: 100%; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--text-primary); padding: 8px 10px; font: inherit; }
|
|
990
1014
|
.peer-scope-actions { display: flex; gap: var(--sp-2); }
|
|
991
1015
|
.peer-actions { display: flex; gap: 6px; }
|
|
992
|
-
.peer-actions button { border: 1px solid var(--border); background: transparent; border-radius: var(--radius-pill); padding: 5px 10px; font-family: var(--font-sans); font-size: 12px; cursor: pointer; color: var(--text-secondary); }
|
|
1016
|
+
.peer-actions button { border: 1px solid var(--border); background: transparent; border-radius: var(--radius-pill); padding: 5px 10px; min-width: 28px; min-height: 28px; display: inline-flex; align-items: center; justify-content: center; font-family: var(--font-sans); font-size: 12px; cursor: pointer; color: var(--text-secondary); }
|
|
993
1017
|
.peer-actions button:hover { border-color: var(--border-hover); background: var(--surface-2); }
|
|
1018
|
+
.peer-card,
|
|
1019
|
+
.actor-row,
|
|
1020
|
+
.peer-scope-input,
|
|
1021
|
+
.actor-list {
|
|
1022
|
+
scroll-margin-top: 110px;
|
|
1023
|
+
}
|
|
994
1024
|
.peer-scope-editor-wrap {
|
|
995
1025
|
display: grid;
|
|
996
1026
|
gap: var(--sp-2);
|
|
@@ -1037,6 +1067,25 @@
|
|
|
1037
1067
|
border-radius: 8px;
|
|
1038
1068
|
margin: 8px 0;
|
|
1039
1069
|
}
|
|
1070
|
+
.sync-empty-state strong {
|
|
1071
|
+
display: block;
|
|
1072
|
+
margin-bottom: 6px;
|
|
1073
|
+
color: var(--text-secondary);
|
|
1074
|
+
font-size: 0.95rem;
|
|
1075
|
+
}
|
|
1076
|
+
.sync-empty-state span {
|
|
1077
|
+
display: block;
|
|
1078
|
+
max-width: 54ch;
|
|
1079
|
+
margin: 0 auto;
|
|
1080
|
+
line-height: 1.5;
|
|
1081
|
+
}
|
|
1082
|
+
.sync-inline-feedback {
|
|
1083
|
+
margin-top: 8px;
|
|
1084
|
+
font-size: 12px;
|
|
1085
|
+
color: var(--text-secondary);
|
|
1086
|
+
}
|
|
1087
|
+
.sync-inline-feedback.success { color: var(--accent); }
|
|
1088
|
+
.sync-inline-feedback.warning { color: var(--accent-warm); }
|
|
1040
1089
|
.sync-field-error {
|
|
1041
1090
|
outline: 1.5px solid var(--red-text, #dc2626) !important;
|
|
1042
1091
|
outline-offset: -1px;
|
|
@@ -1052,6 +1101,23 @@
|
|
|
1052
1101
|
40%, 80% { transform: translateX(4px); }
|
|
1053
1102
|
}
|
|
1054
1103
|
.sync-shake { animation: sync-shake 0.3s ease-in-out; }
|
|
1104
|
+
@keyframes sync-attention-target {
|
|
1105
|
+
0% {
|
|
1106
|
+
transform: translateY(0);
|
|
1107
|
+
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
1108
|
+
}
|
|
1109
|
+
35% {
|
|
1110
|
+
transform: translateY(-1px);
|
|
1111
|
+
box-shadow: 0 0 0 3px var(--focus-ring);
|
|
1112
|
+
}
|
|
1113
|
+
100% {
|
|
1114
|
+
transform: translateY(0);
|
|
1115
|
+
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
1116
|
+
}
|
|
1117
|
+
}
|
|
1118
|
+
.sync-attention-target {
|
|
1119
|
+
animation: sync-attention-target 900ms ease-out;
|
|
1120
|
+
}
|
|
1055
1121
|
.settings-button:disabled {
|
|
1056
1122
|
opacity: 0.55;
|
|
1057
1123
|
cursor: not-allowed;
|
|
@@ -1106,11 +1172,19 @@
|
|
|
1106
1172
|
text-transform: uppercase;
|
|
1107
1173
|
color: var(--text-tertiary);
|
|
1108
1174
|
}
|
|
1175
|
+
.sync-team-headline {
|
|
1176
|
+
font-size: 15px;
|
|
1177
|
+
font-weight: 700;
|
|
1178
|
+
color: var(--text-primary);
|
|
1179
|
+
}
|
|
1109
1180
|
.sync-team-metrics {
|
|
1110
1181
|
font-size: 13px;
|
|
1111
1182
|
color: var(--text-secondary);
|
|
1112
1183
|
font-feature-settings: 'tnum' 1;
|
|
1113
1184
|
}
|
|
1185
|
+
.sync-team-metrics-secondary {
|
|
1186
|
+
color: var(--text-tertiary);
|
|
1187
|
+
}
|
|
1114
1188
|
.sync-radix-select-host {
|
|
1115
1189
|
min-width: 0;
|
|
1116
1190
|
max-width: 100%;
|
|
@@ -1321,6 +1395,64 @@
|
|
|
1321
1395
|
background: rgba(212, 100, 46, 0.1);
|
|
1322
1396
|
color: var(--accent-warm);
|
|
1323
1397
|
}
|
|
1398
|
+
.viewer-reconnect-overlay {
|
|
1399
|
+
position: fixed;
|
|
1400
|
+
inset: 0;
|
|
1401
|
+
z-index: 30;
|
|
1402
|
+
display: flex;
|
|
1403
|
+
align-items: center;
|
|
1404
|
+
justify-content: center;
|
|
1405
|
+
padding: var(--sp-6);
|
|
1406
|
+
background: color-mix(in srgb, var(--surface-0) 82%, transparent);
|
|
1407
|
+
backdrop-filter: blur(10px);
|
|
1408
|
+
}
|
|
1409
|
+
.viewer-reconnect-card {
|
|
1410
|
+
width: min(460px, 100%);
|
|
1411
|
+
display: flex;
|
|
1412
|
+
flex-direction: column;
|
|
1413
|
+
gap: var(--sp-3);
|
|
1414
|
+
padding: var(--sp-5);
|
|
1415
|
+
border: 1px solid var(--border);
|
|
1416
|
+
border-radius: var(--radius-xl);
|
|
1417
|
+
background: var(--surface-1);
|
|
1418
|
+
box-shadow: var(--shadow-md);
|
|
1419
|
+
}
|
|
1420
|
+
.viewer-reconnect-eyebrow {
|
|
1421
|
+
font-size: 12px;
|
|
1422
|
+
font-weight: 700;
|
|
1423
|
+
letter-spacing: 0.06em;
|
|
1424
|
+
text-transform: uppercase;
|
|
1425
|
+
color: var(--text-tertiary);
|
|
1426
|
+
}
|
|
1427
|
+
.viewer-reconnect-title {
|
|
1428
|
+
font-size: 18px;
|
|
1429
|
+
font-weight: 700;
|
|
1430
|
+
color: var(--text-primary);
|
|
1431
|
+
}
|
|
1432
|
+
.viewer-reconnect-detail {
|
|
1433
|
+
font-size: 13px;
|
|
1434
|
+
line-height: 1.5;
|
|
1435
|
+
color: var(--text-secondary);
|
|
1436
|
+
}
|
|
1437
|
+
.viewer-reconnect-status {
|
|
1438
|
+
display: inline-flex;
|
|
1439
|
+
align-items: center;
|
|
1440
|
+
gap: 10px;
|
|
1441
|
+
color: var(--text-secondary);
|
|
1442
|
+
font-size: 12px;
|
|
1443
|
+
}
|
|
1444
|
+
.viewer-reconnect-spinner {
|
|
1445
|
+
width: 14px;
|
|
1446
|
+
height: 14px;
|
|
1447
|
+
border-radius: 50%;
|
|
1448
|
+
border: 2px solid color-mix(in srgb, var(--accent) 22%, transparent);
|
|
1449
|
+
border-top-color: var(--accent);
|
|
1450
|
+
animation: reconnectSpin 0.9s linear infinite;
|
|
1451
|
+
}
|
|
1452
|
+
@keyframes reconnectSpin {
|
|
1453
|
+
from { transform: rotate(0deg); }
|
|
1454
|
+
to { transform: rotate(360deg); }
|
|
1455
|
+
}
|
|
1324
1456
|
|
|
1325
1457
|
.settings-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
|
|
1326
1458
|
.settings-tab {
|
|
@@ -1651,6 +1783,22 @@
|
|
|
1651
1783
|
<button class="tab-btn" id="tabBtn-sync">Sync</button>
|
|
1652
1784
|
</nav>
|
|
1653
1785
|
<div class="app-notice" id="globalNotice" hidden aria-live="polite"></div>
|
|
1786
|
+
<div class="viewer-reconnect-overlay" id="viewerReconnectOverlay" hidden>
|
|
1787
|
+
<div class="viewer-reconnect-card" role="status" aria-live="assertive">
|
|
1788
|
+
<div class="viewer-reconnect-eyebrow">Viewer connection</div>
|
|
1789
|
+
<div class="viewer-reconnect-title">Reconnecting to codemem…</div>
|
|
1790
|
+
<div class="viewer-reconnect-detail" id="viewerReconnectDetail">
|
|
1791
|
+
The viewer server is restarting or temporarily unavailable. Trying again automatically…
|
|
1792
|
+
</div>
|
|
1793
|
+
<div class="viewer-reconnect-status">
|
|
1794
|
+
<span class="viewer-reconnect-spinner" aria-hidden="true"></span>
|
|
1795
|
+
<span>The page will recover automatically when the server responds.</span>
|
|
1796
|
+
</div>
|
|
1797
|
+
<div>
|
|
1798
|
+
<button class="settings-button" id="viewerReconnectRetry">Retry now</button>
|
|
1799
|
+
</div>
|
|
1800
|
+
</div>
|
|
1801
|
+
</div>
|
|
1654
1802
|
|
|
1655
1803
|
<!-- ── Settings modal ──────────────────────────────────── -->
|
|
1656
1804
|
<div id="settingsDialogMount"></div>
|
|
@@ -1886,17 +2034,18 @@
|
|
|
1886
2034
|
<!-- 1. Needs attention + team setup/status -->
|
|
1887
2035
|
<div class="card" id="syncTeamCard">
|
|
1888
2036
|
<div class="section-header">
|
|
1889
|
-
<h2>
|
|
2037
|
+
<h2>Team sync</h2>
|
|
1890
2038
|
<div class="section-actions">
|
|
1891
2039
|
<button class="settings-button" id="syncNowButton">Sync now</button>
|
|
1892
2040
|
</div>
|
|
1893
2041
|
</div>
|
|
1894
|
-
<div class="section-meta" id="syncTeamMeta">
|
|
2042
|
+
<div class="section-meta" id="syncTeamMeta">Start with the next step below, then review team status and device details.</div>
|
|
1895
2043
|
<div class="sync-skeleton" id="syncTeamSkeleton" role="status" aria-label="Loading team sync">
|
|
1896
2044
|
<div class="sync-skeleton-line medium"></div>
|
|
1897
2045
|
<div class="sync-skeleton-block"></div>
|
|
1898
2046
|
<div class="sync-skeleton-line short"></div>
|
|
1899
2047
|
</div>
|
|
2048
|
+
<div class="sync-actions" id="syncTeamActions" hidden></div>
|
|
1900
2049
|
<div id="syncSetupPanel">
|
|
1901
2050
|
<div id="syncJoinSection">
|
|
1902
2051
|
<h3 class="settings-group-title">Join a team</h3>
|
|
@@ -1919,7 +2068,6 @@
|
|
|
1919
2068
|
<div class="section-meta" id="syncCoordinatorDiscoveredMeta"></div>
|
|
1920
2069
|
<div class="actor-list" id="syncCoordinatorDiscoveredList"></div>
|
|
1921
2070
|
</div>
|
|
1922
|
-
<div class="sync-actions" id="syncTeamActions" hidden></div>
|
|
1923
2071
|
</div>
|
|
1924
2072
|
|
|
1925
2073
|
<!-- 2. People & devices -->
|
|
@@ -1975,7 +2123,7 @@
|
|
|
1975
2123
|
</label>
|
|
1976
2124
|
</div>
|
|
1977
2125
|
</div>
|
|
1978
|
-
<div class="section-meta" id="syncMeta">
|
|
2126
|
+
<div class="section-meta" id="syncMeta">Use this section for sync debugging, pairing, and recent attempt details.</div>
|
|
1979
2127
|
<div class="sync-skeleton" id="syncDiagSkeleton" role="status" aria-label="Loading diagnostics">
|
|
1980
2128
|
<div class="sync-skeleton-line long"></div>
|
|
1981
2129
|
<div class="sync-skeleton-line medium"></div>
|
|
@@ -1986,7 +2134,7 @@
|
|
|
1986
2134
|
|
|
1987
2135
|
<div id="syncPairingPanelMount" style="display: contents"></div>
|
|
1988
2136
|
|
|
1989
|
-
<h3 class="settings-group-title" style="margin-top: 20px">Recent sync attempts</h3>
|
|
2137
|
+
<h3 class="settings-group-title" style="margin-top: 20px">Recent sync attempts (advanced)</h3>
|
|
1990
2138
|
<div class="attempts-list" id="syncAttempts"></div>
|
|
1991
2139
|
</div>
|
|
1992
2140
|
</div>
|