npm - coxpit - Versions diffs - 5.23.1 → 5.26.0 - Mend

coxpit 5.23.1 → 5.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "coxpit",
-  "version": "5.23.1",
+  "version": "5.26.0",
   "description": "Self-hosted cockpit for running a fleet of AI coding agents across your own machines — parallel worktree runs, live board, compare & merge, web terminal, design capture.",
   "type": "module",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -45,6 +45,7 @@
     "@fastify/websocket": "^11",
     "@libsql/client": "^0.14",
     "@xterm/addon-fit": "^0.10.0",
+    "@xterm/addon-search": "^0.15.0",
     "@xterm/addon-unicode11": "^0.8.0",
     "@xterm/addon-web-links": "^0.11.0",
     "@xterm/xterm": "^5.5.0",

package/src/cockpit.ts CHANGED Viewed

@@ -54,6 +54,11 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   .toggle:hover{color:var(--ink);border-color:var(--line-hi)}
   .layout{display:grid;grid-template-columns:270px 1fr;height:calc(100dvh - 46px)}
+  /* 포커스 모드 — 트리·요청바 숨기고 페인만(⌘.) */
+  .layout.focusmode{grid-template-columns:1fr}
+  .layout.focusmode .rail{display:none}
+  .layout.focusmode .reqbar{display:none}
+  .tc-btn.on{color:var(--brand-ink);background:var(--brand);border-color:var(--brand)}
   .layout > *{min-height:0;min-width:0}
   /* ── workspace tree ── */
@@ -81,6 +86,15 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   /* ── 탭 바 + 분할 트리 페인 ── */
   .stage{display:flex;flex-direction:column;min-width:0;background:var(--bg);position:relative}
+  /* ── 터미널 스크롤백 검색바(⌘F) ── */
+  .term-find{position:absolute;top:44px;right:14px;z-index:30;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--line-hi);border-radius:9px;padding:5px 6px;box-shadow:0 6px 20px rgba(0,0,0,.4)}
+  .term-find[hidden]{display:none}          /* hidden 속성 존중 — 아래 규칙이 UA 를 이기지 않게 */
+  .term-find:not([hidden]){display:flex}
+  .term-find input{font-family:var(--mono);font-size:12px;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:5px 8px;width:200px;outline:none}
+  .term-find input:focus{border-color:var(--brand)}
+  .term-find .fc{font-family:var(--mono);font-size:10.5px;color:var(--faint);min-width:20px;text-align:center}
+  .term-find button{font-family:var(--mono);font-size:13px;color:var(--muted);background:none;border:none;cursor:pointer;padding:2px 5px;border-radius:5px}
+  .term-find button:hover{color:var(--ink);background:var(--surface2)}
   .tabbar{display:flex;align-items:stretch;height:38px;border-bottom:1px solid var(--line);background:var(--panel);font-family:var(--mono)}
   .tabs{flex:1;display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden}
   .tab{display:inline-flex;align-items:center;gap:7px;padding:0 10px 0 12px;border-right:1px solid var(--line);font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap;max-width:220px;user-select:none;flex:none}
@@ -185,6 +199,19 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   /* ── folder picker (자유 세션 폴더 지정) ── */
   .modal{position:fixed;inset:0;background:rgba(4,6,10,.6);display:none;align-items:center;justify-content:center;z-index:60}
   .modal.on{display:flex}
+  /* ── ⌘K 커맨드 팔레트 ── */
+  #palette{align-items:flex-start}
+  .pal{width:min(620px,94vw);margin-top:12vh;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line-hi);border-radius:14px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.5)}
+  .pal>input{font-family:var(--mono);font-size:14px;color:var(--ink);background:transparent;border:none;border-bottom:1px solid var(--line);padding:15px 18px;outline:none}
+  .pal-list{max-height:52vh;overflow:auto;padding:6px;scrollbar-width:none}
+  .pal-list::-webkit-scrollbar{width:0;display:none}
+  .pal-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;font-family:var(--mono);font-size:12.5px;color:var(--muted)}
+  .pal-row.sel{background:var(--brand-dim);color:var(--ink)}
+  .pal-row .pk{font-size:9px;letter-spacing:.04em;color:var(--faint);border:1px solid var(--line);border-radius:999px;padding:1px 7px;flex:none;text-transform:uppercase}
+  .pal-row.sel .pk{border-color:rgba(78,201,176,.4);color:var(--brand)}
+  .pal-row .pl{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
+  .pal-row .ph{font-size:10.5px;color:var(--faint);flex:none;max-width:40%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
+  .pal-empty{padding:18px;text-align:center;color:var(--faint);font-family:var(--mono);font-size:12px}
   .pick{width:min(560px,92vw);max-height:76vh;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line-hi);border-radius:14px;overflow:hidden;font-family:var(--mono)}
   .pick-h{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--line)}
   .pick-h .t{font-size:13px;color:var(--ink);font-weight:600}
@@ -215,6 +242,16 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   .sec-row .shint{color:var(--faint);font-size:11px;font-family:var(--mono)}
   .sec-row .sdel{color:var(--faint);border:none;background:none;cursor:pointer;font-size:14px;padding:0 4px}
   .sec-row .sdel:hover{color:var(--failed)}
