@oddessentials/agent-guild 0.23.0 → 0.24.1

package/web/index.html

@@ -125,6 +125,7 @@
       </div>
       <div class="panel-actions">
         <button id="panel-voice" class="btn voice" type="button" hidden aria-pressed="false" title="Speak into this terminal. Review the text, then press Enter yourself.">Dictate</button>
+        <button id="panel-copy" class="btn" type="button" hidden aria-haspopup="dialog" title="Select and copy terminal text">Copy…</button>
         <button id="panel-stop" class="btn danger" type="button">Stop</button>
         <button id="panel-close" class="btn" type="button" title="Hide the terminal. The session keeps running.">Hide</button>
       </div>
@@ -133,6 +134,21 @@
     <div id="voice-preview" class="voice-preview" hidden aria-live="polite"></div>
   </div>
 
+  <dialog id="terminal-copy" class="terminal-copy" aria-labelledby="terminal-copy-title">
+    <div class="terminal-copy-bar">
+      <div class="terminal-copy-heading">
+        <h2 id="terminal-copy-title">Copy terminal text</h2>
+        <p class="sub" data-session></p>
+      </div>
+      <button class="btn" type="button" data-done>Done</button>
+    </div>
+    <textarea readonly autofocus wrap="off" spellcheck="false" inputmode="none" aria-label="Terminal text snapshot" aria-describedby="terminal-copy-status"></textarea>
+    <div class="terminal-copy-footer">
+      <p id="terminal-copy-status" role="status"></p>
+      <button class="btn primary" type="button" data-copy disabled>Copy selection</button>
+    </div>
+  </dialog>
+
   <dialog id="models" class="models" aria-labelledby="models-title">
     <div class="models-bar">
       <span id="models-icon" class="provider-icon small"></span>
@@ -304,6 +320,11 @@
         <summary></summary>
         <ul></ul>
       </details>
+      <details class="multiplexers" hidden>
+        <summary>Terminal multiplexers</summary>
+        <button class="btn multiplexer-refresh" type="button">Refresh</button>
+        <div class="multiplexer-list"></div>
+      </details>
       <div class="provider-actions">
         <button class="btn primary new" type="button">New</button>
         <button class="btn existing" type="button">Existing…</button>

package/web/styles.css

@@ -418,6 +418,27 @@ body:has(#app[hidden]):has(#auth[hidden]):has(#stopped[hidden])::after {
 }
 .terminal-host { flex: 1; min-height: 0; padding: 8px 4px 4px 10px; }
 .terminal-host > div { height: 100%; }
