claude-code-kanban 7.2.0 → 7.3.0

package/hub-app.json

@@ -5,6 +5,7 @@
   "icon": "columns",
   "run": { "entry": "server.js", "defaultPort": 3541 },
   "publishes": ["session.changed"],
+  "keys": { "keeps": ["ctrl+alt+n", "ctrl+alt+r", "ctrl+alt+s"] },
   "provides": {
     "projects": { "path": "/api/projects" },
     "terminal": { "liveWork": "/api/terminals" }

package/lib/terminal.js

@@ -12,6 +12,7 @@
 // gates and hands the upgraded socket over, so no keystroke or output byte waits on
 // cck's main thread.
 
+const { spawnSync } = require('node:child_process');
 const crypto = require('node:crypto');
 const fs = require('node:fs');
 const os = require('node:os');
@@ -147,10 +148,25 @@ function quoteArg(arg, family) {
   return family === 'cmd' ? `"${arg}"` : `'${arg}'`;
 }
 
+// Free text, unlike quoteArg's input. Inside single quotes pwsh only reads a quote mark (it
+// counts the typographic ones too) and POSIX shells read nothing, so doubling or closing
+// around the quote is enough. cmd has no quoting that holds % and ", so start() refuses it.
+function quotePrompt(text, family) {
+  if (family === 'pwsh') return `'${text.replace(/['‘’‚‛]/g, '$&$&')}'`;
+  return `'${text.replace(/'/g, "'\\''")}'`;
+}
+
+// The prompt goes first: -w takes an optional value, so a prompt after it would become the worktree name.
+function claudeCommand(shell, claudeArgs, prompt) {
+  const family = shellFamily(shell);
+  const args = claudeArgs.map((a) => quoteArg(a, family));
+  return ['claude', ...(prompt ? [quotePrompt(prompt, family)] : []), ...args].join(' ');
+}
+
 function shellArgs(shell, claudeArgs) {
   const family = shellFamily(shell);
   if (!claudeArgs) return family === 'pwsh' ? ['-NoLogo'] : family === 'gitbash' ? ['--login', '-i'] : [];
-  const cmd = ['claude', ...claudeArgs].map((a) => quoteArg(a, family)).join(' ');
+  const cmd = claudeCommand(shell, claudeArgs);
   if (family === 'pwsh') return ['-NoLogo', '-NoExit', '-Command', cmd];
   if (family === 'cmd') return ['/k', cmd];
   if (family === 'gitbash') return ['--login', '-i', '-c', `${cmd}; exec bash --login -i`];
@@ -196,13 +212,17 @@ function parseNewSpec(msg) {
   if (model && !MODELS.has(model)) return 'model';
   const taskList = msg.taskList || null;
   if (taskList && !(typeof taskList === 'string' && TASK_LIST_RE.test(taskList))) return 'task list id';
-  // biome-ignore lint/suspicious/noControlCharactersInRegex: strips ESC so a prompt cannot carry terminal sequences
-  const prompt = typeof msg.prompt === 'string' ? msg.prompt.replace(/\x1b/g, '').trim() : '';
+  const edit = msg.edit === true;
+  // ESC so a prompt cannot carry terminal sequences; on a shell line (edit) every control
+  // character but tab and line breaks, since it could act as a key (Ctrl+C, Ctrl+U) instead of text.
+  // biome-ignore lint/suspicious/noControlCharactersInRegex: strips control characters on purpose
+  const strip = edit ? /[\x00-\x08\x0b-\x1f\x7f]/g : /\x1b/g;
+  const prompt = typeof msg.prompt === 'string' ? msg.prompt.replace(strip, '').trim() : '';
   if (prompt.length > MAX_PROMPT) return 'prompt';
   const extraArgs = msg.extraArgs ?? [];
   const bad = extraArgsError(extraArgs);
   if (bad) return bad;
-  return { cwd: msg.cwd, name: name || null, worktree, model, taskList, prompt: prompt || null, extraArgs };
+  return { cwd: msg.cwd, name: name || null, worktree, model, taskList, prompt: prompt || null, extraArgs, edit };
 }
 
 function samePath(a, b) {
@@ -442,19 +462,23 @@ function createTerminalService(o) {
     return /\btrust\b/i.test(screenText(s.term));
   }
 
-  function queuePrompt(s, prompt) {
-    let armed = false;
+  // `submit` is claude's prompt: wait for its input box, then press Enter. Without it the text
+  // is the claude command typed at the shell prompt once the shell's startup output settles,
+  // and Enter is left to the user; bracketed paste keeps a prompt's line breaks from running
+  // the command early (checked in Git Bash and pwsh).
+  function queueText(s, raw, submit) {
+    let armed = !submit;
     let timer = null;
-    const text = bracketed(prompt);
+    const text = bracketed(raw);
     s.onOutput = (data) => {
       if (!armed && data.includes('\x1b[?2004h')) armed = true;
       if (!armed) return;
       clearTimeout(timer);
       timer = setTimeout(() => {
-        if (s.exited || onTrustScreen(s)) return;
+        if (s.exited || (submit && onTrustScreen(s))) return;
         s.onOutput = null;
         s.pty.write(text);
-        setTimeout(() => { if (!s.exited) s.pty.write('\r'); }, 100);
+        if (submit) setTimeout(() => { if (!s.exited) s.pty.write('\r'); }, 100);
       }, PROMPT_QUIET_MS);
     };
   }
@@ -492,7 +516,10 @@ function createTerminalService(o) {
         moved = true;
         continue;
       }
+      const had = s.claudePid;
       const pid = inputPid(s, live);
+      // An edit terminal starts claude whenever the user presses Enter, after syncBoost stopped looking.
+      if (pid && pid !== had) syncBoost(s);
       if (!pid || (live.some((l) => l.pid === pid) && pidAlive(pid))) continue;
       s.claudeExitedAt = Date.now();
       s.claudePid = null;
@@ -537,7 +564,8 @@ function createTerminalService(o) {
     if (taskList) env.CLAUDE_CODE_TASK_LIST_ID = taskList;
     // Git Bash's login profile cds to $HOME unless this is set.
     if (shellFamily(shell) === 'gitbash') env.CHERE_INVOKING = '1';
-    const proc = pty.spawn(shell, shellArgs(shell, claudeArgsFor(mode, id, spec)), {
+    const claudeArgs = claudeArgsFor(mode, id, spec);
+    const proc = pty.spawn(shell, shellArgs(shell, spec?.edit ? null : claudeArgs), {
       name: 'xterm-256color',
       cols,
       rows,
@@ -549,9 +577,10 @@ function createTerminalService(o) {
     term.loadAddon(serializer);
     const s = {
       id, mode, cwd, pty: proc, term, serializer, sockets: new Set(), exited: false, ended: false, paused: false, startedAt: Date.now(),
-      name: spec?.name || null, worktree: spec?.worktree || false, taskList, onOutput: null,
+      name: spec?.name || null, worktree: spec?.worktree || false, taskList, onOutput: null, edit: !!spec?.edit,
     };
-    if (spec?.prompt) queuePrompt(s, spec.prompt);
+    if (s.edit) queueText(s, claudeCommand(shell, claudeArgs, spec.prompt), false);
+    else if (spec?.prompt) queueText(s, spec.prompt, true);
     if (mode === 'pick') watchPick(s);
 
     proc.onData((data) => {
@@ -697,6 +726,9 @@ function createTerminalService(o) {
     if (mode === 'new') {
       spec = parseNewSpec(msg);
       if (typeof spec === 'string') return { code: 4002, status: 400, error: `invalid ${spec}` };
+      if (spec.edit && spec.prompt && shellFamily(shell) === 'cmd') {
+        return { code: 4002, status: 400, error: 'cmd cannot take a typed prompt; clear the prompt or set the terminal shell to pwsh or gitbash' };
+      }
     }
     const known = await o.resolveCwd(id);
     let cwd = known;
@@ -751,7 +783,7 @@ function createTerminalService(o) {
   function list() {
     return [...sessions.values()].filter((s) => !s.ended).map((s) => ({
       id: s.id, mode: s.mode, cwd: s.cwd, pid: s.pty.pid, clients: s.sockets.size, startedAt: s.startedAt,
-      name: s.name, worktree: s.worktree,
+      name: s.name, worktree: s.worktree, edit: s.edit,
     }));
   }
 
@@ -802,6 +834,8 @@ function createTerminalService(o) {
     const s = sessions.get(id);
     if (!s || s.ended || s.exited || s.claudeExitedAt || s.onOutput || s.mode === 'shell' || s.mode === 'fork') return false;
     if (onTrustScreen(s)) return false;
+    // Until the user runs the typed command, the input box is the shell's command line.
+    if (s.edit && !s.claudePid) return false;
     s.pty.write(bracketed(text));
     return true;
   }
@@ -810,6 +844,12 @@ function createTerminalService(o) {
     shuttingDown = true;
     clearTimeout(saveTimer);
     clearInterval(exitTimer);
+    // On Windows pty.kill() returns before the tree is gone, and the host exits right after
+    // shutdown, so claude outlived it. One synchronous tree kill ends every session first.
+    const pids = [...sessions.values()].map((s) => s.pty.pid).filter(Boolean);
+    if (process.platform === 'win32' && pids.length) {
+      spawnSync('taskkill', ['/f', '/t', ...pids.flatMap((pid) => ['/pid', String(pid)])], { windowsHide: true, stdio: 'ignore' });
+    }
     for (const s of sessions.values()) {
       try { s.pty.kill(); } catch { /* already gone */ }
     }
@@ -819,4 +859,4 @@ function createTerminalService(o) {
   return { token, handleUpgrade, clientConfig, list, claudePids, isRunning, end, authorized, startNew, paste, restore, shutdown, unavailableReason };
 }
 
-module.exports = { createTerminalService, readTerminalConfig, localUnavailableReason, refuseUpgrade, clientConfigFor, ptyEnv, shellArgs, resolveShell, claudeArgsFor, parseNewSpec, findPickProcess, tokenMatches };
+module.exports = { createTerminalService, readTerminalConfig, localUnavailableReason, refuseUpgrade, clientConfigFor, ptyEnv, shellArgs, claudeCommand, resolveShell, claudeArgsFor, parseNewSpec, findPickProcess, tokenMatches };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-kanban",
-  "version": "7.2.0",
+  "version": "7.3.0",
   "description": "A web-based Kanban board for viewing Claude Code tasks with agent teams support",
   "main": "server.js",
   "type": "commonjs",

package/public/app.js

@@ -2494,8 +2494,13 @@ function clampModalZoom(v) {
   return Math.min(MODAL_ZOOM_MAX, Math.max(MODAL_ZOOM_MIN, v));
 }
 
+function modalZoomLabel() {
+  return `${Math.round(modalZoom * 100)}%`;
+}
+
 function applyModalZoom() {
   document.documentElement.style.setProperty('--modal-zoom', String(modalZoom));
+  for (const el of document.querySelectorAll('.pane-zoom-val')) el.textContent = modalZoomLabel();
 }
 
 // delta 0 resets to 100%
@@ -2505,7 +2510,7 @@ function adjustModalZoom(delta) {
   modalZoom = next;
   store.setItem(MODAL_ZOOM_KEY, String(modalZoom));
   applyModalZoom();
-  showToast(`Text ${Math.round(modalZoom * 100)}%`);
+  showToast(`Text ${modalZoomLabel()}`);
 }
 
 // The markup decides what scales: `.modal-zoomable` marks a modal's reading
@@ -5917,9 +5922,9 @@ const SHORTCUT_TABS = [
       {
         title: 'Sessions',
         rows: [
-          { keys: ['Ctrl', 'Alt', 'N'], combo: true, label: 'New session' },
-          { keys: ['Ctrl', 'Alt', 'R'], combo: true, label: 'Resume session (claude -r)' },
-          { keys: ['Ctrl', 'Alt', 'S'], combo: true, label: 'Swap to previous session' },
+          { keys: ['Ctrl', 'Alt', 'N'], combo: true, hubMod: true, label: 'New session' },
+          { keys: ['Ctrl', 'Alt', 'R'], combo: true, hubMod: true, label: 'Resume session (claude -r)' },
+          { keys: ['Ctrl', 'Alt', 'S'], combo: true, hubMod: true, label: 'Swap to previous session' },
         ],
       },
     ],
@@ -5949,17 +5954,57 @@ const SHORTCUT_TABS = [
           { keys: ['M'], label: 'Jump to marketplace' },
           { keys: ['$'], label: 'Jump to cost' },
           { keys: ['Ctrl', 'M'], combo: true, label: 'Jump to memory' },
-          { keys: ['Ctrl', 'Alt', '←/→'], combo: true, label: 'Previous / next hub app' },
-          { keys: ['Alt', '1…9'], combo: true, label: 'Jump to hub app by number' },
-          { keys: ['Ctrl', 'Alt', 'P'], combo: true, label: 'Project picker' },
-          { keys: ['Ctrl', 'Alt', 'W'], combo: true, label: 'Config dir picker' },
-          { keys: ['Ctrl', 'Alt', 'A'], combo: true, label: 'App launcher' },
+          {
+            keys: ['Ctrl', 'Alt', '←/→'],
+            action: ['hub.prevApp', 'hub.nextApp'],
+            combo: true,
+            hubMod: true,
+            label: 'Previous / next hub app',
+          },
+          {
+            keys: ['Alt', '1…9'],
+            action: 'hub.appByNumber',
+            combo: true,
+            hubMod: true,
+            label: 'Jump to hub app by number',
+          },
+          {
+            keys: ['Ctrl', 'Alt', 'P'],
+            action: 'hub.projectPicker',
+            combo: true,
+            hubMod: true,
+            label: 'Project picker',
+          },
+          {
+            keys: ['Ctrl', 'Alt', 'W'],
+            action: 'hub.configDirPicker',
+            combo: true,
+            hubMod: true,
+            label: 'Config dir picker',
+          },
+          { keys: ['Ctrl', 'Alt', 'A'], action: 'hub.appLauncher', combo: true, hubMod: true, label: 'App launcher' },
         ],
       },
     ],
   },
 ];
 
+// macOS names Control, Option and Shift by their symbols.
+const IS_MAC = /^Mac/i.test(navigator.userAgentData?.platform || navigator.platform || '');
+const MAC_KEYS = { Ctrl: '⌃', Alt: '⌥', Shift: '⇧' };
+if (IS_MAC) document.getElementById('new-session-btn')?.setAttribute('title', 'New session (⌃⌥N)');
+
+// The keys of a help row as they read on this system. The hub's modifier is Ctrl+Alt, and on
+// macOS Control+Option for the tab numbers too (Windows and Linux use bare Alt for those). A hub
+// row shows the keys the hub reports, which the user can change; row.keys until it answers.
+function helpKeys(row, mac = IS_MAC, keyLabel = hub.keyLabel) {
+  const live = row.action && keyLabel(row.action);
+  if (live) return live;
+  if (!mac) return row.keys;
+  if (row.hubMod) return ['⌃', '⌥', ...row.keys.filter((k) => k !== 'Ctrl' && k !== 'Alt')];
+  return row.keys.map((k) => MAC_KEYS[k] || k);
+}
+
 // Interleaves each pair's rows left-then-right so CSS grid auto-placement lands
 // them on shared row tracks (see .shortcuts in style.css).
 function buildHelpShortcuts(groups) {
@@ -5975,9 +6020,10 @@ function buildHelpShortcuts(groups) {
     for (let i = 0; i < Math.max(...sides.map(([g]) => g.rows.length)); i++) {
       for (const [group, side] of sides) {
         const row = group.rows[i];
-        if (!row) continue;
+        const parts = row && helpKeys(row);
+        if (!parts?.length) continue;
         const sep = row.combo ? '<span class="sc-plus">+</span>' : '<span class="sc-or">/</span>';
-        const keys = row.keys.map((k) => `<kbd>${escapeHtml(k)}</kbd>`).join(sep);
+        const keys = parts.map((k) => `<kbd>${escapeHtml(k)}</kbd>`).join(sep);
         const label = escapeHtml(row.label);
         cells.push(`<dt class="${escapeHtml(side)}">${keys}</dt><dd class="${escapeHtml(side)}">${label}</dd>`);
       }
@@ -5996,7 +6042,10 @@ const helpTabs = () => SHORTCUT_TABS.filter((t) => hub.inHub || !t.hub);
 function filteredShortcutGroups(query) {
   return helpTabs()
     .flatMap((t) => t.groups)
-    .map((g) => ({ title: g.title, rows: g.rows.filter((r) => fuzzyMatch(`${r.label} ${r.keys.join(' ')}`, query)) }))
+    .map((g) => ({
+      title: g.title,
+      rows: g.rows.filter((r) => fuzzyMatch(`${r.label} ${helpKeys(r).join(' ')}`, query)),
+    }))
     .filter((g) => g.rows.length);
 }
 
@@ -7630,9 +7679,10 @@ function reviewBridge(textBefore, headingBefore, rangeAt, comboOf, fieldSelector
     const mods = [e.ctrlKey && 'ctrl', e.altKey && 'alt', e.shiftKey && 'shift', e.metaKey && 'meta']
       .filter(Boolean)
       .join('+');
-    return [e.code && `${mods}|c:${e.code}`, typeof e.key === 'string' && `${mods}|k:${e.key.toLowerCase()}`].filter(
-      Boolean,
-    );
+    return [
+      e.code && !e.getModifierState?.('AltGraph') && `${mods}|c:${e.code}`,
+      typeof e.key === 'string' && `${mods}|k:${e.key.toLowerCase()}`,
+    ].filter(Boolean);
   };
   let claims = new Set();
   let forward = new Set();
@@ -12171,9 +12221,14 @@ function togglePaneSplit() {
   return true;
 }
 
+function shownPaneSplit() {
+  const sid = paneSessionId();
+  return sid && !wantsTerminal() && getPaneSplit(sid);
+}
+
 function focusPaneSide(side) {
   const sid = paneSessionId();
-  const split = sid && !wantsTerminal() && getPaneSplit(sid);
+  const split = shownPaneSplit();
   if (!split) return false;
   if (getActivePaneId(sid) !== split[side]) {
     setActivePaneId(sid, split[side]);
@@ -12363,6 +12418,20 @@ function updatePaneFades() {
   paneTabs.classList.toggle('fade-r', scrollLeft + clientWidth < scrollWidth - 1);
 }
 
+// A URL pane's page is on another origin, so its key presses never reach the board: the zoom
+// keys zoom the whole window and the pane keys do nothing. The bar zooms without keys and
+// says when the page has the keyboard; a click on it gives the keys back.
+function paneUrlBarHtml() {
+  return `<div class="pane-url-bar"><button class="icon-btn pane-keys" title="The page has keyboard focus. Click to turn the board shortcuts back on">Board shortcuts off · click to turn on</button><button class="icon-btn" data-pane-zoom="-0.1" title="Smaller" aria-label="Smaller">−</button><button class="icon-btn pane-zoom-val" data-pane-zoom="0" title="Reset size">${modalZoomLabel()}</button><button class="icon-btn" data-pane-zoom="0.1" title="Larger" aria-label="Larger">+</button></div>`;
+}
+
+function markPaneFrameFocus() {
+  const el = document.activeElement;
+  const view = el?.classList.contains('pane-url-frame') ? el.parentElement : null;
+  for (const v of paneViews.querySelectorAll('.pane-view.frame-focus')) v.classList.remove('frame-focus');
+  view?.classList.add('frame-focus');
+}
+
 function paneCardHtml(title, text, button) {
   return `<div class="pane-card"><div class="pane-card-box">${PANE_ICONS.warning}<h3>${escapeHtml(title)}</h3><p>${escapeHtml(text)}</p><button class="btn btn-primary" data-pane-open>${escapeHtml(button)}</button></div></div>`;
 }
@@ -12412,12 +12481,13 @@ async function loadPaneView(sid, pane, view, scroll) {
   }
   if (pane.kind === 'url') {
     const frame = document.createElement('iframe');
-    frame.className = 'pane-frame modal-zoomable';
+    frame.className = 'pane-frame pane-url-frame modal-zoomable';
     frame.setAttribute('sandbox', PANE_URL_SANDBOX);
     frame.setAttribute('referrerpolicy', 'no-referrer');
     frame.title = pane.title;
     frame.src = pane.target;
     view.appendChild(frame);
+    view.insertAdjacentHTML('beforeend', paneUrlBarHtml());
     // Framed at once; a refusal found by the probe swaps the frame for the card.
     if ((await probePaneFraming(sid, pane)) === false) {
       frame.remove();
@@ -12907,8 +12977,42 @@ function focusSideOf(el) {
 // That blur is also the only sign that a click in a split moved into a pane's frame.
 window.addEventListener('blur', () => {
   closePaneMenu();
-  setTimeout(() => focusSideOf(document.activeElement?.closest?.('.pane-view.on')));
+  setTimeout(() => {
+    syncPaneFrameFocus();
+    watchPaneFrameFocus();
+  });
+});
+window.addEventListener('focus', () => {
+  clearInterval(paneFrameFocusPoll);
+  markPaneFrameFocus();
 });
+
+function syncPaneFrameFocus() {
+  focusSideOf(document.activeElement?.closest?.('.pane-view.on'));
+  markPaneFrameFocus();
+}
+
+function splitPaneFrameFocused() {
+  const el = document.activeElement;
+  return el?.tagName === 'IFRAME' && paneViews.contains(el) && !!shownPaneSplit();
+}
+
+// A click from one frame into another fires no event in this document, so while a split's frame
+// has focus the board checks which one it is: one pointer compare four times a second.
+let paneFrameFocusPoll = 0;
+function watchPaneFrameFocus() {
+  clearInterval(paneFrameFocusPoll);
+  if (!splitPaneFrameFocused()) return;
+  let last = document.activeElement;
+  paneFrameFocusPoll = setInterval(() => {
+    const el = document.activeElement;
+    if (!splitPaneFrameFocused()) clearInterval(paneFrameFocusPoll);
+    else if (el !== last) {
+      last = el;
+      syncPaneFrameFocus();
+    }
+  }, 250);
+}
 paneSplitBox.addEventListener(
   'pointerdown',
   (e) => focusSideOf(paneLog.contains(e.target) ? paneBoard : e.target.closest('.side-l, .side-r')),
@@ -13024,6 +13128,8 @@ function applySplitRatio() {
 
 paneViews.addEventListener('click', (e) => {
   if (e.target.closest('[data-pane-open]')) openPaneExternally();
+  const zoom = e.target.closest('[data-pane-zoom]');
+  if (zoom) adjustModalZoom(Number(zoom.dataset.paneZoom));
 });
 bindPreviewRelativeLinks(paneViews, (a) => a.closest('.pane-doc')?.dataset.path);
 paneTabs.addEventListener('scroll', updatePaneFades, { passive: true });
@@ -13193,6 +13299,12 @@ function terminalPaneFocused() {
   return document.getElementById('terminal-pane').contains(document.activeElement);
 }
 
+// Kanban's own session keys (new, resume, swap) use the hub's modifier, so the hub leaves them alone.
+// AltGr reaches the page as Ctrl+Alt; when it types a character (Polish AltGr+S is 'ś'), the press is text.
+function hubModDown(e) {
+  return e.ctrlKey && e.altKey && !e.metaKey && !e.shiftKey && !e.getModifierState?.('AltGraph');
+}
+
 function inPageField(e) {
   const field = e.target?.closest?.(TEXT_FIELD_SELECTOR);
   return !!field && !document.getElementById('terminal-pane').contains(field);
@@ -13200,7 +13312,7 @@ function inPageField(e) {
 
 // `probe` asks which keys the terminal frame hands back, and the frame sees keys only while it has focus.
 function terminalShortcut(e, probe = false) {
-  const ctrlAlt = e.ctrlKey && e.altKey && !e.shiftKey && !e.metaKey;
+  const ctrlAlt = hubModDown(e);
   const ctrlShift = e.ctrlKey && e.shiftKey && !e.altKey && !e.metaKey;
   // Ctrl+_ is Claude Code's undo, so the zoom keys leave it to the terminal.
   const zoom = e.key === '_' ? undefined : zoomDelta(e);
@@ -13808,6 +13920,7 @@ async function openTerminal(sessionId, mode, attempt = 0) {
         worktree: spec.worktree,
         model: spec.model,
         prompt: spec.prompt,
+        edit: spec.edit,
       }),
     },
   });
@@ -14097,12 +14210,14 @@ const newSpecs = new Map();
 const dispatchSpecs = new Map();
 const ns = { projects: [], picked: [], matches: [], idx: -1, folder: '', busy: false, resume: false };
 const NEW_SESSION_STAY_KEY = 'new-session-stay';
+const NEW_SESSION_EDIT_KEY = 'new-session-edit';
 
 const PLACEHOLDER_NAMES = { pick: 'Resume session', dispatch: 'Started session', new: 'New session' };
 const PLACEHOLDER_HINTS = {
   pick: 'pick a session to resume',
   dispatch: 'starting',
   new: 'waiting for your first message',
+  edit: 'press Enter in the terminal to start',
 };
 
 function placeholderSession(id, spec) {
@@ -14110,6 +14225,7 @@ function placeholderSession(id, spec) {
     id,
     placeholder: true,
     mode: spec.mode,
+    edit: !!spec.edit,
     name: spec.name || PLACEHOLDER_NAMES[spec.mode] || PLACEHOLDER_NAMES.new,
     dispatchGroup: spec.group || undefined,
     dispatched: spec.mode === 'dispatch' ? { parent: spec.parent || null } : undefined,
@@ -14189,7 +14305,7 @@ function renderPlaceholderCard(session) {
           <button onclick="fetchTasks('${escAttrJs(session.id)}')" data-session-id="${escapeHtml(session.id)}" class="session-item session-placeholder ${isActive ? 'active' : ''}" title="${escapeHtml(`${session.id} | ${session.project}`)}">
             <div class="session-name">${escapeHtml(session.name)}</div>
             ${projectHtml ? `<div class="session-secondary">${projectHtml}</div>` : ''}
-            <div class="session-waiting"><span class="pulse"></span>${PLACEHOLDER_HINTS[session.mode] || PLACEHOLDER_HINTS.new}</div>
+            <div class="session-waiting"><span class="pulse"></span>${PLACEHOLDER_HINTS[session.edit ? 'edit' : session.mode] || PLACEHOLDER_HINTS.new}</div>
           </button>
         `;
 }
@@ -14203,7 +14319,14 @@ async function restorePendingSessions() {
   try {
     for (const t of await terminals) {
       if ((t.mode !== 'new' && t.mode !== 'pick') || newSpecs.has(t.id) || dispatchSpecs.has(t.id)) continue;
-      newSpecs.set(t.id, { cwd: t.cwd, name: t.name, worktree: t.worktree, mode: t.mode, startedAt: t.startedAt });
+      newSpecs.set(t.id, {
+        cwd: t.cwd,
+        name: t.name,
+        worktree: t.worktree,
+        mode: t.mode,
+        edit: t.edit,
+        startedAt: t.startedAt,
+      });
     }
   } catch (_) {}
 }
@@ -14241,6 +14364,7 @@ function openNewSession(folder, resume = false) {
   document.getElementById('ns-wt').checked = false;
   document.getElementById('ns-model').value = '';
   document.getElementById('ns-stay').checked = store.getItem(NEW_SESSION_STAY_KEY) === 'true';
+  document.getElementById('ns-edit').checked = store.getItem(NEW_SESSION_EDIT_KEY) === 'true';
   setNewSessionError('');
   const current = viewMode === 'session' ? sessions.find((s) => s.id === currentSessionId)?.project : null;
   setNewSessionFolder(folder || current || '');
@@ -14340,12 +14464,15 @@ function folderListOpen() {
 function newSessionValues() {
   const wtOn = document.getElementById('ns-wt').checked;
   const wtName = document.getElementById('ns-wt-name').value.trim();
+  const edit = !ns.resume && document.getElementById('ns-edit').checked;
   return {
     cwd: ns.folder,
     name: document.getElementById('ns-name').value.trim() || null,
     worktree: wtOn ? wtName || true : false,
     model: document.getElementById('ns-model').value || null,
     prompt: document.getElementById('ns-prompt').value.trim() || null,
+    edit,
+    stay: !ns.resume && !edit && document.getElementById('ns-stay').checked,
   };
 }
 
@@ -14371,11 +14498,12 @@ function renderNewSessionForm() {
   const hint = document.getElementById('ns-wt-hint');
   hint.hidden = !wtOn;
   hint.textContent = `.claude/worktrees/${typeof v.worktree === 'string' ? v.worktree : '<name chosen by Claude>'}`;
+  document.getElementById('ns-stay').disabled = v.edit;
   const problem = newSessionProblem(v);
   setNewSessionError(problem);
   const start = document.getElementById('ns-start');
   start.disabled = !v.cwd || !!problem || ns.busy;
-  const verb = ns.resume ? 'Resume' : 'Start';
+  const verb = ns.resume ? 'Resume' : v.edit ? 'Open' : 'Start';
   start.textContent = v.cwd ? `${verb} in ${pathBasename(v.cwd)}` : verb;
 }
 
@@ -14424,7 +14552,7 @@ function startNewSession() {
   const id = crypto.randomUUID();
   newSpecs.set(id, { ...(ns.resume ? { cwd: v.cwd } : v), mode: ns.resume ? 'pick' : 'new', startedAt: Date.now() });
   setTerminalMode(id, true);
-  if (!ns.resume && document.getElementById('ns-stay').checked) return startNewSessionInBackground(id, v);
+  if (v.stay) return startNewSessionInBackground(id, v);
   sessions = mergePlaceholders(sessions.filter((s) => !s.placeholder));
   closeNewSession();
   fetchTasks(id).then(() => sessionsList.querySelector('.session-item.active')?.scrollIntoView({ block: 'nearest' }));
@@ -14528,6 +14656,10 @@ function initNewSession() {
   document
     .getElementById('ns-stay')
     .addEventListener('change', (e) => store.setItem(NEW_SESSION_STAY_KEY, String(e.target.checked)));
+  document.getElementById('ns-edit').addEventListener('change', (e) => {
+    store.setItem(NEW_SESSION_EDIT_KEY, String(e.target.checked));
+    renderNewSessionForm();
+  });
   for (const id of ['ns-name', 'ns-wt-name', 'ns-prompt', 'ns-model']) {
     document.getElementById(id).addEventListener('input', renderNewSessionForm);
   }

package/public/index.html

@@ -849,6 +849,7 @@
       </div>
       <div class="modal-footer ns-footer">
         <label class="ns-check ns-stay" title="Start in the background and keep the current view"><input type="checkbox" id="ns-stay"> Stay here</label>
+        <label class="ns-check ns-edit" title="Open a shell in the folder with the claude command typed in. Press Enter to run it."><input type="checkbox" id="ns-edit"> Edit before run</label>
         <button type="button" class="btn btn-secondary" onclick="closeNewSession()">Cancel</button>
         <button type="button" id="ns-start" class="btn btn-primary" onclick="startNewSession()" disabled>Start</button>
       </div>

package/public/style.css

@@ -3909,6 +3909,49 @@ code.language-tree .hljs-title {
   background: #fff;
 }
 
+.pane-url-bar {
+  position: absolute;
+  right: 12px;
+  bottom: 12px;
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  padding: 3px;
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: var(--bg-elevated);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
+  font-family: var(--font-mono);
+  font-size: 12px;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.15s;
+}
+
+.pane-view:hover > .pane-url-bar,
+.pane-view.frame-focus > .pane-url-bar {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.pane-url-bar .icon-btn {
+  width: auto;
+  min-width: 26px;
+  height: 24px;
+  padding: 0 6px;
+  border-color: transparent;
+  font: inherit;
+}
+
+.pane-url-bar .pane-keys {
+  display: none;
+  color: var(--accent);
+}
+
+.pane-view.frame-focus .pane-keys {
+  display: flex;
+}
+
 .pane-doc {
   flex: 1;
   min-height: 0;
@@ -7333,7 +7376,7 @@ select.form-input option:checked {
 
 /* #region NEW_SESSION */
 .modal.new-session-modal {
-  width: 520px;
+  width: 640px;
   max-width: calc(100vw - 32px);
   overflow: visible;
 }
@@ -7462,7 +7505,8 @@ select.form-input option:checked {
   accent-color: var(--accent);
 }
 
-.ns-inline .form-input:disabled {
+.ns-inline .form-input:disabled,
+.ns-check:has(input:disabled) {
   opacity: 0.5;
   cursor: not-allowed;
 }
@@ -7545,15 +7589,27 @@ select.form-input option:checked {
   border-top: 1px solid var(--border);
 }
 
-.ns-stay {
-  margin-right: auto;
+.ns-stay,
+.ns-edit {
   color: var(--text-tertiary);
 }
 
-.new-session-modal.ns-resume .ns-stay {
+.ns-edit {
+  margin-right: auto;
+}
+
+.new-session-modal.ns-resume .ns-stay,
+.new-session-modal.ns-resume .ns-edit {
   visibility: hidden;
 }
 
+.ns-footer .btn-primary {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .ns-footer .btn-primary:disabled {
   opacity: 0.5;
   cursor: not-allowed;

package/public/terminal-frame.js

@@ -11,12 +11,14 @@
   const modsOf = (e) =>
     [e.ctrlKey && 'ctrl', e.altKey && 'alt', e.shiftKey && 'shift', e.metaKey && 'meta'].filter(Boolean).join('+');
 
-  // A claim names a key by its physical code, or by its character when the layout moves it.
+  // A claim names a key by its physical code, or by its character when the layout moves it. A press
+  // that AltGr turns into a character (Polish AltGr+S is 'ś') is matched by its character only.
   function keySigs(e) {
     const mods = modsOf(e);
-    return [e.code && `${mods}|c:${e.code}`, typeof e.key === 'string' && `${mods}|k:${e.key.toLowerCase()}`].filter(
-      Boolean,
-    );
+    return [
+      e.code && !e.getModifierState?.('AltGraph') && `${mods}|c:${e.code}`,
+      typeof e.key === 'string' && `${mods}|k:${e.key.toLowerCase()}`,
+    ].filter(Boolean);
   }
 
   const claimSig = (c) => keySigs(c)[0];

package/public/vendor/claude-hub-sdk.js

@@ -1,18 +1,51 @@
-// claude-hub-sdk 1.2.0 (sha256 62c7d9f477b2). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
-// Claude Code Hub SDK stub: what an app serves when no hub runs it. Under a hub, the hub hands the
-// app its real SDK (client.js) in place of this file. The API must match client.js; a test checks it.
-((root) => {
+// claude-hub-sdk 1.4.0 (sha256 7d559a8888ce). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
+// Claude Code Hub SDK: the one rule that names a key press, shared by the hub page, client.js and
+// stub.js. The hub serves it to its page as /sdk/keys.js; mount() and sdk:sync put it in front of
+// client.js and stub.js, so an app still loads one file.
+// var, not const: the hub page and an app page each load it as a classic script, and a second
+// const declaration in the same page would throw.
+var ClaudeHubKeys = (() => {
   'use strict';
 
-  // A copy of client.js comboOf(); a test checks they match.
+  // Modifiers in ctrl, alt, shift, meta order, joined by '+' to the key. macOS composes
+  // Option+<key> into a character (Option+1 is '¡', Option+P is 'π') and holding Control does not
+  // undo it, so e.key alone cannot name these presses there. e.code is the physical key, which is
+  // wrong for non-US layouts, hence only as a fallback. No fallback under AltGraph: Chromium sets it
+  // when AltGr types a character, and that press is text. Takes a real KeyboardEvent or a forwarded
+  // {key, code} payload; a payload without code degrades to key. A payload needs no AltGraph: the
+  // SDK forwards only a press whose key already names a bound combo.
+  // Self-contained on purpose: cck puts its source text into a sandboxed frame.
   function comboOf(e) {
     const lower = typeof e.key === 'string' ? e.key.toLowerCase() : '';
-    const m = /^(?:Key|Digit)([A-Z1-9])$/.exec(e.code || '');
+    const m = !e.getModifierState?.('AltGraph') && /^(?:Key|Digit)([A-Z1-9])$/.exec(e.code || '');
     const key = /^[a-z1-9]$/.test(lower) ? lower : m ? m[1].toLowerCase() : e.key;
     const mods = [e.ctrlKey && 'ctrl', e.altKey && 'alt', e.shiftKey && 'shift', e.metaKey && 'meta'];
     return [...mods, key].filter(Boolean).join('+');
   }
 
+  // The keys of a combo as a help row shows them: ['Ctrl', 'Alt', 'P'], or ['⌃', '⌥', 'P'] on macOS.
+  // The {n} of a numbered combo reads 1…9.
+  function keyParts(combo, mac) {
+    const mods = mac
+      ? { ctrl: '⌃', alt: '⌥', shift: '⇧', meta: '⌘' }
+      : { ctrl: 'Ctrl', alt: 'Alt', shift: 'Shift', meta: 'Win' };
+    const named = { '{n}': '1…9', ArrowLeft: '←', ArrowRight: '→', ArrowUp: '↑', ArrowDown: '↓' };
+    return combo.split('+').map((k) => mods[k] ?? named[k] ?? (k.length === 1 ? k.toUpperCase() : k));
+  }
+
+  return { comboOf, keyParts };
+})();
+
+if (typeof module === 'object' && module.exports) module.exports = ClaudeHubKeys;
+
+// Claude Code Hub SDK stub: what an app serves when no hub runs it. Under a hub, the hub hands the
+// app its real SDK (client.js) in place of this file. The API must match client.js; a test checks it.
+((root) => {
+  'use strict';
+
+  // keys.js comes first in the synced file. Required as a module, stub.js loads it itself.
+  const { comboOf } = typeof ClaudeHubKeys === 'object' ? ClaudeHubKeys : require('./keys');
+
   function createClaudeHub(win) {
     let hub = null;
     const off = () => {};
@@ -43,6 +76,7 @@
         can: (action) => !!standaloneFn(action),
         forwards: () => false,
         forwardCombos: () => [],
+        keyLabel: () => null,
         closeGuard() {},
         openExternal(url) {
           win.open(url, '_blank', 'noopener');