synabun 2.0.10 → 2.1.0

package/neural-interface/public/shared/cc-dropdown.js

@@ -25,6 +25,8 @@
 // closes and moves on, the choice as it was. An open menu is placed `fixed` against its trigger,
 // so a scrolling pane never cuts it off, and kept inside the box that clips it (a window).
 
+import { placementArea } from './app-frame.js';
+
 const ARROW = '<svg class="cc-dropdown-arrow" viewBox="0 0 24 24" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>';
 const GAP = 4;          // between the trigger and its menu
 const EDGE = 6;         // the least room left between a menu and the edge of what clips it
@@ -94,13 +96,39 @@ export function matchIndex(options, typed, from = -1) {
   return -1;
 }
 
+/** Multi-choice values in menu order. Disabled selected rows are mandatory. */
+export function multipleValues(options) {
+  const exclusive = options.find(o => o.selected && o.exclusive && !o.scope);
+  if (exclusive) return [String(exclusive.value ?? '')];
+  const scoped = new Set(options.filter(o => o.selected && o.exclusive && o.scope).map(o => o.scope));
+  return options.filter(o => o.selected && (!scoped.has(o.scope) || o.exclusive)).map(o => String(o.value ?? ''));
+}
+
+/** Exclusive rows may apply globally (inheritance) or within a named section. */
+export function toggleMultiple(options, values, index) {
+  const option = options[index];
+  if (!option || option.disabled) return [...values];
+  if (option.exclusive && !option.scope) return [String(option.value ?? '')];
+  const selected = new Set(values);
+  for (const row of options) {
+    if ((row.exclusive && !row.scope) || (option.exclusive && row.scope === option.scope) || (!option.exclusive && row.exclusive && row.scope === option.scope)) selected.delete(String(row.value ?? ''));
+  }
+  const value = String(option.value ?? '');
+  if (option.exclusive) selected.add(value);
+  else if (selected.has(value)) selected.delete(value); else selected.add(value);
+  return multipleValues(options.map(row => ({ ...row, selected: selected.has(String(row.value ?? '')) || (!option.exclusive && row.disabled && row.selected) })));
+}
+
+const multipleText = (options, values) => options.filter(o => values.includes(String(o.value ?? '')))
+  .map(o => o.label).join(', ');
+
 // ── Markup ──
 
 function optionHTML(id, option, index, chosen) {
   const label = String(option.label ?? '');
-  const active = index === chosen;
+  const active = Array.isArray(chosen) ? (chosen.includes(String(option.value ?? '')) || (option.automatic && option.selected)) : index === chosen;
   return `<div class="cc-dropdown-item${active ? ' active' : ''}" id="${esc(id)}-opt-${index}" role="option" aria-selected="${active}"`
-    + `${option.disabled ? ' aria-disabled="true"' : ''} data-value="${esc(option.value ?? '')}" data-index="${index}" title="${esc(label)}">${esc(label)}</div>`;
+    + `${option.disabled ? ' aria-disabled="true"' : ''} data-value="${esc(option.value ?? '')}" data-index="${index}"${option.exclusive ? ' data-exclusive="true"' : ''}${option.scope ? ` data-scope="${esc(option.scope)}"` : ''}${option.automatic ? ' data-automatic="true"' : ''} data-label="${esc(label)}" title="${esc(option.caption || label)}">${Array.isArray(chosen) ? '<span class="cc-dropdown-check" aria-hidden="true"></span>' : ''}<span>${esc(label)}${option.caption ? `<small class="cc-dropdown-caption">${esc(option.caption)}</small>` : ''}</span></div>`;
 }
 
 /** The menu's options (and headings) for `entries`, the `chosen` index marked. */
