@madarco/agentbox 0.2.0 → 0.4.0

package/dist/{create-SE6H4B5U-ESNDTXAI.js → create-SE6H4B5U-IWAZHJHV.js}

@@ -3,8 +3,8 @@ import {
   createBox,
   defaultBoxName,
   sanitizeBasename
-} from "./chunk-3OPLNXQ5.js";
-import "./chunk-3NIZKZPJ.js";
+} from "./chunk-3NCUES35.js";
+import "./chunk-MOC54XL6.js";
 import "./chunk-IDR4HVIC.js";
 import "./chunk-SOMIKEN2.js";
 export {
@@ -12,4 +12,4 @@ export {
   defaultBoxName,
   sanitizeBasename
 };
-//# sourceMappingURL=create-SE6H4B5U-ESNDTXAI.js.map
+//# sourceMappingURL=create-SE6H4B5U-IWAZHJHV.js.map

package/dist/index.js

@@ -1,11 +1,12 @@
 #!/usr/bin/env node
 import {
   createBox
-} from "./chunk-3OPLNXQ5.js";
+} from "./chunk-3NCUES35.js";
 import {
   AmbiguousBoxError,
   BoxNotFoundError,
   destroyBox,
+  getBoxEndpoints,
   getBoxHostPaths,
   inspectBox,
   listBoxes,
@@ -15,7 +16,7 @@ import {
   startBox,
   stopBox,
   unpauseBox
-} from "./chunk-3NU4PS5W.js";
+} from "./chunk-3JKQNOXP.js";
 import {
   ClaudeSessionError,
   SHARED_CLAUDE_VOLUME,
@@ -37,7 +38,7 @@ import {
   resolveClaudeVolume,
   startClaudeSession,
   stopRelay
-} from "./chunk-3NIZKZPJ.js";
+} from "./chunk-MOC54XL6.js";
 import {
   STATE_DIR,
   readState,
@@ -66,6 +67,7 @@ import {
   lookupKey,
   pruneOrphanProjectConfigs,
   pullToHost,
+  readBoxStatus,
   refreshExport,
   removeCheckpoint,
   removeImage,
@@ -1600,6 +1602,7 @@ var InputParser = class {
         if (b === LEADER) {
           this.flush();
           this.state = "leader";
+          this.onEvent({ type: "leader", active: true });
           this.arm(this.leaderMs, "leader");
         } else if (b === ESC) {
           this.flush();
@@ -1622,14 +1625,18 @@ var InputParser = class {
           if (c === "v") this.onEvent({ type: "action", name: "vnc" });
           else if (c === "w") this.onEvent({ type: "action", name: "web" });
           else if (c === "c") this.onEvent({ type: "action", name: "code" });
-          else if (c === "q" || c === "d") this.onEvent({ type: "quit" });
-          else if (c === "k" || c === "p" || c === "P") this.onEvent({ type: "switch", dir: "prev" });
+          else if (c === "s") this.onEvent({ type: "action", name: "stop" });
+          else if (c === "p") this.onEvent({ type: "action", name: "pause" });
+          else if (c === "d") this.onEvent({ type: "action", name: "destroy" });
+          else if (c === "q") this.onEvent({ type: "quit" });
+          else if (c === "k") this.onEvent({ type: "switch", dir: "prev" });
           else if (c === "j" || c === "n" || c === "N") this.onEvent({ type: "switch", dir: "next" });
           else {
             this.fwd.push(b);
             this.flush();
           }
         }
+        this.onEvent({ type: "leader", active: false });
         this.state = "normal";
         i++;
         continue;
@@ -1737,6 +1744,7 @@ var InputParser = class {
       if (kind === "leader" && this.state === "leader") {
         this.fwd.push(LEADER);
         this.flush();
+        this.onEvent({ type: "leader", active: false });
         this.state = "normal";
       } else if (kind === "esc" && (this.state === "esc" || this.state === "mouseX10")) {
         this.forwardVerbatim(this.esc);
@@ -1861,6 +1869,18 @@ var PtySession = class {
 };
 
 // src/dashboard/sidebar.ts
+function ellipsize(s, max) {
+  if (max <= 0) return "";
+  if (s.length <= max) return s;
+  if (max === 1) return "\u2026";
+  return s.slice(0, max - 1) + "\u2026";
+}
+function ellipsizeHead(s, max) {
+  if (max <= 0) return "";
+  if (s.length <= max) return s;
+  if (max === 1) return "\u2026";
+  return "\u2026" + s.slice(s.length - (max - 1));
+}
 function activityCell(b) {
   if (b.state !== "running") return `[${b.state}]`;
   switch (b.claudeActivity) {
@@ -1876,8 +1896,12 @@ function activityCell(b) {
 }
 var NEW_BOX_ID = "__agentbox_new__";
 var NEW_BOX_LABEL = "+ New box";
-var SIDEBAR_HEADER = "\u2550 AgentBox \u2550";
-var SIDEBAR_HEADER_LINES = 2;
+var SIDEBAR_HEADER = "AgentBox";
+function topBorder(label, w) {
+  const lead = `\u256D\u2500\u2500\u2500 ${label} `;
+  if (lead.length >= w) return lead.slice(0, w);
+  return lead + "\u2500".repeat(w - lead.length);
+}
 function fit(s, w) {
   if (s.length === w) return s;
   if (s.length > w) return s.slice(0, w);
@@ -1889,17 +1913,55 @@ function center(s, w) {
   const leftPad = Math.floor(pad / 2);
   return " ".repeat(leftPad) + s + " ".repeat(pad - leftPad);
 }
+function projectLabel(project) {
+  if (!project) return "(no project)";
+  const parts = project.split("/").filter(Boolean);
+  return parts[parts.length - 1] ?? project;
+}
+function stripTitleGlyph(s) {
+  const t = s.replace(/^[\s\p{S}*·]+/u, "");
+  return t.length > 0 ? t : s.trim();
+}
+function boxRow(b, marker, w) {
+  const numStr = b.index != null ? `${b.index} ` : "";
+  const status = activityCell(b);
+  const left = `${marker}${numStr}`;
+  const room = w - left.length - status.length - 1;
+  if (room <= 0) return fit(`${left}${status}`, w);
+  const middle = b.state === "running" && b.sessionTitle ? ellipsize(stripTitleGlyph(b.sessionTitle), room) : ellipsizeHead(b.name, room);
+  return fit(`${left}${middle}`, w - status.length) + status;
+}
 function sidebarLines(boxes, selectedId, w, h) {
-  const lines = [center(SIDEBAR_HEADER, w), fit("", w)];
-  const nameW = Math.min(16, Math.max(6, ...boxes.map((b) => b.name.length), 6));
+  const lines = [topBorder(SIDEBAR_HEADER, w), fit("", w)];
+  const rowOwner = [null, null];
+  const headerRows = [true, false];
+  const push = (line, owner, header) => {
+    lines.push(fit(line, w));
+    rowOwner.push(owner);
+    headerRows.push(header);
+  };
+  let prevProject;
+  let seenGroup = false;
   for (const b of boxes) {
-    const marker = b.id === selectedId ? "\u25B8 " : "  ";
-    const row2 = b.id === NEW_BOX_ID ? `${marker}${NEW_BOX_LABEL}` : `${marker}${fit(b.name, nameW)}  ${activityCell(b)}`;
-    lines.push(fit(row2, w));
+    const marker = b.id === selectedId ? "\u25B8" : " ";
+    if (b.id === NEW_BOX_ID) {
+      push(`${marker}${NEW_BOX_LABEL}`, b.id, false);
+      continue;
+    }
+    if (!seenGroup || b.project !== prevProject) {
+      push(center(` \u2500\u2500 ${projectLabel(b.project)} \u2500\u2500 `, w), null, true);
+      prevProject = b.project;
+      seenGroup = true;
+    }
+    push(boxRow(b, marker, w), b.id, false);
   }
-  if (boxes.length === 0) lines.push(fit(" (no boxes)", w));
-  while (lines.length < h) lines.push(fit("", w));
-  return lines.slice(0, h);
+  if (boxes.length === 0) push(" (no boxes)", null, false);
+  while (lines.length < h) push("", null, false);
+  return {
+    lines: lines.slice(0, h),
+    rowOwner: rowOwner.slice(0, h),
+    headerRows: headerRows.slice(0, h)
+  };
 }
 function menuLines(boxName, w, h) {
   const body = [
@@ -1963,29 +2025,58 @@ var BRAND_NOBOLD = "\x1B[22m";
 var HINT_KEY = "\x1B[38;5;255m";
 var HINT_TXT = "\x1B[38;5;245m";
 var BAR_RESET = "\x1B[0m";
+var SWITCH_HINT = ["Control+Option+\u2191/\u2193", "switch"];
 var HINT_GROUPS = [
-  ["Control+Option+Up/Down", "switch"],
+  SWITCH_HINT,
   ["Control+a c", "code"],
   ["Control+a v", "vnc"],
   ["Control+a w", "web"],
   ["Control+a q", "quit"]
 ];
-function statusLine(box, w, stateLabel) {
+var COLLAPSED_HINT_GROUPS = [
+  SWITCH_HINT,
+  ["Control+a", "more"]
+];
+var ADVANCED_HINT_GROUPS = [
+  ["c", "code"],
+  ["v", "vnc"],
+  ["w", "web"],
+  ["s", "stop"],
+  ["p", "pause"],
+  ["d", "destroy"],
+  ["q", "quit"]
+];
+function statusLine(box, w, stateLabel, groups = HINT_GROUPS) {
   const state = stateLabel ?? (box ? box.state === "running" ? box.claudeActivity ?? "unknown" : box.state : "");
   const brandPrefix = box ? " agentbox \u25B8 " : " agentbox ";
-  const brandMain = box ? `${box.name} (${state}) ` : "";
-  const left = brandPrefix + brandMain;
-  const leftStyled = BAR_BRAND + brandPrefix + BRAND_BOLD + brandMain + BRAND_NOBOLD;
+  const base = box ? `${box.name} (${state})` : "";
+  const coreMain = box ? `${base} ` : "";
+  const corePlain = brandPrefix + coreMain;
   const SEP = "   \u2502   ";
-  const rightPlain = HINT_GROUPS.map(([k, l]) => `${k}: ${l}`).join(SEP) + " ";
-  const rightStyled = HINT_GROUPS.map(([k, l]) => `${HINT_KEY}${k}${HINT_TXT}: ${l}`).join(
-    `${HINT_TXT}${SEP}`
-  ) + " ";
-  if (left.length + rightPlain.length + 1 > w) {
-    return BAR_BASE + BAR_BRAND + fit(left, w) + BAR_RESET;
-  }
-  const gap = w - left.length - rightPlain.length;
-  return BAR_BASE + leftStyled + BAR_BASE + " ".repeat(gap) + rightStyled + BAR_RESET;
+  const renderHints = (g) => ({
+    plain: g.map(([k, l]) => `${k}: ${l}`).join(SEP) + " ",
+    styled: g.map(([k, l]) => `${HINT_KEY}${k}${HINT_TXT}: ${l}`).join(`${HINT_TXT}${SEP}`) + " "
+  });
+  let hints = null;
+  for (const g of [groups, COLLAPSED_HINT_GROUPS]) {
+    const h = renderHints(g);
+    if (corePlain.length + h.plain.length + 1 <= w) {
+      hints = h;
+      break;
+    }
+  }
+  if (!hints) {
+    return BAR_BASE + BAR_BRAND + fit(corePlain, w) + BAR_RESET;
+  }
+  const room = w - corePlain.length - hints.plain.length - 1;
+  let titleSeg = "";
+  if (box?.sessionTitle && room >= 7) {
+    titleSeg = ` \u2014 ${ellipsize(box.sessionTitle, Math.min(40, room - 3))}`;
+  }
+  const leftPlain = brandPrefix + base + titleSeg + (box ? " " : "");
+  const leftStyled = BAR_BRAND + brandPrefix + BRAND_BOLD + base + titleSeg + (box ? " " : "") + BRAND_NOBOLD;
+  const gap = w - leftPlain.length - hints.plain.length;
+  return BAR_BASE + leftStyled + BAR_BASE + " ".repeat(gap) + hints.styled + BAR_RESET;
 }
 
 // src/dashboard/compositor.ts
@@ -1996,6 +2087,7 @@ var SGR_RESET = "\x1B[0m";
 var POLL_MS = 1e3;
 var FRAME_MS = 16;
 var RESIZE_DEBOUNCE_MS = 120;
+var LEADER_LINGER_MS = 1500;
 var SYNC_BEGIN = "\x1B[?2026h";
 var SYNC_END = "\x1B[?2026l";
 function cursorTo2(x, y) {
@@ -2008,10 +2100,40 @@ var Compositor = class {
     this.layout = computeLayout(this.out.columns ?? 100, this.out.rows ?? 30);
     this.parser = new InputParser({
       onEvent: (e) => {
+        if (e.type === "leader") {
+          if (this.leaderLingerTimer) {
+            clearTimeout(this.leaderLingerTimer);
+            this.leaderLingerTimer = null;
+          }
+          if (e.active) {
+            this.leaderActive = true;
+          } else {
+            this.leaderLingerTimer = setTimeout(() => {
+              this.leaderLingerTimer = null;
+              this.leaderActive = false;
+              this.drawChrome();
+            }, LEADER_LINGER_MS);
+          }
+          this.drawChrome();
+          return;
+        }
+        if (this.pendingConfirm) {
+          if (e.type === "forward") {
+            this.handleConfirmKey(e.bytes);
+            return;
+          }
+          this.pendingConfirm = null;
+          this.drawChrome();
+        }
         if (e.type === "quit") this.onSig();
         else if (e.type === "switch") this.switchBox(e.dir);
-        else if (e.type === "action") void this.doAction(e.name);
-        else if (this.createMenu) this.handleCreateMenuKey(e.bytes);
+        else if (e.type === "action") {
+          if (e.name === "pause" || e.name === "stop" || e.name === "destroy") {
+            void this.doLifecycle(e.name);
+          } else {
+            void this.doAction(e.name);
+          }
+        } else if (this.createMenu) this.handleCreateMenuKey(e.bytes);
         else if (this.lifecycleMenu) this.handleLifecycleMenuKey(e.bytes);
         else if (this.menu) this.handleMenuKey(e.bytes);
         else this.session?.write(e.bytes);
@@ -2038,6 +2160,14 @@ var Compositor = class {
   menu = null;
   lifecycleMenu = null;
   createMenu = null;
+  /** True while the Ctrl-a leader is pending — swaps the footer to the
+   *  expanded chord menu (chrome only; never touches the right pane). */
+  leaderActive = false;
+  /** Holds the expanded footer for LEADER_LINGER_MS after the leader resolves
+   *  (so the chord menu doesn't flash by). */
+  leaderLingerTimer = null;
+  /** Set while a destroy confirm is pending in the status bar. */
+  pendingConfirm = null;
   activeMode = "claude";
   flashMsg = null;
   flashTimer = null;
@@ -2097,7 +2227,9 @@ var Compositor = class {
     return this.boxes.find((b) => b.id === this.selectedId);
   }
   async poll() {
-    const before = JSON.stringify(this.boxes.map((b) => [b.id, b.state, b.claudeActivity]));
+    const before = JSON.stringify(
+      this.boxes.map((b) => [b.id, b.state, b.claudeActivity, b.sessionTitle])
+    );
     await this.refreshBoxes();
     if (this.busy) {
     } else if (!this.boxes.some((b) => b.id === this.selectedId) && this.boxes[0]) {
@@ -2109,7 +2241,9 @@ var Compositor = class {
       const reresolve = this.session && !running || this.placeholder && running || this.menu && !running || this.lifecycleMenu != null && box?.state !== this.lifecycleMenu.state;
       if (reresolve) await this.spawnActive();
     }
-    if (JSON.stringify(this.boxes.map((b) => [b.id, b.state, b.claudeActivity])) !== before) {
+    if (JSON.stringify(
+      this.boxes.map((b) => [b.id, b.state, b.claudeActivity, b.sessionTitle])
+    ) !== before) {
       this.drawChrome();
     }
   }
@@ -2124,6 +2258,7 @@ var Compositor = class {
     this.menu = null;
     this.lifecycleMenu = null;
     this.createMenu = null;
+    this.pendingConfirm = null;
     this.clearRightPane();
     const id = this.selectedId;
     const target = await this.deps.resolveTarget(id);
@@ -2137,6 +2272,7 @@ var Compositor = class {
     this.menu = null;
     this.lifecycleMenu = null;
     this.createMenu = null;
+    this.pendingConfirm = null;
     if (target.kind === "attach") {
       this.activeMode = target.mode ?? "claude";
       this.session = new PtySession(
@@ -2214,7 +2350,7 @@ var Compositor = class {
     for (const b of bytes) {
       if (m.confirmDestroy) {
         if (b === 121 || b === 13 || b === 10) {
-          void this.choosePaused("destroy");
+          void this.runDestroy(this.selectedId, this.selectedBox()?.name ?? this.selectedId);
         } else {
           m.confirmDestroy = false;
           this.drawChrome();
@@ -2224,7 +2360,7 @@ var Compositor = class {
       }
       const resumeKey = m.state === "paused" ? 117 : 115;
       if (b === resumeKey) {
-        void this.choosePaused("resume");
+        void this.resumeSelected();
         return;
       }
       if (b === 100) {
@@ -2235,37 +2371,27 @@ var Compositor = class {
       }
     }
   }
-  async choosePaused(which) {
+  async resumeSelected() {
     if (this.busy) return;
     const id = this.selectedId;
     const name = this.selectedBox()?.name ?? id;
-    const resumeVerb = this.lifecycleMenu?.state === "stopped" ? "start" : "unpause";
+    const verb = this.lifecycleMenu?.state === "stopped" ? "start" : "unpause";
     this.busy = true;
     this.menu = null;
     this.lifecycleMenu = null;
     this.createMenu = null;
-    this.placeholder = ["", which === "resume" ? "  Resuming\u2026" : "  Destroying\u2026"];
+    this.placeholder = ["", "  Resuming\u2026"];
     this.prevRows = null;
     this.drawChrome();
     this.scheduleRender();
     try {
-      if (which === "resume") {
-        await this.deps.resumeBox(id);
-        if (this.selectedId !== id || this.tornDown) return;
-        await this.refreshBoxes();
-        await this.spawnActive();
-      } else {
-        await this.deps.destroyBox(id);
-        if (this.tornDown) return;
-        await this.refreshBoxes();
-        if (this.boxes[0]) this.selectedId = this.boxes[0].id;
-        await this.spawnActive();
-        this.flash(`destroyed ${name}`);
-      }
+      await this.deps.resumeBox(id);
+      if (this.selectedId !== id || this.tornDown) return;
+      await this.refreshBoxes();
+      await this.spawnActive();
     } catch (err) {
       if (this.selectedId !== id || this.tornDown) return;
       const msg = err instanceof Error ? err.message : String(err);
-      const verb = which === "resume" ? resumeVerb : "destroy";
       this.placeholder = [
         "",
         `  Failed to ${verb} ${name}:`,
@@ -2279,6 +2405,102 @@ var Compositor = class {
       this.busy = false;
     }
   }
+  /** Destroy `id` and recover the selection. Shared by the lifecycle-menu
+   *  confirm and the running-box `Ctrl-a d` status-bar confirm. */
+  async runDestroy(id, name) {
+    if (this.busy) return;
+    this.busy = true;
+    this.menu = null;
+    this.lifecycleMenu = null;
+    this.createMenu = null;
+    this.placeholder = ["", "  Destroying\u2026"];
+    this.prevRows = null;
+    this.drawChrome();
+    this.scheduleRender();
+    try {
+      await this.deps.destroyBox(id);
+      if (this.tornDown) return;
+      await this.refreshBoxes();
+      if (this.boxes[0]) this.selectedId = this.boxes[0].id;
+      await this.spawnActive();
+      this.flash(`destroyed ${name}`);
+    } catch (err) {
+      if (this.tornDown) return;
+      const msg = err instanceof Error ? err.message : String(err);
+      this.placeholder = [
+        "",
+        `  Failed to destroy ${name}:`,
+        `  ${msg}`,
+        "",
+        `  Try from a shell: agentbox destroy ${name}`
+      ];
+      this.prevRows = null;
+      this.scheduleRender();
+    } finally {
+      this.busy = false;
+    }
+  }
+  /** Ctrl-a p/s/d on the selected box. pause/stop transition state (the pane
+   *  re-resolves to the lifecycle menu); destroy asks to confirm first. */
+  async doLifecycle(name) {
+    if (this.selectedId === NEW_BOX_ID) {
+      this.flash("select a box first");
+      return;
+    }
+    const id = this.selectedId;
+    const boxName = this.selectedBox()?.name ?? id;
+    if (name === "destroy") {
+      this.pendingConfirm = { boxId: id, name: boxName };
+      this.drawChrome();
+      return;
+    }
+    if (this.selectedBox()?.state !== "running") {
+      this.flash(`${boxName} is not running`);
+      return;
+    }
+    if (this.busy) return;
+    this.busy = true;
+    this.menu = null;
+    this.lifecycleMenu = null;
+    this.createMenu = null;
+    this.placeholder = ["", name === "pause" ? "  Pausing\u2026" : "  Stopping\u2026"];
+    this.prevRows = null;
+    this.drawChrome();
+    this.scheduleRender();
+    try {
+      if (name === "pause") await this.deps.pauseBox(id);
+      else await this.deps.stopBox(id);
+      if (this.selectedId !== id || this.tornDown) return;
+      await this.refreshBoxes();
+      await this.spawnActive();
+      this.flash(`${name === "pause" ? "paused" : "stopped"} ${boxName}`);
+    } catch (err) {
+      if (this.selectedId !== id || this.tornDown) return;
+      const msg = err instanceof Error ? err.message : String(err);
+      this.placeholder = [
+        "",
+        `  Failed to ${name} ${boxName}:`,
+        `  ${msg}`,
+        "",
+        `  Try from a shell: agentbox ${name} ${boxName}`
+      ];
+      this.prevRows = null;
+      this.scheduleRender();
+    } finally {
+      this.busy = false;
+    }
+  }
+  handleConfirmKey(bytes) {
+    const c = this.pendingConfirm;
+    if (!c) return;
+    const b = bytes[0];
+    this.pendingConfirm = null;
+    if (b === 121 || b === 13 || b === 10) {
+      void this.runDestroy(c.boxId, c.name);
+    } else {
+      this.drawChrome();
+    }
+  }
   handleCreateMenuKey(bytes) {
     for (const b of bytes) {
       if (b === 99 || b === 13 || b === 10) {
@@ -2360,6 +2582,7 @@ var Compositor = class {
   }
   switchBox(dir) {
     if (this.boxes.length === 0) return;
+    this.pendingConfirm = null;
     const i = Math.max(
       0,
       this.boxes.findIndex((b) => b.id === this.selectedId)
@@ -2431,23 +2654,36 @@ var Compositor = class {
   drawChrome() {
     if (this.tornDown || this.layout.tooSmall) return;
     const { sidebar, sepX, statusY } = this.layout;
-    const lines = sidebarLines(this.boxes, this.selectedId, sidebar.w, sidebar.h);
-    const selIdx = this.boxes.findIndex((b) => b.id === this.selectedId);
-    const selRow = selIdx >= 0 ? SIDEBAR_HEADER_LINES + selIdx : -1;
+    const { lines, rowOwner, headerRows } = sidebarLines(
+      this.boxes,
+      this.selectedId,
+      sidebar.w,
+      sidebar.h
+    );
     let s = SYNC_BEGIN + "\x1B[0m";
     for (let i = 0; i < lines.length; i++) {
-      const style = i === 0 ? SB_HEADER : i === selRow ? SB_SELECTED : SB_BODY;
+      const style = headerRows[i] ? SB_HEADER : rowOwner[i] === this.selectedId ? SB_SELECTED : SB_BODY;
       s += cursorTo2(0, i) + style + lines[i] + SGR_RESET;
     }
-    for (let y = 0; y < sidebar.h; y++) s += cursorTo2(sepX, y) + "\u2502";
+    for (let y = 0; y < sidebar.h; y++)
+      s += cursorTo2(sepX, y) + SB_HEADER + (y === 0 ? "\u256E" : "\u2502") + SGR_RESET;
     let status;
-    if (this.flashMsg) {
+    if (this.pendingConfirm) {
+      const w = this.layout.cols;
+      const txt = ` Destroy ${this.pendingConfirm.name}?  y = confirm  \xB7  any other key = cancel `.slice(0, w).padEnd(w);
+      status = `\x1B[7m${txt}\x1B[0m`;
+    } else if (this.flashMsg) {
       const w = this.layout.cols;
       const txt = ` ${this.flashMsg} `.slice(0, w).padEnd(w);
       status = `\x1B[7m${txt}\x1B[0m`;
     } else {
       const stateLabel = this.selectedId === NEW_BOX_ID ? "create" : this.menu ? "menu" : this.session && this.activeMode === "shell" ? "shell" : void 0;
-      status = statusLine(this.selectedBox(), this.layout.cols, stateLabel);
+      status = statusLine(
+        this.selectedBox(),
+        this.layout.cols,
+        stateLabel,
+        this.leaderActive ? ADVANCED_HINT_GROUPS : void 0
+      );
     }
     s += cursorTo2(0, statusY) + status;
     this.out.write(s + SYNC_END);
@@ -2474,6 +2710,7 @@ var Compositor = class {
     if (this.pollTimer) clearInterval(this.pollTimer);
     if (this.resizeTimer) clearTimeout(this.resizeTimer);
     if (this.flashTimer) clearTimeout(this.flashTimer);
+    if (this.leaderLingerTimer) clearTimeout(this.leaderLingerTimer);
     this.parser.dispose();
     this.disposeSession();
     this.inp.off("data", this.onData);
@@ -2501,7 +2738,15 @@ function scoped(all, projectRoot, boxes) {
   return sortBoxes(all ? boxes : boxes.filter((b) => b.projectRoot === projectRoot));
 }
 function toSidebar(b) {
-  return { id: b.id, name: b.name, state: b.state, claudeActivity: b.claudeActivity };
+  return {
+    id: b.id,
+    name: b.name,
+    state: b.state,
+    claudeActivity: b.claudeActivity,
+    sessionTitle: b.claudeSessionTitle,
+    index: b.projectIndex,
+    project: b.projectRoot
+  };
 }
 var dashboardCommand = new Command7("dashboard").description("Box list + the selected box live Agent session").argument("[box]", "initial box (default: first running box; -p restricts to the cwd project)").option("-p, --project", "only this project's boxes (default: all boxes globally)").action(async (idOrName, opts) => {
   try {
@@ -2643,23 +2888,35 @@ var dashboardCommand = new Command7("dashboard").description("Box list + the sel
       const ep = box.endpoints.endpoints.find((e) => e.kind === kind);
       return { name: box.name, url: ep && ep.reachable && ep.url ? ep.url : null };
     };
+    const webTarget = (box) => {
+      const ep = box.endpoints.endpoints.find((e) => e.kind === "web");
+      const exposed = Boolean(ep && ep.reachable && ep.url);
+      const url = box.endpoints.domainIsOrb ? `http://${box.endpoints.domain}` : exposed && ep?.url ? ep.url : `http://${box.endpoints.domain}`;
+      return { url, exposed };
+    };
     const openVnc = async (boxId) => {
       const { url } = await findEndpointUrl(boxId, "vnc");
       if (!url) return "VNC not available for this box";
+      let exposedWebUrl = null;
       try {
         const box = await findBox2(boxId);
+        const web = webTarget(box);
+        if (web.exposed) exposedWebUrl = web.url;
         const br = await ensureBoxBrowser(box.container);
         if (!br.up) return `VNC: in-box browser unavailable (${br.reason ?? "box not running?"})`;
       } catch {
       }
       detach("open", [url]);
+      if (exposedWebUrl) {
+        detach("open", [exposedWebUrl]);
+        return "Opening VNC + web in browser\u2026";
+      }
       return "Opening VNC in browser\u2026";
     };
     const openWeb = async (boxId) => {
       const box = (await listBoxes()).find((b) => b.id === boxId);
       if (!box) return "box not found";
-      const ep = box.endpoints.endpoints.find((e) => e.kind === "web");
-      const url = ep && ep.reachable && ep.url ? ep.url : `http://${box.endpoints.domain}`;
+      const { url } = webTarget(box);
       detach("open", [url]);
       return `Opening ${url.replace(/^https?:\/\//, "")}\u2026`;
     };
@@ -2675,6 +2932,12 @@ var dashboardCommand = new Command7("dashboard").description("Box list + the sel
       if (box.state === "paused") await unpauseBox(box.id);
       else await startBox(box.id);
     };
+    const pauseBoxAction = async (boxId) => {
+      await pauseBox(boxId);
+    };
+    const stopBoxAction = async (boxId) => {
+      await stopBox(boxId);
+    };
     const destroyBoxAction = async (boxId) => {
       await destroyBox(boxId);
     };
@@ -2688,6 +2951,8 @@ var dashboardCommand = new Command7("dashboard").description("Box list + the sel
         openShell,
         createNewBox,
         resumeBox,
+        pauseBox: pauseBoxAction,
+        stopBox: stopBoxAction,
         destroyBox: destroyBoxAction,
         openVnc,
         openCode,
@@ -3484,6 +3749,21 @@ var screenCommand = new Command18("screen").description("Open a box's VNC (noVNC
     }
     process.stdout.write(`opened ${url}
 `);
+    try {
+      const { record } = await getBoxHostPaths(box.id);
+      const persisted = await readBoxStatus(box.id);
+      const eps = await getBoxEndpoints(record, engine, persisted);
+      const webEp = eps.endpoints.find((e) => e.kind === "web");
+      if (webEp?.reachable && webEp.url) {
+        const webUrl = engine === "orbstack" && !opts.loopback ? `http://${record.container}.orb.local` : webEp.url;
+        const w = spawnSync5("open", [webUrl], { stdio: "inherit" });
+        if (w.status === 0) process.stdout.write(`also opened ${webUrl}
+`);
+        else log19.warn(`could not open web app (${webUrl})`);
+      }
+    } catch (e) {
+      log19.warn(`could not open web app: ${e instanceof Error ? e.message : String(e)}`);
+    }
   } catch (err) {
     handleLifecycleError(err);
   }