+.terminal-copy {
+  width: min(880px, calc(100vw - 24px)); height: min(720px, calc(100dvh - 24px));
+  max-width: none; max-height: none; padding: 0; overflow: hidden;
+  color: var(--text); background: var(--surface); border: 1px solid var(--border);
+  border-radius: var(--radius); box-shadow: var(--shadow);
+}
+.terminal-copy[open] { display: flex; flex-direction: column; }
+.terminal-copy::backdrop { background: rgba(15, 17, 21, 0.5); }
+.terminal-copy-bar, .terminal-copy-footer { display: flex; align-items: center; gap: 12px; padding: 12px 16px; }
+.terminal-copy-heading { flex: 1; min-width: 0; }
+.terminal-copy-heading .sub { margin: 4px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 0.8rem; }
+.terminal-copy textarea {
+  flex: 1; min-height: 0; width: 100%; resize: none; margin: 0; padding: 14px 16px;
+  border: 0; border-block: 1px solid var(--border); border-radius: 0;
+  background: var(--term-bg); color: #e6e9ef; font: 14px/1.5 var(--font-mono);
+  white-space: pre; user-select: text; -webkit-user-select: text; touch-action: auto; overscroll-behavior: contain;
+}
+.terminal-copy textarea:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
+.terminal-copy-footer p { flex: 1; margin: 0; color: var(--muted); font-size: 0.8rem; }
+.terminal-copy .btn { min-height: 44px; flex-shrink: 0; }
+.terminal-copy .btn:disabled { cursor: default; }
 @media (pointer: coarse) {
   /* A drag on the panel would otherwise scroll the page behind it. */
   body:has(#terminal-panel:not([hidden])) { overflow: hidden; }
@@ -736,3 +757,13 @@ a.news-link:visited { color: var(--muted); }
   .history-row .session-id { grid-row: 2; justify-self: start; }
   .history-form { flex-wrap: wrap; }
 }
+/* Installation controls share each skin's card colors and button styles. */
+.multiplexers { margin: .6rem 0; }
+.multiplexers > summary { cursor: pointer; font-size: .85rem; }
+.multiplexer-refresh { margin: .5rem 0; }
+.multiplexer-row { padding: .65rem 0; border-top: 1px solid var(--border); }
+.multiplexer-row > strong { margin-right: .6rem; }
+.multiplexer-note { font-size: .8rem; line-height: 1.5; overflow-wrap: anywhere; margin: .4rem 0; }
+.multiplexer-row .copies { margin-top: .4rem; }
+.multiplexer-row .copy-head { flex-wrap: wrap; }
+.multiplexer-row .copy-name { flex: 1 0 100%; }

package/web/terminal-copy.js

@@ -0,0 +1,128 @@
+// A frozen copy surface keeps native touch selection separate from terminal gestures.
+const SELECT_HINT = 'Touch and hold to select text.';
+
+export function captureTerminalText(term) {
+  const buffer = term.buffer.active;
+  const lines = [];
+  let viewportLine = 0;
+  let viewportPrefix = '';
+  for (let y = 0; y < buffer.length; y++) {
+    const line = buffer.getLine(y);
+    const text = line.translateToString(true, 0, term.cols);
+    const wrapped = line.isWrapped && lines.length > 0;
+    if (y === buffer.viewportY) {
+      viewportLine = wrapped ? lines.length - 1 : lines.length;
+      // The visible row can begin inside a joined line. Keep its actual text
+      // prefix: terminal cells and JavaScript character counts differ for Unicode.
+      viewportPrefix = wrapped ? lines[lines.length - 1] : '';
+    }
+    if (wrapped) lines[lines.length - 1] += text;
+    else lines.push(text);
+  }
+  return { text: lines.join('\n'), viewportLine, viewportPrefix };
+}
+
+export class TerminalCopy {
+  constructor({ opener, dialog, getCurrent }) {
+    this.dialog = dialog;
+    this.getCurrent = getCurrent;
+    this.text = dialog.querySelector('textarea');
+    this.copyButton = dialog.querySelector('[data-copy]');
+    this.status = dialog.querySelector('[role="status"]');
+    this.current = null;
+    this.attempt = null;
+    const touch = matchMedia('(any-pointer: coarse)');
+    const availability = () => { opener.hidden = !touch.matches && !navigator.maxTouchPoints; };
+    touch.addEventListener('change', availability);
+    availability();
+    opener.addEventListener('click', () => this.open());
+    this.copyButton.addEventListener('click', () => this.copy());
+    dialog.querySelector('[data-done]').addEventListener('click', () => this.close(true));
+    dialog.addEventListener('cancel', (event) => { event.preventDefault(); this.close(true); });
+    // A programmatic/native close can arrive after the sheet has already reopened.
+    dialog.addEventListener('close', () => { if (!dialog.open) this.clear(); });
+    this.text.addEventListener('select', () => this.selectionChanged());
+    document.addEventListener('selectionchange', () => {
+      if (dialog.open) this.selectionChanged();
+    });
+  }
+
+  open() {
+    if (this.dialog.open) return;
+    const current = this.getCurrent();
+    if (!current) return;
+    const snapshot = captureTerminalText(current.term);
+    this.current = current;
+    this.selection = '0:0';
+    this.text.value = snapshot.text;
+    this.dialog.querySelector('[data-session]').textContent = current.name;
+    this.status.textContent = SELECT_HINT;
+    this.copyButton.disabled = true;
+    this.dialog.showModal();
+    this.text.focus({ preventScroll: true });
+    this.text.setSelectionRange(0, 0);
+    const style = getComputedStyle(this.text);
+    this.text.scrollTop = snapshot.viewportLine * parseFloat(style.lineHeight);
+    this.text.scrollLeft = 0;
+    if (snapshot.viewportPrefix) {
+      const measure = document.createElement('canvas').getContext('2d');
+      measure.font = style.font;
+      this.text.scrollLeft = measure.measureText(snapshot.viewportPrefix).width;
+    }
+  }
+
+  selectionChanged() {
+    const selection = `${this.text.selectionStart}:${this.text.selectionEnd}`;
+    if (selection !== this.selection && this.status.textContent === 'Copied') {
+      this.status.textContent = SELECT_HINT;
+    }
+    this.selection = selection;
+    this.copyButton.disabled = Boolean(this.attempt) || this.text.selectionStart === this.text.selectionEnd;
+  }
+
+  async copy() {
+    const current = this.current;
+    if (!current || this.attempt) return;
+    const range = `${this.text.selectionStart}:${this.text.selectionEnd}`;
+    const selected = this.text.value.slice(this.text.selectionStart, this.text.selectionEnd);
+    if (!selected) return;
+    const attempt = this.attempt = {};
+    this.copyButton.disabled = true;
+    this.status.textContent = 'Copying…';
+    try {
+      // Stay in the user's click activation; no permission preflight or clipboard read.
+      // Textareas normalize newlines to LF; match xterm's Windows copy convention.
+      const text = /Win/.test(navigator.platform) ? selected.replace(/\n/g, '\r\n') : selected;
+      await navigator.clipboard.writeText(text);
+      if (this.current === current && this.attempt === attempt) {
+        this.status.textContent = range === `${this.text.selectionStart}:${this.text.selectionEnd}` ? 'Copied' : SELECT_HINT;
+      }
+    } catch {
+      if (this.current === current && this.attempt === attempt) {
+        this.status.textContent = 'Use Copy in the text selection menu.';
+        this.text.focus({ preventScroll: true });
+      }
+    } finally {
+      if (this.attempt === attempt) {
+        this.attempt = null;
+        this.selectionChanged();
+      }
+    }
+  }
+
+  close(restoreFocus = false) {
+    const current = this.current;
+    this.clear();
+    if (this.dialog.open) this.dialog.close();
+    if (restoreFocus && current && this.getCurrent()?.term === current.term) current.term.focus();
+  }
+
+  clear() {
+    this.current = null;
+    this.attempt = null;
+    this.text.value = '';
+    this.status.textContent = '';
+    this.dialog.querySelector('[data-session]').textContent = '';
+    this.copyButton.disabled = true;
+  }
+}