+  .leaf-h .pane-act{font-family:var(--mono);font-size:10px;color:var(--brand);opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
+  .leaf-h .pane-act:empty{display:none}
+  .tnode.run .ract{margin-left:6px;font-size:10px;color:var(--brand);opacity:.85}
+  .leaf-h .zoom{color:var(--faint);border:none;background:none;cursor:pointer;font-size:12px;padding:0 2px}
+  .leaf-h .zoom:hover{color:var(--brand)}
+  .leaf-h .pact{color:var(--faint);border:none;background:none;cursor:pointer;font-size:12px;padding:0 2px}
+  .leaf-h .pact:hover{color:var(--brand)}
+  .leaf-h .bsel{display:none;color:var(--faint);border:none;background:none;cursor:pointer;font-size:11px;padding:0 2px}
+  body.bcastmode .leaf-h .bsel{display:inline-block}   /* 브로드캐스트 모드에서만 대상 선택 토글 노출 */
+  .leaf-h .bsel.on{color:var(--open)}
   .leaf-h .lock{color:var(--faint);border:none;background:none;cursor:pointer;font-size:12px;padding:0 2px}
   .leaf-h .lock:hover{color:var(--brand)}
   .leaf-h .sendkey{font:inherit;font-family:var(--mono);font-size:11px;color:var(--ink);background:var(--panel);border:1px solid var(--brand);border-radius:5px;padding:1px 6px;width:150px;outline:none}
@@ -259,6 +296,9 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   .rv-diff > span{display:block;min-height:1.2em}
   .dl-file{color:var(--brand)} .dl-hunk{color:var(--open)} .dl-ctx{color:var(--muted)}
   .dl-add{color:#7fdca0;background:rgba(88,179,104,.08)} .dl-del{color:#e58a92;background:rgba(226,91,103,.08)}
+  .rv-diff .ws{color:var(--faint);opacity:.55}
+  .rv-ws{font-family:var(--mono);font-size:11px;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:3px 8px;cursor:pointer}
+  .rv-ws:hover{color:var(--ink)} .rv-ws.on{color:var(--brand-ink);background:var(--brand);border-color:var(--brand)}
   .rv-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--faint);font-family:var(--mono);font-size:13px;text-align:center;padding:24px}
   /* ── 모바일 대응 (드로어 트리 + 단일 터미널 + IME 입력바) ── */
@@ -339,7 +379,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
 </header>
 <div class="scrim" id="scrim"></div>
-<div class="layout">
+<div class="layout" id="layout">
   <aside class="rail" id="rail">
     <div class="lbl"><span>Workspace</span><span id="machName" style="color:var(--faint)">local</span></div>
     <div id="tree"></div>
@@ -354,10 +394,18 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
         <button class="tc-btn" id="splitCol" title="가로 분할 — 포커스 페인을 상하로" disabled>▬ split</button>
         <button class="tc-btn session" id="sessionBtn" title="자유 세션(폴더 지정 터미널) 열기">＋<span class="b-txt"> Session</span></button>
         <button class="tc-btn" id="fileBtn" title="파일 보기 — md·html·pdf·이미지·텍스트 뷰어(터미널 옆 페인)">▤<span class="b-txt"> File</span></button>
+        <button class="tc-btn" id="focusBtn" title="포커스 모드 — 트리·요청바 숨기고 페인만 (⌘.)">◱<span class="b-txt"> Focus</span></button>
         <button class="tc-btn" id="closeBtn" title="포커스 페인 닫기(탭은 유지)" disabled>×<span class="b-txt"> pane</span></button>
       </div>
     </div>
     <div class="panes" id="panes"></div>
+    <div class="term-find" id="termFind" hidden>
+      <input id="findInput" placeholder="터미널에서 찾기 (⌘F)" autocomplete="off" spellcheck="false" />
+      <span class="fc" id="findCount"></span>
+      <button type="button" id="findPrev" title="이전 (⇧⏎)">↑</button>
+      <button type="button" id="findNext" title="다음 (⏎)">↓</button>
+      <button type="button" id="findClose" title="닫기 (esc)">×</button>
+    </div>
     <div class="empty" id="empty">
       <div class="card">
         <div class="glyph">⌗ ⌗ ⌗</div>
@@ -421,6 +469,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
       <input id="rvVcmd" placeholder="예: npm test — 정착 시 자동 실행" autocomplete="off" />
       <button type="button" id="rvVsave">save</button>
     </span>
+    <button type="button" id="rvWs" class="rv-ws" title="공백 표시(스페이스·탭)">␣ 공백</button>
     <span id="rvHint" style="margin-left:auto;color:var(--faint)">정착하면 자동 검증 · 승자를 base 에 merge</span>
   </div>
   <div class="rv-cols" id="rvCols"></div>
@@ -479,12 +528,20 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   </div>
 </div>
+<div class="modal" id="palette">
+  <div class="pal">
+    <input id="palInput" placeholder="이동·명령 검색 (⌘K)  ·  세션·run·프로젝트·명령" autocomplete="off" spellcheck="false" />
+    <div class="pal-list" id="palList"></div>
+  </div>
+</div>
 <div class="toast" id="toast"></div>
 <script src="/vendor/xterm.js"></script>
 <script src="/vendor/addon-fit.js"></script>
 <script src="/vendor/addon-unicode11.js"></script>
 <script src="/vendor/addon-web-links.js"></script>
+<script src="/vendor/addon-search.js"></script>
 <script src="/vendor/marked.js"></script>
 <script>
   // 모바일 = 터미널 우선을 유지하되 좁은 화면에 맞춤(드로어 트리 + 단일 터미널 + IME 입력바).
@@ -496,6 +553,23 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   function toast(msg){ var t=$('toast'); t.textContent=msg; t.classList.add('show'); clearTimeout(toast._h); toast._h=setTimeout(function(){ t.classList.remove('show'); }, 2600); }
   var V_GLYPH = { pass:'✓ verify', fail:'✗ verify', running:'⋯ verify', error:'! verify' };
   function vbadge(status){ if (!status || !V_GLYPH[status]) return ''; return '<span class="vbadge '+status+'" data-role="vbadge">'+V_GLYPH[status]+'</span>'; }
