clay-server 5.3.0-beta.5 → 5.3.0-beta.6

package/lib/public/modules/file-pane-review.js

@@ -0,0 +1,26 @@
+import { filePaneState, updateFilePaneState, repaintFilePane } from './file-pane-instances.js';
+import { renderSplitDiff, renderUnifiedDiff } from './diff.js';
+import { renderCodeWithLineNumbers, mapExtToLanguage } from './file-viewer-source.js';
+
+var callbacks = new Map();
+export function bindFileReview(state, review) {
+  if (review) callbacks.set(state.instanceId, { requestId: state.requestId, context: state.context, review: review });
+  else callbacks.delete(state.instanceId);
+}
+export function releaseFileReview(id) { callbacks.delete(id); }
+export function paintFileReview(body, state) {
+  var bar = document.createElement('div'); bar.className = 'file-history-view-bar';
+  var receipt = callbacks.get(state.instanceId);
+  function current() { var live = filePaneState(state.instanceId); return live && live.requestId === state.requestId && live.context === state.context; }
+  function button(label, callback) { var b = document.createElement('button'); b.type = 'button'; b.textContent = label; b.disabled = !callback; b.addEventListener('click', function () { if (current() && callback) callback(); }); bar.appendChild(b); }
+  button('Back to file', function () { updateFilePaneState(state.instanceId, { diff: null }); repaintFilePane(state.instanceId); });
+  ['Split', 'Unified', 'Source'].forEach(function (mode) { button(mode, function () { updateFilePaneState(state.instanceId, { reviewMode: mode.toLowerCase() }); repaintFilePane(state.instanceId); }); });
+  if (receipt && receipt.requestId === state.requestId && receipt.context === state.context) {
+    var review = receipt.review, label = document.createElement('span'); label.textContent = (review.index + 1) + ' of ' + review.total; bar.appendChild(label);
+    button('Previous file', review.previous); button('Next file', review.next); if (review.askAgent) button('Ask agent', review.askAgent);
+  }
+  body.appendChild(bar);
+  var content = document.createElement('div'), ext = state.resource.path.split('.').pop(); body.appendChild(content);
+  if (state.reviewMode === 'source') renderCodeWithLineNumbers(content, state.diff.newStr || '', ext);
+  else content.appendChild((state.reviewMode === 'unified' ? renderUnifiedDiff : renderSplitDiff)(state.diff.oldStr || '', state.diff.newStr || '', mapExtToLanguage(ext)));
+}

package/lib/public/modules/file-pane-toolbar.js

@@ -0,0 +1,54 @@
+import { filePreviewKind } from './file-pane-render.js';
+import { iconHtml, refreshIcons } from './icons.js';
+
+function button(label, icon, action) {
+  var element = document.createElement('button'); element.type = 'button'; element.title = label; element.setAttribute('aria-label', label);
+  element.innerHTML = icon ? iconHtml(icon) : label; element.addEventListener('click', action); return element;
+}
+export function filePaneShell(id, act) {
+  var panel = document.createElement('section'); panel.id = 'file-' + id; panel.className = 'file-instance'; panel.dataset.fileInstance = id;
+  var header = document.createElement('header'); header.className = 'tool-pane-header split-pane-header'; header.dataset.toolPane = panel.id;
+  var title = document.createElement('span'); title.className = 'tool-pane-title split-pane-title';
+  var space = document.createElement('span'); space.className = 'split-pane-drag-space';
+  var actions = document.createElement('div'); actions.className = 'file-viewer-window-actions';
+  var pin = button('Pin this file', 'pin', function () { act('pin'); }); pin.dataset.action = 'pin';
+  actions.append(pin, button('Expand file pane', 'maximize-2', function () { act('expand'); }), button('Close file pane', 'x', function () { act('close'); }));
+  header.append(title, space, actions);
+  var toolbar = document.createElement('div'); toolbar.className = 'file-instance-toolbar'; toolbar.setAttribute('aria-label', 'File actions');
+  ['Preview', 'Source', 'History'].forEach(function (label) { var b = button(label, null, function () { act(label.toLowerCase()); }); b.dataset.action = label.toLowerCase(); toolbar.appendChild(b); });
+  var more = button('More file actions', 'ellipsis', toggle); more.setAttribute('aria-haspopup', 'menu'); more.setAttribute('aria-expanded', 'false');
+  toolbar.appendChild(more);
+  var menu = document.createElement('div'); menu.className = 'file-instance-more hidden'; menu.setAttribute('role', 'menu');
+  [['Copy source', 'copy'], ['Copy formatted', 'formatted'], ['Download', 'download'], ['Export PDF', 'pdf'], ['Present slides', 'slides'], ['Use H1 headings', 'h1'], ['Use H2 headings', 'h2'], ['Use H3 headings', 'h3'], ['Refresh', 'refresh']].forEach(function (item) {
+    var b = button(item[0], null, function () { dismiss(true); act(item[1]); }); b.setAttribute('role', 'menuitem'); b.dataset.action = item[1]; menu.appendChild(b);
+  });
+  function dismiss(focus) { menu.classList.add('hidden'); more.setAttribute('aria-expanded', 'false'); if (focus) more.focus(); }
+  function toggle() { var open = menu.classList.contains('hidden'); dismiss(false); if (open) { menu.classList.remove('hidden'); more.setAttribute('aria-expanded', 'true'); menu.querySelector('button:not(:disabled)').focus(); } }
+  function outside(event) { if (!menu.contains(event.target) && !more.contains(event.target)) dismiss(false); }
+  panel.addEventListener('keydown', function (event) {
+    if (!menu.classList.contains('hidden')) {
+      if (event.key === 'Escape' || event.key === 'Tab') { dismiss(event.key === 'Escape'); event.stopPropagation(); if (event.key === 'Escape') event.preventDefault(); }
+      if (event.key === 'ArrowDown' || event.key === 'ArrowUp' || event.key === 'Home' || event.key === 'End') {
+        var buttons = Array.from(menu.querySelectorAll('button:not(:disabled)')), index = buttons.indexOf(document.activeElement);
+        index = event.key === 'Home' ? 0 : event.key === 'End' ? buttons.length - 1 : (index + (event.key === 'ArrowDown' ? 1 : -1) + buttons.length) % buttons.length;
+        buttons[index].focus(); event.preventDefault(); event.stopPropagation();
+      }
+      return;
+    }
+    if (event.key === 'Escape') { act('escape'); event.stopPropagation(); }
+    if (event.key === 'ArrowRight' || event.key === 'ArrowLeft') act(event.key === 'ArrowRight' ? 'next' : 'previous');
+  });
+  document.addEventListener('pointerdown', outside);
+  panel.addEventListener('clay-tool-pane-dispose', function () { document.removeEventListener('pointerdown', outside); }, { once: true });
+  var body = document.createElement('div'); body.className = 'file-viewer-body'; body.tabIndex = 0;
+  panel.append(header, toolbar, menu, body); refreshIcons(); return panel;
+}
+export function updateFilePaneToolbar(panel, state) {
+  var title = panel.querySelector('.tool-pane-title'); title.textContent = state.resource.path.split('/').pop(); title.title = state.resource.path;
+  var pin = panel.querySelector('[data-action="pin"]'), pinned = state.resource.mode === 'pin';
+  pin.setAttribute('aria-pressed', String(pinned)); pin.title = pinned ? 'Pinned to ' + state.resource.path + '. Switch to Follow selection' : 'Following file selection. Pin this file'; pin.setAttribute('aria-label', pinned ? 'Follow file selection' : 'Pin this file');
+  ['preview', 'source', 'history'].forEach(function (key) { panel.querySelector('[data-action="' + key + '"]').setAttribute('aria-pressed', String(key === 'history' ? state.historyVisible : !state.historyVisible && (key === 'preview') === state.resource.rendered)); });
+  panel.querySelector('[data-action="preview"]').disabled = !filePreviewKind(state.resource.path) || !!state.binary;
+  var markdown = /\.mdx?$/i.test(state.resource.path);
+  ['pdf', 'formatted', 'slides', 'h1', 'h2', 'h3'].forEach(function (key) { panel.querySelector('[data-action="' + key + '"]').disabled = !markdown; });
+}

