a2acalling 0.6.63 → 0.6.65
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/.a2a-manifest.json +2 -2
- package/.maestro/inbox/release-workflow-spam.md +25 -0
- package/CONVENTIONS.md +3 -0
- package/docs/plans/2026-02-21-a2a-48-permissions-redesign.md +359 -0
- package/docs/plans/2026-02-21-a2a-49-remaining-tabs-polish.md +375 -0
- package/package.json +1 -1
- package/src/dashboard/public/app.js +702 -424
- package/src/dashboard/public/index.html +223 -125
- package/src/dashboard/public/style.css +933 -109
|
@@ -1,31 +1,70 @@
|
|
|
1
1
|
<!doctype html>
|
|
2
|
-
<html lang="en">
|
|
2
|
+
<html lang="en" class="sl-theme-dark">
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>A2A
|
|
7
|
-
|
|
6
|
+
<title>A2A Callbook</title>
|
|
7
|
+
<!-- A2A-47: Switch to Shoelace dark theme to match dark sidebar design -->
|
|
8
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.19/cdn/themes/dark.css" />
|
|
8
9
|
<script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.19/cdn/shoelace-autoloader.js"></script>
|
|
10
|
+
<!-- A2A-47: Material Symbols for sidebar nav icons -->
|
|
11
|
+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" />
|
|
12
|
+
<!-- A2A-47: Inter font for modern UI typography -->
|
|
13
|
+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" />
|
|
9
14
|
<link rel="stylesheet" href="./style.css">
|
|
10
15
|
</head>
|
|
11
|
-
<body>
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
<
|
|
15
|
-
|
|
16
|
+
<body class="sl-theme-dark">
|
|
17
|
+
<!-- A2A-47: Fixed left sidebar navigation replacing sl-tab-group horizontal tabs -->
|
|
18
|
+
<aside class="sidebar">
|
|
19
|
+
<div class="sidebar-brand">
|
|
20
|
+
<span class="material-symbols-outlined brand-icon">phone_in_talk</span>
|
|
21
|
+
<span class="brand-text">A2A Callbook</span>
|
|
22
|
+
</div>
|
|
23
|
+
<nav class="sidebar-nav">
|
|
24
|
+
<a data-panel="contacts" class="nav-item active">
|
|
25
|
+
<span class="material-symbols-outlined nav-icon" style="color:#10B981;">contacts</span>
|
|
26
|
+
<span class="nav-label">Contacts</span>
|
|
27
|
+
</a>
|
|
28
|
+
<a data-panel="calls" class="nav-item">
|
|
29
|
+
<span class="material-symbols-outlined nav-icon" style="color:#3B82F6;">call</span>
|
|
30
|
+
<span class="nav-label">Calls</span>
|
|
31
|
+
</a>
|
|
32
|
+
<a data-panel="permissions" class="nav-item">
|
|
33
|
+
<span class="material-symbols-outlined nav-icon" style="color:#8B5CF6;">verified_user</span>
|
|
34
|
+
<span class="nav-label">Permissions</span>
|
|
35
|
+
</a>
|
|
36
|
+
<a data-panel="invites" class="nav-item">
|
|
37
|
+
<span class="material-symbols-outlined nav-icon" style="color:#F59E0B;">mail</span>
|
|
38
|
+
<span class="nav-label">Invites</span>
|
|
39
|
+
</a>
|
|
40
|
+
<a data-panel="logs" class="nav-item">
|
|
41
|
+
<span class="material-symbols-outlined nav-icon" style="color:#14B8A6;">history</span>
|
|
42
|
+
<span class="nav-label">Logs</span>
|
|
43
|
+
</a>
|
|
44
|
+
<a data-panel="health" class="nav-item">
|
|
45
|
+
<span class="material-symbols-outlined nav-icon" style="color:#EF4444;">monitor_heart</span>
|
|
46
|
+
<span class="nav-label">Health</span>
|
|
47
|
+
</a>
|
|
48
|
+
<!-- A2A-50: Settings nav item for relocated admin settings -->
|
|
49
|
+
<a data-panel="settings" class="nav-item">
|
|
50
|
+
<span class="material-symbols-outlined nav-icon" style="color:#6B7280;">settings</span>
|
|
51
|
+
<span class="nav-label">Settings</span>
|
|
52
|
+
</a>
|
|
53
|
+
</nav>
|
|
54
|
+
</aside>
|
|
16
55
|
|
|
17
|
-
<main>
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
<sl-tab slot="nav" panel="permissions">Permissions</sl-tab>
|
|
22
|
-
<sl-tab slot="nav" panel="invites">Invites</sl-tab>
|
|
23
|
-
<sl-tab slot="nav" panel="logs">Logs</sl-tab>
|
|
24
|
-
<sl-tab slot="nav" panel="health">Health</sl-tab>
|
|
56
|
+
<main class="main-content">
|
|
57
|
+
<!-- A2A-47: Decorative background orbs for depth -->
|
|
58
|
+
<div class="bg-orb bg-orb-blue"></div>
|
|
59
|
+
<div class="bg-orb bg-orb-purple"></div>
|
|
25
60
|
|
|
26
|
-
|
|
27
|
-
|
|
61
|
+
<header class="content-header">
|
|
62
|
+
<h1 id="section-title">Contacts</h1>
|
|
63
|
+
</header>
|
|
28
64
|
|
|
65
|
+
<div class="content-body">
|
|
66
|
+
<!-- A2A-47: Panel-based layout; only one panel visible at a time -->
|
|
67
|
+
<div id="panel-contacts" class="panel active">
|
|
29
68
|
<sl-details id="add-contact-details" summary="+ Add Contact">
|
|
30
69
|
<form id="add-contact-form">
|
|
31
70
|
<sl-input id="add-contact-url" label="Invite URL" placeholder="a2a://host/token" required></sl-input>
|
|
@@ -45,10 +84,9 @@
|
|
|
45
84
|
|
|
46
85
|
<div id="contacts-sections"></div>
|
|
47
86
|
<sl-card id="contact-detail"></sl-card>
|
|
48
|
-
</
|
|
87
|
+
</div>
|
|
49
88
|
|
|
50
|
-
<
|
|
51
|
-
<h2>Calls</h2>
|
|
89
|
+
<div id="panel-calls" class="panel">
|
|
52
90
|
<table id="calls-table">
|
|
53
91
|
<thead>
|
|
54
92
|
<tr>
|
|
@@ -63,117 +101,109 @@
|
|
|
63
101
|
<tbody></tbody>
|
|
64
102
|
</table>
|
|
65
103
|
<div id="call-detail"></div>
|
|
66
|
-
</
|
|
104
|
+
</div>
|
|
67
105
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
<div class="
|
|
71
|
-
<
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
106
|
+
<!-- A2A-48: Permissions tab redesign with tier cards, tool toggles, auto-save, and right sidebar -->
|
|
107
|
+
<div id="panel-permissions" class="panel">
|
|
108
|
+
<div class="perm-layout">
|
|
109
|
+
<div class="perm-main">
|
|
110
|
+
<!-- Active Tier cards -->
|
|
111
|
+
<section class="perm-section">
|
|
112
|
+
<div class="perm-section-header">
|
|
113
|
+
<h2>Active Tier</h2>
|
|
114
|
+
<button class="perm-add-btn" id="perm-new-tier-btn">
|
|
115
|
+
<span class="material-symbols-outlined" style="font-size:18px;">add</span> New Tier
|
|
116
|
+
</button>
|
|
117
|
+
</div>
|
|
118
|
+
<div id="tier-cards" class="tier-cards-grid"></div>
|
|
119
|
+
</section>
|
|
76
120
|
|
|
77
|
-
|
|
121
|
+
<!-- Active Configuration (topics + goals) -->
|
|
122
|
+
<section class="perm-section">
|
|
123
|
+
<div class="perm-section-header">
|
|
124
|
+
<h2>Active Configuration</h2>
|
|
125
|
+
<span class="perm-hint">Drag items from sidebar to update permissions</span>
|
|
126
|
+
</div>
|
|
127
|
+
<div class="config-columns">
|
|
128
|
+
<div class="config-col">
|
|
129
|
+
<div class="config-col-header config-col-header--teal">
|
|
130
|
+
<span class="status-dot status-dot--teal"></span>
|
|
131
|
+
Active Topics
|
|
132
|
+
<span id="topic-count" class="count-badge count-badge--teal">0</span>
|
|
133
|
+
</div>
|
|
134
|
+
<div id="active-topics-zone" class="perm-drop-zone"></div>
|
|
135
|
+
</div>
|
|
136
|
+
<div class="config-col">
|
|
137
|
+
<div class="config-col-header config-col-header--yellow">
|
|
138
|
+
<span class="status-dot status-dot--yellow"></span>
|
|
139
|
+
Active Goals
|
|
140
|
+
<span id="goal-count" class="count-badge count-badge--yellow">0</span>
|
|
141
|
+
</div>
|
|
142
|
+
<div id="active-goals-zone" class="perm-drop-zone"></div>
|
|
143
|
+
</div>
|
|
144
|
+
</div>
|
|
145
|
+
</section>
|
|
78
146
|
|
|
79
|
-
|
|
80
|
-
|
|
147
|
+
<!-- Allowed Tools toggles -->
|
|
148
|
+
<section class="perm-section">
|
|
149
|
+
<h2>Allowed Tools</h2>
|
|
150
|
+
<div id="tool-toggles" class="tool-toggles-grid"></div>
|
|
151
|
+
</section>
|
|
81
152
|
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
<sl-input id="tier-description" label="Description"></sl-input>
|
|
85
|
-
<label>Allowed Tools</label>
|
|
86
|
-
<div id="tier-tools-list" class="tools-checklist"></div>
|
|
87
|
-
<label>Topics</label>
|
|
88
|
-
<div id="tier-topics-list"></div>
|
|
89
|
-
<label>Goals</label>
|
|
90
|
-
<div id="tier-goals-list"></div>
|
|
91
|
-
<div class="row">
|
|
92
|
-
<sl-button type="submit" variant="primary">Save Tier</sl-button>
|
|
153
|
+
<!-- Tier Warnings -->
|
|
154
|
+
<div id="tier-warnings" class="tier-warnings"></div>
|
|
93
155
|
</div>
|
|
94
|
-
</form>
|
|
95
156
|
|
|
96
|
-
|
|
97
|
-
<
|
|
98
|
-
|
|
99
|
-
|
|
157
|
+
<!-- Right sidebar: preview + topic/goal lists -->
|
|
158
|
+
<div class="perm-sidebar">
|
|
159
|
+
<div id="perm-preview" class="preview-card"></div>
|
|
160
|
+
<div id="sidebar-topics" class="sidebar-list"></div>
|
|
161
|
+
<div id="sidebar-goals" class="sidebar-list"></div>
|
|
162
|
+
</div>
|
|
100
163
|
</div>
|
|
101
164
|
|
|
102
|
-
|
|
103
|
-
<
|
|
104
|
-
<sl-input id="
|
|
105
|
-
<sl-
|
|
106
|
-
<div class="row">
|
|
107
|
-
<sl-button
|
|
165
|
+
<!-- A2A-48: Simplified Create New Item dialog (no icon selector per scope decision) -->
|
|
166
|
+
<sl-dialog id="create-item-dialog" label="Create New Item" style="--width: 440px;">
|
|
167
|
+
<sl-input id="create-item-title" label="Title" placeholder="e.g., Database Management" required></sl-input>
|
|
168
|
+
<sl-textarea id="create-item-desc" label="Description" rows="3" placeholder="Describe the scope..."></sl-textarea>
|
|
169
|
+
<div slot="footer" class="row">
|
|
170
|
+
<sl-button id="create-item-cancel" variant="default">Cancel</sl-button>
|
|
171
|
+
<sl-button id="create-item-submit" variant="primary">Create</sl-button>
|
|
108
172
|
</div>
|
|
109
|
-
</
|
|
173
|
+
</sl-dialog>
|
|
110
174
|
|
|
111
|
-
|
|
112
|
-
<
|
|
113
|
-
<
|
|
114
|
-
<sl-
|
|
175
|
+
<!-- A2A-48: Full caller preview dialog (existing, kept for detail view) -->
|
|
176
|
+
<sl-dialog id="preview-dialog" label="Caller Preview" style="--width: 540px;">
|
|
177
|
+
<div id="preview-content"></div>
|
|
178
|
+
<sl-button slot="footer" variant="primary" id="preview-close-btn">Close</sl-button>
|
|
179
|
+
</sl-dialog>
|
|
180
|
+
|
|
181
|
+
<!-- A2A-50: Delete confirmation dialog for topics/goals -->
|
|
182
|
+
<sl-dialog id="delete-confirm-dialog" label="Confirm Removal" style="--width: 400px;">
|
|
183
|
+
<p id="delete-confirm-message">Remove this item from the tier?</p>
|
|
184
|
+
<div slot="footer" class="row">
|
|
185
|
+
<sl-button id="delete-confirm-no" variant="default">Cancel</sl-button>
|
|
186
|
+
<sl-button id="delete-confirm-yes" variant="danger">Remove</sl-button>
|
|
187
|
+
</div>
|
|
188
|
+
</sl-dialog>
|
|
189
|
+
|
|
190
|
+
<!-- A2A-50: New Tier dialog (glass-styled modal replacing inline form scroll) -->
|
|
191
|
+
<sl-dialog id="new-tier-dialog" label="Create New Tier" style="--width: 440px;">
|
|
192
|
+
<sl-input id="new-tier-dialog-id" label="Tier ID" placeholder="partners" required></sl-input>
|
|
193
|
+
<sl-input id="new-tier-dialog-name" label="Name" placeholder="Partners"></sl-input>
|
|
115
194
|
<label>Copy from
|
|
116
|
-
<sl-select id="new-tier-copy-from" size="small">
|
|
195
|
+
<sl-select id="new-tier-dialog-copy-from" size="small">
|
|
117
196
|
<sl-option value="">None</sl-option>
|
|
118
197
|
</sl-select>
|
|
119
198
|
</label>
|
|
120
|
-
<div class="row">
|
|
121
|
-
<sl-button
|
|
122
|
-
|
|
123
|
-
</form>
|
|
124
|
-
|
|
125
|
-
<h3>Remote Callbook</h3>
|
|
126
|
-
<sl-card id="callbook-status"></sl-card>
|
|
127
|
-
|
|
128
|
-
<h3>Auto Update</h3>
|
|
129
|
-
<sl-card id="auto-update-status">Loading...</sl-card>
|
|
130
|
-
<div class="row">
|
|
131
|
-
<sl-button id="auto-update-check" size="small">Check now</sl-button>
|
|
132
|
-
<sl-button id="auto-update-now" size="small">Update now</sl-button>
|
|
133
|
-
<sl-button id="auto-update-toggle" size="small">Disable auto-update</sl-button>
|
|
134
|
-
</div>
|
|
135
|
-
|
|
136
|
-
<sl-card>
|
|
137
|
-
<form id="callbook-provision-form">
|
|
138
|
-
<div class="row">
|
|
139
|
-
<sl-button type="submit" variant="primary" size="small">Create Install Link (24h)</sl-button>
|
|
140
|
-
<sl-button id="callbook-logout" size="small" variant="default">Logout This Browser</sl-button>
|
|
141
|
-
</div>
|
|
142
|
-
<sl-input id="callbook-label" label="Device label" value="Callbook Remote"></sl-input>
|
|
143
|
-
<sl-textarea id="callbook-install-url" label="Install URL" rows="3" readonly></sl-textarea>
|
|
144
|
-
<div class="row">
|
|
145
|
-
<sl-button id="callbook-copy-url" size="small">Copy Link</sl-button>
|
|
146
|
-
</div>
|
|
147
|
-
<div id="callbook-warnings" class="mono"></div>
|
|
148
|
-
</form>
|
|
149
|
-
</sl-card>
|
|
150
|
-
|
|
151
|
-
<sl-card>
|
|
152
|
-
<div class="row">
|
|
153
|
-
<strong>Paired Devices</strong>
|
|
199
|
+
<div slot="footer" class="row">
|
|
200
|
+
<sl-button id="new-tier-dialog-cancel" variant="default">Cancel</sl-button>
|
|
201
|
+
<sl-button id="new-tier-dialog-submit" variant="primary">Create Tier</sl-button>
|
|
154
202
|
</div>
|
|
155
|
-
<table id="callbook-devices-table">
|
|
156
|
-
<thead>
|
|
157
|
-
<tr>
|
|
158
|
-
<th>Label</th>
|
|
159
|
-
<th>Created</th>
|
|
160
|
-
<th>Last Used</th>
|
|
161
|
-
<th>Sessions</th>
|
|
162
|
-
<th>Revoked</th>
|
|
163
|
-
<th>Action</th>
|
|
164
|
-
</tr>
|
|
165
|
-
</thead>
|
|
166
|
-
<tbody></tbody>
|
|
167
|
-
</table>
|
|
168
|
-
</sl-card>
|
|
169
|
-
|
|
170
|
-
<sl-dialog id="preview-dialog" label="Caller Preview" style="--width: 540px;">
|
|
171
|
-
<div id="preview-content"></div>
|
|
172
|
-
<sl-button slot="footer" variant="primary" id="preview-close-btn">Close</sl-button>
|
|
173
203
|
</sl-dialog>
|
|
174
|
-
</
|
|
204
|
+
</div>
|
|
175
205
|
|
|
176
|
-
<
|
|
206
|
+
<div id="panel-invites" class="panel">
|
|
177
207
|
<sl-details id="generate-invite-details" summary="+ Generate Invite">
|
|
178
208
|
<form id="invite-form">
|
|
179
209
|
<sl-input id="invite-name" label="Name" required></sl-input>
|
|
@@ -209,11 +239,9 @@
|
|
|
209
239
|
</thead>
|
|
210
240
|
<tbody></tbody>
|
|
211
241
|
</table>
|
|
212
|
-
</
|
|
213
|
-
|
|
214
|
-
<sl-tab-panel name="logs">
|
|
215
|
-
<h2>Logs</h2>
|
|
242
|
+
</div>
|
|
216
243
|
|
|
244
|
+
<div id="panel-logs" class="panel">
|
|
217
245
|
<div class="filters">
|
|
218
246
|
<label>Level
|
|
219
247
|
<sl-select id="logs-level" size="small" clearable>
|
|
@@ -254,10 +282,9 @@
|
|
|
254
282
|
</table>
|
|
255
283
|
|
|
256
284
|
<sl-card id="trace-detail"></sl-card>
|
|
257
|
-
</
|
|
285
|
+
</div>
|
|
258
286
|
|
|
259
|
-
<
|
|
260
|
-
<h2>E2E Health</h2>
|
|
287
|
+
<div id="panel-health" class="panel">
|
|
261
288
|
<sl-card id="health-latest">
|
|
262
289
|
<p>No test results available. Run <code>node test/e2e/orchestrate.js --persist</code> to generate results.</p>
|
|
263
290
|
</sl-card>
|
|
@@ -275,12 +302,83 @@
|
|
|
275
302
|
</thead>
|
|
276
303
|
<tbody></tbody>
|
|
277
304
|
</table>
|
|
278
|
-
</
|
|
279
|
-
|
|
305
|
+
</div>
|
|
306
|
+
|
|
307
|
+
<!-- A2A-50: Settings panel — relocated from sl-details in panel-permissions -->
|
|
308
|
+
<div id="panel-settings" class="panel">
|
|
309
|
+
<h3>Defaults</h3>
|
|
310
|
+
<form id="defaults-form">
|
|
311
|
+
<sl-input id="defaults-expiration" label="Expiration" placeholder="7d"></sl-input>
|
|
312
|
+
<sl-input id="defaults-max-calls" label="Max Calls" type="number" min="1"></sl-input>
|
|
313
|
+
<div class="row">
|
|
314
|
+
<sl-button type="submit" variant="primary">Save Defaults</sl-button>
|
|
315
|
+
</div>
|
|
316
|
+
</form>
|
|
317
|
+
|
|
318
|
+
<h3>New Tier</h3>
|
|
319
|
+
<form id="new-tier-form">
|
|
320
|
+
<sl-input id="new-tier-id" label="Tier ID" placeholder="partners"></sl-input>
|
|
321
|
+
<sl-input id="new-tier-name" label="Name" placeholder="Partners"></sl-input>
|
|
322
|
+
<label>Copy from
|
|
323
|
+
<sl-select id="new-tier-copy-from" size="small">
|
|
324
|
+
<sl-option value="">None</sl-option>
|
|
325
|
+
</sl-select>
|
|
326
|
+
</label>
|
|
327
|
+
<div class="row">
|
|
328
|
+
<sl-button type="submit" variant="primary">Create Tier</sl-button>
|
|
329
|
+
</div>
|
|
330
|
+
</form>
|
|
331
|
+
|
|
332
|
+
<h3>Remote Callbook</h3>
|
|
333
|
+
<sl-card id="callbook-status"></sl-card>
|
|
334
|
+
|
|
335
|
+
<h3>Auto Update</h3>
|
|
336
|
+
<sl-card id="auto-update-status">Loading...</sl-card>
|
|
337
|
+
<div class="row">
|
|
338
|
+
<sl-button id="auto-update-check" size="small">Check now</sl-button>
|
|
339
|
+
<sl-button id="auto-update-now" size="small">Update now</sl-button>
|
|
340
|
+
<sl-button id="auto-update-toggle" size="small">Disable auto-update</sl-button>
|
|
341
|
+
</div>
|
|
280
342
|
|
|
281
|
-
|
|
343
|
+
<sl-card>
|
|
344
|
+
<form id="callbook-provision-form">
|
|
345
|
+
<div class="row">
|
|
346
|
+
<sl-button type="submit" variant="primary" size="small">Create Install Link (24h)</sl-button>
|
|
347
|
+
<sl-button id="callbook-logout" size="small" variant="default">Logout This Browser</sl-button>
|
|
348
|
+
</div>
|
|
349
|
+
<sl-input id="callbook-label" label="Device label" value="Callbook Remote"></sl-input>
|
|
350
|
+
<sl-textarea id="callbook-install-url" label="Install URL" rows="3" readonly></sl-textarea>
|
|
351
|
+
<div class="row">
|
|
352
|
+
<sl-button id="callbook-copy-url" size="small">Copy Link</sl-button>
|
|
353
|
+
</div>
|
|
354
|
+
<div id="callbook-warnings" class="mono"></div>
|
|
355
|
+
</form>
|
|
356
|
+
</sl-card>
|
|
357
|
+
|
|
358
|
+
<sl-card>
|
|
359
|
+
<div class="row">
|
|
360
|
+
<strong>Paired Devices</strong>
|
|
361
|
+
</div>
|
|
362
|
+
<table id="callbook-devices-table">
|
|
363
|
+
<thead>
|
|
364
|
+
<tr>
|
|
365
|
+
<th>Label</th>
|
|
366
|
+
<th>Created</th>
|
|
367
|
+
<th>Last Used</th>
|
|
368
|
+
<th>Sessions</th>
|
|
369
|
+
<th>Revoked</th>
|
|
370
|
+
<th>Action</th>
|
|
371
|
+
</tr>
|
|
372
|
+
</thead>
|
|
373
|
+
<tbody></tbody>
|
|
374
|
+
</table>
|
|
375
|
+
</sl-card>
|
|
376
|
+
</div>
|
|
377
|
+
</div>
|
|
282
378
|
</main>
|
|
283
379
|
|
|
380
|
+
<div id="notice"></div>
|
|
381
|
+
|
|
284
382
|
<script src="./app.js"></script>
|
|
285
383
|
</body>
|
|
286
384
|
</html>
|