@happy-nut/monacori 0.1.3 → 0.1.6

package/dist/viewer.client.js

@@ -113,9 +113,9 @@ function setupLazyDiff() {
   if (wrappers[0]) ensureFileReady(wrappers[0]); // first file ready so the initial caret has a row to land on
 }
 if (REVIEW_LAZY) { setupLazyDiff(); setTimeout(function () { diffBootDone = true; }, 0); }
-const links = Array.from(document.querySelectorAll('#changes-panel .file-link'));
+let links = Array.from(document.querySelectorAll('#changes-panel .file-link')); // re-captured on in-place diff update
 let sourceLinks = Array.from(document.querySelectorAll('.source-link')); // re-captured when a deferred tree materializes
-const sourceFiles = JSON.parse(document.getElementById('source-files-data')?.textContent || '[]');
+let sourceFiles = JSON.parse(document.getElementById('source-files-data')?.textContent || '[]');
 // i18n: the message catalog (en + ko) is emitted server-side; the locale lives in localStorage and the
 // whole UI switches live (no reload). t() feeds dynamically-built text; applyI18n() rewrites the static
 // chrome (data-i18n / -ph / -title / -aria). English is the first-paint default.
@@ -147,13 +147,13 @@ function applyI18n() {
   var sel = document.getElementById('settings-language');
   if (sel) sel.value = locale;
 }
-const fileStates = JSON.parse(document.getElementById('file-state-data')?.textContent || '[]');
-const httpEnvironments = JSON.parse(document.getElementById('http-env-data')?.textContent || '{}');
-const httpEnvNames = Object.keys(httpEnvironments);
+let fileStates = JSON.parse(document.getElementById('file-state-data')?.textContent || '[]');
+let httpEnvironments = JSON.parse(document.getElementById('http-env-data')?.textContent || '{}');
+let httpEnvNames = Object.keys(httpEnvironments);
 const httpEnvKey = 'monacori-http-env:' + location.pathname;
 const httpRequestsByPath = new Map();
 const httpVarsByPath = new Map();
-const sourceByPath = new Map(sourceFiles.map((file) => [file.path, file]));
+let sourceByPath = new Map(sourceFiles.map((file) => [file.path, file]));
 // Phase 2b lazy-LOAD: source content is fetched once after first paint (serve /source-data or the
 // Electron bridge) and merged into the metadata-only source records; until then sourceLoaded is false
 // and the source view shows a brief loading state. Non-lazy-load modes embed source -> already loaded.
@@ -184,16 +184,16 @@ function loadSourceData() {
     }
     sourceLoaded = true;
     sourceLoading = false;
-    try { startSymbolIndex(); } catch (e) {}
+    scheduleSymbolIndex();
     if (pendingSourceOpen) { var po = pendingSourceOpen; pendingSourceOpen = null; openSourceFile(po.path, po.shouldSwitch); }
     else if (isSourceViewerVisible() && document.getElementById('source-viewer').dataset.openPath) { openSourceFile(document.getElementById('source-viewer').dataset.openPath, false); }
     if (pendingSymbol) { var s = pendingSymbol; pendingSymbol = null; goToDefOrUsages(s); }
   }, function () { sourceLoaded = true; sourceLoading = false; });
 }
-const fileSignatureByPath = new Map(fileStates.map((file) => [file.path, file.signature]));
+let fileSignatureByPath = new Map(fileStates.map((file) => [file.path, file.signature]));
 const reviewMeta = document.getElementById('review-meta');
 const watchEnabled = reviewMeta?.dataset.watch === 'true';
-const currentSignature = reviewMeta?.dataset.signature || '';
+let currentSignature = reviewMeta?.dataset.signature || '';
 const uiStateKey = 'monacori-diff-ui:' + location.pathname;
 const recentKey = 'monacori-diff-recent:' + location.pathname;
 const viewedKey = 'monacori-diff-viewed:' + location.pathname;
@@ -455,14 +455,26 @@ function scheduleDiffScroll(row) {
   });
 }
 