+  // 라이브 상태 — run 의 최신 이벤트에서 "지금 뭐 하는지"(도구명/사고)를 뽑는다. 실행 중일 때만.
+  function latestActivity(runId){
+    var r=runById[runId]; if(!r) return '';
+    if(r.status!=='running' && r.status!=='pending') return '';
+    var evs=r.events||[];
+    for(var i=evs.length-1;i>=0;i--){
+      var e=evs[i], k=e.kind;
+      if(k==='steer') return 'steer'; if(k==='ask') return 'asking';
+      if(k!=='assistant') continue;
+      try{ var o=JSON.parse(e.payload);
+        var c=o&&o.message&&o.message.content;
+        if(c&&c.length){ for(var j=c.length-1;j>=0;j--){ if(c[j].type==='tool_use') return c[j].name||'tool'; if(c[j].type==='text'&&(c[j].text||'').trim()) return 'thinking'; } }
+        else if(o&&o.text) return 'thinking';
+      }catch(_){}
+    }
+    return r.status==='pending' ? 'starting' : 'working';
+  }
   // ── fleet 상태 ──
   var fleet = { machines:[], repos:[], tasks:[], groups:[], runs:[], providers:[] };
@@ -503,6 +577,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   var fold = {};   // 접힘 상태(repo/goal/task 노드)
   function isFold(k){ return fold[k]===true; }
   function repoOfRun(runId){ var r=runById[runId]; var t=r&&taskById[r.taskId]; return t?t.repoId:null; }
+  function runIsSession(runId){ var r=runById[runId]; var t=r&&taskById[r.taskId]; var rp=t&&repoById[t.repoId]; return !!(rp&&rp.kind==='sessions'); }
   async function hydrate(){
     try{
@@ -595,8 +670,9 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
       + '<span class="n">'+esc(t.title)+'</span></div>';
     if (!isFold(tk)) rns.sort(function(a,b){return a.id-b.id;}).forEach(function(r){
       var open = tabs[r.id] ? ' open' : '';
+      var act=latestActivity(r.id);
       s += '<div class="tnode run'+open+'" data-run="'+r.id+'"><span class="st '+esc(r.status)+'"></span>'
-        + '<span class="n">r'+r.id+' · '+esc(r.status)+'</span></div>';
+        + '<span class="n">r'+r.id+' · '+esc(r.status)+'</span>'+(act?'<span class="ract">'+esc(act)+'</span>':'')+'</div>';
     });
     return s;
   }
@@ -623,6 +699,8 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   var tabOrder = [];         // 탭 바 순서(runId)
   var layout = { leaf:true, id:'L0', tab:null };  // 분할 트리 루트
   var focusLeaf = 'L0';
+  var zoomLeaf = null;   // 페인 최대화(줌) — 설정되면 그 리프만 전체 렌더
+  var bcastSel = {};     // 브로드캐스트 선택 대상(tab id → true). 비어있으면 전체.
   var leafSeq = 1;
   var viewerSeq = 1;         // 뷰어 탭 키(문자열 'v#')
   var MAX_LEAVES = 6;
@@ -682,6 +760,10 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
       }
       cb(links.length?links:undefined);
     }}); }catch(e){}