package/lib/public/modules/file-viewer-source.js

@@ -0,0 +1,70 @@
+import { iconHtml } from './icons.js';
+export function mapExtToLanguage(ext) {
+  var map = {
+    js: "javascript", ts: "typescript", jsx: "javascript", tsx: "typescript",
+    py: "python", rb: "ruby", go: "go", rs: "rust", java: "java",
+    css: "css", html: "xml", xml: "xml", json: "json", yaml: "yaml",
+    yml: "yaml", md: "markdown", sh: "bash", bash: "bash", zsh: "bash",
+    sql: "sql", c: "c", cpp: "cpp", h: "c", hpp: "cpp",
+    cs: "csharp", swift: "swift", kt: "kotlin", vue: "xml", svelte: "xml"
+  };
+  return map[ext] || null;
+}
+
+export function renderCodeWithLineNumbers(bodyEl, content, ext) {
+  var lang = mapExtToLanguage(ext);
+  var lines = content.split("\n");
+  var lineCount = lines.length;
+
+  var viewer = document.createElement("div");
+  viewer.className = "file-viewer-code";
+
+  var gutter = document.createElement("pre");
+  gutter.className = "file-viewer-gutter";
+  var nums = [];
+  for (var i = 1; i <= lineCount; i++) nums.push(i);
+  gutter.textContent = nums.join("\n");
+
+  var codeWrap = document.createElement("pre");
+  codeWrap.className = "file-viewer-code-content";
+  var codeEl = document.createElement("code");
+  if (lang) codeEl.className = "language-" + lang;
+  codeEl.textContent = content;
+  codeWrap.appendChild(codeEl);
+
+  viewer.appendChild(gutter);
+  viewer.appendChild(codeWrap);
+
+  bodyEl.innerHTML = "";
+  bodyEl.appendChild(viewer);
+
+  if (typeof hljs !== "undefined" && lang) {
+    hljs.highlightElement(codeEl);
+  }
+}
+
+export 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);
+}
+
+export function formatSize(bytes) {
+  if (bytes < 1024) return bytes + " B";
+  if (bytes < 1048576) return (bytes / 1024).toFixed(1) + " KB";
+  return (bytes / 1048576).toFixed(1) + " MB";
+}

package/lib/public/modules/filebrowser.js

@@ -1,3 +1,7 @@
+import { independentFilesActive, closeActiveFilePane, expandActiveFilePane, reopenIndependentFile, refreshIndependentFile, presentIndependentFile } from './file-pane-entrypoints.js';
+import { openIndependentFile, routeFilePaneMessage } from './file-pane-instances.js';
+import { activeSavedView } from './view-workspace-state.js';
+import { mapExtToLanguage, renderCodeWithLineNumbers, renderLargeTextFile, formatSize } from './file-viewer-source.js';
 import { presentedDocument, refreshPresentedDocument, closePresentedDocument } from './clay-studio-document.js';
 import { registerStudioPaint } from './clay-studio-render.js';
 import { iconHtml, refreshIcons } from './icons.js';