+var setActiveRaf = 0, setActiveScrollPending = true;
 function setActive(index, shouldScroll = true) {
   if (hunkTotal() === 0) return;
   current = ((index % hunkTotal()) + hunkTotal()) % hunkTotal();
+  // Coalesce rapid presses (holding/spamming F7 or Shift+F7) into one DOM apply per animation frame. The
+  // key handler returns immediately and `current` updates synchronously (so next()/nav math stays correct),
+  // while the heavy DOM work (full link/wrapper sweeps, body materialize) runs at most once per frame
+  // instead of once per keystroke — the input queue never blocks and can't pile up on big repos.
+  setActiveScrollPending = shouldScroll;
+  if (setActiveRaf) return;
+  setActiveRaf = requestAnimationFrame(function () {
+    setActiveRaf = 0;
+    applySetActive(current, setActiveScrollPending);
+  });
+}
+function applySetActive(idx, shouldScroll) {
   document.getElementById('source-viewer')?.classList.add('hidden');
   document.getElementById('diff-view')?.classList.remove('hidden');
   setTab('changes');
-  const file = hunkPathAt(current);
-  const idx = current;
+  const file = hunkPathAt(idx);
   links.forEach((link) => link.classList.toggle('active', link.dataset.file === file));
   renderBreadcrumb(document.getElementById('diff-breadcrumb'), file);
   var dvt = document.getElementById('diff-viewed-toggle');
@@ -973,6 +985,13 @@ document.addEventListener('keydown', (event) => {
     openMergedView((event.code === 'Slash' || event.key === '?') ? 'q' : 'c');
     return;
   }
+  // Cmd/Ctrl+Shift+N opens/closes the prompt memo. Electron also routes this via the Review menu; in the
+  // browser/serve build (no menu) this keydown is the only path. Match the physical key so layout/IME never swallows it.
+  if ((event.metaKey || event.ctrlKey) && event.shiftKey && (event.code === 'KeyN' || event.key === 'n' || event.key === 'N')) {
+    event.preventDefault();
+    openMemoView();
+    return;
+  }
   // "?" = question, ">" = change-request composer on the current line/selection (no modifier).
   if (!event.altKey && !event.metaKey && !event.ctrlKey && (event.key === '?' || event.key === '>')) {
     const ce = document.activeElement;
@@ -1215,7 +1234,7 @@ document.addEventListener('copy', handleSourceCopy);
 
 applyI18n(); // first paint already shows English (inline); this swaps to the saved locale before the rest of init renders dynamic text
 populateHttpEnvSelect();
-if (!REVIEW_LAZY_LOAD) setTimeout(startSymbolIndex, 0); // non-lazy indexes now; lazy-LOAD defers the (large) source blob + index to the first source-view open / go-to-def
+if (!REVIEW_LAZY_LOAD) scheduleSymbolIndex(); // non-lazy indexes when idle; lazy-LOAD defers the (large) source blob + index to the first source-view open / go-to-def
 const restored = restoreUiState();
 if (!restored) {
   const initial = location.hash.match(/^#hunk-(\d+)$/);
@@ -1227,6 +1246,19 @@ initSourceTreeFolds();
 if (watchEnabled) setInterval(checkForLiveUpdate, 1500);
 window.addEventListener('beforeunload', saveUiState);
 
+// First render has painted — drop the boot overlay (it bridged the blank gap right after loadFile). Two
+// rAFs so the spinner stays until the diff/tree are actually on screen, then a short fade-out.
+(function () {
+  var ov = document.getElementById('boot-overlay');
+  if (!ov) return;
+  requestAnimationFrame(function () {
+    requestAnimationFrame(function () {
+      ov.classList.add('hide');
+      setTimeout(function () { ov.remove(); }, 240);
+    });
+  });
+})();
+
 (function setupSidebarResize() {
   const resizer = document.querySelector('.sidebar-resizer');
   if (!resizer) return;
@@ -1943,6 +1975,96 @@ function openMergedView(kind) {
   }
 }
 
+// Prompt memo (Cmd/Ctrl+Shift+N): one freeform Markdown scratchpad with a live split preview, persisted
+// across reopens via the same store as comments/locale. "Send to terminal" hands the current draft to the
+// same pane-pick mode the merged views use, so a half-formed prompt can target any live claude/codex session.
+var memoKey = 'monacori-memo';
+function loadMemo() {
+  var v = persistRead(memoKey);
+  if (typeof v === 'string') return v;
+  try { var s = localStorage.getItem(memoKey); return typeof s === 'string' ? s : ''; } catch (e) { return ''; }
+}
+function saveMemo(text) { persistSave(memoKey, text || ''); }
+function renderMemoMd(text) {
+  if (!text || !text.trim()) return '<div class="mc-memo-empty" data-i18n="memo.previewEmpty">' + escapeHtml(t('memo.previewEmpty')) + '</div>';
+  return renderMarkdownBlocks(text).map(function (b) { return b.html; }).join('');
+}
+function openMemoView() {
+  var existing = document.getElementById('mc-memo');
+  if (existing) { existing.remove(); return; } // the shortcut toggles: a second press closes the memo
+  var modal = document.createElement('div');
+  modal.id = 'mc-memo';
+  modal.className = 'mc-modal';
+  var panel = document.createElement('div');
+  panel.className = 'mc-modal-panel mc-memo-panel';
+  var head = document.createElement('div');
+  head.className = 'mc-modal-head';
+  var title = document.createElement('span');
+  title.setAttribute('data-i18n', 'memo.title');
+  title.textContent = t('memo.title');
+  var closeBtn = document.createElement('button');
+  closeBtn.type = 'button';
+  closeBtn.className = 'mc-btn mc-ghost';
+  closeBtn.setAttribute('data-i18n', 'merged.close');
+  closeBtn.textContent = t('merged.close');
+  closeBtn.addEventListener('click', function () { modal.remove(); });
+
+  var body = document.createElement('div');
+  body.className = 'mc-memo-body';
+  var area = document.createElement('textarea');
+  area.className = 'mc-modal-text mc-memo-edit';
+  area.spellcheck = false;
+  area.setAttribute('data-i18n-ph', 'memo.placeholder');
+  area.placeholder = t('memo.placeholder');
+  area.value = loadMemo();
+  var preview = document.createElement('div');
+  preview.className = 'md-cell mc-memo-preview';
+  preview.innerHTML = renderMemoMd(area.value);
+  area.addEventListener('input', function () {
+    saveMemo(area.value);
+    preview.innerHTML = renderMemoMd(area.value);
+  });
+
+  // Terminal send: hand the current draft to pane-pick mode (arrows choose the session, Enter sends). Shown
+  // only once a terminal pane exists; enterSendMode reopens the panel if it was closed.
+  var sendBtn = null;
+  if (window.__monacoriTerminal && typeof window.__monacoriTerminal.paneCount === 'function' && window.__monacoriTerminal.paneCount() > 0) {
+    sendBtn = document.createElement('button');
+    sendBtn.type = 'button';
+    sendBtn.className = 'mc-btn mc-send-term';
+    sendBtn.setAttribute('data-i18n', 'merged.sendToTerminal');
+    sendBtn.textContent = t('merged.sendToTerminal');
+    sendBtn.addEventListener('click', function () {
+      var text = area.value;
+      modal.remove();
+      window.__monacoriTerminal.enterSendMode(text);
+    });
+  }
+
+  head.appendChild(title);
+  if (sendBtn) head.appendChild(sendBtn);
+  head.appendChild(closeBtn);
+  body.appendChild(area);
+  body.appendChild(preview);
+  panel.appendChild(head);
+  panel.appendChild(body);
+  modal.appendChild(panel);
+  modal.addEventListener('mousedown', function (e) { if (e.target === modal) modal.remove(); });
+  modal.addEventListener('keydown', function (e) { if (e.key === 'Escape') { e.preventDefault(); modal.remove(); } });
+  document.body.appendChild(modal);
+  // Focus the editor; Electron async-restores focus to <body>, so retry briefly (same as the composer/merged view).
+  var memoFocusTries = 0;
+  var tryFocusMemo = function () {
+    if (!document.getElementById('mc-memo')) return true;
+    if (document.activeElement === area) return true;
+    try { area.focus(); } catch (e) {}
+    return document.activeElement === area;
+  };
+  if (!tryFocusMemo()) {
+    var memoFocusIv = setInterval(function () { if (tryFocusMemo() || ++memoFocusTries > 12) clearInterval(memoFocusIv); }, 25);
+  }
+}
+
 document.addEventListener('click', function (event) {
   var t = event.target;
   if (!t || !t.closest) return;
@@ -2011,8 +2133,17 @@ refreshComments();
 
   function setActive(p) {
     active = p;
-    panes.forEach(function (q) { q.el.classList.toggle('is-active', q === p); });
-    if (p) requestAnimationFrame(function () { try { p.term.focus(); } catch (e) {} });
+    panes.forEach(function (q) {
+      q.el.classList.toggle('is-active', q === p);
+      // 2+ panes: dim every pane but the active one (no border, just a clean focus cue). A lone pane stays full.
+      q.el.classList.toggle('is-inactive', panes.length > 1 && q !== p);
+    });
+    if (p) requestAnimationFrame(function () {
+      try {
+        if (p.labelEl && p.labelEl.getAttribute('contenteditable') === 'true') return;
+        p.term.focus();
+      } catch (e) {}
+    });
   }
 
   function makePane() {
@@ -2044,7 +2175,13 @@ refreshComments();
     term.attachCustomKeyEventHandler(function (e) {
       if (e.type === 'keydown' && e.metaKey) {
         var k = (e.key || '').toLowerCase();
-        if (k === 'c' || k === 'v' || k === 'x' || k === 'a') return true;
+        // The bare modifier press (Cmd goes down BEFORE the letter on macOS) must not blur — blurring
+        // here drops the textarea focus the upcoming Cmd+V paste / Cmd+C copy needs, which broke them.
+        if (k === 'meta' || k === 'control' || k === 'alt' || k === 'shift') return true;
+        // Match the PHYSICAL key (e.code), not e.key: under a non-Latin layout/IME (e.g. Korean 한글)
+        // Cmd+V reports e.key as 'ㅍ', so a key-based check misses it — blurring the terminal and
+        // breaking paste/copy/cut/select-all whenever the Korean input source is active.
+        if (e.code === 'KeyC' || e.code === 'KeyV' || e.code === 'KeyX' || e.code === 'KeyA') return true;
         try { term.blur(); } catch (x) {}
         return false;
       }
@@ -2067,8 +2204,18 @@ refreshComments();
     if (el.getAttribute('contenteditable') === 'true') return;
     setActive(pane);
     el.contentEditable = 'true';
-    el.focus();
-    try { var range = document.createRange(); range.selectNodeContents(el); var sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); } catch (e) {}
+    // Electron asynchronously restores focus to <body> after the keydown, so a one-shot focus loses the
+    // race and the label turns editable but never gets the caret — retry until it sticks, then select all
+    // (same pattern as the composer/memo). This is why rename "did nothing" before.
+    var renameTries = 0;
+    var focusLabel = function () {
+      if (el.getAttribute('contenteditable') !== 'true') return true; // finished/cancelled meanwhile
+      try { el.focus(); } catch (e) {}
+      if (document.activeElement !== el) return false;
+      try { var range = document.createRange(); range.selectNodeContents(el); var sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); } catch (e) {}
+      return true;
+    };
+    if (!focusLabel()) { var renameIv = setInterval(function () { if (focusLabel() || ++renameTries > 12) clearInterval(renameIv); }, 25); }
     function finish(commit) {
       el.removeEventListener('keydown', onKey);
       el.removeEventListener('blur', onBlur);
@@ -2239,6 +2386,15 @@ if (window.monacoriMenu && typeof window.monacoriMenu.onMergedView === 'function
   // split), so the user can pick which claude/codex session receives the prompt.
   window.monacoriMenu.onMergedView(function (kind) { openMergedView(kind); });
 }
+if (window.monacoriMenu && typeof window.monacoriMenu.onOpenMemo === 'function') {
+  // Cmd/Ctrl+Shift+N from the Review menu -> open/close the prompt memo.
+  window.monacoriMenu.onOpenMemo(function () { openMemoView(); });
+}
+if (window.monacoriMenu && typeof window.monacoriMenu.onDiffUpdate === 'function') {
+  // Electron watch: main rebuilds on working-tree changes and pushes the new HTML so we refresh the diff
+  // in place — NO window reload — keeping the integrated terminal's pty sessions (claude/codex) alive.
+  window.monacoriMenu.onDiffUpdate(function (html) { try { applyDiffUpdate(html); } catch (e) {} });
+}
 if (window.monacoriMenu && typeof window.monacoriMenu.onCloseTab === 'function') {
   // Cmd/Ctrl+W: close the active Files-mode tab (no-op outside the source viewer).
   window.monacoriMenu.onCloseTab(function () {
@@ -2471,6 +2627,71 @@ function restoreUiState() {
   return false;
 }
 
+// In-place diff refresh (instead of a full window reload): apply a compact payload of just the changed
+// regions (diff container, sidebar trees, status, data) and re-run the bootstrap steps. The window never
+// reloads, so the integrated terminal's pty sessions (claude/codex) survive a watch refresh. Electron's
+// main pushes the payload over IPC (monacori:diff-update); serve mode's poller fetches /__ai_flow_update.
+function applyDiffUpdate(u) {
+  if (!u || !u.signature || u.signature === currentSignature) return false; // unchanged — nothing to do
+
+  // Remember what to restore after the swap (comments/viewed persist on their own; these don't).
+  var sv = document.getElementById('source-viewer');
+  var openPath = (sv && sv.dataset.openPath) || '';
+  var wasSource = isSourceViewerVisible();
+  var container = document.getElementById('diff2html-container');
+  var diffScrollTop = container ? container.scrollTop : 0;
+
+  // 1) Replace the visible regions straight from the payload (no full-HTML parse).
+  if (container) container.innerHTML = u.diffContainer || '';
+  var changesPanel = document.getElementById('changes-panel');
+  if (changesPanel) changesPanel.innerHTML = u.changesPanel || '';
+  // Files tree: keep the inert island (lazy, not yet opened) in sync, and refresh the live panel when it's
+  // already materialized — or always, in eager mode where the panel holds the tree directly.
+  var filesIsland = document.getElementById('files-tree-html');
+  if (filesIsland) filesIsland.textContent = u.filesTree || '';
+  var filesPanel = document.getElementById('files-panel');
+  if (filesPanel && (!REVIEW_LAZY || filesPanel.innerHTML.trim())) filesPanel.innerHTML = u.filesTree || '';
+  var statusEl = document.querySelector('.review-status');
+  if (statusEl) statusEl.innerHTML = u.reviewStatus || '';
+  if (reviewMeta) { reviewMeta.setAttribute('data-signature', u.signature); if (u.generatedAt) reviewMeta.setAttribute('data-generated-at', u.generatedAt); }
+
+  // 2) Re-derive module-level state directly from the payload objects.
+  fileStates = u.fileStates || [];
+  fileSignatureByPath = new Map(fileStates.map(function (f) { return [f.path, f.signature]; }));
+  sourceFiles = u.sourceFilesMeta || [];
+  sourceByPath = new Map(sourceFiles.map(function (f) { return [f.path, f]; }));
+  httpEnvironments = u.httpEnvironments || {};
+  httpEnvNames = Object.keys(httpEnvironments);
+  currentSignature = u.signature;
+  links = Array.from(document.querySelectorAll('#changes-panel .file-link'));
+  sourceLinks = Array.from(document.querySelectorAll('.source-link'));
+
+  // 3) Reset lazy-materialize + index state so the new diff bodies / source / symbols rebuild on demand.
+  bodyPromise = {};
+  diffBootDone = false;
+  sourceLoaded = !REVIEW_LAZY_LOAD; // lazyLoad: re-fetch source content on next use
+  sourceLoading = false;
+  symbolIndex = null;
+  if (REVIEW_LAZY) { setupLazyDiff(); setTimeout(function () { diffBootDone = true; }, 0); }
+  else { prepareDiff2HtmlHunks(); diffBootDone = true; }
+  if (!REVIEW_LAZY_LOAD) setTimeout(startSymbolIndex, 0);
+
+  // 4) Re-run the DOM-dependent bootstrap steps.
+  applyI18n();
+  populateHttpEnvSelect();
+  initSourceTreeFolds();
+  refreshComments();
+
+  // 5) Best-effort restore of what the user was looking at.
+  if (wasSource && openPath && sourceByPath.has(openPath)) {
+    openSourceFile(openPath, false);
+  } else if (container) {
+    showDiffView(false);
+    container.scrollTop = diffScrollTop;
+  }
+  return true;
+}
+
 async function checkForLiveUpdate() {
   if (checkingForUpdates) return;
   checkingForUpdates = true;
@@ -2483,8 +2704,12 @@ async function checkForLiveUpdate() {
       liveStatus.textContent = t('status.live.updated') + ' ' + new Date(state.generatedAt).toLocaleTimeString();
     }
     if (state.signature && state.signature !== currentSignature) {
-      saveUiState();
-      location.reload();
+      // serve mode: fetch just the compact update payload and refresh in place (same path Electron uses
+      // over IPC) rather than reloading — so an open integrated terminal keeps its sessions.
+      try {
+        var fresh = await fetch('__ai_flow_update', { cache: 'no-store' });
+        if (fresh.ok) applyDiffUpdate(await fresh.json());
+      } catch (e) {}
     }
   } catch {
     if (liveStatus) liveStatus.textContent = t('status.live.waiting');
@@ -3104,6 +3329,14 @@ function symbolIndexWorker() {
     self.postMessage({ index: index, total: total });
   };
 }
+// Run symbol indexing off the critical path: requestIdleCallback so the heavy postMessage of the whole
+// source blob to the worker (structured-clone serialization is synchronous on the main thread) never
+// competes with key handling — especially on big repos right after the diff/tree first paints.
+function scheduleSymbolIndex() {
+  var run = function () { try { startSymbolIndex(); } catch (e) {} };
+  if (typeof window !== 'undefined' && typeof window.requestIdleCallback === 'function') window.requestIdleCallback(run, { timeout: 3000 });
+  else setTimeout(run, 0);
+}
 function startSymbolIndex() {
   try {
     if (typeof Worker === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) return;
@@ -3810,16 +4043,21 @@ function populateHttpEnvSelect() {
     opts += '<option value="' + escapeHtml(name) + '"' + (name === currentHttpEnvName ? ' selected' : '') + '>' + escapeHtml(name) + '</option>';
   });
   select.innerHTML = opts;
-  select.addEventListener('change', function () {
-    currentHttpEnvName = select.value;
-    try { localStorage.setItem(httpEnvKey, currentHttpEnvName); } catch (error) {}
-    const path = document.getElementById('source-viewer')?.dataset.openPath || '';
-    if (path && isHttpFile(path)) {
-      const file = sourceByPath.get(path);
-      const body = document.getElementById('source-body');
-      if (file && body) body.innerHTML = renderHttpTable(file);
-    }
-  });
+  // The <select> lives in the toolbar (not swapped on in-place diff updates), so wire the change handler
+  // exactly once — populateHttpEnvSelect is re-called by applyDiffUpdate to refresh the options.
+  if (!select.dataset.wired) {
+    select.dataset.wired = '1';
+    select.addEventListener('change', function () {
+      currentHttpEnvName = select.value;
+      try { localStorage.setItem(httpEnvKey, currentHttpEnvName); } catch (error) {}
+      const path = document.getElementById('source-viewer')?.dataset.openPath || '';
+      if (path && isHttpFile(path)) {
+        const file = sourceByPath.get(path);
+        const body = document.getElementById('source-body');
+        if (file && body) body.innerHTML = renderHttpTable(file);
+      }
+    });
+  }
 }
 
 function renderSourceTable(file, query) {

package/dist/viewer.css

@@ -465,14 +465,16 @@ td.d2h-del:not(.d2h-code-side-linenumber) { color: #d8e0e8; }
 }
 .tree-dir summary::-webkit-details-marker { display: none; }
 .tree-dir summary:hover { background: var(--bg); }
-.tree-dir:not([open]) .folder-icon { transform: rotate(-90deg); }
 .folder-icon {
   display: inline-grid;
   place-items: center;
-  font-size: 9px;
   color: var(--muted);
-  transition: transform 120ms ease;
 }
+.folder-icon .folder-ic { width: 14px; height: 14px; display: block; }
+/* Closed vs open folder glyph (replaces the old rotated "v" chevron). */
+.tree-dir > summary .fi-open { display: none; }
+.tree-dir[open] > summary .fi-closed { display: none; }
+.tree-dir[open] > summary .fi-open { display: block; }
 .file-link.tree-file { padding-left: calc(8px + (var(--depth) * 14px)); }
 .tree-focus { box-shadow: inset 0 0 0 1px var(--active); border-radius: 6px; }
 summary.tree-focus { background: var(--bg); }
@@ -524,7 +526,20 @@ summary.tree-focus { background: var(--bg); }
 .status-deleted { background: var(--del); color: #cf222e; }
 .status-renamed { background: #fff8c5; color: #9a6700; }
 .status-source { background: var(--line); color: var(--muted); }
-.content { min-width: 0; padding: 0; }
+.content { min-width: 0; padding: 0; display: flex; flex-direction: column; min-height: 100vh; }
+/* Pin the diff's horizontal scrollbar to the viewport bottom instead of letting it float
+   mid-screen when a file's diff is short: fill the content column vertically so the last
+   file's diff body extends all the way down. */
+#diff-view:not(.hidden) { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
+#diff-view .diff2html-container { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
+.diff2html-container .d2h-wrapper { flex: 1 1 auto; display: flex; flex-direction: column; }
+.diff2html-container .d2h-file-wrapper:last-child { flex: 1 1 auto; }
+.diff2html-container .d2h-file-wrapper:last-child .d2h-files-diff { height: 100%; }
+/* Slimmer scrollbars — the default overlay bars read as chunky on the dark UI. */
+::-webkit-scrollbar { width: 9px; height: 9px; }
+::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--muted) 32%, transparent); border-radius: 5px; }
+::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--muted) 52%, transparent); }
+::-webkit-scrollbar-track { background: transparent; }
 .toolbar {
   position: sticky;
   top: 0;
@@ -629,6 +644,31 @@ h1 { margin: 0; font-size: 18px; }
   background: var(--panel);
   user-select: text;
 }
+/* Extend the line-number gutter (and its divider) to the bottom of the panel so it never stops at the
+   last line with an empty strip + cut-off border below it — one continuous gutter. The .num cell is 58px
+   wide + 8px padding each side + 1px border ≈ 75px; the gradient mirrors that. (pre-wrap = no h-scroll, so
+   a fixed background stays aligned.) */
+.source-body:not(.empty):not(.image-body) {
+  background-image: linear-gradient(to right, var(--line) 0 74px, var(--border) 74px 75px, var(--panel) 75px);
+  background-repeat: no-repeat;
+}
+/* Boot overlay: painted the instant the review HTML loads, removed once the renderer's bootstrap has drawn
+   the diff/tree — so there's no blank screen between the startup spinner and first render. Mirrors
+   app-main's LOADING_HTML spinner exactly so the hand-off from the loading screen is seamless. */
+#boot-overlay {
+  position: fixed; inset: 0; z-index: 200;
+  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
+  background: #2b2b2b; color: #9aa4af;
+  font: 13px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  transition: opacity 0.22s ease;
+}
+#boot-overlay.hide { opacity: 0; pointer-events: none; }
+.boot-spinner {
+  width: 34px; height: 34px;
+  border: 3px solid #3a3a3a; border-top-color: #4a9eff; border-radius: 50%;
+  animation: boot-spin 0.8s linear infinite;
+}
+@keyframes boot-spin { to { transform: rotate(360deg); } }
 /* Empty state ("Select a file…") centered in the available space, not top-left. */
 .source-body.empty {
   display: flex;
@@ -688,7 +728,8 @@ h1 { margin: 0; font-size: 18px; }
 .source-row.md-row.cursor-line .num,
 .source-row.csv-row.cursor-line .num { color: var(--active); }
 .num {
-  width: 58px;
+  width: 75px;
+  box-sizing: border-box; /* fixed 75px total so the .source-body gutter gradient lines up exactly (no bleed) */
   user-select: none;
   text-align: right;
   color: var(--muted);
@@ -760,6 +801,12 @@ h1 { margin: 0; font-size: 18px; }
 .mc-modal-head span { margin-right: auto; }
 .mc-modal-text { width: 100%; height: 100%; box-sizing: border-box; resize: none; border: 0; padding: 12px; background: var(--bg); color: var(--text); font: 12px/1.55 Monaco, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
 .mc-modal-text:focus { outline: none; }
+/* Prompt memo: split editor | live Markdown preview inside the standard modal shell. */
+.mc-memo-body { display: grid; grid-template-columns: 1fr 1fr; min-height: 0; height: 100%; }
+.mc-memo-edit { height: 100%; border-right: 1px solid var(--border); }
+.mc-memo-preview { height: 100%; overflow: auto; padding: 12px 16px; background: var(--panel); color: var(--text); }
+.mc-memo-preview > :first-child { margin-top: 0; }
+.mc-memo-empty { color: var(--muted); font-size: 12px; font-style: italic; }
 .tok-comment { color: var(--token-comment); font-style: italic; }
 .tok-keyword { color: var(--token-keyword); font-weight: 650; }
 .tok-string { color: var(--token-string); }
@@ -1074,9 +1121,11 @@ h1 { margin: 0; font-size: 18px; }
 .terminal-pane-label[contenteditable="true"] { color: var(--text); background: var(--bg); outline: none; }
 .terminal-pane.is-active .terminal-pane-label { color: var(--text); }
 .terminal-pane-host { flex: 1 1 auto; min-width: 0; min-height: 0; padding: 4px 0 4px 8px; }
-.terminal-pane.is-active { box-shadow: inset 2px 0 0 var(--active); }
+/* No border on the active pane — the inactive panes dim back instead, so the focused one stands out
+   cleanly without an outline. Only applies with 2+ panes (a lone pane is never dimmed; see setActive). */
+.terminal-pane { transition: opacity 120ms ease; }
+.terminal-panel:not(.send-mode) .terminal-pane.is-inactive { opacity: 0.4; }
 /* Pane-pick mode (merged "Send to terminal"): chosen pane ringed + full opacity, the rest dimmed. */
-.terminal-panel.send-mode .terminal-pane { transition: opacity 120ms ease; }
 .terminal-pane.is-dimmed { opacity: 0.3; }
 .terminal-pane.is-send-target { box-shadow: inset 0 0 0 2px var(--active); opacity: 1; position: relative; }
 /* Faint ⏎ hint floating over the chosen pane; it vanishes the instant Enter exits send mode. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@happy-nut/monacori",
-  "version": "0.1.3",
+  "version": "0.1.6",
   "description": "Validation control plane for AI-generated code changes.",
   "type": "module",
   "repository": {