+    // 스크롤백 검색(⌘F) — SearchAddon. t.search 에 보관, 검색바가 findNext/Previous 호출.
+    var search=null; try{ search=new window.SearchAddon.SearchAddon(); term.loadAddon(search);
+      search.onDidChangeResults(function(e){ if($('termFind') && !$('termFind').hidden && focusedRunId()===runId){ var c=$('findCount'); if(c){ var n=(e&&e.resultCount)||0; c.textContent = n ? (((e.resultIndex>=0?e.resultIndex+1:0))+'/'+n) : '0'; } } });
+    }catch(e){}
     // 복사 배선: xterm 은 user-select:none 이라 네이티브 선택이 없다 → term.getSelection() 을 직접 클립보드로.
     // ① 드래그 놓으면 자동 복사(select-to-copy) ② Cmd/Ctrl+C 로도 복사(선택 없으면 통과 → SIGINT).
     var copySel=function(){ var s=''; try{ s=term.getSelection(); }catch(e){} if(!s) return false;
@@ -691,13 +773,15 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     host.addEventListener('mouseup', function(){ copySel(); });
     host.addEventListener('touchend', function(){ copySel(); });
     term.attachCustomKeyEventHandler(function(ev){
-      if(ev.type==='keydown' && (ev.metaKey||ev.ctrlKey) && (ev.key==='c'||ev.key==='C')){
-        if(term.hasSelection()){ copySel(); return false; }
+      if(ev.type==='keydown' && (ev.metaKey||ev.ctrlKey)){
+        if(ev.key==='c'||ev.key==='C'){ if(term.hasSelection()){ copySel(); return false; } }
+        // 전역 단축키(⌘K·⌘F·⌘⏎·⌘1~9)는 터미널로 보내지 않는다 — 문서 핸들러가 처리.
+        if(ev.key==='k'||ev.key==='K'||ev.key==='f'||ev.key==='F'||ev.key==='Enter'||ev.key==='.'||(ev.key>='1'&&ev.key<='9')) return false;
       }
       return true;
     });
     // term.open 은 host 가 DOM 에 붙은 뒤(attachHosts) 최초 1회 — detached 에서 open 하면 렌더러가 안 뜬다.
-    var t={ runId:runId, name:tabName(runId), term:term, fit:fit, ws:null, retry:0, closing:false, host:host, ro:null, opened:false, connected:false };
+    var t={ runId:runId, name:tabName(runId), term:term, fit:fit, ws:null, retry:0, closing:false, host:host, ro:null, opened:false, connected:false, search:search };
     term.onData(function(d){ if(t.ws&&t.ws.readyState===1) t.ws.send(JSON.stringify({t:'i',d:d})); });
     tabs[runId]=t; tabOrder.push(runId);
     return t;   // open·connect 는 attachHosts 에서(Phase 2 순서: open → connect)
@@ -759,7 +843,10 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
         var fp=document.createElement('iframe'); fp.src=rawUrl;   // 브라우저/Electron 내장 PDF 뷰어(수동적 — sandbox 불필요)
         body.innerHTML=''; body.appendChild(fp);
       } else if(d.kind==='image'){
-        body.innerHTML=''; var im=document.createElement('img'); im.src=rawUrl; im.alt=t.name; body.appendChild(im);
+        body.innerHTML=''; var im=document.createElement('img'); im.alt=t.name;
+        // 브라우저가 못 그리는 형식(HEIC/TIFF 등)이나 로드 실패 시 조용히 빈 화면 대신 이유+원본 링크
+        im.onerror=function(){ body.innerHTML='<div class="view-msg">이 이미지를 표시할 수 없습니다 · '+fmtSize(d.size||0)+'<br><span style="color:var(--faint)">브라우저가 못 그리는 형식일 수 있어요 (예: HEIC·TIFF)</span><br><br><a href="'+rawUrl+'" target="_blank">원본 열기 / 내려받기</a></div>'; };
+        im.src=rawUrl; body.appendChild(im);
       } else if(d.kind==='binary'){
         body.innerHTML='<div class="view-msg">미리보기 불가 · '+fmtSize(d.size||0)+(d.note?(' · '+esc(d.note)):'')+'<br><br><a href="'+rawUrl+'" target="_blank">원본 열기 / 내려받기</a></div>';
       } else { // text
@@ -849,15 +936,20 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
       var leaf=document.createElement('div'); leaf.className='leaf'+(node.id===focusLeaf?' focus':''); leaf.dataset.leaf=node.id;
       var t=node.tab!=null?tabs[node.tab]:null; var r=node.tab!=null?runById[node.tab]:null;
       var head=document.createElement('div'); head.className='leaf-h'; head.dataset.leafhead=node.id;
+      var zoomBtn = '<button class="zoom" data-zoom="'+node.id+'" title="이 페인 최대화 (⌘⏎)">'+(zoomLeaf?'⤡':'⤢')+'</button>';
       head.innerHTML = t
         ? (t.kind==='viewer'
           ? '<span class="st vdoc">▤</span><span class="nm">'+esc(t.name)+'</span>'
-            + '<button class="x" title="이 페인 닫기(뷰어 유지)">×</button>'
+            + zoomBtn + '<button class="x" title="이 페인 닫기(뷰어 유지)">×</button>'
           : '<span class="st '+esc(r?r.status:'')+'"></span><span class="nm">'+esc(t.name)+'</span>'
+            + '<span data-role="act" class="pane-act">'+esc(latestActivity(node.tab))+'</span>'
             + '<span data-role="chip" class="chip '+esc(r?r.status:'')+'">'+esc(r?r.status:'')+'</span>'
             + '<span data-role="vslot">'+vbadge(r&&r.verifyStatus)+'</span>'
+            + '<button class="bsel'+(bcastSel[node.tab]?' on':'')+'" data-bcast="'+node.tab+'" title="브로드캐스트 대상 토글">'+(bcastSel[node.tab]?'◉':'◯')+'</button>'
+            + (runIsSession(node.tab)?'':'<button class="pact" data-diff="'+node.id+'" title="이 run 의 diff (Review)">⧉</button>')
+            + '<button class="pact" data-hist="'+node.id+'" title="이 run 히스토리 (대화·터미널)">↺</button>'
             + '<button class="lock" data-lock="'+node.id+'" title="이 페인에 시크릿/비밀번호 전송(터미널에 안 찍힘)">⊟</button>'
-            + '<button class="x" title="이 페인 닫기(탭은 유지)">×</button>')
+            + zoomBtn + '<button class="x" title="이 페인 닫기(탭은 유지)">×</button>')
         : '<span class="nm" style="color:var(--faint)">빈 페인</span><button class="x" title="이 페인 닫기">×</button>';
       var body=document.createElement('div'); body.className='leaf-body'; body.dataset.leafbody=node.id;
       if (!t){ var em=document.createElement('div'); em.className='leaf-empty'; em.textContent='탭을 여기로 드래그하거나 탭을 클릭하세요'; body.appendChild(em); }
@@ -887,7 +979,11 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     $('panes').style.display = n?'flex':'none';
     renderTabs();
     var host=$('panes'); host.innerHTML='';
-    if (n){ host.appendChild(buildNode(layout)); attachHosts(); }
+    if (n){
+      var zl = zoomLeaf ? findLeaf(zoomLeaf) : null;   // 줌: 그 리프만 전체 렌더(레이아웃은 메모리에 보존)
+      var root = zl ? { leaf:true, id:zl.id, tab:zl.tab } : layout;
+      host.appendChild(buildNode(root)); attachHosts();
+    }
     updateControls();
     if (typeof reqMode!=='undefined') setMode(reqMode);
     requestAnimationFrame(fitAllVisible);
@@ -900,9 +996,41 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     updateControls();
     if (typeof reqMode!=='undefined' && reqMode!=='new') setMode(reqMode);
   }
