clay-server 2.17.0-beta.8 → 2.17.0

package/lib/public/app.js

@@ -8,7 +8,7 @@ import { initMateKnowledge, requestKnowledgeList, renderKnowledgeList, handleKno
 import { initRewind, setRewindMode, showRewindModal, clearPendingRewindUuid, addRewindButton } from './modules/rewind.js';
 import { initNotifications, showDoneNotification, playDoneSound, isNotifAlertEnabled, isNotifSoundEnabled } from './modules/notifications.js';
 import { initInput, clearPendingImages, handleInputSync, autoResize, builtinCommands, sendMessage } from './modules/input.js';
-import { initQrCode } from './modules/qrcode.js';
+import { initQrCode, triggerShare } from './modules/qrcode.js';
 import { initFileBrowser, loadRootDirectory, refreshTree, handleFsList, handleFsRead, handleDirChanged, refreshIfOpen, handleFileChanged, handleFileHistory, handleGitDiff, handleFileAt, getPendingNavigate, closeFileViewer, resetFileBrowser } from './modules/filebrowser.js';
 import { initTerminal, openTerminal, closeTerminal, resetTerminals, handleTermList, handleTermCreated, handleTermOutput, handleTermExited, handleTermClosed, sendTerminalCommand } from './modules/terminal.js';
 import { initStickyNotes, handleNotesList, handleNoteCreated, handleNoteUpdated, handleNoteDeleted, openArchive, closeArchive, isArchiveOpen, hideNotes, showNotes, isNotesVisible } from './modules/sticky-notes.js';
@@ -5168,6 +5168,8 @@ import { initLongPress } from './modules/longpress.js';
 
   // --- QR code ---
   initQrCode();
+  var sharePill = document.getElementById("share-pill");
+  if (sharePill) sharePill.addEventListener("click", triggerShare);
 
   // --- File browser ---
   initFileBrowser({

package/lib/public/css/menus.css

@@ -244,6 +244,25 @@
   margin-top: 2px;
   font-weight: 400;
 }
+.qr-share-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 12px;
+  padding: 8px 16px;
+  border: 1px solid #ddd;
+  border-radius: 8px;
+  background: #fff;
+  color: #333;
+  font-family: inherit;
+  font-size: 13px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 0.15s;
+}
+.qr-share-btn:hover { background: #f5f5f5; }
+.qr-share-btn .lucide { width: 14px; height: 14px; }
+.qr-share-btn.hidden { display: none; }
 
 /* --- Notification menu --- */
 #notif-menu-wrap {

package/lib/public/css/overlays.css

@@ -75,6 +75,31 @@ button.top-bar-pill.pill-accent:hover { background: color-mix(in srgb, var(--acc
 .top-bar-install-btn.hidden { display: none; }
 .pwa-standalone .top-bar-install-btn { display: none !important; }
 
+/* Share button — desktop only, same style as install pill */
+.top-bar-share-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  background: color-mix(in srgb, var(--accent) 12%, transparent);
+  color: var(--accent);
+  border: none;
+  border-radius: 10px;
+  padding: 2px 10px;
+  font-family: inherit;
+  font-size: 11px;
+  font-weight: 600;
+  cursor: pointer;
+  white-space: nowrap;
+  line-height: 1;
+  transition: background 0.15s;
+}
+.top-bar-share-btn .lucide { width: 12px; height: 12px; }
+.top-bar-share-btn:hover { background: color-mix(in srgb, var(--accent) 20%, transparent); }
+@media (max-width: 768px) {
+  .top-bar-share-btn { display: none; }
+}
+.pwa-standalone .top-bar-share-btn { display: none !important; }
+
 /* PWA install modal */
 .pwa-modal {
   position: fixed;

package/lib/public/index.html

@@ -31,6 +31,7 @@
   <div id="top-bar">
     <div class="top-bar-left-pills">
       <button id="pwa-install-pill" class="top-bar-install-btn hidden" title="Open as app"><i data-lucide="download"></i> Open as app</button>
+      <button id="share-pill" class="top-bar-share-btn" title="Share"><i data-lucide="qr-code"></i> Share</button>
       <div id="update-pill-wrap" class="top-bar-update hidden">
         <button id="update-pill" class="top-bar-update-btn"><i data-lucide="arrow-up-circle"></i> <span id="update-version"></span> is available. Update now</button>
       <div id="update-popover" class="top-bar-popover">
@@ -723,6 +724,7 @@
   <div id="qr-overlay-inner">
     <div id="qr-canvas"></div>
     <div id="qr-url"></div>
+    <button id="qr-share-btn" class="qr-share-btn hidden"><i data-lucide="share-2"></i> Share</button>
   </div>
 </div>
 

package/lib/public/modules/profile.js

@@ -308,7 +308,7 @@ function showPopover() {
   // Avatar row (overlapping banner)
   html += '<div class="profile-avatar-row">';
   html += '<div class="profile-popover-avatar">';
-  html += '<img class="profile-popover-avatar-img" src="' + avatarUrl(currentStyle, seed, 80) + '" alt="avatar">';
+  html += '<img class="profile-popover-avatar-img" src="' + (profile.avatarCustom || avatarUrl(currentStyle, seed, 80)) + '" alt="avatar">';
   html += '</div>';
   html += '<div class="profile-name-display">' + escapeAttr(displayName || 'Awesome Clay User') + '</div>';
   html += '</div>';

package/lib/public/modules/qrcode.js

@@ -12,16 +12,18 @@ function getShareUrl() {
 export function triggerShare() {
   var url = getShareUrl();
 
-  // Use Web Share API if available
-  if (navigator.share) {
+  // Use Web Share API on mobile only
+  var isMobile = window.innerWidth <= 768 || /Mobi|Android/i.test(navigator.userAgent);
+  if (isMobile && navigator.share) {
     navigator.share({ title: document.title || "Clay", url: url }).catch(function () {});
     return;
   }
 
-  // Fallback: show QR overlay
+  // Show QR overlay
   var qrOverlay = document.getElementById("qr-overlay");
   var qrCanvas = document.getElementById("qr-canvas");
   var qrUrl = document.getElementById("qr-url");
+  var qrShareBtn = document.getElementById("qr-share-btn");
 
   var qr = qrcode(0, "M");
   qr.addData(url);
@@ -29,6 +31,15 @@ export function triggerShare() {
   qrCanvas.innerHTML = qr.createSvgTag(5, 0);
   qrUrl.innerHTML = url + '<span class="qr-hint">click to copy</span>';
 
+  // Show browser share button if Web Share API is available
+  if (qrShareBtn) {
+    if (navigator.share) {
+      qrShareBtn.classList.remove("hidden");
+    } else {
+      qrShareBtn.classList.add("hidden");
+    }
+  }
+
   qrOverlay.classList.remove("hidden");
 }
 
@@ -58,6 +69,15 @@ export function initQrCode() {
     e.stopPropagation();
   });
 
+  // Browser share button
+  var qrShareBtn = document.getElementById("qr-share-btn");
+  if (qrShareBtn) {
+    qrShareBtn.addEventListener("click", function () {
+      var url = getShareUrl();
+      navigator.share({ title: document.title || "Clay", url: url }).catch(function () {});
+    });
+  }
+
   // ESC to close
   document.addEventListener("keydown", function (e) {
     if (e.key === "Escape" && !qrOverlay.classList.contains("hidden")) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clay-server",
-  "version": "2.17.0-beta.8",
+  "version": "2.17.0",
   "description": "Web UI for Claude Code. Any device. Push notifications.",
   "bin": {
     "clay-server": "./bin/cli.js",