@@ -120,17 +148,17 @@ export function menuHTML(id, entries, chosen = chosenIndex(flatOptions(entries))
  * Name it with `labelledBy` (the id of its visible label) or `label`. `classes` and `attrs` go on
  * the `.cc-dropdown`.
  */
-export function dropdownHTML(id, entries, { classes = '', labelledBy = '', label = '', attrs = '', inputAttrs = '', disabled = false } = {}) {
+export function dropdownHTML(id, entries, { classes = '', labelledBy = '', label = '', attrs = '', inputAttrs = '', disabled = false, multiple = false, summary = '' } = {}) {
   const options = flatOptions(entries);
-  const chosen = chosenIndex(options);
+  const chosen = multiple ? multipleValues(options) : chosenIndex(options);
   const current = chosen >= 0 ? options[chosen] : null;
   const name = labelledBy ? ` aria-labelledby="${esc(labelledBy)}"` : label ? ` aria-label="${esc(label)}"` : '';
-  const text = String(current?.label ?? '');
-  return `<input type="hidden" id="${esc(id)}" value="${esc(current?.value ?? '')}"${disabled ? ' disabled' : ''}${inputAttrs ? ` ${inputAttrs}` : ''}>`
-    + `<div class="cc-dropdown${classes ? ` ${classes}` : ''}${disabled ? ' disabled' : ''}" data-for="${esc(id)}"${attrs ? ` ${attrs}` : ''}>`
+  const text = multiple ? (summary || multipleText(options, chosen)) : String(current?.label ?? '');
+  return `<input type="hidden" id="${esc(id)}" value="${esc(multiple ? chosen.join(',') : current?.value ?? '')}"${disabled ? ' disabled' : ''}${inputAttrs ? ` ${inputAttrs}` : ''}>`
+    + `<div class="cc-dropdown${classes ? ` ${classes}` : ''}${disabled ? ' disabled' : ''}" data-for="${esc(id)}"${multiple ? ' data-multiple="true"' : ''}${attrs ? ` ${attrs}` : ''}>`
     + `<button type="button" class="cc-dropdown-trigger" id="${esc(id)}-trigger" role="combobox" aria-haspopup="listbox" aria-expanded="false" aria-controls="${esc(id)}-menu"${name}${disabled ? ' disabled' : ''}>`
     + `<span class="cc-dropdown-value" title="${esc(text)}">${esc(text)}</span>${ARROW}</button>`
-    + `<div class="cc-dropdown-menu" id="${esc(id)}-menu" role="listbox"${name} tabindex="-1">${menuHTML(id, entries, chosen)}</div>`
+    + `<div class="cc-dropdown-menu" id="${esc(id)}-menu" role="listbox"${multiple ? ' aria-multiselectable="true"' : ''}${name} tabindex="-1">${menuHTML(id, entries, chosen)}</div>`
     + '</div>';
 }
 
@@ -143,7 +171,7 @@ const partsOf = (dd) => ({
   input: dd.dataset.for ? document.getElementById(dd.dataset.for) : null,
 });
 const itemsOf = (dd) => [...(partsOf(dd).menu?.querySelectorAll('.cc-dropdown-item') || [])];
-const optionsOf = (items) => items.map(el => ({ value: el.dataset.value ?? '', label: el.textContent, disabled: el.getAttribute('aria-disabled') === 'true' }));
+const optionsOf = (items) => items.map(el => ({ value: el.dataset.value ?? '', label: el.dataset.label ?? el.textContent, disabled: el.getAttribute('aria-disabled') === 'true', exclusive: el.dataset.exclusive === 'true', scope: el.dataset.scope || undefined, selected: el.classList.contains('active') }));
 const highlightedOf = (items) => items.findIndex(el => el.classList.contains('highlight'));
 const chosenOf = (items) => items.findIndex(el => el.classList.contains('active'));
 const isOpen = (dd) => !!dd?.classList.contains('open');
@@ -194,6 +222,21 @@ function showChosen(dd, index) {
   }
 }
 
+function showMultiple(dd, values) {
+  const { label, input } = partsOf(dd);
+  const items = itemsOf(dd);
+  items.forEach(el => {
+    const active = values.includes(el.dataset.value ?? '') || el.dataset.automatic === 'true';
+    el.classList.toggle('active', active);
+    el.setAttribute('aria-selected', String(active));
+  });
+  if (input) input.value = values.join(',');
+  if (label) {
+    label.textContent = multipleText(optionsOf(items), values);
+    label.title = label.textContent;
+  }
+}
+
 function highlight(dd, index) {
   const { trigger, menu } = partsOf(dd);
   const items = itemsOf(dd);
@@ -227,7 +270,9 @@ function place(dd) {
   Object.assign(style, { position: 'fixed', left: '0px', top: '0px', right: 'auto', bottom: 'auto', width: 'auto', maxHeight: 'none', minWidth: '0px', maxWidth: 'none' });
   const origin = menu.getBoundingClientRect(); // where the containing block's (0, 0) is on screen
   const t = trigger.getBoundingClientRect();
-  let room = { left: 0, top: 0, right: window.innerWidth, bottom: window.innerHeight };
+  // The app frame for a trigger inside it (app-frame.js), else the window; then whatever clips the menu
+  const area = placementArea(t.left + t.width / 2, t.top + t.height / 2);
+  let room = { left: area.left, top: area.top, right: area.right, bottom: area.bottom };
   const box = fixedContainer(dd);
   if (box) {
     const cs = getComputedStyle(box);
@@ -268,8 +313,12 @@ function open(dd, index = null) {
   if (!trigger || trigger.disabled || dd.classList.contains('disabled')) return;
   for (const other of document.querySelectorAll('.cc-dropdown.open')) if (other !== dd) close(other);
   ensureAria(dd);
+  dd._ccBefore = partsOf(dd).input?.value;
+  dd._ccBeforeLabel = partsOf(dd).label?.textContent;
+  dd._ccBeforeMenu = partsOf(dd).menu?.innerHTML;
   dd.classList.add('open');
   trigger.setAttribute('aria-expanded', 'true');
+  partsOf(dd).input?.dispatchEvent(new Event('cc-dropdown-open', { bubbles: true }));
   if (document.activeElement !== trigger) trigger.focus({ preventScroll: true });
   place(dd);
   const items = itemsOf(dd);
@@ -278,8 +327,14 @@ function open(dd, index = null) {
   highlight(dd, index ?? (chosen >= 0 && !options[chosen].disabled ? chosen : edgeIndex(options, 'first')));
 }
 
-function close(dd, { focus = false } = {}) {
-  const { trigger, menu } = partsOf(dd);
+function close(dd, { focus = false, cancel = false } = {}) {
+  const { trigger, menu, input, label } = partsOf(dd);
+  const changed = isOpen(dd) && dd.dataset.multiple === 'true' && input && input.value !== dd._ccBefore;
+  if (cancel && changed) {
+    if (menu && dd._ccBeforeMenu != null) menu.innerHTML = dd._ccBeforeMenu;
+    showMultiple(dd, dd._ccBefore === '' ? [''] : dd._ccBefore.split(','));
+    if (label) { label.textContent = dd._ccBeforeLabel; label.title = label.textContent; }
+  }
   dd.classList.remove('open', 'drop-up');
   trigger?.setAttribute('aria-expanded', 'false');
   trigger?.removeAttribute('aria-activedescendant');
@@ -287,6 +342,10 @@ function close(dd, { focus = false } = {}) {
   menu?.removeAttribute('style');
   dd._ccPlacedAt = null;
   if (focus && trigger?.isConnected) trigger.focus({ preventScroll: true });
+  if (changed && !cancel) {
+    input.dispatchEvent(new Event('input', { bubbles: true }));
+    input.dispatchEvent(new Event('change', { bubbles: true }));
+  }
 }
 
 /** The user's choice: shown, the menu closed, the focus on the trigger, then `input` and `change` when it changed. */
@@ -295,6 +354,12 @@ function choose(dd, index) {
   const item = items[index];
   const { input } = partsOf(dd);
   if (!item || item.getAttribute('aria-disabled') === 'true') { close(dd, { focus: true }); return; }
+  if (dd.dataset.multiple === 'true') {
+    showMultiple(dd, toggleMultiple(optionsOf(items), items.filter(el => el.classList.contains('active')).map(el => el.dataset.value), index));
+    input?.dispatchEvent(new Event('cc-dropdown-draft', { bubbles: true }));
+    highlight(dd, index);
+    return;
+  }
   const changed = !!input && input.value !== (item.dataset.value ?? '');
   showChosen(dd, index);
   close(dd, { focus: true });
@@ -315,20 +380,25 @@ export function setDropdownItems(input, entries) {
   const wasOpen = isOpen(dd);
   const before = wasOpen ? itemsOf(dd)[highlightedOf(itemsOf(dd))]?.dataset.value : undefined;
   const options = flatOptions(entries);
-  const chosen = chosenIndex(options);
+  const multiple = dd.dataset.multiple === 'true';
+  const chosen = multiple ? multipleValues(options) : chosenIndex(options);
   menu.innerHTML = menuHTML(input.id, entries, chosen);
-  showChosen(dd, chosen);
+  if (multiple) showMultiple(dd, chosen); else showChosen(dd, chosen);
   if (!wasOpen) return;
   place(dd);
   const items = itemsOf(dd);
   const again = before === undefined ? -1 : items.findIndex(el => el.dataset.value === before);
-  highlight(dd, again >= 0 ? again : chosen);
+  highlight(dd, again >= 0 ? again : chosenOf(items));
 }
 
 /** `select.value = …`: the first choice with that value, or none (the value is then ''). No event. */
 export function setDropdownValue(input, value) {
   const dd = dropdownOf(input);
   if (!dd) { if (input) input.value = value ?? ''; return; }
+  if (dd.dataset.multiple === 'true') {
+    showMultiple(dd, Array.isArray(value) ? value.map(String) : String(value ?? '').split(','));
+    return;
+  }
   showChosen(dd, itemsOf(dd).findIndex(el => el.dataset.value === String(value ?? '')));
 }
 
@@ -337,16 +407,16 @@ export function setDropdownDisabled(input, disabled) {
   const dd = dropdownOf(input);
   if (input) input.disabled = !!disabled;
   if (!dd) return;
-  if (disabled && isOpen(dd)) close(dd);
+  if (disabled && isOpen(dd)) close(dd, { cancel: true });
   dd.classList.toggle('disabled', !!disabled);
   const { trigger } = partsOf(dd);
   if (trigger) trigger.disabled = !!disabled;
 }
 
 /** Closes every open dropdown under `root`; true when one was open. `focus` puts the focus back on its trigger. */
-export function closeDropdowns(root = document, { focus = false } = {}) {
+export function closeDropdowns(root = document, { focus = false, cancel = false } = {}) {
   const open = [...root.querySelectorAll('.cc-dropdown.open')];
-  for (const dd of open) close(dd, { focus });
+  for (const dd of open) close(dd, { focus, cancel });
   return open.length > 0;
 }
 
@@ -446,7 +516,7 @@ export function wireDropdowns(root, { signal } = {}) {
       case 'Escape':
         e.preventDefault();
         e.stopPropagation();
-        close(dd, { focus: true });
+        close(dd, { focus: true, cancel: true });
         break;
       case 'Tab':
         close(dd); // the focus moves on as usual; the choice stays as it was

package/neural-interface/public/shared/cdx/cdx-context-menu.js

@@ -164,6 +164,7 @@ function build(m, { copied = false } = {}) {
  *   opts.onManage()    opens the MCP servers; without it there is no "Manage"
  *   opts.onSettings()  opens Codex settings; without it there is no "Settings"
  *   opts.onAccount()   opens the account menu; without it there is no Account row
+ *   opts.bounds()      the area the popover stays in ({ left, top, right, bottom }: the app frame); the window without it
  * Returns { element, open(), close({ focus }), isOpen(), sync(), destroy() }.
  */
 export function mountContextMenu(actionsEl, panelEl, opts = {}) {
@@ -215,23 +216,23 @@ export function mountContextMenu(actionsEl, panelEl, opts = {}) {
   }
 
   // Below the cog, its right edge on the cog's; above it when there is more room
-  // there; always inside the viewport, scrolling inside when it is taller.
+  // there; always inside the app frame, scrolling inside when it is taller.
   function place() {
     if (!open || !pop) return;
     const r = cog.getBoundingClientRect();
-    const vw = window.innerWidth;
-    const vh = window.innerHeight;
-    const width = Math.max(0, Math.min(WIDTH, vw - MARGIN * 2));
+    // Inside the area the panel names (the app frame), else the window
+    const f = opts.bounds?.() || { left: 0, top: 0, right: window.innerWidth, bottom: window.innerHeight, width: window.innerWidth };
+    const width = Math.max(0, Math.min(WIDTH, f.width - MARGIN * 2));
     pop.style.width = `${width}px`;
-    const below = vh - r.bottom - GAP - MARGIN;
-    const above = r.top - GAP - MARGIN;
+    const below = f.bottom - r.bottom - GAP - MARGIN;
+    const above = r.top - f.top - GAP - MARGIN;
     const up = below < 220 && above > below;
     pop.style.maxHeight = `${Math.max(120, up ? above : below)}px`;
     const height = pop.offsetHeight;
-    const left = Math.max(MARGIN, Math.min(r.right - width, vw - width - MARGIN));
+    const left = Math.max(f.left + MARGIN, Math.min(r.right - width, f.right - width - MARGIN));
     const top = up
-      ? Math.max(MARGIN, r.top - GAP - height)
-      : Math.max(MARGIN, Math.min(r.bottom + GAP, vh - MARGIN - height));
+      ? Math.max(f.top + MARGIN, r.top - GAP - height)
+      : Math.max(f.top + MARGIN, Math.min(r.bottom + GAP, f.bottom - MARGIN - height));
     pop.style.left = `${Math.round(left)}px`;
     pop.style.top = `${Math.round(top)}px`;
     // Once it has its width: only now is a cut value known.

package/neural-interface/public/shared/cdx/cdx-copy.js

@@ -0,0 +1,16 @@
+let translate = null;
+export function setCodexTranslator(fn) { translate = typeof fn === 'function' ? fn : null; }
+
+// Detached panels/tests can render before the locale bundle is ready.
+export function cxpText(key, english, params) {
+  const path = `codexPanel.${key}`;
+  const value = translate?.(path, params) || path;
+  if (value !== path) return value;
+  return english.replace(/\{(\w+)\}/g, (_, name) => params?.[name] ?? `{${name}}`);
+}
+
+export function cxpSessionLabel(label) {
+  if (label === 'New session') return cxpText('newSession', 'New session');
+  if (label === 'Saved session') return cxpText('savedSession', 'Saved session');
+  return label;
+}

package/neural-interface/public/shared/cdx/cdx-output-model.js

@@ -236,7 +236,10 @@ export function fileChangeDiffs(item = {}) {
   if (raw && (/^(?:diff --git |--- )/m.test(raw) || changes.length <= 1 && /^@@ /m.test(raw))) return parseUnifiedDiff(raw, changes.length === 1 ? changeInfo(changes[0]) : {});
   const files = changes.slice(0, OUTPUT_LIMITS.files).flatMap(change => {
     const info = changeInfo(change);
-    const patch = change.diff || change.patch || change.content || change.output || '';
+    const patch = change.diff ?? change.patch ?? change.content ?? change.output;
+    if ((info.status === 'added' || info.status === 'deleted') && typeof patch === 'string') {
+      return [wholeFileDiff(patch, info)];
+    }
     if (!patch) return [{ ...info, lines: [], hunks: [], added: 0, removed: 0, raw: '', unavailable: true }];
     return parseUnifiedDiff(typeof patch === 'string' ? patch : readableStructuredValue(patch), info);
   });
@@ -244,6 +247,24 @@ export function fileChangeDiffs(item = {}) {
   return files;
 }
 
+function wholeFileDiff(content, info) {
+  const added = info.status === 'added';
+  const text = content.replace(/\r\n/g, '\n');
+  const lines = text === '' ? [] : text.split('\n');
+  if (text.endsWith('\n')) lines.pop();
+  const sign = added ? '+' : '-';
+  const raw = `@@ -${added ? '0,0' : `1,${lines.length}`} +${added ? `1,${lines.length}` : '0,0'} @@\n`
+    + lines.map(line => `${sign}${line}\n`).join('')
+    + (text && !text.endsWith('\n') ? '\\n' : '');
+  const oversized = content.length > OUTPUT_LIMITS.input || lines.length > OUTPUT_LIMITS.diffLines;
+  return { ...info, lines: oversized ? [] : lines.map((text, i) => ({
+    kind: added ? 'add' : 'delete', sign, text,
+    oldLine: added ? null : i + 1, newLine: added ? i + 1 : null,
+  })), hunks: [{ oldStart: added ? 0 : 1, newStart: added ? 1 : 0 }],
+  added: added ? lines.length : 0, removed: added ? 0 : lines.length,
+  raw, oversized };
+}
+
 function changeInfo(change) {
   const kind = typeof change.kind === 'object' ? change.kind : { type: change.kind || change.type };
   const moved = kind.move_path || kind.movePath || change.newPath;

package/neural-interface/public/shared/cdx/cdx-output.js

@@ -1,3 +1,4 @@
+import { cxpText } from './cdx-copy.js';
 import { OUTPUT_LIMITS, boundedText, cleanTerminal, jsonAnswer, looksLikeStreamingJson, isPreformattedText, structuredValueModel, readableStructuredValue, parseUnifiedDiff, hasOverlongRun, outputOverflows, displayDiffPath } from './cdx-output-model.js';
 
 const sources = new WeakMap();
@@ -193,7 +194,7 @@ export function hydrateOutputControls(container) {
       watchCaps(root);
     } else if (button.dataset.outputAction === 'copy') {
       const text = sources.get(root)?.text ?? root.dataset.original ?? diffStates.get(root)?.raw ?? root.querySelector('.cxp-diff-source')?.textContent ?? '';
-      navigator.clipboard.writeText(text).then(() => { button.textContent = 'Copied'; setTimeout(() => { button.textContent = root.classList.contains('cxp-diff-view') ? 'Copy patch' : 'Copy'; }, 1500); }).catch(() => {});
+      navigator.clipboard.writeText(text).then(() => { button.textContent = 'Copied'; setTimeout(() => { button.textContent = root.classList.contains('cxp-diff-view') ? cxpText('copyPatch', 'Copy patch') : 'Copy'; }, 1500); }).catch(() => {});
     }
     event.stopPropagation();
   });
@@ -310,19 +311,19 @@ export function renderDiffView(container, files, { lazy = false, cwd = container
   if (!state) {
     state = { entries: new Map(), raw: '' }; diffStates.set(container, state);
     const controls = node('div', 'cxp-output-controls');
-    const copy = node('button', 'cxp-output-control', 'Copy patch'); copy.type = 'button'; copy.dataset.outputAction = 'copy'; controls.append(copy);
+    const copy = node('button', 'cxp-output-control', cxpText('copyPatch', 'Copy patch')); copy.type = 'button'; copy.dataset.outputAction = 'copy'; controls.append(copy);
     const source = node('pre', 'cxp-diff-source'); source.hidden = true;
     if (summaryEl) controls.insertBefore(summaryEl, copy);
     else controls.insertBefore(node('div', 'cxp-card-meta'), copy);
     container.replaceChildren(controls, source); hydrateOutputControls(container);
   }
   const summary = container.querySelector('.cxp-output-controls .cxp-card-meta');
-  if (summary && !summaryEl) summary.textContent = `${files.length} file change${files.length === 1 ? '' : 's'}`;
+  if (summary && !summaryEl) summary.textContent = cxpText(files.length === 1 ? 'oneFileChange' : 'fileChanges', files.length === 1 ? '1 file change' : '{count} file changes', { count: files.length });
   state.raw = files.map(file => file.raw || '').join('\n');
   let filesNote = container.querySelector('.cxp-diff-files-note');
   if (!filesNote) { filesNote = node('div', 'cxp-output-note cxp-diff-files-note'); container.append(filesNote); }
   filesNote.hidden = !files.some(file => file.filesTruncated);
-  filesNote.textContent = 'Remaining files omitted: preview limited to 100 files.';
+  filesNote.textContent = cxpText('filesLimit', 'Remaining files omitted: preview limited to 100 files.');
   const serialized = files.map(file => file.raw?.startsWith('diff --git ') ? file.raw : `diff --git a/${file.oldPath || file.path} b/${file.path}\n${file.status === 'renamed' ? `rename from ${file.oldPath}\nrename to ${file.path}\n` : ''}--- ${file.status === 'added' ? '/dev/null' : `a/${file.oldPath || file.path}`}\n+++ ${file.status === 'deleted' ? '/dev/null' : `b/${file.path}`}\n${file.raw || ''}`).join('\n');
   container.querySelector('.cxp-diff-source').textContent = boundedText(serialized, OUTPUT_LIMITS.input);
   const retained = new Set();
@@ -341,11 +342,11 @@ export function renderDiffView(container, files, { lazy = false, cwd = container
         const f = entry.file;
         if (!f) return;
         entry.built = true;
-        const message = f.binary ? 'Binary file; text diff unavailable.' : f.oversized ? 'Oversized patch; rendering omitted (200,000 characters / 2,000 lines per file limit). Raw patch is copyable.' : f.unavailable || !f.lines.length && !f.hunks.length && f.status !== 'renamed' ? 'Patch not supplied or not a unified diff.' : '';
+        const message = f.binary ? cxpText('binary', 'Binary file; text diff unavailable.') : f.oversized ? cxpText('oversized', 'Oversized patch; rendering omitted (200,000 characters / 2,000 lines per file limit). Raw patch is copyable.') : f.unavailable || !f.lines.length && !f.hunks.length && f.status !== 'renamed' ? cxpText('patchMissing', 'Patch not supplied or not a unified diff.') : '';
         entry.note.textContent = message; entry.note.hidden = !message;
         diffRows(f, entry.rows, message ? 0 : entry.full ? OUTPUT_LIMITS.diffLines : OUTPUT_LIMITS.diffPreview);
         entry.more.hidden = !!message || f.lines.length <= OUTPUT_LIMITS.diffPreview;
-        entry.more.textContent = entry.full ? 'Show fewer lines' : `Show full diff (${f.lines.length} lines)`;
+        entry.more.textContent = entry.full ? cxpText('fewerLines', 'Show fewer lines') : cxpText('fullDiff', 'Show full diff ({count} lines)', { count: f.lines.length });
         watchCap(entry.rows);
       };
       entry.build = build;
@@ -361,7 +362,7 @@ export function renderDiffView(container, files, { lazy = false, cwd = container
     entry.path.title = file.status === 'renamed' ? `${file.oldPath} → ${file.path}` : file.path;
     measureChanges(entry.path, () => fitDiffPath(entry.path, entry.file, container.dataset.cwd));
     fitDiffPath(entry.path, file, cwd);
-    entry.status.textContent = file.status;
+    entry.status.textContent = cxpText(`diff_${file.status}`, file.status);
     entry.stats.textContent = `+${file.added} −${file.removed}`;
     if (entry.built || !lazy || !observer) { if (entry.details.open || entry.built) entry.build(); }
     else { pending.set(entry.details, entry.build); observer.observe(entry.details); }