+  // 페인 최대화(줌) 토글 — 포커스 페인(또는 지정 leaf)만 전체로. 다시 누르면 복원.
+  function toggleZoom(id){
+    var target = id || focusLeaf;
+    if(zoomLeaf===target){ zoomLeaf=null; }
+    else { var l=findLeaf(target); if(!l || l.tab==null) return; zoomLeaf=target; focusLeaf=target; }
+    render();
+  }
+  // 페인 순서(트리 순회) → ⌘1..9 로 N번째 포커스
+  function leafOrder(){ var out=[]; eachLeaf(layout,function(l){ out.push(l); }); return out; }
+  // ── 레이아웃 저장/복원 (localStorage, 기기별) ──
+  // 트리 + 각 페인의 탭을 복원 키(run=runId · viewer=경로)로 직렬화한다.
+  function serializeNode(node){
+    if(node.leaf){ var d=null; if(node.tab!=null){ var t=tabs[node.tab]; if(t){ d = (t.kind==='viewer') ? {type:'viewer',path:t.path,name:t.name} : {type:'run',runId:node.tab}; } }
+      return {leaf:true, tab:d}; }
+    return {split:true, dir:node.dir, ratio:node.ratio, a:serializeNode(node.a), b:serializeNode(node.b)};
+  }
+  function rebuildNode(sn){
+    if(sn.leaf){ var tabId=null;
+      if(sn.tab){ if(sn.tab.type==='viewer'){ var vt=ensureViewer(sn.tab.path, sn.tab.name); tabId=vt.runId; }
+        else if(sn.tab.type==='run' && runById[sn.tab.runId]){ ensureTab(sn.tab.runId); tabId=sn.tab.runId; } }
+      return {leaf:true, id:newLeafId(), tab:tabId}; }
+    return {split:true, id:newLeafId(), dir:sn.dir, ratio:sn.ratio, a:rebuildNode(sn.a), b:rebuildNode(sn.b)};
+  }
+  function loadLayouts(){ try{ return JSON.parse(localStorage.getItem('coxpit.layouts')||'{}')||{}; }catch(e){ return {}; } }
+  function saveLayouts(o){ try{ localStorage.setItem('coxpit.layouts', JSON.stringify(o)); }catch(e){} }
+  function saveLayout(){ if(!tabOrder.length){ toast('저장할 페인이 없습니다'); return; } var nm=prompt('레이아웃 이름'); if(!nm||!nm.trim()) return; nm=nm.trim();
+    var o=loadLayouts(); o[nm]={tree:serializeNode(layout), ts:Date.now()}; saveLayouts(o); toast('레이아웃 저장 · '+nm); }
+  function restoreLayout(nm){ var o=loadLayouts(); var s=o[nm]; if(!s){ toast('없는 레이아웃'); return; }
+    layout=rebuildNode(s.tree); zoomLeaf=null; var f=firstLeaf(); focusLeaf=f?f.id:'L0'; render(); renderTree(); toast('레이아웃 복원 · '+nm); }
+  function deleteLayout(nm){ var o=loadLayouts(); delete o[nm]; saveLayouts(o); toast('레이아웃 삭제 · '+nm); }
   // 탭 열기 = 포커스 슬롯에 표시(강제 분할 없음). 기존 호출부(openRunPane) 호환.
   function openTab(runId){
+    zoomLeaf=null;   // 새 탭은 보여야 하므로 줌 해제
     if(!tabs[runId]) ensureTab(runId);   // 뷰어 탭은 ensureViewer 로 이미 생성됨 → 터미널로 오생성 방지
     var l=leafOfTab(runId);
     if (l){ setLeafFocus(l.id); return; }
@@ -915,6 +1043,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   function splitFocused(dir){
     if (!tabOrder.length) return;
+    zoomLeaf=null;
     if (isMobile()){ toast('창분할은 데스크톱 전용 — 모바일은 탭으로 전환하세요'); return; }
     if (countLeaves()>=MAX_LEAVES){ toast('페인 최대 '+MAX_LEAVES+'개'); return; }
     var l=findLeaf(focusLeaf) || firstLeaf(); if(!l) return;
@@ -924,6 +1053,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     focusLeaf=bId; render(); renderTree();
   }
   function closeSlot(id){
+    zoomLeaf=null;
     if (countLeaves()<=1){ var only=findLeaf(id)||firstLeaf(); if(only) only.tab=null; if(only) focusLeaf=only.id; render(); renderTree(); return; }
     (function walk(node){
       if(node.leaf) return false;
@@ -935,6 +1065,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     render(); renderTree();
   }
   function closeTab(runId){
+    zoomLeaf=null;
     var t=tabs[runId]; if(!t) return; t.closing=true;
     try{ if(t.ws) t.ws.close(); }catch(e){}
     try{ if(t.ro) t.ro.disconnect(); }catch(e){}
@@ -953,6 +1084,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   }
   function tileTabs(ids){
     ids=(ids||[]).filter(function(x){return x!=null;}); if(!ids.length) return;
+    zoomLeaf=null;
     ids.forEach(ensureTab);
     layout=buildTiled(ids,'row'); var f=firstLeaf(); focusLeaf=f?f.id:'L0';
     render(); renderTree();
@@ -970,6 +1102,7 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
       var st=head.querySelector('.st'); if(st) st.className='st '+r.status;
       var chip=head.querySelector('[data-role=chip]'); if(chip){ chip.className='chip '+r.status; chip.textContent=r.status; }
       var vslot=head.querySelector('[data-role=vslot]'); if(vslot) vslot.innerHTML=vbadge(r.verifyStatus);
+      var act=head.querySelector('[data-role=act]'); if(act) act.textContent=latestActivity(l.tab);
     });
   }
@@ -1010,6 +1143,16 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   // ── 페인(슬롯) 이벤트: 포커스·닫기·드롭·리사이즈 ──
   $('panes').addEventListener('click', function(e){
+    var zoomBtn=e.target.closest('[data-zoom]');
+    if (zoomBtn){ e.stopPropagation(); toggleZoom(zoomBtn.getAttribute('data-zoom')); return; }
+    var bcBtn=e.target.closest('[data-bcast]');
+    if (bcBtn){ e.stopPropagation(); var bid=bcBtn.getAttribute('data-bcast'); bcastSel[bid]=!bcastSel[bid];
+      bcBtn.classList.toggle('on', !!bcastSel[bid]); bcBtn.textContent = bcastSel[bid]?'◉':'◯';
+      if(reqMode==='bcast') setMode('bcast'); return; }
+    var diffBtn=e.target.closest('[data-diff]');
+    if (diffBtn){ e.stopPropagation(); var dl=findLeaf(diffBtn.getAttribute('data-diff')); if(dl&&dl.tab!=null) openReviewForRun(dl.tab); return; }
+    var histBtn=e.target.closest('[data-hist]');
+    if (histBtn){ e.stopPropagation(); var hl=findLeaf(histBtn.getAttribute('data-hist')); if(hl&&hl.tab!=null){ setLeafFocus(hl.id); openHistory(); } return; }
     var lockBtn=e.target.closest('[data-lock]');
     if (lockBtn){ e.stopPropagation(); startSecretSend(lockBtn.getAttribute('data-lock'), lockBtn); return; }
     var leaf=e.target.closest('[data-leaf]'); if(!leaf) return;
@@ -1047,6 +1190,106 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   $('menuBtn').addEventListener('click', function(){ setDrawer(!$('rail').classList.contains('open')); });
   $('scrim').addEventListener('click', function(){ setDrawer(false); });
+  // ── 터미널 스크롤백 검색(⌘F) ──
+  function focusedTermTab(){ var rid=focusedRunId(); var t=(rid!=null)?tabs[rid]:null; return (t && t.term && t.search) ? t : null; }
+  var FIND_DECO={ matchBackground:'#3a4a2e', activeMatchBackground:'#4ec9b0', activeMatchColorOverviewRuler:'#4ec9b0', matchOverviewRuler:'#33415580' };
+  function runFind(dir){ var t=focusedTermTab(); var q=$('findInput').value; if(!t){ return; } if(!q){ try{ t.search.clearDecorations(); }catch(e){} var c=$('findCount'); if(c) c.textContent=''; return; }
+    try{ if(dir<0) t.search.findPrevious(q,{decorations:FIND_DECO}); else t.search.findNext(q,{decorations:FIND_DECO}); }catch(e){} }
+  function openFind(){ var t=focusedTermTab(); if(!t){ toast('검색할 터미널 페인을 먼저 선택하세요'); return; } $('termFind').hidden=false; var i=$('findInput'); i.focus(); i.select(); if(i.value) runFind(1); }
+  function closeFind(){ $('termFind').hidden=true; var t=focusedTermTab(); if(t){ try{ t.search.clearDecorations(); t.term.focus(); }catch(e){} } }
+  $('findInput').addEventListener('input', function(){ runFind(1); });
+  $('findInput').addEventListener('keydown', function(e){ if(e.key==='Enter'){ e.preventDefault(); runFind(e.shiftKey?-1:1); } else if(e.key==='Escape'){ e.preventDefault(); closeFind(); } });
+  $('findNext').addEventListener('click', function(){ runFind(1); });
+  $('findPrev').addEventListener('click', function(){ runFind(-1); });
+  $('findClose').addEventListener('click', closeFind);
+  document.addEventListener('keydown', function(e){
+    if((e.metaKey||e.ctrlKey) && (e.key==='f'||e.key==='F') && !e.shiftKey && !e.altKey){
+      if(focusedTermTab()){ e.preventDefault(); openFind(); }
+    }
+  });
+  // ── ⌘K 커맨드 팔레트 — 이동(세션·run·프로젝트) + 명령 ──
+  var palItems=[], palSel=0;
+  function paletteItems(){
+    var items=[
+      {k:'cmd', label:'새 작업 세션 열기', run:openSession},
+      {k:'cmd', label:'파일 열기 (뷰어)', run:openFilePicker},
+      {k:'cmd', label:'터미널 검색 (⌘F)', run:openFind},
+      {k:'cmd', label:'세로 분할', run:function(){ splitFocused('row'); }},
+      {k:'cmd', label:'가로 분할', run:function(){ splitFocused('col'); }},
+      {k:'cmd', label:'포커스 페인 닫기', run:function(){ if(focusLeaf) closeSlot(focusLeaf); }},
+      {k:'cmd', label:'포커스 모드 (트리 숨김, ⌘.)', run:toggleFocus},
+      {k:'cmd', label:'페인 최대화 토글 (⌘⏎)', run:function(){ toggleZoom(focusLeaf); }},
+      {k:'cmd', label:'레이아웃 저장 (현재 페인 배치)', run:saveLayout},
+      {k:'cmd', label:'뷰어 / 히스토리', run:openHistory},
+      {k:'cmd', label:'Review 열기 (비교·머지)', run:showReview},
+      {k:'cmd', label:'시크릿 (env 주입)', run:openSecrets},
+      {k:'cmd', label:'보드로 전환', run:function(){ location.href='/'; }}
+    ];
+    // 세션 → 페인으로 열기
+    var runs=[]; Object.keys(runById).forEach(function(id){ runs.push(runById[id]); });
+    runs.sort(function(a,b){ return b.id-a.id; });
+    runs.forEach(function(r){
+      var task=taskById[r.taskId]; var repo=task&&repoById[task.repoId];
+      if(repo && repo.kind==='sessions'){ items.push({k:'session', label:(task&&task.title)||('session r'+r.id), hint:'r'+r.id, run:function(){ openRunPane(r.id); }}); }
+    });
+    // run → 페인으로 열기 (최근 40개)
+    var n=0; runs.forEach(function(r){
+      var task=taskById[r.taskId]; var repo=task&&repoById[task.repoId];
+      if(repo && repo.kind==='sessions') return; if(n>=40) return; n++;
+      items.push({k:'run', label:'r'+r.id+' · '+(repo?repo.name:'?')+' / '+((task&&task.title)||''), hint:r.status, run:function(){ openRunPane(r.id); }});
+    });
+    // 프로젝트 → 요청바 대상 지정(팬아웃 준비)
+    Object.keys(repoById).forEach(function(id){ var repo=repoById[id]; if(repo.kind==='sessions') return;
+      items.push({k:'project', label:repo.name, hint:'팬아웃 대상 지정', run:function(){ try{ $('reqRepo').value=String(repo.id); }catch(e){} var i=$('reqInput'); if(i){ i.focus(); } }}); });
+    // 저장된 레이아웃 → 복원 / 삭제
+    var lays=loadLayouts(); var names=Object.keys(lays);
+    names.forEach(function(nm){ items.push({k:'layout', label:'레이아웃 · '+nm, hint:'복원', run:function(){ restoreLayout(nm); }}); });
+    names.forEach(function(nm){ items.push({k:'layout', label:'레이아웃 삭제 · '+nm, hint:'삭제', run:function(){ deleteLayout(nm); }}); });
+    return items;
+  }
+  function renderPalette(q){
+    q=(q||'').trim().toLowerCase();
+    var all=paletteItems();
+    palItems = q ? all.filter(function(it){ return (it.label+' '+(it.hint||'')+' '+it.k).toLowerCase().indexOf(q)>=0; }) : all;
+    palSel=0;
+    if(!palItems.length){ $('palList').innerHTML='<div class="pal-empty">일치 없음</div>'; return; }
+    $('palList').innerHTML = palItems.map(function(it,i){
+      return '<div class="pal-row'+(i===0?' sel':'')+'" data-i="'+i+'"><span class="pk">'+esc(it.k)+'</span><span class="pl">'+esc(it.label)+'</span>'+(it.hint?'<span class="ph">'+esc(it.hint)+'</span>':'')+'</div>';
+    }).join('');
+  }
+  function palMove(d){ if(!palItems.length) return; palSel=(palSel+d+palItems.length)%palItems.length;
+    var rows=$('palList').querySelectorAll('.pal-row'); rows.forEach(function(el,i){ el.classList.toggle('sel', i===palSel); });
+    var sel=rows[palSel]; if(sel) sel.scrollIntoView({block:'nearest'}); }
+  function palRun(i){ var it=palItems[i]; if(!it) return; closePalette(); try{ it.run(); }catch(e){} }
+  function openPalette(){ $('palette').classList.add('on'); var i=$('palInput'); i.value=''; renderPalette(''); i.focus(); }
+  function closePalette(){ $('palette').classList.remove('on'); }
+  $('palInput').addEventListener('input', function(){ renderPalette(this.value); });
+  $('palInput').addEventListener('keydown', function(e){
+    if(e.key==='ArrowDown'){ e.preventDefault(); palMove(1); }
+    else if(e.key==='ArrowUp'){ e.preventDefault(); palMove(-1); }
+    else if(e.key==='Enter'){ e.preventDefault(); palRun(palSel); }
+    else if(e.key==='Escape'){ e.preventDefault(); closePalette(); }
+  });
+  $('palList').addEventListener('click', function(e){ var row=e.target.closest('[data-i]'); if(row) palRun(Number(row.dataset.i)); });
+  $('palette').addEventListener('click', function(e){ if(e.target===this) closePalette(); });
+  document.addEventListener('keydown', function(e){
+    if((e.metaKey||e.ctrlKey) && (e.key==='k'||e.key==='K')){ e.preventDefault(); if($('palette').classList.contains('on')) closePalette(); else openPalette(); }
+  });
+  // ── 포커스 모드 — 트리·요청바 숨기고 페인만 ──
+  function toggleFocus(){ var on=$('layout').classList.toggle('focusmode'); $('focusBtn').classList.toggle('on', on); requestAnimationFrame(fitAllVisible); setTimeout(fitAllVisible, 120); }
+  $('focusBtn').addEventListener('click', toggleFocus);
+  // ── 페인 단축키: ⌘. 포커스 모드 · ⌘⏎ 최대화 토글 · ⌘1~9 N번째 페인 포커스 ──
+  function typingInField(e){ var el=e.target; if(!el) return false; var tag=el.tagName||''; return (tag==='INPUT'||tag==='TEXTAREA') && !el.classList.contains('xterm-helper-textarea'); }
+  document.addEventListener('keydown', function(e){
+    if(!(e.metaKey||e.ctrlKey) || e.altKey) return;
+    if(e.key==='.'){ if(!typingInField(e)){ e.preventDefault(); toggleFocus(); } return; }
+    if(!tabOrder.length || typingInField(e)) return;
+    if(e.key==='Enter' && !e.shiftKey){ e.preventDefault(); toggleZoom(focusLeaf); return; }
+    if(e.key>='1' && e.key<='9'){ var order=leafOrder(); var idx=Number(e.key)-1; if(order[idx]){ e.preventDefault(); if(zoomLeaf){ zoomLeaf=order[idx].id; focusLeaf=order[idx].id; render(); } else setLeafFocus(order[idx].id); } }
+  });
   // ── 모바일 터미널 입력바 — 조합 완료 텍스트를 통째로 포커스 탭의 PTY 로(IME 안전) ──
   function focusedWs(){ var rid=focusedRunId(); return (rid!=null && tabs[rid]) ? tabs[rid].ws : null; }
   function termSendRaw(d){ var ws=focusedWs(); if(ws && ws.readyState===1) ws.send(JSON.stringify({t:'i',d:d})); }
@@ -1262,10 +1505,12 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     else if (m==='steer'){ var rid=focusRun(); go.textContent='Steer ⏎';
       $('reqTgt').textContent = rid?('➤ r'+rid+' 에 후속 지시'):'포커스한 페인 없음';
       inp.placeholder = rid?('r'+rid+' 에이전트에게 다음 지시…'):'왼쪽 트리에서 run 을 열어 포커스하세요'; }
-    else { go.textContent='Send ⏎'; var n=tabOrder.length;
-      $('reqTgt').textContent = '⊞ 열린 탭 '+n+'개에 브로드캐스트';
-      inp.placeholder = n?('열린 '+n+'개 터미널에 그대로 전송 (엔터 포함)'):'열린 탭이 없습니다'; }
+    else { go.textContent='Send ⏎'; var n=tabOrder.length; var sel=bcastCount();
+      $('reqTgt').textContent = sel ? ('⊞ 선택 '+sel+'개 페인에 전송') : ('⊞ 열린 탭 '+n+'개 전체에 전송');
+      inp.placeholder = n?(sel?('선택한 '+sel+'개에만 그대로 전송'):'전체 '+n+'개 터미널에 전송 — 페인 ◯ 로 대상 선택'):'열린 탭이 없습니다'; }
+    document.body.classList.toggle('bcastmode', m==='bcast');
   }
+  function bcastCount(){ var c=0; Object.keys(bcastSel).forEach(function(k){ if(bcastSel[k] && tabs[k] && tabs[k].ws) c++; }); return c; }
   Array.prototype.forEach.call(document.querySelectorAll('.mode'), function(b){ b.addEventListener('click', function(){ setMode(b.dataset.mode); $('reqInput').focus(); }); });
   var submitting = false;
@@ -1302,13 +1547,14 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
         else { var j = await res.json().catch(function(){return{};}); toast('steer 불가: '+(j.error||res.status)); }
       }catch(e){ toast('steer 실패: '+e); }
       finally{ submitting=false; $('reqGo').disabled=false; }
-    } else { // broadcast
+    } else { // broadcast — 선택 페인이 있으면 거기로만, 없으면 열린 탭 전체
       if (!tabOrder.length){ toast('열린 탭이 없습니다'); return; }
       var payload = text + '\\r';
+      var onlySel = bcastCount()>0;
       var sent=0;
-      tabOrder.forEach(function(rid){ var t=tabs[rid]; if (t && t.ws && t.ws.readyState===1){ t.ws.send(JSON.stringify({t:'i',d:payload})); sent++; } });
+      tabOrder.forEach(function(rid){ if(onlySel && !bcastSel[rid]) return; var t=tabs[rid]; if (t && t.ws && t.ws.readyState===1){ t.ws.send(JSON.stringify({t:'i',d:payload})); sent++; } });
       inp.value='';
-      toast('브로드캐스트 → '+sent+'개 탭');
+      toast('브로드캐스트 → '+sent+'개'+(onlySel?' (선택)':' (전체)'));
     }
   }
   $('reqGo').addEventListener('click', submitReq);
