clay-server 5.5.0-beta.4 → 5.5.0-beta.5

package/lib/public/modules/split-pane-renderer.js

@@ -225,7 +225,6 @@ export function handlePaneSearchMessage(event, host) {
   }
   return false;
 }
-
 function startPaneRename(header, titleEl, pane) {
   if (header.querySelector(".split-pane-rename-input")) return;
   var section = header.parentNode, frame = section.querySelector('.split-pane-frame');
@@ -234,7 +233,7 @@ function startPaneRename(header, titleEl, pane) {
       initial.binding.sessionOriginId !== frame.dataset.sessionOriginId) return;
   var input = document.createElement("input");
   input.type = "text"; input.className = "split-pane-rename-input"; input.value = pane.title;
-  titleEl.style.display = "none"; header.insertBefore(input, titleEl); input.focus(); input.select();
+  titleEl.style.display = "none"; titleEl.parentNode.insertBefore(input, titleEl); input.focus(); input.select();
   var done = false;
   var origin = frame.dataset.sessionOriginId, binding = initial.binding, socket = getWs();
   function current() {
@@ -293,8 +292,9 @@ export function createSplitPane(pane, closePane) {
   var session = sessionById(pane.sessionId); var vendor = session && session.vendor || "unknown";
   var vendorIcon = document.createElement("img"); vendorIcon.className = "split-pane-vendor"; vendorIcon.hidden = !VENDOR_AVATARS[vendor];
   if (!vendorIcon.hidden) vendorIcon.src = VENDOR_AVATARS[vendor]; vendorIcon.alt = ""; vendorIcon.title = VENDOR_NAMES[vendor] || vendor; header.appendChild(vendorIcon);
+  var identity = document.createElement("span"); identity.className = "split-pane-identity"; header.appendChild(identity);
   var title = document.createElement("span"); title.className = "split-pane-title"; title.textContent = pane.title; title.title = "Rename session";
-  title.addEventListener("click", function () { if (title.getAttribute('aria-disabled') === 'true' || !syncPaneHeaderState(paneEl)) return; var current = sessionById(Number(paneEl.dataset.sessionId)); if (current) startPaneRename(header, title, { sessionId: current.id, title: current.title }); }); header.appendChild(title);
+  title.addEventListener("click", function () { if (title.getAttribute('aria-disabled') === 'true' || !syncPaneHeaderState(paneEl)) return; var current = sessionById(Number(paneEl.dataset.sessionId)); if (current) startPaneRename(header, title, { sessionId: current.id, title: current.title }); }); identity.appendChild(title);
   var dragSpace = document.createElement("span"); dragSpace.className = "split-pane-drag-space"; dragSpace.title = "Drag to rearrange panes"; dragSpace.setAttribute("aria-hidden", "true"); header.appendChild(dragSpace);
   var frame = document.createElement("iframe"); frame.className = "split-pane-frame"; frame.dataset.projectSlug = pane.slug;
   frame.dataset.sessionId = String(pane.sessionId); frame.src = paneUrl(pane); frame.title = pane.title;
@@ -323,7 +323,7 @@ export function createSplitPane(pane, closePane) {
   }
   close.dataset.sessionId = String(pane.sessionId); close.addEventListener("click", function () { if (syncPaneHeaderState(paneEl)) closePane(Number(this.dataset.sessionId)); }); header.appendChild(close);
   var info = document.createElement("button"); info.type = "button"; info.className = "split-pane-info"; info.setAttribute("aria-label", "Session information"); info.title = "Session information"; info.innerHTML = iconHtml("info");
-  info.addEventListener("click", function (event) { event.stopPropagation(); if (syncPaneHeaderState(paneEl)) togglePaneInfo(info, frame); }); header.appendChild(info);
+  info.addEventListener("click", function (event) { event.stopPropagation(); if (syncPaneHeaderState(paneEl)) togglePaneInfo(info, frame); }); identity.insertBefore(info, title.nextSibling);
   var sidebarButton = document.createElement("button"); sidebarButton.type = "button"; sidebarButton.className = "split-pane-sidebar";
   var sidebarExpanded = !document.getElementById("layout").classList.contains("sidebar-collapsed");
   sidebarButton.setAttribute("aria-label", sidebarExpanded ? "Collapse sidebar" : "Open sidebar");
@@ -378,7 +378,7 @@ export function createSplitPane(pane, closePane) {
   var runtime = document.createElement("div"); runtime.className = "split-view-runtime";
   vendorIcon.classList.add("split-view-runtime-icon"); runtime.appendChild(vendorIcon);
   var runtimeModel = document.createElement("span"); runtimeModel.className = "split-view-model"; runtime.appendChild(runtimeModel);
-  header.insertBefore(runtime, title); header.appendChild(close); paneEl.appendChild(frame);
+  header.insertBefore(runtime, identity); header.appendChild(close); paneEl.appendChild(frame);
   syncPaneHeaderState(paneEl);
   return paneEl;
 }

package/lib/public/modules/split-view-shell-controls.js

@@ -1,21 +1,23 @@
 import { toggleSidebarCollapse } from './sidebar.js';
 
-export function syncSidebarReopenButton(button, active) {
+export function syncSidebarReopenButton(button) {
   if (!button) return;
   var layout = document.getElementById("layout");
   var desktop = !window.matchMedia || window.matchMedia("(min-width: 769px)").matches;
-  button.hidden = !layout || !desktop || !active || !layout.classList.contains("sidebar-collapsed");
+  button.hidden = !layout || !desktop || !layout.classList.contains("sidebar-collapsed");
 }
 
 export function createSidebarReopenButton() {
-  var target = document.querySelector("#top-bar .top-bar-left-pills");
+  var target = document.getElementById("icon-strip");
   if (!target) return null;
+  var existing = document.getElementById("sidebar-shell-expand-btn");
+  if (existing) return existing;
   var button = document.createElement("button");
   button.id = "sidebar-shell-expand-btn";
   button.type = "button";
   button.title = "Open sidebar";
   button.setAttribute("aria-label", "Open sidebar");
-  button.setAttribute("aria-controls", "sidebar-column");
+  button.setAttribute("aria-controls", "sidebar-column mate-sidebar-column");
   button.setAttribute("aria-expanded", "false");
   button.innerHTML = '<i data-lucide="panel-left-open"></i>';
   button.hidden = true;
@@ -23,6 +25,8 @@ export function createSidebarReopenButton() {
     if (button.hidden) return;
     toggleSidebarCollapse();
   });
-  target.prepend(button);
+  var hint = document.getElementById("icon-strip-hint-project");
+  hint.parentNode.insertBefore(button, hint);
+  syncSidebarReopenButton(button);
   return button;
 }

package/lib/public/modules/split-view.js

@@ -200,7 +200,7 @@ function renderSplit(split) {
   else clearRetainedPanes(host);
   var panes = split && split.panes;
   if (!panes || panes.length < 2) {
-    if (shellSidebarExpand) shellSidebarExpand.hidden = true;
+    syncSidebarReopenButton(shellSidebarExpand);
     placeStickyNotesOverlay(false);
     var frames = host.querySelectorAll('.split-pane-frame');
     var retain = frames.length > 0 && frames.length <= 3 && Array.from(frames).every(function (frame) { return frame.dataset.projectSlug === store.get('currentSlug') && frame.clayPane; });
@@ -212,7 +212,7 @@ function renderSplit(split) {
     nativeApp.classList.remove("split-native-hidden");
     return;
   }
-  if (shellSidebarExpand) shellSidebarExpand.hidden = !document.getElementById("layout").classList.contains("sidebar-collapsed");
+  syncSidebarReopenButton(shellSidebarExpand);
   placeStickyNotesOverlay(true);
   nativeApp.classList.add("split-native-hidden");
   host.classList.add("visible");

package/lib/public/modules/theme.js

@@ -1,4 +1,5 @@
 import { store } from './store.js';
+import { appearanceStatus, queueAppearanceSave, initWorkspaceBackground, effectiveAppearance, workspaceBackgrounds } from './appearance-preferences.js';
 import { refreshIcons } from './icons.js';
 import { setTerminalTheme } from './terminal.js';
 import { setTuiSessionTheme } from './session-tui-view.js';
@@ -120,10 +121,10 @@ export function onThemeChange(fn) {
 // The appearance this frame currently shows, for the parent shell to hand to
 // its pane iframes. Never persisted from here.
 export function getAppearanceSnapshot() {
-  var pref = store.get('appearanceDraft') || store.get('appearancePreference') || {};
+  var pref = effectiveAppearance();
   return { themeId: currentThemeId, userId: store.get('myUserId') || null,
-    preference: { configured: !!pref.configured || !!pref.mode || !!pref.theme, theme: pref.theme || null, mode: pref.mode || null,
-      lightTheme: pref.lightTheme || null, darkTheme: pref.darkTheme || null } };
+    preference: { configured: !!pref.configured || !!pref.mode || !!pref.theme || !!pref.background, theme: pref.theme || null, mode: pref.mode || null,
+      lightTheme: pref.lightTheme || null, darkTheme: pref.darkTheme || null, background: pref.background === 'workshop' ? 'workshop' : 'plain', backgroundColor: workspaceBackgrounds.getColor(pref.backgroundColor, pref.customBackgroundColors).id, customBackgroundColors: pref.customBackgroundColors || [] } };
 }
 
 // A pane iframe mirrors the parent's live appearance. The server remains the
@@ -464,6 +465,7 @@ function rebuildPicker() {
 
 // --- Init ---
 export function initTheme() {
+  initWorkspaceBackground();
   var seed = window.__clayAppearanceSeed;
   if (seed && seed.configured) store.set({ appearancePreference: seed });
   var initialMode = seed && seed.configured && (seed.mode === 'light' || seed.mode === 'dark')
@@ -507,11 +509,6 @@ export function initTheme() {
 
 }
 
-function appearanceStatus(text, error) {
-  store.set({ appearanceSaveStatus: text, appearanceSaveError: !!error });
-  var status = document.getElementById('us-appearance-status');
-  if (status) { status.textContent = text; status.dataset.state = error ? 'error' : ''; }
-}
 export function getAppearanceChoices() {
   return { mode: (store.get('appearanceDraft') || store.get('appearancePreference') || {}).mode || 'system', lightTheme: themeIdForMode('light'), darkTheme: themeIdForMode('dark') };
 }
@@ -520,12 +517,14 @@ export function retryAppearanceSave() {
   if (draft) saveAppearance(draft.theme, draft.mode, draft);
 }
 export function selectAppearanceMode(mode) {
+  if ((store.get('appearanceColorEditor') || {}).saving) return;
   var effective = mode === 'system' ? getSystemMode() : mode;
   var id = themeIdForMode(effective);
   saveAppearance(id, mode === 'system' ? null : mode);
   applyTheme(id);
 }
 export function selectAppearanceTheme(mode, id) {
+  if ((store.get('appearanceColorEditor') || {}).saving) return;
   if (!getTheme(id) || getTheme(id).variant !== mode) return;
   var effective = getEffectiveMode();
   var current = store.get('appearanceDraft') || store.get('appearancePreference') || {};
@@ -536,34 +535,17 @@ export function selectAppearanceTheme(mode, id) {
 function saveAppearance(theme, mode, overrides) {
   var values = Object.assign({}, store.get('appearanceDraft') || store.get('appearancePreference') || {}, {theme:theme, mode:mode}, overrides || {});
   delete values.configured;
+  ['lightTheme', 'darkTheme'].forEach(function (key) { if (!values[key]) delete values[key]; });
   var selected = getTheme(theme);
   if (selected) values[selected.variant + 'Theme'] = theme;
-  store.set({appearanceDraft:values});
-  var queue = store.get('appearanceSaveQueue') || Promise.resolve();
-  var next = queue.catch(function () {}).then(function () {return persistAppearance(values);});
-  store.set({appearanceSaveQueue:next});
-  return next;
-}
-async function persistAppearance(values) {
-  var request = (store.get('appearanceSaveRequest') || 0) + 1;
-  store.set({ appearanceSaveRequest: request });
-  appearanceStatus('Saving appearance…');
-  try {
-    var response = await fetch('/api/user/appearance', {method:'PUT',headers:{'Content-Type':'application/json','X-Clay-Settings':'1'},body:JSON.stringify(values)});
-    if (!response.ok) throw new Error('Could not save appearance. Your preview remains. Retry to save it.');
-    if (store.get('appearanceSaveRequest') !== request) return;
-    var saved = await response.json();
-    store.set({ appearancePreference: saved, appearanceDraft: store.get('appearanceDraft') === values ? null : store.get('appearanceDraft') });
-    [STORAGE_KEY,SKIN_KEY,MODE_KEY,STORAGE_KEY+'-vars',STORAGE_KEY+'-variant'].forEach(function (key) {try {localStorage.removeItem(key);}catch(error){}});
-    appearanceStatus('Saved. Applied to this view; other devices use it when they reload.');
-  } catch(error) {if(store.get('appearanceSaveRequest') === request) appearanceStatus(error.message,true);}
+  return queueAppearanceSave(values);
 }
 async function loadAppearance() {
   try {
     var response = await fetch('/api/user/appearance');
     if (!response.ok) throw new Error('Appearance preferences unavailable.');
     var data = await response.json();
-    if(store.get('appearanceSaveRequest'))return;
+    if(store.get('appearanceDraft') || store.get('appearanceSaveRequest'))return;
     // A pane that already mirrors its parent's live view is newer than this GET, which may predate a pending save.
     if(externalThemeId)return;
     if (data.configured) {store.set({appearancePreference:data});applyTheme(themeIdForMode(data.mode || getSystemMode()));}

package/lib/public/modules/tool-pane-chrome.js

@@ -1,3 +1,4 @@
+import { bindToolPaneMaterial } from './tool-pane-material.js';
 import { ensureWorkbenchWindowControls, syncWorkbenchWindowControls } from './workbench-window-controls.js';
 import { WORKBENCH_PANELS } from './workbench-panels.js';
 import { recordToolExpansion } from './view-presentation-state.js';
@@ -16,7 +17,7 @@ function titleFor(panel, name) {
   try { return browser && browser.url ? new URL(browser.url).hostname : 'Browser'; } catch (error) { return 'Browser'; }
 }
 export function renderToolPaneChrome(panel, name) {
-  if (panel.dataset.fileInstance) return;
+  if (panel.dataset.fileInstance) { bindToolPaneMaterial(panel, panel.querySelector(':scope > .tool-pane-header')); return; }
   if (WORKBENCH_PANELS[name]) { renderWorkbenchChrome(panel, name); return; }
   var definition = TOOL_PANES[name];
   if (!definition) return;
@@ -50,6 +51,7 @@ export function renderToolPaneChrome(panel, name) {
     if (title.textContent !== label) { title.textContent = label; title.title = label; }
   }
   update();
+  bindToolPaneMaterial(panel, header);
 }
 
 store.subscribe(function (state, previous) {
@@ -61,6 +63,7 @@ store.subscribe(function (state, previous) {
 function renderWorkbenchChrome(panel, name) {
   panel.classList.add('workbench-pane-shell');
   var header = panel.querySelector(':scope > header');
+  bindToolPaneMaterial(panel, header);
   if (!header || header.dataset.toolPane === name) return;
   header.dataset.toolPane = name;
   header.classList.add('tool-pane-header', 'split-pane-header');

package/lib/public/modules/tool-pane-material.js

@@ -0,0 +1,23 @@
+// Keep the content backing below the real header without moving content nodes
+// or giving filters to containers that own viewport-fixed controls.
+export function bindToolPaneMaterial(panel, header) {
+  if (!header || panel.classList.contains('tool-pane-material')) return;
+  function measure() {
+    if (!panel.isConnected || !header.getClientRects().length) return;
+    // Layout coordinates stay stable during the existing pane scale animation.
+    var bottom = header.offsetTop + header.offsetHeight;
+    var value = Math.max(0, bottom) + 'px';
+    if (panel.style.getPropertyValue('--tool-pane-body-top') !== value) panel.style.setProperty('--tool-pane-body-top', value);
+  }
+  measure();
+  panel.classList.add('tool-pane-material');
+  var observer = typeof ResizeObserver === 'function' ? new ResizeObserver(measure) : null;
+  if (observer) { observer.observe(header); observer.observe(panel); }
+  else window.addEventListener('resize', measure);
+  panel.addEventListener('clay-tool-pane-dispose', function () {
+    if (observer) observer.disconnect();
+    else window.removeEventListener('resize', measure);
+    panel.classList.remove('tool-pane-material');
+    panel.style.removeProperty('--tool-pane-body-top');
+  }, { once: true });
+}

package/lib/public/modules/tooltip.js

@@ -18,8 +18,8 @@ function initTooltips() {
   document.body.appendChild(tooltipEl);
 
   // Convert existing title attributes to data-tip in target areas
-  convertTitles();
   initPaneHeaderTooltips();
+  convertTitles();
 
   // Delegate hover events on document for [data-tip]
   document.addEventListener("mouseover", function (e) {
@@ -96,7 +96,7 @@ function cancelShow() {
 function showTooltipAt(target) {
   if (!tooltipEl || !target.isConnected || !target.getClientRects().length) return;
   // A message preview already describes this Worker/task tab.
-  if (target.getAttribute('aria-describedby') === 'agent-message-bubble' && document.getElementById('agent-message-bubble')) return;
+  if ((target.getAttribute('aria-describedby') || '').split(/\s+/).indexOf('agent-message-bubble') >= 0 && document.getElementById('agent-message-bubble')) return;
   // Suppress tooltip when an associated popover/picker is open
   var suppressSel = target.getAttribute("data-tip-suppress-when-open");
   if (suppressSel) {
@@ -171,7 +171,11 @@ function hideTooltip() {
   currentTarget = null;
 }
 
-function pruneTooltip() { if (currentTarget && (!currentTarget.isConnected || !currentTarget.getClientRects().length)) { cancelShow(); hideTooltip(); } }
+function pruneTooltip() {
+  if (!currentTarget) return;
+  if (!currentTarget.isConnected || !currentTarget.getClientRects().length) { cancelShow(); hideTooltip(); }
+  else if (!currentTarget.hasAttribute('data-tip-html') && tooltipEl.textContent !== currentTarget.getAttribute('data-tip')) showTooltipAt(currentTarget);
+}
 
 function dismissTooltip() { cancelShow(); hideTooltip(); }
 

package/lib/public/modules/tui-attention.js

@@ -1,3 +1,4 @@
+import { store } from './store.js';
 // tui-attention.js
 //
 // Modal that mounts a transient xterm attached to a Claude TUI session's
@@ -64,7 +65,7 @@ function teardownModalXterm() {
 
 function modalSend(msg) {
   if (!modalWs || modalWs.readyState !== 1) return;
-  try { modalWs.send(JSON.stringify(msg)); } catch (e) {}
+  try { if (store.get('tuiModalGithubAttachKey')) msg.githubAttachKey = store.get('tuiModalGithubAttachKey'); modalWs.send(JSON.stringify(msg)); } catch (e) {}
 }
 
 function fitModalXterm() {
@@ -143,6 +144,7 @@ export function openTuiModal(terminalId, sourceSlug, info) {
   modalTerminalId = terminalId;
   modalSourceSlug = sourceSlug;
   var infoObj = info || {};
+  store.set({tuiModalGithubAttachKey:infoObj.githubAttachKey || null,tuiModalProcessExited:false});
   modalCloseHook = typeof infoObj.onClose === "function" ? infoObj.onClose : null;
   setModalBreadcrumb({
     projectIcon: infoObj.projectIcon || null,
@@ -206,7 +208,8 @@ export function openTuiModal(terminalId, sourceSlug, info) {
     } else if (msg.type === "term_resized" && modalXterm && msg.cols > 0 && msg.rows > 0) {
       try { modalXterm.resize(msg.cols, msg.rows); } catch (err) {}
     } else if (msg.type === "term_exited" && modalXterm) {
-      try { modalXterm.write("\r\n\x1b[90m[claude exited]\x1b[0m\r\n"); } catch (err) {}
+      store.set({tuiModalProcessExited:true});
+      try { modalXterm.write("\r\n\x1b[90m[process exited]\x1b[0m\r\n"); } catch (err) {}
     } else if (msg.type === "term_closed") {
       closeTuiModal();
     }
@@ -237,16 +240,18 @@ export function openTuiModal(terminalId, sourceSlug, info) {
 
 export function closeTuiModal() {
   if (!modalEl) return;
+  var processExited = store.get('tuiModalProcessExited');
   var closeHook = modalCloseHook;
   modalCloseHook = null;
   if (modalTerminalId != null && modalWs && modalWs.readyState === 1) {
-    try { modalWs.send(JSON.stringify({ type: "term_detach", id: modalTerminalId })); } catch (e) {}
+    try { modalWs.send(JSON.stringify({ type: "term_detach", id: modalTerminalId, githubAttachKey: store.get('tuiModalGithubAttachKey') })); } catch (e) {}
   }
   if (modalWs) {
     try { modalWs.close(); } catch (e) {}
     modalWs = null;
   }
   modalTerminalId = null;
+  store.set({tuiModalGithubAttachKey:null,tuiModalProcessExited:false});
   modalSourceSlug = null;
   teardownModalXterm();
   modalEl.classList.add("hidden");
@@ -255,7 +260,7 @@ export function closeTuiModal() {
     modalKeyHandler = null;
   }
   if (closeHook) {
-    try { closeHook(); } catch (e) {}
+    try { closeHook({ exited: processExited }); } catch (e) {}
   }
 }
 

package/lib/public/modules/user-settings-account.js

@@ -1,3 +1,4 @@
+import { selectIntegrationEditor } from './personal-integration-editor.js';
 import { refreshIcons } from './icons.js';
 import { resetAccountSessions } from './user-settings-sessions.js';
 import { confirmSettingsAction as showConfirmDialog } from './server-settings-state.js';
@@ -283,6 +284,7 @@ export function renderEmailSettings() {
     var acc = accounts[i];
     var row = document.createElement('div');
     row.className = 'us-integration-email-row';
+    row.dataset.emailAccountId = acc.id;
     row.innerHTML =
       '<div class="us-voice-row-controls"><div class="us-integration-brand">' + providerIcon(acc.provider) + '</div>' +
       '<div class="us-voice-provider-copy"><strong>' + escHtml(acc.email) + '</strong><small>Email · ' + escHtml(({gmail:'Gmail',outlook:'Outlook Mail',yahoo:'Yahoo Mail',custom:'Custom email'})[acc.provider] || 'Custom email') + (acc.label ? ' · ' + escHtml(acc.label) : '') + '</small></div>' +
@@ -292,7 +294,10 @@ export function renderEmailSettings() {
     manageBtn.setAttribute('aria-label', 'Manage ' + acc.email);
     manageBtn.addEventListener('click', function () {
       var panel = this.closest('.us-integration-email-row').querySelector('.us-email-manage');
-      panel.hidden = !panel.hidden; this.setAttribute('aria-expanded', String(!panel.hidden));
+      var row = this.closest('.us-integration-email-row');
+      selectIntegrationEditor('email-manage:' + row.dataset.emailAccountId, '[data-email-account-id="' + CSS.escape(row.dataset.emailAccountId) + '"] .us-email-manage', function () {
+        panel.hidden = false; row.querySelector('[aria-expanded]').setAttribute('aria-expanded', 'true'); panel.querySelector('button').focus();
+      });
     });
     var removeBtn = row.querySelector('[data-account-id]');
     removeBtn.addEventListener('click', function () {
@@ -305,6 +310,10 @@ export function renderEmailSettings() {
     });
 
     listEl.appendChild(row);
+    var active = store.get('personalIntegrationEditor');
+    if (active && active.key === 'email-manage:' + acc.id) {
+      row.querySelector('.us-email-manage').hidden = false; manageBtn.setAttribute('aria-expanded','true');
+    }
   }
   refreshIcons();
 }

package/lib/public/modules/user-settings-github.js

@@ -0,0 +1,176 @@
+import { selectIntegrationEditor, clearIntegrationEditor } from './personal-integration-editor.js';
+import { showToast } from './utils.js';
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { githubMark } from './github-mark.js';
+import { confirmSettingsAction } from './server-settings-state.js';
+import { openTuiModal, closeTuiModal, getTuiModalTerminalId } from './tui-attention.js';
+function context() { return JSON.stringify([store.get('myUserId'),store.get('currentSlug'),store.get('projectSplitViewSocketGeneration')]); }
+function send(action) {
+  var ws = getWs();
+  if (!ws || ws.readyState !== 1 || !store.get('githubSettingsContextId')) return false;
+  var requestId = crypto.randomUUID(), data = store.get('githubSettingsData') || {};
+  ws.send(JSON.stringify({type:'personal_github_'+action,requestId:requestId,contextId:store.get('githubSettingsContextId'),reviewId:data.reviewId}));
+  if (action !== 'release' && action !== 'stop') {
+    store.set({githubSettingsRequest:requestId,githubSettingsPending:true,githubSettingsAction:action});
+    if (action === 'get') store.set({githubSettingsData:Object.assign({},data,{state:'checking',observed:null,reviewId:null})});
+    setTimeout(function () {
+      if (store.get('githubSettingsRequest') !== requestId || !store.get('githubSettingsPending')) return;
+      store.set({githubSettingsPending:false,githubSettingsData:Object.assign({},store.get('githubSettingsData'),{state:'unknown',reviewId:null,message:'The response is unknown. Stop any active login, then refresh. No action is retried automatically.'})}); render();
+    },20000);
+  }
+  return true;
+}
+function text(tag,value,cls) { var el=document.createElement(tag); el.textContent=value; if(cls) el.className=cls; return el; }
+function button(parent,label,action,disabled) {
+  var el=text('button',label,'settings-btn-sm');el.type='button';el.disabled=!!disabled;el.onclick=action;parent.appendChild(el);return el;
+}
+function open() { selectIntegrationEditor('github', '#us-github-editor', function () { loadGithubIntegration(); if (!store.get('githubSettingsPending')) send('get'); store.set({githubSettingsEditing:true});render();document.getElementById('us-github-editor').focus(); }); }
+function closeTerminal() {
+  var id=store.get('githubSettingsTerminal');store.set({githubSettingsTerminal:null});
+  if(id && getTuiModalTerminalId() === id) closeTuiModal();
+}
+export function closeGithubEditor() { store.set({githubSettingsEditing:false});clearIntegrationEditor('github');render(); }
+function close() { closeGithubEditor();var el=document.querySelector('#us-github-connections button') || document.getElementById('us-github-add');if(el)el.focus(); }
+function statusLabel(data) {
+  var saved=data.saved && data.saved.connection, observed=data.observed;
+  if (!saved) return '';
+  if (!observed || data.state === 'checking') return 'Saved · Verification pending';
+  if (observed.status !== 'authenticated') return 'Saved · '+(observed.status === 'unauthenticated' ? 'Sign-in required' : 'Verification unknown');
+  var sameRuntime=['user','uid','gid','home'].every(function(key){return saved.runtime[key]===data.runtime[key];});
+  if(saved.account.id !== observed.account.id || saved.account.login !== observed.account.login || !sameRuntime)return 'Saved · Account or runtime changed';
+  return 'Verified '+new Date(observed.checkedAt).toLocaleString();
+}
+function render() {
+  var editor = document.getElementById('us-github-editor');
+  var focused = editor && editor.contains(document.activeElement);
+  renderEditor();
+  if (focused && editor && !editor.hidden && !editor.contains(document.activeElement)) editor.focus();
+}
+function renderEditor() {
+  var root=document.getElementById('us-github-connections'), add=document.getElementById('us-github-add'), editor=document.getElementById('us-github-editor');
+  if(!root || !add || !editor)return;
+  var data=store.get('githubSettingsData') || {}, saved=data.saved && data.saved.connection, observed=data.observed, pending=store.get('githubSettingsPending');
+  add.hidden=!!saved;
+  if(saved){
+    var row=root.firstElementChild;
+    if(!row){
+      row=text('div','','us-voice-row');row.dataset.connectionId='github';var controls=text('div','','us-voice-row-controls');
+      var brand=text('span','','us-integration-brand');brand.innerHTML=githubMark();var copy=text('div','','us-voice-provider-copy');
+      copy.append(text('strong',''),text('small',''));controls.append(brand,copy,text('span','','us-integration-state'));
+      var manage=button(controls,'Manage',open);manage.setAttribute('aria-controls','us-github-editor');
+      row.appendChild(controls);root.appendChild(row);
+    }
+    row.querySelector('strong').textContent=saved.account.login;
+    row.querySelector('small').textContent='GitHub · '+saved.account.host+' · ID '+saved.account.id;
+    row.querySelector('.us-integration-state').textContent=statusLabel(data);
+    row.querySelector('button').setAttribute('aria-expanded',String(!!store.get('githubSettingsEditing')));
+    if(store.get('githubSettingsEditing') && editor.parentElement!==row)row.appendChild(editor);
+  } else {
+    var setup=document.getElementById('us-integration-setup');if(editor.parentElement!==setup)setup.appendChild(editor);
+    root.replaceChildren();
+  }
+  editor.hidden=!store.get('githubSettingsEditing'); editor.replaceChildren();
+  if(editor.hidden)return;
+  editor.appendChild(text('h3',saved?'Manage GitHub':'Connect GitHub'));
+  if(data.runtime){
+    editor.appendChild(text('p',data.runtime.shared?'This server OS account shares GitHub CLI credentials across Clay Studio accounts and other processes.':'GitHub CLI runs as your mapped OS account.','settings-hint'));
+    var details=text('details'), summary=text('summary','Runtime account');details.append(summary,text('p','OS account '+data.runtime.user+' · UID '+data.runtime.uid+' / GID '+data.runtime.gid+' · HOME '+data.runtime.home,'settings-hint'));editor.appendChild(details);
+  }
+  if(observed){
+    var labels={missing:'GitHub CLI is not installed for this runtime. Ask the server operator to install gh, then refresh.',unknown:'Authentication could not be verified. Check the network and server setup, then refresh.',unauthenticated:'GitHub CLI is not authenticated for github.com.'};
+    editor.appendChild(text('p',observed.account?'Current CLI account: '+observed.account.login+' · ID '+observed.account.id+' · '+observed.account.host:labels[observed.status] || 'Verification pending.','settings-hint'));
+    if(observed.overridden)editor.appendChild(text('p','GH_TOKEN or GITHUB_TOKEN controls the effective CLI account. Browser sign-in cannot change this override. Ask the server operator to update the environment.','settings-hint'));
+  }
+  if(saved)editor.appendChild(text('p','Saved account: '+saved.account.login+' · ID '+saved.account.id+' · '+saved.account.host+'. Connected '+new Date(saved.connectedAt).toLocaleString()+'.','settings-hint'));
+  var help=text('a','Official GitHub CLI setup and authentication','settings-link');help.href='https://cli.github.com/manual/gh_auth_login';help.target='_blank';help.rel='noopener noreferrer';editor.appendChild(help);
+  if(data.state === 'started' || data.state === 'stopping' || store.get('githubSettingsTerminal')){
+    editor.appendChild(text('p',data.message || 'Waiting for GitHub approval…','settings-hint'));
+    button(editor,'Stop login',function(){send('stop');},data.state==='stopping');return;
+  }
+  var actions=text('div','','settings-form-actions');editor.appendChild(actions);
+  button(actions,'Refresh',function(){send('get');},pending);
+  if(observed && observed.account && data.reviewId){
+    button(actions,(saved?'Confirm account: ':'Connect ')+observed.account.login,function(){send('connect');},pending);
+  }
+  if(data.canLogin && observed && ['authenticated','unauthenticated'].indexOf(observed.status)>=0 && data.reviewId){
+    editor.appendChild(text('p','A new login may replace the GitHub CLI account for this runtime and change its Git authentication settings. GitHub CLI owns the credentials. After approval, verify and explicitly confirm the resulting account.','settings-hint'));
+    button(actions,saved?'Reconnect with browser':'Sign in with browser',function(){
+      confirmSettingsAction('Start gh auth login for github.com in OS account '+data.runtime.user+' (HOME '+data.runtime.home+')? This may replace credentials used by other applications. Approve only at https://github.com/login/device.','Start GitHub login',function(){send('login');});
+    },pending);
+  } else if(data.runtime && data.runtime.shared && !data.canLogin && !(observed && observed.overridden))editor.appendChild(text('p','Only a server administrator can start a new login in the shared OS account. You can connect its verified existing account.','settings-hint'));
+  if(saved && data.reviewId)button(actions,'Disconnect',function(){confirmSettingsAction('Remove only this Clay Studio association? GitHub CLI credentials remain available to other applications and existing CLI-backed GitHub tools.','Disconnect',function(){send('disconnect');});},pending);
+  button(actions,'Cancel',close,pending);
+}
+export function initGithubIntegration(root){
+  var list=text('div');list.id='us-github-connections';root.querySelector('#us-linear-connections').after(list);
+  var editor=text('section','','settings-form');editor.id='us-github-editor';editor.hidden=true;editor.tabIndex=-1;root.querySelector('#us-integration-setup').appendChild(editor);
+  var add=text('button','','us-integration-tile');add.type='button';add.id='us-github-add';add.innerHTML=githubMark()+'<span>GitHub</span>';add.onclick=open;root.querySelector('.us-integration-tiles').appendChild(add);
+  var status=text('p','','settings-status');status.id='us-github-status';status.setAttribute('role','status');status.setAttribute('aria-live','polite');list.after(status);
+  store.subscribe(function(state,previous){
+    if(state.myUserId!==previous.myUserId || state.currentSlug!==previous.currentSlug || state.projectSplitViewSocketGeneration!==previous.projectSplitViewSocketGeneration || state.connected===false && previous.connected!==false){leaveGithubIntegration();}
+  });
+}
+export function loadGithubIntegration(){
+  if(store.get('githubSettingsContextId'))return;
+  store.set({githubSettingsContextId:crypto.randomUUID(),githubSettingsContext:context(),githubSettingsData:null});send('get');
+}
+export function leaveGithubIntegration(){
+  if(!store.get('githubSettingsContextId'))return;
+  if(store.get('githubSettingsTerminal') || store.get('githubSettingsPending') && store.get('githubSettingsAction')==='login') {
+    store.set({githubSettingsClosing:{contextId:store.get('githubSettingsContextId'),requestId:store.get('githubSettingsRequest'),owner:store.get('myUserId')}});
+    showToast(store.get('connected')===false?'GitHub login closure is unconfirmed after disconnection. Refresh before another attempt.':'Stopping the GitHub login terminal. Waiting for exit acknowledgement.','info');
+  }
+  send('release');closeTerminal();
+  store.set({githubSettingsContextId:null,githubSettingsRequest:null,githubSettingsPending:false,githubSettingsEditing:false,githubSettingsData:null});
+  var root=document.querySelector('.us-section[data-section=us-integrations]');if(root)root.dataset.githubLoaded='false';
+  clearIntegrationEditor('github');render();
+}
+export function handleGithubIntegration(message){
+  var closing=store.get('githubSettingsClosing');
+  if(closing && closing.contextId===message.contextId && closing.requestId===message.requestId && closing.owner===store.get('myUserId')) {
+    if(message.state==='stopped' || message.state==='unknown') {
+      showToast(message.message,message.state==='unknown'?'error':'info');
+      if(message.state==='stopped')store.set({githubSettingsClosing:null});
+    }
+  }
+  if(!store.get('githubSettingsContextId') || store.get('githubSettingsContext')!==context() || message.contextId!==store.get('githubSettingsContextId') || message.requestId!==store.get('githubSettingsRequest'))return;
+  var previous=store.get('githubSettingsData') || {};
+  var data=Object.assign({},previous,message);
+  if(message.state==='error' || message.state==='unknown')data.observed=null;
+  store.set({githubSettingsData:data,githubSettingsPending:['checking','verifying','stopping'].indexOf(message.state)>=0});
+  var status=document.getElementById('us-github-status');if(status){status.textContent=message.message || (message.state==='checking'?'Checking GitHub…':'');status.dataset.state=['error','unknown'].indexOf(message.state)>=0?'error':'';}
+  if(message.state==='started'){
+    store.set({githubSettingsTerminal:message.terminalId});
+    openTuiModal(message.terminalId,message.slug,{sessionTitle:'GitHub sign in',compact:true,githubAttachKey:message.attachKey,onClose:function(result){if(!result.exited && store.get('githubSettingsTerminal')===message.terminalId)send('stop');}});
+  } else if(['ready','saved','stopped','unknown'].indexOf(message.state)>=0)closeTerminal();
+  var root=document.querySelector('.us-section[data-section=us-integrations]');if(root && message.saved)root.dataset.githubLoaded='true';
+  if(message.state==='saved'){store.set({githubSettingsEditing:false});}
+  render();
+  if(message.state==='saved')close();
+}
+
+// Retain the editor until the exact login reports terminal exit; unknown never navigates.
+export function stopGithubEditorLogin() {
+  var data = store.get('githubSettingsData') || {};
+  var login = store.get('githubSettingsTerminal') || ['started','stopping'].indexOf(data.state) >= 0 ||
+    store.get('githubSettingsAction') === 'login' && (store.get('githubSettingsPending') || data.state === 'unknown');
+  if (!login) return Promise.resolve(true);
+  return new Promise(function (resolve) {
+    var contextId = store.get('githubSettingsContextId'), requestId = store.get('githubSettingsRequest');
+    var timer;
+    function finish(ok) { clearTimeout(timer); unsubscribe(); resolve(ok); }
+    var unsubscribe = store.subscribe(function (state) {
+      if (state.githubSettingsContextId !== contextId || state.githubSettingsRequest !== requestId) { finish(false); return; }
+      var current = state.githubSettingsData || {};
+      if (current.state === 'stopped') finish(true);
+      else if (current.state === 'unknown' || state.connected === false) finish(false);
+    });
+    timer = setTimeout(function () {
+      var message = 'GitHub login closure is unconfirmed. Keep this editor open and ask the server operator to inspect it. No login is retried automatically.';
+      store.set({githubSettingsPending:false,githubSettingsData:Object.assign({},store.get('githubSettingsData'),{state:'unknown',message:message,reviewId:null})});
+      showToast(message,'error'); render(); finish(false);
+    },20000);
+    if (!send('stop')) finish(false);
+  });
+}