clay-server 2.5.0 → 2.6.0
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/bin/claude-relay.js +6 -0
- package/bin/cli.js +26 -8
- package/lib/cli-sessions.js +2 -7
- package/lib/config.js +78 -5
- package/lib/daemon.js +233 -2
- package/lib/notes.js +3 -2
- package/lib/project.js +465 -28
- package/lib/public/app.js +187 -24
- package/lib/public/css/base.css +61 -61
- package/lib/public/css/diff.css +3 -4
- package/lib/public/css/filebrowser.css +362 -2
- package/lib/public/css/icon-strip.css +317 -1
- package/lib/public/css/input.css +127 -50
- package/lib/public/css/messages.css +1 -1
- package/lib/public/css/mobile-nav.css +8 -4
- package/lib/public/css/overlays.css +9 -6
- package/lib/public/css/server-settings.css +67 -20
- package/lib/public/css/sidebar.css +10 -101
- package/lib/public/css/skills.css +730 -0
- package/lib/public/css/title-bar.css +82 -4
- package/lib/public/index.html +277 -70
- package/lib/public/modules/input.js +119 -56
- package/lib/public/modules/project-settings.js +906 -0
- package/lib/public/modules/server-settings.js +409 -53
- package/lib/public/modules/sidebar.js +720 -1
- package/lib/public/modules/skills.js +710 -0
- package/lib/public/modules/terminal.js +7 -0
- package/lib/public/modules/theme.js +88 -89
- package/lib/public/style.css +1 -0
- package/lib/sdk-bridge.js +18 -7
- package/lib/server.js +305 -1
- package/lib/sessions.js +9 -4
- package/lib/utils.js +18 -0
- package/package.json +3 -2
|
@@ -91,14 +91,84 @@
|
|
|
91
91
|
border-bottom: 1px solid var(--border-subtle);
|
|
92
92
|
}
|
|
93
93
|
|
|
94
|
-
.title-bar-project-
|
|
94
|
+
.title-bar-project-dropdown {
|
|
95
|
+
display: flex;
|
|
96
|
+
align-items: center;
|
|
97
|
+
gap: 6px;
|
|
95
98
|
width: 100%;
|
|
96
|
-
|
|
97
|
-
|
|
99
|
+
min-width: 0;
|
|
100
|
+
background: none;
|
|
101
|
+
border: none;
|
|
102
|
+
padding: 4px 8px;
|
|
103
|
+
margin: -4px -8px;
|
|
104
|
+
border-radius: 6px;
|
|
105
|
+
cursor: pointer;
|
|
106
|
+
transition: background 0.15s;
|
|
107
|
+
font-family: inherit;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.title-bar-project-dropdown:hover {
|
|
111
|
+
background: rgba(var(--overlay-rgb), 0.06);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.title-bar-project-icon {
|
|
115
|
+
display: none;
|
|
116
|
+
font-size: 18px;
|
|
117
|
+
line-height: 1;
|
|
118
|
+
flex-shrink: 0;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.title-bar-project-icon.has-icon {
|
|
122
|
+
display: inline-flex;
|
|
123
|
+
align-items: center;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.title-bar-project-icon .emoji {
|
|
127
|
+
width: 18px;
|
|
128
|
+
height: 18px;
|
|
129
|
+
vertical-align: middle;
|
|
130
|
+
filter:
|
|
131
|
+
drop-shadow(1px 0 0 rgba(0,0,0,0.18))
|
|
132
|
+
drop-shadow(-1px 0 0 rgba(0,0,0,0.18))
|
|
133
|
+
drop-shadow(0 1px 0 rgba(0,0,0,0.18))
|
|
134
|
+
drop-shadow(0 -1px 0 rgba(0,0,0,0.18));
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.title-bar-project-name {
|
|
138
|
+
font-family: "Pretendard", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
|
|
139
|
+
font-size: 17px;
|
|
140
|
+
font-weight: 800;
|
|
98
141
|
color: var(--text);
|
|
99
142
|
overflow: hidden;
|
|
100
143
|
text-overflow: ellipsis;
|
|
101
144
|
white-space: nowrap;
|
|
145
|
+
min-width: 0;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.title-bar-chevron {
|
|
149
|
+
width: 14px;
|
|
150
|
+
height: 14px;
|
|
151
|
+
flex-shrink: 0;
|
|
152
|
+
color: var(--text-secondary);
|
|
153
|
+
transition: transform 0.2s;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.title-bar-project-dropdown.open .title-bar-chevron {
|
|
157
|
+
transform: rotate(180deg);
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
.project-rename-input {
|
|
161
|
+
width: 100%;
|
|
162
|
+
font-family: "Pretendard", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
|
|
163
|
+
font-size: 17px;
|
|
164
|
+
font-weight: 800;
|
|
165
|
+
color: var(--text);
|
|
166
|
+
background: var(--bg-alt);
|
|
167
|
+
border: 1px solid var(--accent);
|
|
168
|
+
border-radius: 4px;
|
|
169
|
+
padding: 1px 4px;
|
|
170
|
+
outline: none;
|
|
171
|
+
min-width: 0;
|
|
102
172
|
}
|
|
103
173
|
|
|
104
174
|
/* --- Content section (inside #main-column) --- */
|
|
@@ -107,7 +177,6 @@
|
|
|
107
177
|
height: 48px;
|
|
108
178
|
display: flex;
|
|
109
179
|
align-items: center;
|
|
110
|
-
justify-content: space-between;
|
|
111
180
|
padding: 0 16px;
|
|
112
181
|
min-width: 0;
|
|
113
182
|
border-bottom: 1px solid var(--border-subtle);
|
|
@@ -124,9 +193,11 @@
|
|
|
124
193
|
.title-bar-content .status {
|
|
125
194
|
display: flex;
|
|
126
195
|
align-items: center;
|
|
196
|
+
justify-content: flex-end;
|
|
127
197
|
gap: 6px;
|
|
128
198
|
font-size: 12px;
|
|
129
199
|
color: var(--text-muted);
|
|
200
|
+
flex: 1;
|
|
130
201
|
flex-shrink: 0;
|
|
131
202
|
}
|
|
132
203
|
|
|
@@ -137,6 +208,13 @@
|
|
|
137
208
|
height: calc(32px + var(--safe-top));
|
|
138
209
|
}
|
|
139
210
|
|
|
211
|
+
.top-bar-actions {
|
|
212
|
+
top: auto;
|
|
213
|
+
bottom: 0;
|
|
214
|
+
height: 32px;
|
|
215
|
+
transform: none;
|
|
216
|
+
}
|
|
217
|
+
|
|
140
218
|
#sidebar-column {
|
|
141
219
|
width: 0 !important;
|
|
142
220
|
min-width: 0 !important;
|
package/lib/public/index.html
CHANGED
|
@@ -21,6 +21,22 @@
|
|
|
21
21
|
</head>
|
|
22
22
|
<body>
|
|
23
23
|
<div id="layout">
|
|
24
|
+
<!-- === Announce Bars (above top bar, full width) === -->
|
|
25
|
+
<div id="update-banner" class="hidden">
|
|
26
|
+
<span class="update-banner-text"><i data-lucide="arrow-up-circle"></i> A new version of Clay is available: <strong id="update-version"></strong></span>
|
|
27
|
+
<button id="update-now">Update now</button>
|
|
28
|
+
<button id="update-how" title="Manual update instructions">?</button>
|
|
29
|
+
<button id="update-banner-close" aria-label="Dismiss"><i data-lucide="x"></i></button>
|
|
30
|
+
</div>
|
|
31
|
+
<div id="onboarding-banner" class="hidden">
|
|
32
|
+
<span class="onboarding-banner-text" id="onboarding-banner-text"></span>
|
|
33
|
+
<button id="onboarding-banner-close" aria-label="Dismiss"><i data-lucide="x"></i></button>
|
|
34
|
+
</div>
|
|
35
|
+
<div id="skip-perms-banner" class="hidden">
|
|
36
|
+
<i data-lucide="shield-off"></i>
|
|
37
|
+
<span>Skip permissions mode is active. All tool executions are auto-approved.</span>
|
|
38
|
+
</div>
|
|
39
|
+
|
|
24
40
|
<!-- === Top Bar (full width, forms reverse-ㄱ with icon strip) === -->
|
|
25
41
|
<div id="top-bar">
|
|
26
42
|
<a href="https://github.com/chadbyte/claude-relay" target="_blank" rel="noopener" class="top-bar-title"><img class="top-bar-icon" src="favicon.svg" width="16" height="16" alt="">Clay</a>
|
|
@@ -55,7 +71,6 @@
|
|
|
55
71
|
<div class="icon-strip-home" title="Clay">
|
|
56
72
|
<span class="icon-strip-pill"></span>
|
|
57
73
|
<img class="footer-mascot icon-strip-logo" src="favicon.svg" width="38" height="38" alt="Clay">
|
|
58
|
-
<span class="icon-strip-status"></span>
|
|
59
74
|
</div>
|
|
60
75
|
<div class="icon-strip-separator"></div>
|
|
61
76
|
<div class="icon-strip-projects" id="icon-strip-projects"></div>
|
|
@@ -66,13 +81,18 @@
|
|
|
66
81
|
<div id="main-area">
|
|
67
82
|
<div id="sidebar-column">
|
|
68
83
|
<div class="title-bar-sidebar">
|
|
69
|
-
<
|
|
84
|
+
<button class="title-bar-project-dropdown" id="title-bar-project-dropdown">
|
|
85
|
+
<span class="title-bar-project-icon" id="title-bar-project-icon"></span>
|
|
86
|
+
<span class="title-bar-project-name" id="title-bar-project-name"></span>
|
|
87
|
+
<i data-lucide="chevron-down" class="title-bar-chevron"></i>
|
|
88
|
+
</button>
|
|
70
89
|
</div>
|
|
71
90
|
<div id="sidebar">
|
|
72
91
|
<div id="sidebar-tools">
|
|
73
92
|
<div id="session-actions">
|
|
74
93
|
<button id="file-browser-btn"><i data-lucide="folder-tree"></i> <span>File browser</span></button>
|
|
75
94
|
<button id="terminal-sidebar-btn"><i data-lucide="square-terminal"></i> <span>Terminal</span><span id="terminal-sidebar-count" class="sidebar-badge hidden"></span></button>
|
|
95
|
+
<button id="skills-btn"><i data-lucide="puzzle"></i> <span>Skills</span></button>
|
|
76
96
|
</div>
|
|
77
97
|
</div>
|
|
78
98
|
<div id="sidebar-sessions-header">
|
|
@@ -130,21 +150,6 @@
|
|
|
130
150
|
</div>
|
|
131
151
|
<div id="main-panels">
|
|
132
152
|
<div id="app">
|
|
133
|
-
<div id="update-banner" class="hidden">
|
|
134
|
-
<span class="update-banner-text"><i data-lucide="arrow-up-circle"></i> A new version of Clay is available: <strong id="update-version"></strong></span>
|
|
135
|
-
<button id="update-now">Update now</button>
|
|
136
|
-
<button id="update-how" title="Manual update instructions">?</button>
|
|
137
|
-
<button id="update-banner-close" aria-label="Dismiss"><i data-lucide="x"></i></button>
|
|
138
|
-
</div>
|
|
139
|
-
<div id="onboarding-banner" class="hidden">
|
|
140
|
-
<span class="onboarding-banner-text" id="onboarding-banner-text"></span>
|
|
141
|
-
<button id="onboarding-banner-close" aria-label="Dismiss"><i data-lucide="x"></i></button>
|
|
142
|
-
</div>
|
|
143
|
-
<div id="skip-perms-banner" class="hidden">
|
|
144
|
-
<i data-lucide="shield-off"></i>
|
|
145
|
-
<span>Skip permissions mode is active. All tool executions are auto-approved.</span>
|
|
146
|
-
</div>
|
|
147
|
-
|
|
148
153
|
<div id="connect-overlay">
|
|
149
154
|
<img class="connect-logo" src="favicon.svg" width="48" height="48" alt="Clay">
|
|
150
155
|
<span class="connect-wordmark">Clay</span>
|
|
@@ -243,11 +248,8 @@
|
|
|
243
248
|
<textarea id="input" rows="1" placeholder="Message Claude Code..." enterkeyhint="send" dir="auto"></textarea>
|
|
244
249
|
<div id="input-bottom">
|
|
245
250
|
<div id="attach-wrap">
|
|
246
|
-
<button id="attach-btn" type="button" aria-label="Attach"><i data-lucide="
|
|
247
|
-
<
|
|
248
|
-
<button class="attach-menu-item" id="attach-camera"><i data-lucide="camera"></i> <span>Take Photo</span></button>
|
|
249
|
-
<button class="attach-menu-item" id="attach-photos"><i data-lucide="image"></i> <span>Add Photos</span></button>
|
|
250
|
-
</div>
|
|
251
|
+
<button id="attach-file-btn" type="button" aria-label="Attach file" title="Attach file"><i data-lucide="paperclip"></i></button>
|
|
252
|
+
<button id="attach-image-btn" type="button" aria-label="Attach image" title="Attach image"><i data-lucide="image"></i></button>
|
|
251
253
|
</div>
|
|
252
254
|
<div id="input-bottom-right">
|
|
253
255
|
<div id="config-chip-wrap" class="hidden">
|
|
@@ -320,6 +322,148 @@
|
|
|
320
322
|
</div>
|
|
321
323
|
<div class="file-viewer-body" id="file-viewer-body"></div>
|
|
322
324
|
</div>
|
|
325
|
+
<div id="project-settings" class="hidden panel-fullscreen">
|
|
326
|
+
<div class="project-settings-layout">
|
|
327
|
+
<div class="project-settings-nav">
|
|
328
|
+
<div class="project-settings-nav-inner">
|
|
329
|
+
<div class="server-settings-nav-header" id="ps-nav-title">-</div>
|
|
330
|
+
<div class="server-settings-nav-items">
|
|
331
|
+
<div class="settings-nav-category">Project</div>
|
|
332
|
+
<button class="settings-nav-item active" data-section="profile"><span>Profile</span></button>
|
|
333
|
+
<button class="settings-nav-item" data-section="defaults"><span>Model & Behavior</span></button>
|
|
334
|
+
<div class="settings-nav-separator"></div>
|
|
335
|
+
<div class="settings-nav-category">Configuration</div>
|
|
336
|
+
<button class="settings-nav-item" data-section="instructions"><span>CLAUDE.md</span></button>
|
|
337
|
+
<button class="settings-nav-item" data-section="environment"><span>Environment Variables</span></button>
|
|
338
|
+
</div>
|
|
339
|
+
</div>
|
|
340
|
+
</div>
|
|
341
|
+
<div class="project-settings-content">
|
|
342
|
+
<div class="project-settings-content-inner">
|
|
343
|
+
<!-- Profile -->
|
|
344
|
+
<div class="ps-section active" data-section="profile">
|
|
345
|
+
<h2>Profile</h2>
|
|
346
|
+
<div class="settings-card">
|
|
347
|
+
<div class="settings-field">
|
|
348
|
+
<label class="settings-label">Project Name</label>
|
|
349
|
+
<div class="ps-name-row">
|
|
350
|
+
<span class="settings-value" id="ps-project-name">-</span>
|
|
351
|
+
<button class="settings-btn-sm" id="ps-rename-btn">Rename</button>
|
|
352
|
+
</div>
|
|
353
|
+
<div class="ps-rename-form hidden" id="ps-rename-form">
|
|
354
|
+
<input type="text" class="ps-text-input" id="ps-rename-input" autocomplete="off" spellcheck="false">
|
|
355
|
+
<div class="ps-rename-actions">
|
|
356
|
+
<button class="settings-btn-sm" id="ps-rename-save">Save</button>
|
|
357
|
+
<button class="settings-btn-sm settings-btn-ghost" id="ps-rename-cancel">Cancel</button>
|
|
358
|
+
</div>
|
|
359
|
+
</div>
|
|
360
|
+
</div>
|
|
361
|
+
<div class="settings-field">
|
|
362
|
+
<label class="settings-label">Icon</label>
|
|
363
|
+
<div class="ps-icon-row">
|
|
364
|
+
<span class="ps-icon-preview" id="ps-icon-preview"></span>
|
|
365
|
+
<button class="settings-btn-sm" id="ps-icon-btn">Change</button>
|
|
366
|
+
<button class="settings-btn-sm settings-btn-ghost hidden" id="ps-icon-remove-btn">Remove</button>
|
|
367
|
+
</div>
|
|
368
|
+
<div id="ps-emoji-picker-anchor"></div>
|
|
369
|
+
</div>
|
|
370
|
+
</div>
|
|
371
|
+
</div>
|
|
372
|
+
<!-- Defaults -->
|
|
373
|
+
<div class="ps-section" data-section="defaults">
|
|
374
|
+
<h2>Model & Behavior</h2>
|
|
375
|
+
<p class="ps-section-desc">Configure which model to use and how Claude behaves during sessions.</p>
|
|
376
|
+
<div class="settings-card">
|
|
377
|
+
<div class="settings-field">
|
|
378
|
+
<label class="settings-label">Model</label>
|
|
379
|
+
<div class="settings-hint">Choose the Claude model to use. Larger models are slower but more capable.</div>
|
|
380
|
+
<div id="ps-model-list" class="settings-model-list"></div>
|
|
381
|
+
</div>
|
|
382
|
+
</div>
|
|
383
|
+
<div class="settings-card" id="ps-beta-card" style="display:none">
|
|
384
|
+
<div class="settings-field">
|
|
385
|
+
<label class="settings-label">Extended Context (Beta)</label>
|
|
386
|
+
<div class="settings-hint">Enable 1M token context window for Sonnet models. Allows processing much larger codebases and files, but may increase latency.</div>
|
|
387
|
+
<label class="settings-toggle-row ps-beta-toggle-row">
|
|
388
|
+
<div>
|
|
389
|
+
<span class="settings-label">1M Context</span>
|
|
390
|
+
</div>
|
|
391
|
+
<input type="checkbox" id="ps-beta-1m">
|
|
392
|
+
<span class="toggle-track"><span class="toggle-thumb"></span></span>
|
|
393
|
+
</label>
|
|
394
|
+
</div>
|
|
395
|
+
</div>
|
|
396
|
+
<div class="settings-card">
|
|
397
|
+
<div class="settings-field">
|
|
398
|
+
<label class="settings-label">Mode</label>
|
|
399
|
+
<div class="settings-hint">Controls how Claude handles tool use and file edits.</div>
|
|
400
|
+
<div id="ps-mode-list" class="settings-model-list"></div>
|
|
401
|
+
</div>
|
|
402
|
+
</div>
|
|
403
|
+
<div class="settings-card" id="ps-effort-card">
|
|
404
|
+
<div class="settings-field">
|
|
405
|
+
<label class="settings-label">Effort</label>
|
|
406
|
+
<div class="settings-hint">Controls how much thinking effort Claude puts into responses. Higher effort means longer, more thorough responses.</div>
|
|
407
|
+
<div class="settings-btn-group" id="ps-effort-bar"></div>
|
|
408
|
+
</div>
|
|
409
|
+
</div>
|
|
410
|
+
</div>
|
|
411
|
+
<!-- Instructions -->
|
|
412
|
+
<div class="ps-section" data-section="instructions">
|
|
413
|
+
<h2>CLAUDE.md</h2>
|
|
414
|
+
<p class="ps-section-desc">Edit the CLAUDE.md file for this project. These instructions are passed to Claude at the start of every session.</p>
|
|
415
|
+
<div class="settings-card">
|
|
416
|
+
<div class="settings-field">
|
|
417
|
+
<div id="ps-instructions-status" class="settings-hint"></div>
|
|
418
|
+
<textarea class="ps-textarea" id="ps-instructions-editor" rows="20" spellcheck="false" placeholder="# Project Instructions Write instructions for Claude here..."></textarea>
|
|
419
|
+
<div class="ps-textarea-actions">
|
|
420
|
+
<button class="settings-btn-sm" id="ps-instructions-save">Save</button>
|
|
421
|
+
<span class="ps-save-status" id="ps-instructions-save-status"></span>
|
|
422
|
+
</div>
|
|
423
|
+
</div>
|
|
424
|
+
</div>
|
|
425
|
+
</div>
|
|
426
|
+
<!-- Environment -->
|
|
427
|
+
<div class="ps-section" data-section="environment">
|
|
428
|
+
<h2>Environment Variables</h2>
|
|
429
|
+
<p class="ps-section-desc">Store API keys, tokens, and config for this project. Paste a <code>.env</code> file to import multiple variables at once.</p>
|
|
430
|
+
<div class="settings-hint ps-env-notice hidden" id="ps-env-override-notice">
|
|
431
|
+
<i data-lucide="info"></i> A <code>.envrc</code> file exists in the project directory and will take precedence over these settings.
|
|
432
|
+
</div>
|
|
433
|
+
<div class="ps-env-tabs">
|
|
434
|
+
<button class="ps-env-tab active" data-tab="project">Project</button>
|
|
435
|
+
<button class="ps-env-tab" data-tab="shared">Shared</button>
|
|
436
|
+
</div>
|
|
437
|
+
<div class="ps-env-tab-content active" data-tab="project">
|
|
438
|
+
<div class="ps-env-header">
|
|
439
|
+
<button class="settings-btn-sm" id="ps-env-add-btn"><i data-lucide="plus"></i> Add Variable</button>
|
|
440
|
+
<span class="ps-save-status" id="ps-env-save-status"></span>
|
|
441
|
+
</div>
|
|
442
|
+
<div class="ps-env-list" id="ps-env-list">
|
|
443
|
+
<!-- rows rendered by JS -->
|
|
444
|
+
</div>
|
|
445
|
+
</div>
|
|
446
|
+
<div class="ps-env-tab-content" data-tab="shared">
|
|
447
|
+
<p class="settings-hint" style="margin-bottom: 12px;">Shared variables apply to all projects. Project-level variables take precedence.</p>
|
|
448
|
+
<div class="ps-env-header">
|
|
449
|
+
<button class="settings-btn-sm" id="ps-shared-env-add-btn"><i data-lucide="plus"></i> Add Variable</button>
|
|
450
|
+
<span class="ps-save-status" id="ps-shared-env-save-status"></span>
|
|
451
|
+
</div>
|
|
452
|
+
<div class="ps-env-list" id="ps-shared-env-list">
|
|
453
|
+
<!-- rows rendered by JS -->
|
|
454
|
+
</div>
|
|
455
|
+
</div>
|
|
456
|
+
</div>
|
|
457
|
+
</div>
|
|
458
|
+
</div>
|
|
459
|
+
<div class="project-settings-close-col">
|
|
460
|
+
<button class="server-settings-close-btn" id="project-settings-close" title="Close">
|
|
461
|
+
<i data-lucide="x"></i>
|
|
462
|
+
<span>ESC</span>
|
|
463
|
+
</button>
|
|
464
|
+
</div>
|
|
465
|
+
</div>
|
|
466
|
+
</div>
|
|
323
467
|
<div id="terminal-container" class="hidden">
|
|
324
468
|
<div class="terminal-header">
|
|
325
469
|
<div id="terminal-tabs" class="terminal-tabs"></div>
|
|
@@ -352,7 +496,6 @@
|
|
|
352
496
|
<span class="user-island-name">Clay <span id="footer-version" class="footer-version"></span></span>
|
|
353
497
|
</div>
|
|
354
498
|
<div class="user-island-actions">
|
|
355
|
-
<a href="https://github.com/chadbyte/claude-relay" target="_blank" rel="noopener" class="user-island-chip" title="Star on GitHub"><svg class="chip-octocat" viewBox="0 0 16 16" fill="white" width="13" height="13"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg><span class="chip-star">★</span><span class="chip-label">Star Clay</span></a>
|
|
356
499
|
</div>
|
|
357
500
|
</div>
|
|
358
501
|
|
|
@@ -398,16 +541,16 @@
|
|
|
398
541
|
<div class="server-settings-nav-header" id="settings-server-name"></div>
|
|
399
542
|
<div class="server-settings-nav-items">
|
|
400
543
|
<div class="settings-nav-category">General</div>
|
|
401
|
-
<button class="settings-nav-item active" data-section="overview"><span>
|
|
402
|
-
<button class="settings-nav-item" data-section="models"><span>Models</span></button>
|
|
403
|
-
<div class="settings-nav-separator"></div>
|
|
404
|
-
<div class="settings-nav-category">Configuration</div>
|
|
405
|
-
<button class="settings-nav-item" data-section="security"><span>Security</span></button>
|
|
544
|
+
<button class="settings-nav-item active" data-section="overview"><span>Status</span></button>
|
|
406
545
|
<button class="settings-nav-item" data-section="notifications"><span>Notifications</span></button>
|
|
407
|
-
<button class="settings-nav-item" data-section="appearance"><span>Appearance</span></button>
|
|
408
546
|
<div class="settings-nav-separator"></div>
|
|
409
|
-
<div class="settings-nav-category">
|
|
410
|
-
<button class="settings-nav-item" data-section="
|
|
547
|
+
<div class="settings-nav-category">Session</div>
|
|
548
|
+
<button class="settings-nav-item" data-section="models"><span>Model & Behavior</span></button>
|
|
549
|
+
<button class="settings-nav-item" data-section="claudemd"><span>CLAUDE.md</span></button>
|
|
550
|
+
<button class="settings-nav-item" data-section="environment"><span>Environment Variables</span></button>
|
|
551
|
+
<div class="settings-nav-separator"></div>
|
|
552
|
+
<div class="settings-nav-category">Server</div>
|
|
553
|
+
<button class="settings-nav-item" data-section="security"><span>Security</span></button>
|
|
411
554
|
<div class="settings-nav-separator"></div>
|
|
412
555
|
<button class="settings-nav-item settings-nav-danger" data-section="shutdown"><span>Shutdown Server</span></button>
|
|
413
556
|
</div>
|
|
@@ -416,7 +559,7 @@
|
|
|
416
559
|
<div class="server-settings-content">
|
|
417
560
|
<div class="server-settings-content-inner">
|
|
418
561
|
<div class="server-settings-section active" data-section="overview">
|
|
419
|
-
<h2>
|
|
562
|
+
<h2>Status</h2>
|
|
420
563
|
<div class="settings-card">
|
|
421
564
|
<div class="settings-field">
|
|
422
565
|
<label class="settings-label">Project Name</label>
|
|
@@ -467,17 +610,62 @@
|
|
|
467
610
|
<span class="settings-value" id="settings-status-clients">-</span>
|
|
468
611
|
</div>
|
|
469
612
|
</div>
|
|
613
|
+
<div class="settings-card">
|
|
614
|
+
<div class="settings-field-row">
|
|
615
|
+
<label class="settings-label">WebSocket Path</label>
|
|
616
|
+
<span class="settings-value settings-mono" id="settings-ws-path">-</span>
|
|
617
|
+
</div>
|
|
618
|
+
<div class="settings-field-row">
|
|
619
|
+
<label class="settings-label">Project Slug</label>
|
|
620
|
+
<span class="settings-value settings-mono" id="settings-project-slug">-</span>
|
|
621
|
+
</div>
|
|
622
|
+
</div>
|
|
623
|
+
<div class="settings-card hidden" id="settings-keep-awake-card">
|
|
624
|
+
<label class="settings-toggle-row">
|
|
625
|
+
<div>
|
|
626
|
+
<span class="settings-label">Keep Awake</span>
|
|
627
|
+
<div class="settings-hint">Prevent the system from sleeping while the server is running (macOS only).</div>
|
|
628
|
+
</div>
|
|
629
|
+
<input type="checkbox" id="settings-keep-awake">
|
|
630
|
+
<span class="toggle-track"><span class="toggle-thumb"></span></span>
|
|
631
|
+
</label>
|
|
632
|
+
</div>
|
|
470
633
|
</div>
|
|
471
634
|
<div class="server-settings-section" data-section="models">
|
|
472
|
-
<h2>
|
|
635
|
+
<h2>Model & Behavior</h2>
|
|
636
|
+
<p class="settings-hint" style="margin-bottom: 20px;">Configure which model to use and how Claude behaves during sessions.</p>
|
|
473
637
|
<div class="settings-card">
|
|
474
638
|
<div class="settings-field">
|
|
475
|
-
<label class="settings-label">
|
|
476
|
-
<div class="settings-
|
|
639
|
+
<label class="settings-label">Model</label>
|
|
640
|
+
<div class="settings-hint">Choose the Claude model to use. Larger models are slower but more capable.</div>
|
|
641
|
+
<div id="settings-model-list" class="settings-model-list"></div>
|
|
477
642
|
</div>
|
|
643
|
+
</div>
|
|
644
|
+
<div class="settings-card" id="ss-beta-card" style="display:none">
|
|
478
645
|
<div class="settings-field">
|
|
479
|
-
<label class="settings-label">
|
|
480
|
-
<div
|
|
646
|
+
<label class="settings-label">Extended Context (Beta)</label>
|
|
647
|
+
<div class="settings-hint">Enable 1M token context window for Sonnet models. Allows processing much larger codebases and files, but may increase latency.</div>
|
|
648
|
+
<label class="settings-toggle-row ss-beta-toggle-row">
|
|
649
|
+
<div>
|
|
650
|
+
<span class="settings-label">1M Context</span>
|
|
651
|
+
</div>
|
|
652
|
+
<input type="checkbox" id="ss-beta-1m">
|
|
653
|
+
<span class="toggle-track"><span class="toggle-thumb"></span></span>
|
|
654
|
+
</label>
|
|
655
|
+
</div>
|
|
656
|
+
</div>
|
|
657
|
+
<div class="settings-card">
|
|
658
|
+
<div class="settings-field">
|
|
659
|
+
<label class="settings-label">Mode</label>
|
|
660
|
+
<div class="settings-hint">Controls how Claude handles tool use and file edits.</div>
|
|
661
|
+
<div id="ss-mode-list" class="settings-model-list"></div>
|
|
662
|
+
</div>
|
|
663
|
+
</div>
|
|
664
|
+
<div class="settings-card" id="ss-effort-card">
|
|
665
|
+
<div class="settings-field">
|
|
666
|
+
<label class="settings-label">Effort</label>
|
|
667
|
+
<div class="settings-hint">Controls how much thinking effort Claude puts into responses. Higher effort means longer, more thorough responses.</div>
|
|
668
|
+
<div class="settings-btn-group" id="ss-effort-bar"></div>
|
|
481
669
|
</div>
|
|
482
670
|
</div>
|
|
483
671
|
</div>
|
|
@@ -488,6 +676,10 @@
|
|
|
488
676
|
<div>
|
|
489
677
|
<label class="settings-label">Skip Permissions</label>
|
|
490
678
|
<div class="settings-hint">When enabled, all tool executions are auto-approved without asking.</div>
|
|
679
|
+
<div class="settings-hint">This setting cannot be changed here. Stop the server and restart with the flag below.</div>
|
|
680
|
+
<div class="settings-hint settings-copyable-wrap">
|
|
681
|
+
<span class="settings-copyable" id="skip-perms-cmd" data-copy="npx clay-server --dangerously-skip-permissions"><code>npx clay-server --dangerously-skip-permissions</code><button class="settings-copy-btn" type="button" title="Copy">⧉</button></span>
|
|
682
|
+
</div>
|
|
491
683
|
</div>
|
|
492
684
|
<span class="settings-value settings-badge" id="settings-skip-perms">Disabled</span>
|
|
493
685
|
</div>
|
|
@@ -551,46 +743,33 @@
|
|
|
551
743
|
</label>
|
|
552
744
|
</div>
|
|
553
745
|
</div>
|
|
554
|
-
<div class="server-settings-section" data-section="
|
|
555
|
-
<h2>
|
|
746
|
+
<div class="server-settings-section" data-section="claudemd">
|
|
747
|
+
<h2>CLAUDE.md</h2>
|
|
748
|
+
<p class="ps-section-desc">Edit the global CLAUDE.md file. These instructions apply to all projects and sessions on this server.</p>
|
|
556
749
|
<div class="settings-card">
|
|
557
750
|
<div class="settings-field">
|
|
558
|
-
<
|
|
559
|
-
<
|
|
560
|
-
<div
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
<label class="settings-label">Context Display</label>
|
|
564
|
-
<div class="settings-hint">How context window usage is displayed.</div>
|
|
565
|
-
<div class="settings-btn-group" id="settings-context-view">
|
|
566
|
-
<button class="settings-btn-option" data-view="off">Off</button>
|
|
567
|
-
<button class="settings-btn-option" data-view="mini">Mini</button>
|
|
568
|
-
<button class="settings-btn-option" data-view="panel">Panel</button>
|
|
751
|
+
<div id="ss-claudemd-status" class="settings-hint"></div>
|
|
752
|
+
<textarea class="ps-textarea" id="ss-claudemd-editor" rows="20" spellcheck="false" placeholder="# Global Instructions Write instructions for Claude here..."></textarea>
|
|
753
|
+
<div class="ps-textarea-actions">
|
|
754
|
+
<button class="settings-btn-sm" id="ss-claudemd-save">Save</button>
|
|
755
|
+
<span class="ps-save-status" id="ss-claudemd-save-status"></span>
|
|
569
756
|
</div>
|
|
570
757
|
</div>
|
|
571
758
|
</div>
|
|
759
|
+
<div class="settings-hint" style="margin-top: 8px;">
|
|
760
|
+
<i data-lucide="info" style="width: 14px; height: 14px; vertical-align: -2px;"></i>
|
|
761
|
+
This file is stored at <code>~/.claude/CLAUDE.md</code>. Project-level CLAUDE.md files take precedence over this global file.
|
|
762
|
+
</div>
|
|
572
763
|
</div>
|
|
573
|
-
<div class="server-settings-section" data-section="
|
|
574
|
-
<h2>
|
|
575
|
-
<
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
</div>
|
|
580
|
-
<div class="settings-field">
|
|
581
|
-
<label class="settings-label">Project Slug</label>
|
|
582
|
-
<div class="settings-value settings-mono" id="settings-project-slug">-</div>
|
|
583
|
-
</div>
|
|
764
|
+
<div class="server-settings-section" data-section="environment">
|
|
765
|
+
<h2>Shared Environment Variables</h2>
|
|
766
|
+
<p class="settings-hint" style="margin-bottom: 16px;">Define environment variables shared across all projects. Project-level variables take precedence over shared ones.</p>
|
|
767
|
+
<div class="ps-env-header">
|
|
768
|
+
<button class="settings-btn-sm" id="ss-env-add-btn"><i data-lucide="plus"></i> Add Variable</button>
|
|
769
|
+
<span class="ps-save-status" id="ss-env-save-status"></span>
|
|
584
770
|
</div>
|
|
585
|
-
<div class="
|
|
586
|
-
|
|
587
|
-
<div>
|
|
588
|
-
<span class="settings-label">Keep Awake</span>
|
|
589
|
-
<div class="settings-hint">Prevent the system from sleeping while the server is running (macOS only).</div>
|
|
590
|
-
</div>
|
|
591
|
-
<input type="checkbox" id="settings-keep-awake">
|
|
592
|
-
<span class="toggle-track"><span class="toggle-thumb"></span></span>
|
|
593
|
-
</label>
|
|
771
|
+
<div class="ps-env-list" id="ss-env-list">
|
|
772
|
+
<!-- rows rendered by JS -->
|
|
594
773
|
</div>
|
|
595
774
|
</div>
|
|
596
775
|
<div class="server-settings-section" data-section="shutdown">
|
|
@@ -749,6 +928,33 @@
|
|
|
749
928
|
</div>
|
|
750
929
|
</div>
|
|
751
930
|
|
|
931
|
+
<div id="skills-modal" class="hidden">
|
|
932
|
+
<div class="confirm-backdrop"></div>
|
|
933
|
+
<div class="confirm-dialog skills-dialog">
|
|
934
|
+
<div class="skills-header">
|
|
935
|
+
<span class="skills-title"><i data-lucide="puzzle"></i> Skills <span class="skills-powered-by">powered by <a href="https://skills.sh" target="_blank" rel="noopener noreferrer">skills.sh</a></span></span>
|
|
936
|
+
<div class="skills-header-actions">
|
|
937
|
+
<button class="skills-back-btn hidden" id="skills-back-btn"><i data-lucide="arrow-left"></i></button>
|
|
938
|
+
<button class="skills-close" id="skills-modal-close"><i data-lucide="x"></i></button>
|
|
939
|
+
</div>
|
|
940
|
+
</div>
|
|
941
|
+
<div class="skills-search" id="skills-search">
|
|
942
|
+
<i data-lucide="search"></i>
|
|
943
|
+
<input type="text" id="skills-search-input" placeholder="Search skills ..." spellcheck="false" />
|
|
944
|
+
<kbd class="skills-search-hint" id="skills-search-hint">/</kbd>
|
|
945
|
+
<button class="skills-search-clear hidden" id="skills-search-clear"><i data-lucide="x"></i></button>
|
|
946
|
+
</div>
|
|
947
|
+
<div class="skills-tabs">
|
|
948
|
+
<button class="skills-tab active" data-tab="all">All Time</button>
|
|
949
|
+
<button class="skills-tab" data-tab="trending">Trending</button>
|
|
950
|
+
<button class="skills-tab" data-tab="hot">Hot</button>
|
|
951
|
+
</div>
|
|
952
|
+
<div class="skills-content" id="skills-content">
|
|
953
|
+
<div class="skills-loading"><div class="skills-spinner"></div> Loading skills...</div>
|
|
954
|
+
</div>
|
|
955
|
+
</div>
|
|
956
|
+
</div>
|
|
957
|
+
|
|
752
958
|
<script src="https://cdn.jsdelivr.net/npm/marked@14/marked.min.js"></script>
|
|
753
959
|
<script src="https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.min.js"></script>
|
|
754
960
|
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11/build/highlight.min.js"></script>
|
|
@@ -757,6 +963,7 @@
|
|
|
757
963
|
<script src="https://cdn.jsdelivr.net/npm/qrcode-generator@1.4.4/qrcode.min.js"></script>
|
|
758
964
|
<script src="https://cdn.jsdelivr.net/npm/@xterm/xterm@5/lib/xterm.min.js"></script>
|
|
759
965
|
<script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0/lib/addon-fit.min.js"></script>
|
|
966
|
+
<script src="https://cdn.jsdelivr.net/npm/twemoji@14.0.2/dist/twemoji.min.js"></script>
|
|
760
967
|
<script type="module" src="app.js"></script>
|
|
761
968
|
</body>
|
|
762
969
|
</html>
|