@@ -1318,6 +1564,8 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
   var reviewOn = false, rvTaskId = null;
   function showTerminal(){ reviewOn=false; $('review').classList.remove('on'); $('vtReview').classList.remove('on'); $('vtTerm').classList.add('on'); }
   function showReview(){ reviewOn=true; $('review').classList.add('on'); $('vtReview').classList.add('on'); $('vtTerm').classList.remove('on'); renderReviewPicker(); }
+  // 페인 헤더 → 이 run 의 diff 를 Review 로 (그 run 의 태스크 선택 후 compare)
+  function openReviewForRun(runId){ var r=runById[runId]; if(!r){ toast('run 정보 없음'); return; } showReview(); rvTaskId=r.taskId; try{ $('rvTask').value=String(r.taskId); }catch(e){} syncVcmd(); loadCompare(r.taskId); }
   $('vtTerm').addEventListener('click', showTerminal);
   $('vtReview').addEventListener('click', showReview);
   function reviewableTasks(){
@@ -1339,10 +1587,14 @@ export const COCKPIT_HTML = /* html */ `<!doctype html>
     loadCompare(rvTaskId);
   }
   $('rvTask').addEventListener('change', function(){ rvTaskId=Number(this.value); syncVcmd(); loadCompare(rvTaskId); });
+  $('rvWs').addEventListener('click', function(){ rvShowWs=!rvShowWs; this.classList.toggle('on', rvShowWs); if(rvTaskId!=null) loadCompare(rvTaskId); });
+  var rvShowWs=false;
+  function revealWs(e){ return e.replace(/ /g,'<span class="ws">·</span>').replace(/\\t/g,'<span class="ws">→\\u2003</span>'); }
   function diffHTML(text){
     if (!text || !text.trim()) return '<span style="color:var(--faint)">no changes</span>';
     return text.split('\\n').map(function(l){
       var e = esc(l) || '&nbsp;';
+      if (rvShowWs && l.indexOf('diff --git')!==0 && l.indexOf('@@')!==0) e = revealWs(e);
       if (l.indexOf('diff --git')===0 || l.indexOf('+++')===0 || l.indexOf('---')===0) return '<span class="dl-file">'+e+'</span>';
       if (l.indexOf('@@')===0) return '<span class="dl-hunk">'+e+'</span>';
       if (l.charAt(0)==='+') return '<span class="dl-add">'+e+'</span>';

package/src/server.ts CHANGED Viewed

@@ -37,6 +37,7 @@ const VENDOR: Record<string, { pkg: string; rel: string; type: string }> = {
   'addon-fit.js': { pkg: '@xterm/addon-fit/package.json', rel: 'lib/addon-fit.js', type: 'text/javascript' },
   'addon-unicode11.js': { pkg: '@xterm/addon-unicode11/package.json', rel: 'lib/addon-unicode11.js', type: 'text/javascript' },
   'addon-web-links.js': { pkg: '@xterm/addon-web-links/package.json', rel: 'lib/addon-web-links.js', type: 'text/javascript' },
+  'addon-search.js': { pkg: '@xterm/addon-search/package.json', rel: 'lib/addon-search.js', type: 'text/javascript' },
   'marked.js': { pkg: 'marked/package.json', rel: 'marked.min.js', type: 'text/javascript' },
 };