@@ -47,7 +51,7 @@ export function initFileBrowser(_ctx) {
     onFocus: function(path) {
       claimRightWorkbench("file-viewer");
       ctx.fileViewerEl.classList.remove("hidden");
-      if (path !== currentFilePath || (store.get("fileViewerIsHtml") && isRendered && !document.querySelector(".file-viewer-html-preview"))) requestFileContent(path);
+      if (path !== currentFilePath || (store.get("fileViewerIsHtml") && isRendered && !ctx.fileViewerEl.querySelector(".file-viewer-html-preview"))) requestFileContent(path);
     },
     onEmpty: function() { resetMarkdownViewModes(); teardownFileViewer(); },
   });
@@ -499,24 +503,30 @@ function ensureRenderedMarkdown() {
 }
 
 export function closeFileViewer() {
+  if (independentFilesActive()) return closeActiveFilePane();
   releaseRightWorkbench("file-viewer");
   teardownFileViewer();
 }
 
 function teardownFileViewer() {
   cancelPlantUmlPreview();
-  var htmlFrame = document.querySelector(".file-viewer-html-preview");
+  var htmlFrame = ctx.fileViewerEl.querySelector(".file-viewer-html-preview");
   if (htmlFrame) htmlFrame.remove();
   if (currentFilePath && isFollowingMarkdown(currentFilePath)) cancelMarkdownFollow();
   sendUnwatch();
   inlineDiffActive = false;
   exitMarkdownSlides();
   ctx.fileViewerEl.classList.remove("file-viewer-wide");
-  setFileViewerFullscreen(false);
+  setLegacyFileViewerFullscreen(false);
   ctx.fileViewerEl.classList.add("hidden");
 }
 
 export function setFileViewerFullscreen(enabled) {
+  if (independentFilesActive()) return expandActiveFilePane(enabled);
+  return setLegacyFileViewerFullscreen(enabled);
+}
+
+function setLegacyFileViewerFullscreen(enabled) {
   var isFullscreen = !!enabled;
   var viewer = ctx && ctx.fileViewerEl ? ctx.fileViewerEl : document.getElementById("file-viewer");
   var button = document.getElementById("file-viewer-fullscreen");
@@ -575,6 +585,11 @@ var pendingRenderedOpen = false;
 
 export function openFile(filePath, opts) {
   if (!filePath) return;
+  if (activeSavedView() && !store.get('paneMode')) {
+    var opened = openIndependentFile(filePath, opts);
+    if (opened !== false) closePresentedDocument();
+    return opened;
+  }
   var state = store.snap();
   if (!state.connected) return false;
   if (opts && opts.projectSlug && opts.projectSlug !== state.currentSlug) return false;
@@ -597,6 +612,7 @@ export function openFile(filePath, opts) {
 }
 
 export function reopenFileViewer() {
+  if (independentFilesActive()) return reopenIndependentFile();
   var workbenchRevision = claimRightWorkbench("file-viewer");
   store.set({ fileViewerOpenRevision: workbenchRevision });
   if (!focusedFileViewerTab()) return false;
@@ -616,6 +632,7 @@ export function reopenFileViewer() {
 
 export function openWorkingTreeDiff(diff) {
   if (!diff || !diff.path) return;
+  if (independentFilesActive()) return presentIndependentFile({ path: diff.path, content: diff.newContent, binary: diff.binary }, diff.binary ? null : { oldStr: diff.oldContent || "", newStr: diff.newContent || "" }, diff.review);
   var workbenchRevision = claimRightWorkbench("file-viewer");
   store.set({ fileViewerOpenRevision: workbenchRevision });
   openFileViewerTab(diff.path);
@@ -636,6 +653,7 @@ export function openWorkingTreeDiff(diff) {
 
 export function presentMarkdownEdit(msg) {
   if (!msg || !beginMarkdownPresentation(msg.path)) return;
+  if (independentFilesActive()) return presentIndependentFile(msg);
   var workbenchRevision = claimRightWorkbench("file-viewer");
   store.set({ fileViewerOpenRevision: workbenchRevision });
   openFileViewerTab(msg.path, { content: msg.content });
@@ -739,7 +757,7 @@ function requestFileContent(filePath) {
   if (refreshPresentedDocument(filePath)) return;
   var requestId = "file-read-" + Date.now() + "-" + Math.random().toString(36).slice(2);
   var state = store.snap();
-  store.set({ fileReadRequest: { requestId: requestId, path: filePath, projectSlug: state.currentSlug || null, sessionId: state.activeSessionId != null ? String(state.activeSessionId) : null, accountId: state.myUserId || null, workbenchRevision: rightWorkbenchRevisionFor('file-viewer') } });
+  store.set({ fileReadRequest: { requestId: requestId, path: filePath, projectSlug: state.currentSlug || null, sessionId: state.activeSessionId != null ? String(state.activeSessionId) : null, accountId: state.myUserId || null, viewId: state.projectSplitViewActiveId || null, socketGeneration: state.projectSplitViewSocketGeneration, workbenchRevision: rightWorkbenchRevisionFor('file-viewer') } });
   var pending = store.get('pendingFileNavigation');
   if (pending && pending.path === filePath) store.set({ pendingFileNavigation: Object.assign({}, pending, { requestId: requestId }) });
   if (ctx.ws && ctx.connected) {
@@ -750,6 +768,7 @@ function requestFileContent(filePath) {
 var pendingRefresh = false;
 
 export function refreshIfOpen(filePath) {
+  if (independentFilesActive()) return refreshIndependentFile(filePath);
   if (!currentFilePath || ctx.fileViewerEl.classList.contains("hidden")) return;
   // Don't refresh while history panel or inline diff is showing
   if (historyVisible || inlineDiffActive) return;
@@ -863,7 +882,7 @@ function renderFilteredTree(container, tree, depth, query) {
       (function (rowEl, childEl, folderName) {
         rowEl.addEventListener("click", function (e) {
           e.stopPropagation();
-          claimRightWorkbench("file-viewer");
+          if (!activeSavedView()) claimRightWorkbench("file-viewer");
           var isExpanded = rowEl.classList.contains("expanded");
           rowEl.classList.toggle("expanded");
           childEl.classList.toggle("hidden", isExpanded);
@@ -886,6 +905,11 @@ function renderFilteredTree(container, tree, depth, query) {
       (function (filePath, rowEl) {
         rowEl.addEventListener("click", function (e) {
           e.stopPropagation();
+          if (activeSavedView() && !store.get('paneMode')) {
+            openIndependentFile(filePath);
+            if (window.innerWidth <= 768) closeSidebar();
+            return;
+          }
           claimRightWorkbench("file-viewer");
           if (followedFileChanged(filePath)) cancelMarkdownFollow();
           var prev = ctx.fileTreeEl.querySelector(".file-tree-item.active");
@@ -1018,8 +1042,10 @@ function restoreExpanded(expandedSet) {
 }
 
 export function handleFsRead(msg) {
+  if (routeFilePaneMessage(msg)) return;
   var request = store.get('fileReadRequest');
   var state = store.snap();
+  if (request && (request.viewId !== (state.projectSplitViewActiveId || null) || request.socketGeneration !== state.projectSplitViewSocketGeneration)) return;
   if (!request || !state.connected || msg.requestId !== request.requestId || msg.path !== request.path) return;
   if ((request.projectSlug || null) !== (state.currentSlug || null)) return;
   if ((request.sessionId || null) !== (state.activeSessionId == null ? null : String(state.activeSessionId))) return;
@@ -1094,7 +1120,7 @@ function renderEntries(container, entries, depth) {
       (function (dirPath, childEl, rowEl, folderName) {
         rowEl.addEventListener("click", function (e) {
           e.stopPropagation();
-          claimRightWorkbench("file-viewer");
+          if (!activeSavedView()) claimRightWorkbench("file-viewer");
           var isExpanded = rowEl.classList.contains("expanded");
           if (isExpanded) {
             rowEl.classList.remove("expanded");
@@ -1134,6 +1160,11 @@ function renderEntries(container, entries, depth) {
       (function (filePath, rowEl) {
         rowEl.addEventListener("click", function (e) {
           e.stopPropagation();
+          if (activeSavedView() && !store.get('paneMode')) {
+            openIndependentFile(filePath);
+            if (window.innerWidth <= 768) closeSidebar();
+            return;
+          }
           claimRightWorkbench("file-viewer");
           if (followedFileChanged(filePath)) cancelMarkdownFollow();
           // Mark active
@@ -1382,6 +1413,7 @@ function pathsReferToSameFile(left, right) {
 }
 
 export function handleFileChanged(msg, presentedSource) {
+  if (routeFilePaneMessage(msg)) return;
   var source = store.get('studioDocumentView');
   if (source && source.descriptor.path === msg.path && (!presentedSource || presentedDocument(msg.path) !== presentedSource)) return;
   if (!msg.path || !pathsReferToSameFile(msg.path, currentFilePath)) return;
@@ -1545,81 +1577,7 @@ function showInlineDiff(oldStr, newStr, review) {
   render();
 }
 
-function mapExtToLanguage(ext) {
-  var map = {
-    js: "javascript", ts: "typescript", jsx: "javascript", tsx: "typescript",
-    py: "python", rb: "ruby", go: "go", rs: "rust", java: "java",
-    css: "css", html: "xml", xml: "xml", json: "json", yaml: "yaml",
-    yml: "yaml", md: "markdown", sh: "bash", bash: "bash", zsh: "bash",
-    sql: "sql", c: "c", cpp: "cpp", h: "c", hpp: "cpp",
-    cs: "csharp", swift: "swift", kt: "kotlin", vue: "xml", svelte: "xml"
-  };
-  return map[ext] || null;
-}
-
-function currentLang() {
-  if (!currentFilePath) return null;
-  var ext = currentFilePath.split(".").pop().toLowerCase();
-  return mapExtToLanguage(ext);
-}
-
-function renderCodeWithLineNumbers(bodyEl, content, ext) {
-  var lang = mapExtToLanguage(ext);
-  var lines = content.split("\n");
-  var lineCount = lines.length;
-
-  var viewer = document.createElement("div");
-  viewer.className = "file-viewer-code";
-
-  var gutter = document.createElement("pre");
-  gutter.className = "file-viewer-gutter";
-  var nums = [];
-  for (var i = 1; i <= lineCount; i++) nums.push(i);
-  gutter.textContent = nums.join("\n");
-
-  var codeWrap = document.createElement("pre");
-  codeWrap.className = "file-viewer-code-content";
-  var codeEl = document.createElement("code");
-  if (lang) codeEl.className = "language-" + lang;
-  codeEl.textContent = content;
-  codeWrap.appendChild(codeEl);
-
-  viewer.appendChild(gutter);
-  viewer.appendChild(codeWrap);
-
-  bodyEl.innerHTML = "";
-  bodyEl.appendChild(viewer);
-
-  if (typeof hljs !== "undefined" && lang) {
-    hljs.highlightElement(codeEl);
-  }
-}
-
-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";
-  return (bytes / 1048576).toFixed(1) + " MB";
-}
+function currentLang() { return currentFilePath ? mapExtToLanguage(currentFilePath.split('.').pop().toLowerCase()) : null; }
 
 // --- File edit history ---
 
@@ -1639,6 +1597,7 @@ function requestGitDiff(hash, hash2) {
 }
 
 export function handleFileHistory(msg) {
+  if (routeFilePaneMessage(msg)) return;
   currentHistoryEntries = msg.entries || [];
   var historyBtn = document.getElementById("file-viewer-history");
 
@@ -1655,6 +1614,7 @@ export function handleFileHistory(msg) {
 }
 
 export function handleGitDiff(msg) {
+  if (routeFilePaneMessage(msg)) return;
   if (msg.hash && msg.diff !== undefined) {
     var key = msg.hash2 ? msg.hash + ".." + msg.hash2 : msg.hash;
     gitDiffCache[key] = msg.diff;
@@ -1673,6 +1633,7 @@ function requestFileAt(hash) {
 }
 
 export function handleFileAt(msg) {
+  if (routeFilePaneMessage(msg)) return;
   if (msg.hash && msg.content !== undefined) {
     fileAtCache[msg.hash] = msg.content;
   }
@@ -2370,7 +2331,7 @@ function renderViewFileContent(entry, content) {
   bodyEl.appendChild(codeContainer);
 }
 
-function navigateToEdit(edit) {
+export function navigateToEdit(edit) {
   // If already in the same session, scroll directly without replaying history
   if (ctx.activeSessionId === edit.sessionLocalId) {
     scrollToToolElement(edit.toolId, edit.assistantUuid);

package/lib/public/modules/git-panel.js

@@ -1,3 +1,4 @@
+import { fileEntryContext } from './file-pane-entrypoints.js';
 import { currentGithubWorkMarkup, refreshGithubWork, resetGithubWork } from './session-github.js';
 import { store } from './store.js';
 import { refreshIcons, iconHtml } from './icons.js';
@@ -332,7 +333,9 @@ function runAction(action, paths) {
 }
 
 function openFileDiff(filePath, reviewIndex) {
+  var receipt = fileEntryContext();
   requestJson(apiPath("file-diff?path=" + encodeURIComponent(filePath)), { cache: "no-store" }).then(function (result) {
+    if (receipt !== fileEntryContext()) return;
     var paths = currentStatus ? currentStatus.files.map(function (file) { return file.path; }) : [filePath];
     var index = typeof reviewIndex === "number" ? reviewIndex : paths.indexOf(filePath);
     if (index < 0) index = 0;
@@ -350,8 +353,10 @@ function openFileDiff(filePath, reviewIndex) {
 }
 
 function openSessionDiff(sessionKey, filePath) {
+  var receipt = fileEntryContext();
   var url = apiPath("session-diff?session=" + encodeURIComponent(sessionKey) + "&path=" + encodeURIComponent(filePath));
   requestJson(url, { cache: "no-store" }).then(function (result) {
+    if (receipt !== fileEntryContext()) return;
     openWorkingTreeDiff(result);
     showToast("Compared with start of " + (result.sessionTitle || "session"));
   }).catch(function (err) {

package/lib/public/modules/issues.js

@@ -2,7 +2,7 @@ import { openLinear, initLinearPanel } from './linear-panel.js';
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
 import { showToast } from './utils.js';
-import { claimRightWorkbench, registerRightWorkbench, releaseRightWorkbench } from './right-workbench.js';
+import { handlesWorkbenchKey, claimRightWorkbench, registerRightWorkbench, releaseRightWorkbench } from './right-workbench.js';
 import { refreshIcons } from './icons.js';
 import { enhanceClayLogLinks } from './clay-log-links.js';
 import { updateIssueLink } from './clay-issue-links.js';
@@ -169,7 +169,7 @@ export function initIssues() {
   registerRightWorkbench("issues", closeIssues);
   var el = document.createElement('section');
   el.id = 'issues-panel'; el.className = 'hidden'; el.setAttribute('aria-label', 'Project Issues');
-  el.innerHTML = '<header class="issues-topbar"><button class="issues-icon-btn" data-issues-back aria-label="Back to issues" title="Back to issue list"><i data-lucide="arrow-left"></i></button><span class="issues-title"><i data-lucide="circle-dot"></i>Issues</span><span class="issues-subtitle">Manage issues through Driver chat.</span><button type="button" class="issues-icon-btn" data-open-linear>Linear</button><div class="issues-window-actions"><button class="issues-icon-btn" data-issues-wide aria-label="Widen Issues" title="Widen Issues" aria-pressed="false"><i data-lucide="chevrons-left-right"></i></button><button class="issues-icon-btn" data-issues-full aria-label="Toggle Issues fullscreen" title="Toggle fullscreen" aria-pressed="false"><i data-lucide="maximize-2"></i></button><button class="issues-icon-btn" data-issues-close aria-label="Close Issues" title="Close Issues"><i data-lucide="x"></i></button></div></header><div class="issues-filters"><label class="issues-search"><i data-lucide="search"></i><input name="query" type="search" placeholder="Search issues" aria-label="Search issues"></label><select name="filter-status" aria-label="Filter status"><option value="">All statuses</option><option value="open">Open</option><option value="in_progress">In progress</option><option value="resolved">Resolved</option><option value="closed">Closed</option></select><select name="filter-type" aria-label="Filter type"><option value="">All types</option><option value="bug">Bug</option><option value="feature">Feature</option><option value="plan">Plan</option></select></div><p class="issues-notice" role="status"></p><main class="issues-content" role="region" aria-live="polite"></main><div class="issues-delete-dialog hidden" role="dialog" aria-modal="true" aria-labelledby="issues-delete-heading"><div class="issues-delete-card"><h2 id="issues-delete-heading">Delete this issue?</h2><p>This removes the issue from the board but preserves its history.</p><p class="issues-delete-title"></p><p class="issues-delete-status" role="status"></p><div><button type="button" data-issue-delete-cancel>Cancel</button><button type="button" data-issue-delete-confirm>Delete issue</button></div></div></div>';
+  el.innerHTML = '<header class="issues-topbar"><button class="issues-icon-btn" data-issues-back aria-label="Back to issues" title="Back to issue list"><i data-lucide="arrow-left"></i></button><span class="issues-title"><i data-lucide="circle-dot"></i>Issues</span><span class="issues-subtitle">Manage issues through Driver chat.</span><div class="issues-window-actions"><button class="issues-icon-btn" data-issues-wide aria-label="Widen Issues" title="Widen Issues" aria-pressed="false"><i data-lucide="chevrons-left-right"></i></button><button class="issues-icon-btn" data-issues-full aria-label="Toggle Issues fullscreen" title="Toggle fullscreen" aria-pressed="false"><i data-lucide="maximize-2"></i></button><button class="issues-icon-btn" data-issues-close aria-label="Close Issues" title="Close Issues"><i data-lucide="x"></i></button></div></header><div class="issues-filters"><label class="issues-search"><i data-lucide="search"></i><input name="query" type="search" placeholder="Search issues" aria-label="Search issues"></label><select name="filter-status" aria-label="Filter status"><option value="">All statuses</option><option value="open">Open</option><option value="in_progress">In progress</option><option value="resolved">Resolved</option><option value="closed">Closed</option></select><select name="filter-type" aria-label="Filter type"><option value="">All types</option><option value="bug">Bug</option><option value="feature">Feature</option><option value="plan">Plan</option></select><button type="button" class="issues-linear-link" data-open-linear title="Open Linear" aria-label="Open Linear">Linear<i data-lucide="chevron-right"></i></button></div><p class="issues-notice" role="status"></p><main class="issues-content" role="region" aria-live="polite"></main><div class="issues-delete-dialog hidden" role="dialog" aria-modal="true" aria-labelledby="issues-delete-heading"><div class="issues-delete-card"><h2 id="issues-delete-heading">Delete this issue?</h2><p>This removes the issue from the board but preserves its history.</p><p class="issues-delete-title"></p><p class="issues-delete-status" role="status"></p><div><button type="button" data-issue-delete-cancel>Cancel</button><button type="button" data-issue-delete-confirm>Delete issue</button></div></div></div>';
   host.appendChild(el);
   el.querySelector('[data-open-linear]').addEventListener('click', function () { openLinear(); });
   el.addEventListener('input', handleIssueGithubInput);
@@ -226,9 +226,8 @@ export function initIssues() {
   });
   store.subscribe(function (state, previous) {
     if (state.currentSlug !== previous.currentSlug || (previous.connected && !state.connected)) { closeIssues(); store.set({ issuesRequests: {}, issuesSelected: null, issuesCache: {}, issuesMutationRequest: null }); }
-    if (state.issuesOpen && (state.projectLogsOpen || state.scheduledTasksOpen)) closeIssues();
   });
-  document.addEventListener('keydown', function (event) { if (store.get('issuesOpen')) { deleteDialogKeydown(event); if (!event.defaultPrevented && event.key === 'Escape') closeIssues(); } });
+  document.addEventListener('keydown', function (event) { if (store.get('issuesOpen') && handlesWorkbenchKey('issues', event)) { deleteDialogKeydown(event); if (!event.defaultPrevented && event.key === 'Escape') closeIssues(); } });
 }
 function showIssueEdit(entry) {
   if (!entry) return;

package/lib/public/modules/linear-panel.js

@@ -4,7 +4,7 @@ import { escapeHtml } from './utils.js';
 import { renderMarkdown } from './markdown.js';
 import { refreshIcons } from './icons.js';
 import { linearIconMarkup } from './session-github.js';
-import { claimRightWorkbench, registerRightWorkbench, releaseRightWorkbench } from './right-workbench.js';
+import { handlesWorkbenchKey, claimRightWorkbench, registerRightWorkbench, releaseRightWorkbench } from './right-workbench.js';
 
 function esc(value) { return escapeHtml(String(value || '')).replace(/"/g, '"').replace(/'/g, '''); }
 function panel() { return document.getElementById('linear-panel'); }
@@ -145,7 +145,7 @@ export function initLinearPanel() {
     else if (issue && button.hasAttribute('data-linear-start')) { button.disabled = true; request('linear_start_work', { url: issue.url }); }
     else if (issue && button.hasAttribute('data-linear-more')) { button.disabled = true; request('linear_read', { url: issue.url, cursor: issue.pageInfo.endCursor }); }
   });
-  document.addEventListener('keydown', function (event) { if (event.key === 'Escape' && store.get('linearOpen')) closeLinear(); });
+  document.addEventListener('keydown', function (event) { if (event.key === 'Escape' && store.get('linearOpen') && handlesWorkbenchKey('linear', event)) closeLinear(); });
   store.subscribe(function (state, previous) {
     if (state.currentSlug !== previous.currentSlug || state.myUserId !== previous.myUserId || state.dmMode !== previous.dmMode || (previous.connected && !state.connected)) closeLinear();
     else if (state.linearOpen && (state.githubWorkSessions !== previous.githubWorkSessions || state.activeSessionId !== previous.activeSessionId) && state.linearIssue) renderIssue();

package/lib/public/modules/mate-knowledge-workbench.js

@@ -103,7 +103,7 @@ function bindPanel() {
   panel.querySelector('[data-knowledge-forward]').addEventListener('click', function () { navigateHistory('forward'); });
   panel.querySelector('.knowledge-search input').addEventListener('input', scheduleSearch);
   panel.querySelector('[data-knowledge-wide]').addEventListener('click', function () { var key = workspaceKey(); patchState(key, { wide: !stateFor(key).wide }); renderShell(); });
-  panel.querySelector('[data-knowledge-full]').addEventListener('click', exitEditor);
+  panel.querySelector('[data-knowledge-full]').addEventListener('click', togglePaneExpansion);
   panel.querySelector('[data-delete-cancel]').addEventListener('click', closeDelete);
   panel.querySelector('[data-delete-confirm]').addEventListener('click', confirmDelete);
   panel.addEventListener('click', handlePanelClick);
@@ -326,10 +326,14 @@ function retrySync() {
   simpleRequest('knowledge_sync', { names: retry.names }, { syncRetry: retry });
 }
 
+function togglePaneExpansion() { var key = workspaceKey(), state = stateFor(key);
+  if (state.fullscreen) { patchState(key, { paneExpanded: false }); exitEditor(); return; }
+  patchState(key, { paneExpanded: !state.paneExpanded }); renderShell();
+}
 function renderShell() {
-  var state = stateFor(workspaceKey()); panel.classList.toggle('knowledge-wide', state.wide); panel.classList.toggle('panel-fullscreen', state.fullscreen);
-  panel.querySelector('[data-knowledge-wide]').setAttribute('aria-pressed', String(state.wide)); panel.querySelector('[data-knowledge-full]').setAttribute('aria-pressed', String(state.fullscreen));
-  panel.querySelector('[data-knowledge-full]').hidden = !state.fullscreen; panel.querySelector('[data-knowledge-wide]').hidden = state.fullscreen;
+  var state = stateFor(workspaceKey()); panel.classList.toggle('knowledge-wide', state.wide); panel.classList.toggle('panel-fullscreen', !!(state.fullscreen || state.paneExpanded));
+  panel.querySelector('[data-knowledge-wide]').setAttribute('aria-pressed', String(state.wide)); panel.querySelector('[data-knowledge-full]').setAttribute('aria-pressed', String(!!(state.fullscreen || state.paneExpanded)));
+  panel.querySelector('[data-knowledge-full]').hidden = false; panel.querySelector('[data-knowledge-wide]').hidden = state.fullscreen;
   panel.querySelector('[data-knowledge-back]').disabled = !(state.navigationBack || []).length; panel.querySelector('[data-knowledge-forward]').disabled = !(state.navigationForward || []).length;
 }
 function renderStatus() {
@@ -433,12 +437,12 @@ export function openKnowledgeWorkbench() {
   ensurePanel(); if (!panel || !isMateWorkspace(store.snap())) return; returnFocus = document.activeElement;
   claimRightWorkbench('mate-knowledge'); panel.classList.remove('hidden'); setKnowledgeNarrowBackground(panel, true); var button = document.getElementById('knowledge-workbench-btn'); if (button) button.classList.add('active');
   var key = workspaceKey(); var state = stateFor(key); var drafts = Object.assign({}, state.drafts); if (state.selected && drafts[state.selected]) drafts[state.selected] = Object.assign({}, drafts[state.selected], { mode: 'read' });
-  setState(key, Object.assign({}, state, { drafts: drafts, fullscreen: false, loading: true, error: '' })); simpleRequest('knowledge_list'); if (stateFor(key).query.trim()) { patchState(key, { searching: true }); requestSearch(key, stateFor(key).query, 0, false); } render(); setTimeout(function () { var search = panel.querySelector('.knowledge-search input'); if (search) search.focus(); }, 0);
+  setState(key, Object.assign({}, state, { drafts: drafts, fullscreen: false, paneExpanded: false, loading: true, error: '' })); simpleRequest('knowledge_list'); if (stateFor(key).query.trim()) { patchState(key, { searching: true }); requestSearch(key, stateFor(key).query, 0, false); } render(); setTimeout(function () { var search = panel.querySelector('.knowledge-search input'); if (search) search.focus(); }, 0);
 }
 export function closeKnowledgeWorkbench(skipSave) {
   if (!panel) return; var active = document.activeElement; var shouldReturn = skipSave !== true && (!active || active === document.body || panel.contains(active));
   var key = workspaceKey(); cancelScheduledSearch(); if (deleteTarget) closeDelete(); if (skipSave !== true) { saveScroll(); var selected = stateFor(key).selected; if (selected) saveDraftNow(key, selected); }
-  patchState(key, { fullscreen: false }); destroyKnowledgeEditor(); panel.classList.add('hidden'); setKnowledgeNarrowBackground(panel, false); releaseRightWorkbench('mate-knowledge');
+  patchState(key, { fullscreen: false, paneExpanded: false }); destroyKnowledgeEditor(); panel.classList.add('hidden'); setKnowledgeNarrowBackground(panel, false); releaseRightWorkbench('mate-knowledge');
   var button = document.getElementById('knowledge-workbench-btn'); if (button) button.classList.remove('active'); if (shouldReturn && returnFocus && returnFocus.isConnected) returnFocus.focus(); returnFocus = null;
 }
 export function initMateKnowledgeWorkbench() {

package/lib/public/modules/notifications.js

@@ -1,3 +1,4 @@
+import { store } from './store.js';
 import { initNotificationSettings, saveNotificationPreference, updatePushSettings } from './notification-settings.js';
 import { initExtensionSettings } from './extension-settings.js';
 import { copyToClipboard, showToast } from './utils.js';
@@ -71,7 +72,9 @@ export function initNotifications(_ctx) {
   var $ = ctx.$;
 
   // --- Mobile viewport (iOS keyboard handling) ---
-  if (window.visualViewport) {
+  // Embedded panes follow the host viewport. Their layout resize is not a
+  // software keyboard opening and must not force the transcript to its tail.
+  if (window.visualViewport && !store.get('paneMode')) {
     var layout = $("layout");
     var mobileTabBar = document.getElementById("mobile-tab-bar");
     var keyboardWasOpen = false;

package/lib/public/modules/pane-activation.js

@@ -1,4 +1,5 @@
 import { paneHeaderRuntime, initPaneHeaderRuntime } from './pane-header-runtime.js';
+import { sendBoundBrowserCommand } from './pane-browser-transport.js';
 import { disarmStickyBottom } from './chat-render-runtime.js';
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
@@ -206,6 +207,7 @@ export function initPaneActivation() {
         binding: binding, ready: store.get('connected') && store.get('paneReady') && !store.get('paneSuspended') };
     },
     headerRuntime: paneHeaderRuntime,
+    browserCommand: sendBoundBrowserCommand,
     activate: activatePaneSession,
     checkDraft: function () { if (!store.get('panePendingBinding')) { var draft = takeComposerDraft(); restoreComposerDraft(draft); } },
     suspend: suspendPane,

package/lib/public/modules/pane-binding.js

@@ -63,7 +63,11 @@ export function livePaneBinding(frame, message) {
   var target = live && paneTarget(state, state.paneBindingSessions || [], live.sessionId);
   var inLegacySplit = !!(live && split && split.panes.some(function (pane) { return pane.slug === live.projectSlug && pane.sessionId === live.sessionId; }));
   var activePresentation = (state.projectSplitViews || []).find(function (view) { return view.id === state.projectSplitViewActiveId; });
-  var inPresentation = !!(live && live.binding && !split && activePresentation && activePresentation.sessions.some(function (session) {
+  var pair = activePresentation && activePresentation.workspace && activePresentation.workspace.linkedPair;
+  var linkedPresentation = !!(split && pair && split.groupId === pair.groupId && (state.splitGroups || []).some(function (group) {
+    return group.id === pair.groupId && group.pair && (state.paneBindingSessions || []).some(function (session) { return session.id === group.pair.driverId && session.sessionOriginId === pair.driverOriginId; });
+  }));
+  var inPresentation = !!(live && live.binding && (!split || linkedPresentation) && activePresentation && activePresentation.sessions.some(function (session) {
     return session.id === live.sessionId && session.sessionOriginId === live.binding.sessionOriginId;
   }));
   var inSingletonPresentation = !!(live && live.binding && !split && !activePresentation &&

package/lib/public/modules/pane-browser-bridge.js

@@ -1,4 +1,5 @@
 import { store } from './store.js';
+import { selectBrowserPane } from './pane-browser-transport.js';
 import { livePaneBinding, paneMessageBinding } from './pane-binding.js';
 import { showToast } from './utils.js';
 
@@ -15,7 +16,7 @@ export function handlePaneBrowserMessage(event, host) {
   if (!s.connected || !pane || msg.projectSlug !== s.currentSlug || msg.projectSlug !== frame.dataset.projectSlug || String(msg.sessionId) !== frame.dataset.sessionId) return true;
   var expected = new URL('/p/' + encodeURIComponent(pane.slug) + '/?pane=1&session=' + encodeURIComponent(pane.sessionId), window.location.href).href;
   if (frame.clayPane ? !livePaneBinding(frame, msg) : frame.src !== expected) return true;
-  // The authenticated host owns the browser; a live same-project pane supplies only a URL.
+  // Present in the host while browser effects retain the exact source pane binding.
   var binding = frame.clayPane && frame.clayPane.identity().binding, document = frame.contentDocument;
   function current() {
     var now = store.snap();
@@ -27,6 +28,9 @@ export function handlePaneBrowserMessage(event, host) {
     if (binding) return !!frame.clayPane && livePaneBinding(frame, msg) && frame.clayPane.identity().binding === binding;
     return frame.src === expected && !!(now.splitPanes && now.splitPanes.panes.some(function (item) { return String(item.slug) === pane.slug && String(item.sessionId) === String(pane.sessionId); }));
   }
-  import('./shared-browser.js').then(function (module) { if (current()) module.openSharedBrowserAt(msg.url); }).catch(function (error) { showToast(error.message || 'Could not open the browser.', 'warn'); });
+  import('./shared-browser.js').then(function (module) {
+    if (!current() || binding && !selectBrowserPane(frame, binding)) return;
+    module.openSharedBrowserAt(msg.url);
+  }).catch(function (error) { showToast(error.message || 'Could not open the browser.', 'warn'); });
   return true;
 }