clay-server 3.6.0 → 3.7.0-beta.2

package/lib/public/modules/app-messages.js

@@ -46,6 +46,7 @@ import { showImageModal, sendExtensionCommand, handleMcpToolCallMessage } from '
 import { handleMcpServersState } from './mcp-ui.js';
 import { handleShellCommandResult } from './shell-command.js';
 import { handleLoopRegistryUpdated, handleScheduleRunStarted, handleScheduleRunFinished, handleLoopScheduled, isSchedulerOpen, enterCraftingMode, exitCraftingMode, handleLoopRegistryFiles } from './scheduler.js';
+import { renderGeneratedImage, renderImageGenerationProgress, clearImageGenerationProgress, clearAllImageGenerationProgress } from './generated-images.js';
 
 // --- App module imports ---
 import { scrollToBottom, addToMessages, addUserMessage, addSystemMessage, removeMatePreThinking, appendDelta, finalizeAssistantBlock, addConflictMessage, addContextOverflowMessage, showSuggestionChips, armStickyBottom, VENDOR_AVATARS, VENDOR_NAMES } from './app-rendering.js';
@@ -178,17 +179,6 @@ export function processMessage(msg) {
         if (!store.get('sessionIsProcessing')) {
           applyDeadSessionTodoCompaction();
         }
-        // Show the locked vendor toggle only when history exists AND the
-        // vendor isn't already committed. With a committed vendor,
-        // session_switched has already hidden the toggle and shown the
-        // small #active-vendor-indicator; re-showing the locked toggle
-        // here would duplicate the avatar next to the indicator.
-        var _hTotal = store.get('historyTotal') || 0;
-        var _vtw2 = document.getElementById("vendor-toggle-wrap");
-        if (_vtw2 && _hTotal > 0 && !store.get('currentVendor')) {
-          _vtw2.classList.remove("hidden");
-          _vtw2.classList.add("locked");
-        }
         // Restore cached rich context usage BEFORE updateContextPanel runs
         if (msg.contextUsage) {
           store.set({ richContextUsage: msg.contextUsage });
@@ -747,30 +737,9 @@ export function processMessage(msg) {
           selectDefaultVendorForBlankSession();
         }
         if (!msg.model) requestVendorModels(store.get('currentVendor') || "claude", true);
-        // Vendor toggle visibility + active-vendor indicator next to the
-        // model chip.
-        //   - Session has an explicit vendor: hide the toggle (it's
-        //     committed for this conversation) and show a small avatar
-        //     next to the config chip so the user still sees which vendor
-        //     is in use.
-        //   - History without recorded vendor: show locked toggle, no icon
-        //     (we don't know what to render).
-        //   - Brand-new no-vendor session: show toggle, no icon.
-        var _vtw = document.getElementById("vendor-toggle-wrap");
+        // Show the committed session vendor next to the model chip.
         var _avi = document.getElementById("active-vendor-indicator");
         var _avIcon = document.getElementById("active-vendor-icon");
-        if (_vtw) {
-          if (msg.vendor) {
-            _vtw.classList.add("hidden");
-            _vtw.classList.remove("locked");
-          } else if (msg.hasHistory) {
-            _vtw.classList.remove("hidden");
-            _vtw.classList.add("locked");
-          } else {
-            _vtw.classList.remove("locked");
-            _vtw.classList.remove("hidden");
-          }
-        }
         if (_avi && _avIcon) {
           if (msg.vendor && VENDOR_AVATARS[msg.vendor]) {
             _avIcon.src = VENDOR_AVATARS[msg.vendor];
@@ -996,6 +965,7 @@ export function processMessage(msg) {
         break;
 
       case "tool_executing":
+        if (msg.name === "ImageGen") renderImageGenerationProgress(msg);
         if ((msg.name === "propose_debate" || (msg.name && msg.name.indexOf("propose_debate") !== -1)) && msg.input) {
           var _dpTool = getTools()[msg.id];
           if (_dpTool) {
@@ -1047,6 +1017,7 @@ export function processMessage(msg) {
       case "tool_result": {
           var tr = getTools()[msg.id];
           if (tr && tr.hidden) break; // skip hidden plan tools
+          if (msg.is_error && tr && tr.name === "ImageGen") clearImageGenerationProgress(msg.id);
           // Always call updateToolResult for Edit (to show diff from input), or when content exists
           if (msg.content != null || msg.images || (tr && tr.name === "Edit" && tr.input && tr.input.old_string)) {
             updateToolResult(msg.id, msg.content || "", msg.is_error || false, msg.images);
@@ -1061,6 +1032,10 @@ export function processMessage(msg) {
         }
         break;
 
+      case "generated_image":
+        renderGeneratedImage(msg);
+        break;
+
       case "ask_user_answered":
         markAskUserAnswered(msg.toolId, msg.answers);
         stopUrgentBlink();
@@ -1160,6 +1135,7 @@ export function processMessage(msg) {
         stopThinking();
         markAllToolsDone();
         closeToolGroup();
+        clearAllImageGenerationProgress();
         finalizeAssistantBlock();
         addTurnMeta(msg.cost, msg.duration);
         accumulateUsage(msg.cost, msg.usage);

package/lib/public/modules/app-panels.js

@@ -5,7 +5,6 @@ import { refreshIcons } from "./icons.js";
 import { escapeHtml, showToast } from "./utils.js";
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
-import { VENDOR_NAMES, isExperimentalVendor } from './app-rendering.js';
 import { reportPaneContext } from './pane-bridge.js';
 import { setupModelPicker, renderModelPicker, requestVendorModels, prepareModelPickerOpen, modelDisplayName } from './model-picker.js';
 
@@ -368,79 +367,8 @@ export function initPanels() {
   configWebsearchSection = $("config-websearch-section");
   configWebsearchBar = $("config-websearch-bar");
 
-  // --- Vendor toggle ---
-  var vendorToggleWrap = $("vendor-toggle-wrap");
-  var vendorBtnClaude = $("vendor-btn-claude");
-  var vendorBtnCodex = $("vendor-btn-codex");
-  var vendorBtnAntigravity = $("vendor-btn-antigravity");
-  var vendorBtnOpenCode = $("vendor-btn-opencode");
-  var vendorBtnKimi = $("vendor-btn-kimi");
-  var vendorBtnGrok = $("vendor-btn-grok");
-  var vendorBtnCopilot = $("vendor-btn-copilot");
-  var vendorBtnQwen = $("vendor-btn-qwen");
-  var vendorBtnJunie = $("vendor-btn-junie");
-  var vendorBtnKiro = $("vendor-btn-kiro");
-  var vendorBtns = {
-    claude: vendorBtnClaude,
-    codex: vendorBtnCodex,
-    antigravity: vendorBtnAntigravity,
-    opencode: vendorBtnOpenCode,
-    kimi: vendorBtnKimi,
-    grok: vendorBtnGrok,
-    copilot: vendorBtnCopilot,
-    qwen: vendorBtnQwen,
-    junie: vendorBtnJunie,
-    kiro: vendorBtnKiro,
-  };
-
-  function updateVendorToggle() {
-    var installed = store.get('installedVendors') || [];
-    var current = store.get('currentVendor') || "claude";
-
-    var vendors = Object.keys(vendorBtns);
-    for (var i = 0; i < vendors.length; i++) {
-      var v = vendors[i];
-      var btn = vendorBtns[v];
-      if (!btn) continue;
-      var isInstalled = installed.indexOf(v) !== -1;
-      btn.classList.toggle("active", v === current);
-      btn.classList.toggle("disabled", !isInstalled);
-      btn.classList.toggle("experimental", isExperimentalVendor(v));
-      var title = isInstalled ? (VENDOR_NAMES[v] || v) : (VENDOR_NAMES[v] || v) + " is not installed";
-      if (isExperimentalVendor(v)) title += " · Experimental integration; not yet validated through direct use testing";
-      btn.title = title;
-    }
-  }
-
-  function onVendorClick(vendor) {
-    if (vendor === (store.get('currentVendor') || "claude")) return;
-    var installed = store.get('installedVendors') || [];
-    if (installed.indexOf(vendor) === -1) return;
-    store.set({ currentVendor: vendor, currentModel: "", currentModels: [], vendorCapabilities: {}, vendorSelectionLocked: true, sessionVendorBound: true });
-    var ws = getWs();
-    if (ws) ws.send(JSON.stringify({ type: "set_vendor", vendor: vendor }));
-  }
-
-  if (vendorBtnClaude) vendorBtnClaude.addEventListener("click", function() { onVendorClick("claude"); });
-  if (vendorBtnCodex) vendorBtnCodex.addEventListener("click", function() { onVendorClick("codex"); });
-  if (vendorBtnAntigravity) vendorBtnAntigravity.addEventListener("click", function() { onVendorClick("antigravity"); });
-  if (vendorBtnOpenCode) vendorBtnOpenCode.addEventListener("click", function() { onVendorClick("opencode"); });
-  if (vendorBtnKimi) vendorBtnKimi.addEventListener("click", function() { onVendorClick("kimi"); });
-  if (vendorBtnGrok) vendorBtnGrok.addEventListener("click", function() { onVendorClick("grok"); });
-  if (vendorBtnCopilot) vendorBtnCopilot.addEventListener("click", function() { onVendorClick("copilot"); });
-  if (vendorBtnQwen) vendorBtnQwen.addEventListener("click", function() { onVendorClick("qwen"); });
-  if (vendorBtnJunie) vendorBtnJunie.addEventListener("click", function() { onVendorClick("junie"); });
-  if (vendorBtnKiro) vendorBtnKiro.addEventListener("click", function() { onVendorClick("kiro"); });
-
   // --- Reactive UI sync ---
   store.subscribe(function (state, prev) {
-    // Vendor toggle state
-    if (state.availableVendors !== prev.availableVendors ||
-        state.installedVendors !== prev.installedVendors ||
-        state.currentVendor !== prev.currentVendor) {
-      updateVendorToggle();
-    }
-
     // richContextUsage changed -> update popover + panel
     if (state.richContextUsage !== prev.richContextUsage) {
       if (state.richContextUsage) {

package/lib/public/modules/filebrowser-context-menu.js

@@ -0,0 +1,148 @@
+// File-tree context menu and shared file download action.
+
+import { iconHtml, refreshIcons } from './icons.js';
+import { insertTextAtCursor } from './input.js';
+import { copyToClipboard, showToast } from './utils.js';
+
+var MAX_COPY_CONTENT_BYTES = 1024 * 1024;
+
+function closeFileContextMenu() {
+  var menu = document.getElementById('file-tree-context-menu');
+  if (menu) menu.remove();
+  var activeRows = document.querySelectorAll('.file-tree-item.context-open');
+  for (var i = 0; i < activeRows.length; i++) activeRows[i].classList.remove('context-open');
+}
+
+export function downloadProjectFile(filePath) {
+  if (!filePath) return;
+  var link = document.createElement('a');
+  link.href = 'api/file/download?path=' + encodeURIComponent(filePath);
+  link.download = filePath.split('/').pop() || 'download';
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+}
+
+function copyProjectFileContents(filePath) {
+  var url = 'api/file/download?path=' + encodeURIComponent(filePath);
+  fetch(url, { credentials: 'same-origin', cache: 'no-store' })
+    .then(function (response) {
+      if (!response.ok) throw new Error('Could not read file');
+      var contentLength = parseInt(response.headers.get('content-length') || '0', 10);
+      if (contentLength > MAX_COPY_CONTENT_BYTES) {
+        if (response.body && response.body.cancel) response.body.cancel();
+        throw new Error('File is too large to copy');
+      }
+      return response.arrayBuffer();
+    })
+    .then(function (buffer) {
+      if (buffer.byteLength > MAX_COPY_CONTENT_BYTES) throw new Error('File is too large to copy');
+      var bytes = new Uint8Array(buffer);
+      for (var i = 0; i < bytes.length; i++) {
+        if (bytes[i] === 0) throw new Error('Binary files cannot be copied as text');
+      }
+      var decoder = new TextDecoder('utf-8', { fatal: true });
+      var text;
+      try { text = decoder.decode(buffer); } catch (e) { throw new Error('Binary files cannot be copied as text'); }
+      return copyToClipboard(text);
+    })
+    .catch(function (error) {
+      var message = error && error.message ? error.message : 'Could not copy file contents';
+      showToast(message, 'error');
+    });
+}
+
+function menuItem(icon, label, handler) {
+  var item = document.createElement('button');
+  item.type = 'button';
+  item.className = 'file-tree-context-item';
+  item.setAttribute('role', 'menuitem');
+  item.innerHTML = iconHtml(icon) + '<span>' + label + '</span>';
+  item.addEventListener('click', handler);
+  return item;
+}
+
+function positionMenu(menu, clientX, clientY) {
+  var edge = 8;
+  var rect = menu.getBoundingClientRect();
+  var left = Math.max(edge, Math.min(clientX, window.innerWidth - rect.width - edge));
+  var top = Math.max(edge, Math.min(clientY, window.innerHeight - rect.height - edge));
+  menu.style.left = left + 'px';
+  menu.style.top = top + 'px';
+}
+
+function showFileContextMenu(event, row) {
+  closeFileContextMenu();
+  row.classList.add('context-open');
+
+  var menu = document.createElement('div');
+  menu.id = 'file-tree-context-menu';
+  menu.className = 'file-tree-context-menu';
+  menu.setAttribute('role', 'menu');
+  menu.setAttribute('aria-label', 'File actions');
+
+  var mention = menuItem('at-sign', 'Mention in chat', function (clickEvent) {
+    clickEvent.stopPropagation();
+    var filePath = row.dataset.path;
+    closeFileContextMenu();
+    insertTextAtCursor(filePath + ' ');
+  });
+  menu.appendChild(mention);
+
+  var copyPath = menuItem('copy', 'Copy path', function (clickEvent) {
+    clickEvent.stopPropagation();
+    var filePath = row.dataset.path;
+    closeFileContextMenu();
+    copyToClipboard(filePath).catch(function () { showToast('Could not copy path', 'error'); });
+  });
+  menu.appendChild(copyPath);
+
+  var copyContents = menuItem('clipboard-copy', 'Copy contents', function (clickEvent) {
+    clickEvent.stopPropagation();
+    var filePath = row.dataset.path;
+    closeFileContextMenu();
+    copyProjectFileContents(filePath);
+  });
+  menu.appendChild(copyContents);
+
+  var separator = document.createElement('div');
+  separator.className = 'file-tree-context-separator';
+  separator.setAttribute('role', 'separator');
+  menu.appendChild(separator);
+
+  var download = menuItem('download', 'Download', function (clickEvent) {
+    clickEvent.stopPropagation();
+    var filePath = row.dataset.path;
+    closeFileContextMenu();
+    downloadProjectFile(filePath);
+  });
+  menu.appendChild(download);
+  document.body.appendChild(menu);
+  refreshIcons(menu);
+  positionMenu(menu, event.clientX, event.clientY);
+  try { mention.focus({ preventScroll: true }); } catch (e) { mention.focus(); }
+}
+
+export function initFileBrowserContextMenu(treeEl) {
+  if (!treeEl || treeEl.dataset.contextMenuReady === 'true') return;
+  treeEl.dataset.contextMenuReady = 'true';
+
+  treeEl.addEventListener('contextmenu', function (event) {
+    var row = event.target && event.target.closest ? event.target.closest('.file-tree-item') : null;
+    if (!row || !treeEl.contains(row) || row.dataset.entryType !== 'file' || !row.dataset.path) return;
+    event.preventDefault();
+    event.stopPropagation();
+    showFileContextMenu(event, row);
+  });
+
+  document.addEventListener('pointerdown', function (event) {
+    var menu = document.getElementById('file-tree-context-menu');
+    if (menu && !menu.contains(event.target)) closeFileContextMenu();
+  });
+  document.addEventListener('keydown', function (event) {
+    if (event.key === 'Escape') closeFileContextMenu();
+  });
+  window.addEventListener('resize', closeFileContextMenu);
+  window.addEventListener('blur', closeFileContextMenu);
+  treeEl.addEventListener('scroll', closeFileContextMenu, { passive: true });
+}

package/lib/public/modules/filebrowser.js

@@ -10,6 +10,7 @@ import { animateMarkdownChange, beginMarkdownPresentation, cancelMarkdownFollow,
 import { store } from './store.js';
 import { enterMarkdownSlides, exitMarkdownSlides, handleMarkdownSlideKey, syncMarkdownSlidesButton, toggleMarkdownSlideLevelMenu } from './markdown-slides.js';
 import { initFileViewerTabs, openFileViewerTab, previewFileViewerTab, updateFileViewerTab, closeFileViewerTab, focusedFileViewerTab, clearFileViewerTabs } from './filebrowser-tabs.js';
+import { initFileBrowserContextMenu, downloadProjectFile } from './filebrowser-context-menu.js';
 
 var ctx;
 var showDropHint = function () {};
@@ -29,6 +30,7 @@ var gitDiffCache = {};       // hash -> diff text
 var pendingGitDiff = null;   // callback for pending git diff
 var fileAtCache = {};        // hash -> file content
 var pendingFileAt = null;    // callback for pending file-at
+var FILE_RICH_PREVIEW_MAX_BYTES = 1024 * 1024;
 
 export function initFileBrowser(_ctx) {
   ctx = _ctx;
@@ -55,6 +57,7 @@ export function initFileBrowser(_ctx) {
   // collapses/expands folders and ascends/descends into them. The tree
   // gets a tabindex so it can receive focus and keydown events.
   if (ctx.fileTreeEl) {
+    initFileBrowserContextMenu(ctx.fileTreeEl);
     ctx.fileTreeEl.setAttribute('tabindex', '0');
     ctx.fileTreeEl.addEventListener('keydown', handleTreeKeyDown);
     // When the user clicks any tree row, promote it to keyboard focus
@@ -180,6 +183,11 @@ export function initFileBrowser(_ctx) {
     });
   });
 
+  document.getElementById("file-viewer-download").addEventListener("click", function () {
+    if (!currentFilePath) return;
+    downloadProjectFile(currentFilePath);
+  });
+
   // Markdown render toggle
   document.getElementById("file-viewer-render").addEventListener("click", function () {
     if (!currentContent || (!currentIsMarkdown && !currentIsSvg)) return;
@@ -754,6 +762,7 @@ function renderFilteredTree(container, tree, depth, query) {
 
     var row = document.createElement("div");
     row.className = "file-tree-item" + (isDir ? " expanded" : "");
+    row.dataset.entryType = isDir ? "dir" : "file";
     row.style.paddingLeft = (8 + depth * 16) + "px";
     if (entry) {
       row.draggable = true;
@@ -972,6 +981,7 @@ function renderEntries(container, entries, depth) {
     var entry = sorted[i];
     var row = document.createElement("div");
     row.className = "file-tree-item";
+    row.dataset.entryType = entry.type;
     row.style.paddingLeft = (8 + depth * 16) + "px";
 
     row.draggable = true;
@@ -1079,6 +1089,7 @@ function showFileContent(msg) {
   var previousContent = currentContent;
   var previousPath = currentFilePath;
   var previousWasMarkdown = currentIsMarkdown;
+  var lightweightPreview = false;
   var refreshSlideIndex = pendingRefresh && store.get('markdownSlidesActive')
     ? store.get('markdownSlideIndex') || 0
     : null;
@@ -1116,8 +1127,10 @@ function showFileContent(msg) {
   } else {
     currentContent = msg.content;
     var ext = requestedExt;
-    currentIsMarkdown = (ext === "md" || ext === "mdx");
-    currentIsSvg = ext === "svg";
+    lightweightPreview = (msg.size || 0) > FILE_RICH_PREVIEW_MAX_BYTES;
+    currentIsMarkdown = !lightweightPreview && (ext === "md" || ext === "mdx");
+    currentIsSvg = !lightweightPreview && ext === "svg";
+    if (lightweightPreview) isRendered = false;
     if (pendingRenderedOpen && currentIsMarkdown) isRendered = true;
 
     if (currentIsMarkdown || currentIsSvg) {
@@ -1129,7 +1142,9 @@ function showFileContent(msg) {
     }
 
     // Markdown starts as source; SVG starts as a safe image preview.
-    if (currentIsMarkdown) {
+    if (lightweightPreview) {
+      renderLargeTextFile(bodyEl, msg.content, msg.size);
+    } else if (currentIsMarkdown) {
       var transitionFrom = keepRenderState && prevRendered && previousWasMarkdown &&
         isFollowingMarkdown(msg.path) && pathsReferToSameFile(previousPath, msg.path)
         ? (previousContent == null ? "" : previousContent)
@@ -1149,7 +1164,9 @@ function showFileContent(msg) {
   refreshIcons();
 
   // If opened with a diff request, show full-file split diff in wide mode
-  if (pendingOpenMode && pendingOpenMode.type === "diff" && currentContent != null) {
+  if (pendingOpenMode && lightweightPreview) {
+    pendingOpenMode = null;
+  } else if (pendingOpenMode && pendingOpenMode.type === "diff" && currentContent != null) {
     var diffOpts = pendingOpenMode;
     pendingOpenMode = null;
     historyVisible = false;
@@ -1444,6 +1461,26 @@ function renderCodeWithLineNumbers(bodyEl, content, ext) {
   }
 }
 
+function renderLargeTextFile(bodyEl, content, size) {
+  var viewer = document.createElement("div");
+  viewer.className = "file-viewer-large-text";
+
+  var notice = document.createElement("div");
+  notice.className = "file-viewer-large-notice";
+  notice.innerHTML = iconHtml("file-text") +
+    "<span>Large file (" + formatSize(size || 0) + ") — showing plain text for performance</span>";
+
+  var codeWrap = document.createElement("pre");
+  var codeEl = document.createElement("code");
+  codeEl.textContent = content;
+  codeWrap.appendChild(codeEl);
+
+  viewer.appendChild(notice);
+  viewer.appendChild(codeWrap);
+  bodyEl.innerHTML = "";
+  bodyEl.appendChild(viewer);
+}
+
 function formatSize(bytes) {
   if (bytes < 1024) return bytes + " B";
   if (bytes < 1048576) return (bytes / 1024).toFixed(1) + " KB";

package/lib/public/modules/generated-images.js

@@ -0,0 +1,132 @@
+// Inline presentation for images produced by Codex ImageGen.
+
+import { refreshIcons, iconHtml } from './icons.js';
+import { showImageModal } from './app-misc.js';
+import { addToMessages, scrollToBottom } from './app-rendering.js';
+
+function fileNameFromImage(image) {
+  if (image.fileName) return image.fileName;
+  try {
+    var url = new URL(image.url, window.location.href);
+    return decodeURIComponent(url.pathname.split('/').pop()) || 'generated-image.png';
+  } catch (e) {
+    return 'generated-image.png';
+  }
+}
+
+function actionButton(icon, label) {
+  var button = document.createElement('button');
+  button.type = 'button';
+  button.className = 'generated-image-action';
+  button.title = label;
+  button.setAttribute('aria-label', label);
+  button.innerHTML = iconHtml(icon) + '<span>' + label + '</span>';
+  return button;
+}
+
+function findProgressRow(toolId) {
+  var rows = document.querySelectorAll('.generated-image-row[data-image-tool-id]');
+  for (var i = 0; i < rows.length; i++) {
+    if (rows[i].dataset.imageToolId === String(toolId || '')) return rows[i];
+  }
+  return null;
+}
+
+export function renderImageGenerationProgress(msg) {
+  if (!msg.id || findProgressRow(msg.id)) return;
+
+  var row = document.createElement('div');
+  row.className = 'generated-image-row generated-image-row--pending';
+  row.dataset.imageToolId = msg.id;
+
+  var status = document.createElement('div');
+  status.className = 'generated-image-status';
+  status.setAttribute('role', 'status');
+  status.setAttribute('aria-live', 'polite');
+  status.innerHTML = iconHtml('sparkles') + '<span>Creating image</span><span class="generated-image-status-dots" aria-hidden="true"></span>';
+  row.appendChild(status);
+
+  var card = document.createElement('div');
+  card.className = 'generated-image-card generated-image-card--pending';
+  card.setAttribute('aria-hidden', 'true');
+  var field = document.createElement('div');
+  field.className = 'generated-image-particle-field';
+  card.appendChild(field);
+  row.appendChild(card);
+
+  addToMessages(row);
+  refreshIcons(row);
+  scrollToBottom();
+}
+
+export function clearImageGenerationProgress(toolId) {
+  var row = findProgressRow(toolId);
+  if (row && row.classList.contains('generated-image-row--pending')) row.remove();
+}
+
+export function clearAllImageGenerationProgress() {
+  var rows = document.querySelectorAll('.generated-image-row--pending');
+  for (var i = 0; i < rows.length; i++) rows[i].remove();
+}
+
+export function renderGeneratedImage(msg) {
+  var image = msg.images && msg.images[0];
+  if (!image || !image.url) return;
+
+  var row = document.createElement('div');
+  row.className = 'generated-image-row';
+  row.dataset.imageToolId = msg.id || '';
+  var card = document.createElement('figure');
+  card.className = 'generated-image-card';
+  card.dataset.toolId = msg.id || '';
+
+  var imageWrap = document.createElement('div');
+  imageWrap.className = 'generated-image-preview';
+  var img = document.createElement('img');
+  img.src = image.url;
+  img.alt = msg.prompt ? 'Generated image: ' + msg.prompt : 'Generated image';
+  img.loading = 'lazy';
+  img.addEventListener('click', function () { showImageModal(image.url); });
+  imageWrap.appendChild(img);
+  card.appendChild(imageWrap);
+
+  var footer = document.createElement('figcaption');
+  footer.className = 'generated-image-footer';
+  var meta = document.createElement('div');
+  meta.className = 'generated-image-meta';
+  var label = document.createElement('span');
+  label.className = 'generated-image-label';
+  label.innerHTML = iconHtml('sparkles') + '<span>Generated image</span>';
+  meta.appendChild(label);
+  if (msg.prompt) {
+    var prompt = document.createElement('span');
+    prompt.className = 'generated-image-prompt';
+    prompt.textContent = msg.prompt;
+    prompt.title = msg.prompt;
+    meta.appendChild(prompt);
+  }
+  footer.appendChild(meta);
+
+  var actions = document.createElement('div');
+  actions.className = 'generated-image-actions';
+  var openButton = actionButton('maximize-2', 'Open');
+  openButton.addEventListener('click', function () { showImageModal(image.url); });
+  actions.appendChild(openButton);
+  var downloadLink = document.createElement('a');
+  downloadLink.className = 'generated-image-action';
+  downloadLink.href = image.url;
+  downloadLink.download = fileNameFromImage(image);
+  downloadLink.title = 'Download';
+  downloadLink.setAttribute('aria-label', 'Download');
+  downloadLink.innerHTML = iconHtml('download') + '<span>Download</span>';
+  actions.appendChild(downloadLink);
+  footer.appendChild(actions);
+  card.appendChild(footer);
+  row.appendChild(card);
+
+  var progressRow = findProgressRow(msg.id);
+  if (progressRow) progressRow.replaceWith(row);
+  else addToMessages(row);
+  refreshIcons(row);
+  scrollToBottom();
+}

package/lib/public/modules/input.js

@@ -78,23 +78,15 @@ export var builtinCommands = [
 
 function commitVendorForTurn() {
   var committedVendor = store.get('currentVendor');
-  var vendorToggle = document.getElementById("vendor-toggle-wrap");
   var activeIndicator = document.getElementById("active-vendor-indicator");
   var activeIcon = document.getElementById("active-vendor-icon");
   if (committedVendor) {
-    if (vendorToggle) {
-      vendorToggle.classList.add("hidden");
-      vendorToggle.classList.remove("locked");
-    }
     if (activeIndicator && activeIcon) {
       activeIcon.src = VENDOR_AVATARS[committedVendor] || VENDOR_AVATARS.claude;
       activeIcon.alt = VENDOR_NAMES[committedVendor] || VENDOR_NAMES.claude;
       activeIndicator.title = (VENDOR_NAMES[committedVendor] || VENDOR_NAMES.claude) + " session";
       activeIndicator.classList.remove("hidden");
     }
-  } else if (vendorToggle) {
-    vendorToggle.classList.remove("hidden");
-    vendorToggle.classList.add("locked");
   }
   store.set({ vendorSelectionLocked: false, sessionHasHistory: true });
 }
@@ -339,8 +331,7 @@ export function sendMessage() {
 
   // First message commits the vendor and bumps the session into
   // has-history state. The server won't re-fire session_switched after a
-  // message, so mirror the vendor-toggle/active-indicator swap locally:
-  // hide the picker, show the small avatar next to the config chip.
+  // message, so show the small vendor avatar next to the config chip.
   // Bumping sessionHasHistory drives in-session lock states (e.g. the
   // Codex model picker that becomes informational once the thread is
   // bound to a model).
@@ -437,7 +428,7 @@ function extractFilePaths(cd) {
 }
 
 // --- Insert text at cursor in textarea ---
-function insertTextAtCursor(text) {
+export function insertTextAtCursor(text) {
   var el = ctx.inputEl;
   el.focus();
   var start = el.selectionStart;

package/lib/public/modules/session-tui-view.js

@@ -23,9 +23,8 @@ import { attachTuiGrab, detachTuiGrab } from './tui-grab.js';
 import { createKeyToolbar, TERMINAL_TOOLBAR_HTML } from './terminal-toolbar.js';
 import { refreshIcons, iconHtml } from './icons.js';
 
-// Claude TUI session terminal colors follow Clay's active theme via
-// getTerminalTheme(). Live theme switches are wired through
-// setTuiSessionTheme() below, which theme.js calls from applyTheme.
+// Claude TUI sessions always use Clay Studio Dark via getTerminalTheme().
+// Theme switches reapply that fixed palette through setTuiSessionTheme().
 
 var hostEl = null;       // container div mounted over #messages
 var xtermContainerEl = null;

package/lib/public/modules/theme.js

@@ -262,7 +262,7 @@ export function getComputedVar(varName) {
 }
 
 export function getTerminalTheme() {
-  return computeTerminalTheme(getCurrentTheme());
+  return computeTerminalTheme(getTheme(DEFAULT_DARK_THEME_ID) || defaultDarkFallback);
 }
 
 export function getMermaidThemeVars() {
@@ -305,7 +305,9 @@ export function applyTheme(themeId, fromPicker) {
 
   try { updateMascotSvgs(vars, isLight); } catch (e) {}
 
-  var termTheme = computeTerminalTheme(theme);
+  // Terminals deliberately keep Clay Studio Dark for predictable ANSI
+  // contrast, even while the surrounding workspace uses a light theme.
+  var termTheme = getTerminalTheme();
   try { setTerminalTheme(termTheme); } catch (e) {}
   try { setTuiSessionTheme(termTheme); } catch (e) {}
   try { setTuiAttentionTheme(termTheme); } catch (e) {}