tmux-ide 2.9.0-beta.30 → 2.9.0-beta.32

package/bin/cli.js

@@ -11279,7 +11279,7 @@ var require_package = __commonJS({
   "package.json"(exports, module) {
     module.exports = {
       name: "tmux-ide",
-      version: "2.9.0-beta.30",
+      version: "2.9.0-beta.32",
       description: "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
       type: "module",
       bin: {
@@ -71620,9 +71620,8 @@ function mountTmuxServerRoutes(app, options) {
           (row) => row.sessionName === workspace.sessionName && row.liveSessionId === c.req.query("liveSessionId")
         ))
           throw new TmuxServerScopeError("stale-generation");
-        const snapshot2 = await owner.terminalInventoryRuntime.discoverTerminalRuntimeSession(
-          workspace.sessionName,
-          c.req.raw.signal
+        const snapshot2 = await owner.terminalInventoryRuntime.discoverApplicationShellSession(
+          workspace.sessionName
         );
         const currentSessions = await owner.catalog();
         if (!currentSessions.some(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tmux-ide",
-  "version": "2.9.0-beta.30",
+  "version": "2.9.0-beta.32",
   "description": "A visual, agent-aware IDE for any tmux session, with optional workspace presets",
   "type": "module",
   "bin": {

package/packages/daemon/dist/command-center/tmux-servers.js

@@ -181,7 +181,9 @@ export function mountTmuxServerRoutes(app, options) {
             if (!sessions.some((row) => row.sessionName === workspace.sessionName &&
                 row.liveSessionId === c.req.query("liveSessionId")))
                 throw new TmuxServerScopeError("stale-generation");
-            const snapshot = await owner.terminalInventoryRuntime.discoverTerminalRuntimeSession(workspace.sessionName, c.req.raw.signal);
+            // Agent lists need the same status enrichment as pane headers. Raw
+            // terminal inventory omits these facts and falls back to process activity.
+            const snapshot = await owner.terminalInventoryRuntime.discoverApplicationShellSession(workspace.sessionName);
             // Discovery can yield while a same-name session is replaced. Revalidate
             // the captured incarnation before publishing agent metadata as current.
             const currentSessions = await owner.catalog();

package/packages/daemon/dist/tui/mirror/runtime/application-home-agent-roster.jsx

@@ -140,15 +140,15 @@ export function HomeAgentRoster(props) {
             event.stopPropagation();
             props.onMove(direction === "up" ? -1 : 1);
         }} onMouseOut={() => setHovered(null)}>
+      <box height={searchRows()} flexShrink={0}/>
       <box width={width()} height={1} flexShrink={0} flexDirection="row">
         <Show when={props.snapshot.phase === "loading" || props.snapshot.loadingSessions > 0}>
           <ActivityIndicator theme={props.theme} active={props.inputActive}/>
         </Show>
-        <text height={1} flexGrow={1} fg={props.theme.roles.text.primary}>
+        <text height={1} flexGrow={1} fg={props.theme.roles.text.muted}>
           {clipTerminal(title(), width())}
         </text>
       </box>
-      <box height={searchRows()} flexShrink={0}/>
       <box width={width()} height={1} flexShrink={0} flexDirection="row">
         <text width={Math.max(0, width() - (props.onToggleAttention ? 16 : 0))} height={1} fg={props.theme.roles.text.secondary} onMouseDown={(event) => {
             if (!props.inputActive || event.button !== 0)
@@ -166,10 +166,17 @@ export function HomeAgentRoster(props) {
         }}/>
         </Show>
       </box>
-      <Show when={props.snapshot.rows.length > 0} fallback={<box height={Math.max(0, visibleCount() * rowHeight() + 1)} flexShrink={0}/>}>
-        <text width={width()} height={1} flexShrink={0} fg={props.theme.roles.text.muted}>
-          {clipTerminal(`  ${padCells("Agent", columns().agent)}${padCells(props.filterLabel ? "Workspace / machine" : "Session", columns().session)} ${padCells("Status", columns().status)}`, width())}
-        </text>
+      <Show when={props.snapshot.rows.length > 0} fallback={<box height={Math.max(0, visibleCount() * rowHeight() + 1)} flexShrink={0} flexDirection="column" overflow="hidden">
+            <Show when={props.snapshot.phase === "live" && !props.query}>
+              <text height={1} width={width()} fg={props.theme.roles.text.primary}>
+                {clipTerminal("Your next session starts here", width())}
+              </text>
+              <text height={1} width={width()} fg={props.theme.roles.text.muted}>
+                {clipTerminal("Open terminals, or use Commands to connect a machine.", width())}
+              </text>
+            </Show>
+          </box>}>
+        <box height={1} flexShrink={0}/>
         <box height={visibleCount() * rowHeight()} width={width()} flexShrink={0} flexDirection="column" overflow="hidden">
           <For each={keys()}>
             {(key) => {
@@ -185,10 +192,10 @@ export function HomeAgentRoster(props) {
                     props.onSelect(key);
                     props.onOpen(row(), "mouse");
                 }} onMouseOver={() => setHovered(key)} onMouseMove={() => setHovered(key)}>
-                  <NavigationRow theme={props.theme} id={`home-agent:${key}`} width={width()} label={padCells(row().name, columns().agent) +
-                    padCells(rowHeight() > 1
-                        ? row().sessionName
-                        : [row().machineLabel, row().serverLabel, row().sessionName]
+                  <NavigationRow theme={props.theme} id={`home-agent:${key}`} width={width()} label={rowHeight() > 1
+                    ? row().name
+                    : padCells(row().name, columns().agent) +
+                        padCells([row().machineLabel, row().serverLabel, row().sessionName]
                             .filter(Boolean)
                             .join(" / "), columns().session)} detail={padCells(`${!stale(row()) && row().attention ? "! " : ""}${stale(row()) ? "last seen" : homeAgentStatusLabel(row().activity).toLowerCase()}`, columns().status)} detailAlign="end" marker=" " selected={props.selection.selectedKey === key} focused={props.inputActive && !editing() && props.selection.selectedKey === key} hovered={hovered() === key} status={stale(row()) ? "unknown" : statusTone(row())} disabled={row().paneId === null || stale(row())} onActivate={(source) => {
                     if (!props.inputActive || row().paneId === null || stale(row()))
@@ -203,7 +210,7 @@ export function HomeAgentRoster(props) {
                     selected: props.selection.selectedKey === key,
                     disabled: row().paneId === null || stale(row()),
                 }).background}>
-                      {clipTerminal(`  ${padCells(row().harness, columns().agent)}${[row().machineLabel, row().serverLabel].filter(Boolean).join(" / ")}`, width())}
+                      {clipTerminal(`  ${[row().sessionName, row().machineLabel, row().serverLabel, row().harness].filter(Boolean).join(" · ")}`, width())}
                     </text>
                   </Show>
                 </box>);
@@ -212,7 +219,7 @@ export function HomeAgentRoster(props) {
         </box>
       </Show>
       <Show when={props.onQueryChange}>
-        {(onQueryChange) => (<box position="absolute" top={1} left={0} width={width()} height={1}>
+        {(onQueryChange) => (<box position="absolute" top={0} left={0} width={width()} height={1}>
             <HomeAgentSearch theme={props.theme} width={width()} query={props.query ?? ""} active={props.inputActive} onChange={onQueryChange()} onEdit={(event) => {
                 const action = applicationPaneRenameKeyAction(event, props.query ?? "");
                 if (action.kind === "update")

package/packages/daemon/dist/tui/mirror/runtime/application-shell-home.jsx

@@ -1,11 +1,13 @@
 import { interactionReceiptTargetLabel } from "@tmux-ide/core";
 import { For, Show } from "solid-js";
 import { clipTerminal, terminalDisplayWidth } from "../terminal-text.js";
+import { DetailRow } from "../ui/detail-row.jsx";
 import { TuiButton } from "../ui/button.jsx";
 import { HomeAgentRoster } from "./application-home-agent-roster.jsx";
-/** Home reserves its cells for workspace information at every terminal size. */
-export function applicationHomeBrandVariant(_width, _height) {
-    return "wordmark";
+import { APPLICATION_HOME_WORDMARK, APPLICATION_HOME_WORDMARK_WIDTH } from "../ui/home-wordmark.js";
+/** Keep the marketing wordmark intact, falling back when the agent list needs the room. */
+export function applicationHomeBrandVariant(width, height) {
+    return width >= APPLICATION_HOME_WORDMARK_WIDTH && height >= 28 ? "ascii" : "wordmark";
 }
 /** Presentation only: session data, commands, and keyboard admission stay with the shell. */
 export function ApplicationHomeSurface(props) {
@@ -13,9 +15,15 @@ export function ApplicationHomeSurface(props) {
     const height = () => Math.max(0, Math.floor(props.height));
     const inset = () => Math.max(width() >= 40 ? 2 : width() >= 12 ? 1 : 0, props.branded ? Math.floor((width() - 96) / 2) : 0);
     const bodyWidth = () => Math.max(0, width() - inset() * 2);
+    const showAscii = () => props.branded &&
+        props.agentRoster?.phase === "live" &&
+        props.agentRoster.rows.length === 0 &&
+        !props.agentQuery &&
+        applicationHomeBrandVariant(bodyWidth(), height()) === "ascii";
+    const brandRows = () => (showAscii() ? APPLICATION_HOME_WORDMARK.length : 1);
     const spacious = () => height() >= 14;
     const context = () => clipTerminal(props.branded && props.agentRoster
-        ? "Across your machines"
+        ? "Your agents, across your machines"
         : `${props.session ?? "No session selected"} · ${props.status}`, bodyWidth());
     const summary = () => {
         if (!props.session || props.agents === undefined)
@@ -34,14 +42,31 @@ export function ApplicationHomeSurface(props) {
             (props.onCycleTheme ? naturalButtonWidth(themeLabel()) + 2 : 0) +
             (props.onOpenTutorial ? naturalButtonWidth(props.tutorialLabel ?? "Learn tmux-ide") + 2 : 0) +
             2;
-    const reservedRows = () => (spacious() ? 4 : 2) +
+    const reservedRows = () => brandRows() -
+        1 +
+        (spacious() ? 4 : 2) +
         (actionsInRow() ? 1 : 2 + (props.onCycleTheme ? 1 : 0) + (props.onOpenTutorial ? 1 : 0)) +
         (spacious() ? 1 : 0) +
         (props.note ? (spacious() ? 2 : 1) : 0);
-    const recentActivity = () => (props.recentPaneActivity ?? []).slice(0, spacious()
-        ? Math.max(0, Math.min(3, height() - reservedRows() - (props.agentRoster ? 4 : 2) - 2))
+    const activityRows = () => (height() >= 24 && bodyWidth() >= 48 ? 2 : 1);
+    const selectedAgent = () => props.agentRoster?.rows.find((row) => row.key === props.agentSelection?.selectedKey);
+    // Receipts lack a fleet-wide machine identity. Never attribute a same-named
+    // workspace/pane collision to the selected agent.
+    const selectedActivity = () => {
+        const selected = selectedAgent();
+        if (!selected?.paneId || selected.daemonInstanceId !== props.activityDaemonId)
+            return [];
+        const matches = props.agentRoster?.rows.filter((row) => row.sessionName === selected.sessionName && row.paneId === selected.paneId);
+        if (matches?.length !== 1)
+            return [];
+        return (props.recentPaneActivity ?? []).filter((receipt) => receipt.workspaceName === selected.sessionName &&
+            receipt.target.kind === "pane" &&
+            receipt.target.semanticPaneId === selected.paneId);
+    };
+    const recentActivity = () => selectedActivity().slice(0, spacious()
+        ? Math.max(0, Math.min(1, Math.floor((height() - reservedRows() - (props.agentRoster ? 12 : 2) - 2) / activityRows())))
         : 0);
-    const activityHeight = () => (recentActivity().length > 0 ? recentActivity().length + 2 : 0);
+    const activityHeight = () => recentActivity().length > 0 ? recentActivity().length * activityRows() + 2 : 0;
     const paneLabel = (paneId) => {
         const matches = props.agentRoster?.rows.filter((row) => row.paneId === paneId) ?? [];
         return matches.length === 1 ? matches[0].name : paneId;
@@ -65,9 +90,19 @@ export function ApplicationHomeSurface(props) {
                 : "timed out";
     const rosterHeight = () => Math.max(0, height() - reservedRows() - activityHeight());
     return (<box id="application-home" width={width()} height={height()} paddingLeft={inset()} paddingRight={inset()} paddingTop={spacious() ? 1 : 0} flexDirection="column" alignItems="flex-start" backgroundColor={props.theme.roles.surfaces.canvas} overflow="hidden">
-      <text width={bodyWidth()} height={1} flexShrink={0} fg={props.theme.roles.text.primary}>
-        <strong>{clipTerminal(props.branded ? "Your agents" : props.project, bodyWidth())}</strong>
-      </text>
+      <box height={brandRows()} width={bodyWidth()} flexShrink={0} flexDirection="column">
+        <Show when={showAscii()} fallback={<text width={bodyWidth()} height={1} fg={props.theme.roles.text.primary}>
+              <strong>
+                {clipTerminal(props.branded ? "tmux-ide" : props.project, bodyWidth())}
+              </strong>
+            </text>}>
+          <For each={APPLICATION_HOME_WORDMARK}>
+            {(line) => (<text width={bodyWidth()} height={1} flexShrink={0} fg={props.theme.roles.text.primary}>
+                {" ".repeat(Math.max(0, Math.floor((bodyWidth() - APPLICATION_HOME_WORDMARK_WIDTH) / 2))) + line}
+              </text>)}
+          </For>
+        </Show>
+      </box>
       <box height={spacious() ? 1 : 0} flexShrink={0}/>
       <text width={bodyWidth()} height={1} flexShrink={0} fg={props.theme.roles.text.secondary}>
         {context()}
@@ -86,12 +121,10 @@ export function ApplicationHomeSurface(props) {
         <Show when={activityHeight() > 0}>
           <box width={bodyWidth()} height={activityHeight()} flexShrink={0} flexDirection="column" overflow="hidden">
             <text height={1} width={bodyWidth()} fg={props.theme.roles.text.secondary}>
-              {clipTerminal("Recent pane activity", bodyWidth())}
+              {clipTerminal(`${selectedAgent()?.name ?? "Agent"} · latest activity`, bodyWidth())}
             </text>
             <For each={recentActivity()}>
-              {(receipt) => (<text height={1} width={bodyWidth()} fg={props.theme.roles.text.primary}>
-                  {clipTerminal(`${activityTime(receipt)} · ${interactionReceiptTargetLabel(receipt, paneLabel)} · ${activityPhase(receipt)}`, bodyWidth())}
-                </text>)}
+              {(receipt) => (<DetailRow theme={props.theme} width={bodyWidth()} label={interactionReceiptTargetLabel(receipt, paneLabel)} detail={activityPhase(receipt)} description={activityRows() === 2 ? activityTime(receipt) : undefined} attention={receipt.phase === "rejected" || receipt.phase === "timed-out"}/>)}
             </For>
             <text height={1} width={bodyWidth()} fg={props.theme.roles.text.muted}>
               {clipTerminal("Activity reported through tmux-ide", bodyWidth())}

package/packages/daemon/dist/tui/mirror/ui/badge.jsx

@@ -3,7 +3,7 @@ import { componentPalette } from "./state.js";
 export function Badge(props) {
     const palette = () => componentPalette(props.theme, props, props.tone);
     const background = () => props.surface === "header" && palette().state === "base"
-        ? props.theme.roles.surfaces.header
+        ? props.theme.roles.surfaces.panel
         : palette().background;
     const width = () => Math.max(1, Math.floor(props.width ?? terminalDisplayWidth(props.label) + 2));
     const content = () => clipTerminal(props.presentation ?? ` ${props.marker ? `${props.marker} ` : ""}${props.label} `, width());

package/packages/daemon/dist/tui/mirror/ui/detail-row.jsx

@@ -0,0 +1,22 @@
+import { clipTerminal, terminalDisplayWidth } from "../terminal-text.js";
+/** Read-only information row: primary label left, secondary detail aligned right. */
+export function DetailRow(props) {
+    const detailWidth = () => props.detail
+        ? Math.min(terminalDisplayWidth(props.detail), Math.floor(Math.max(0, props.width) / 2))
+        : 0;
+    const labelWidth = () => Math.max(0, props.width - detailWidth() - (detailWidth() ? 1 : 0));
+    return (<box width={props.width} height={props.description ? 2 : 1} flexShrink={0} flexDirection="column" overflow="hidden">
+      <box width={props.width} height={1} flexShrink={0} flexDirection="row">
+        <text width={labelWidth()} height={1} fg={props.attention ? props.theme.colors.status.blocked : props.theme.roles.text.primary}>
+          {clipTerminal(props.label, labelWidth())}
+        </text>
+        <box flexGrow={1}/>
+        <text width={detailWidth()} height={1} fg={props.attention ? props.theme.colors.status.blocked : props.theme.roles.text.muted}>
+          {clipTerminal(props.detail ?? "", detailWidth())}
+        </text>
+      </box>
+      {props.description ? (<text width={props.width} height={1} fg={props.theme.roles.text.muted}>
+          {clipTerminal(props.description, props.width)}
+        </text>) : null}
+    </box>);
+}

package/packages/daemon/dist/tui/mirror/ui/home-wordmark.js

@@ -0,0 +1,11 @@
+// Exact terminal glyphs from docs/public/ascii-wordmark.svg.
+export const APPLICATION_HOME_WORDMARK = [
+    "   ░██                                             ░██       ░██",
+    "   ░██                                                       ░██",
+    "░████████ ░█████████████  ░██    ░██ ░██    ░██    ░██ ░████████  ░███████",
+    "   ░██    ░██   ░██   ░██ ░██    ░██  ░██  ░██     ░██░██    ░██ ░██    ░██",
+    "   ░██    ░██   ░██   ░██ ░██    ░██   ░█████      ░██░██    ░██ ░█████████",
+    "   ░██    ░██   ░██   ░██ ░██   ░███  ░██  ░██     ░██░██   ░███ ░██",
+    "    ░████ ░██   ░██   ░██  ░█████░██ ░██    ░██    ░██ ░█████░██  ░███████",
+];
+export const APPLICATION_HOME_WORDMARK_WIDTH = 75;

package/packages/daemon/dist/tui/mirror/ui/key-hint.jsx

@@ -6,7 +6,7 @@ import { useKeyboardRoute } from "./keyboard-router.jsx";
 export function KeyHint(props) {
     const palette = () => componentPalette(props.theme, props, "neutral");
     const background = () => props.quiet && !props.focused && !props.hovered
-        ? props.theme.roles.surfaces.header
+        ? props.theme.roles.surfaces.panel
         : palette().background;
     const foreground = () => props.quiet && !props.focused && !props.hovered
         ? props.theme.roles.text.muted
@@ -39,7 +39,13 @@ export function KeyHint(props) {
             activate();
         }}>
       <text fg={foreground()} bg={background()}>
-        {props.focused || props.selected ? <strong>{content()}</strong> : content()}
+        {props.focused || props.selected ? (<strong>{content()}</strong>) : props.quiet && !props.presentation ? (<>
+            {" "}
+            <span style={{ fg: props.theme.roles.text.primary }}>
+              {clipTerminal(props.keys, Math.max(0, width() - 1))}
+            </span>
+            {clipTerminal(props.label ? ` ${props.label} ` : " ", Math.max(0, width() - terminalDisplayWidth(props.keys) - 1))}
+          </>) : (content())}
       </text>
     </box>);
 }

package/packages/daemon/dist/tui/mirror/ui/menu.jsx

@@ -2,17 +2,17 @@
 import { For } from "solid-js";
 import { OverlayFrame } from "./overlay-frame.jsx";
 import { OverlayListRow } from "./overlay-list-row.jsx";
-import { overlayFrameSize } from "./overlay-model.js";
+import { overlaySurfaceMetrics } from "./overlay-model.js";
 export function Menu(props) {
-    // Match OverlayFrame's clamped border + left padding budget, not the
-    // requested width; otherwise right-aligned shortcuts disappear offscreen.
-    const innerWidth = () => Math.max(1, overlayFrameSize({
+    const preferredHeight = () => props.items.length + (props.title ? 1 : 0) + (props.footer ? 1 : 0) + 2;
+    const metrics = () => overlaySurfaceMetrics({
         viewportWidth: props.viewportWidth ?? Math.max(props.width, props.left + props.width),
-        viewportHeight: props.viewportHeight ?? Math.max(3, props.top + props.items.length + 4),
+        viewportHeight: props.viewportHeight ?? Math.max(preferredHeight(), props.top + preferredHeight()),
         preferredWidth: props.width,
-        preferredHeight: props.items.length + 4,
-    }).width - 4);
-    return (<OverlayFrame theme={props.theme} viewportWidth={props.viewportWidth ?? Math.max(props.width, props.left + props.width)} viewportHeight={props.viewportHeight ?? Math.max(3, props.top + props.items.length + 3)} width={props.width} height={props.items.length + (props.title ? 3 : 2) + (props.footer ? 1 : 0)} placement="anchor" anchor={{ x: props.left, y: props.top }} zIndex={props.zIndex ?? 20} active={props.active} title={props.title} footer={props.footer} onDismiss={props.onDismiss}>
+        preferredHeight: preferredHeight(),
+    });
+    const innerWidth = () => metrics().contentWidth;
+    return (<OverlayFrame theme={props.theme} viewportWidth={props.viewportWidth ?? Math.max(props.width, props.left + props.width)} viewportHeight={props.viewportHeight ?? Math.max(preferredHeight(), props.top + preferredHeight())} width={props.width} height={preferredHeight()} placement="anchor" anchor={{ x: props.left, y: props.top }} zIndex={props.zIndex ?? 20} active={props.active} title={props.title} footer={props.footer} onDismiss={props.onDismiss}>
       <For each={props.items.map((item) => item.id)}>
         {(id) => {
             const item = () => props.items.find((item) => item.id === id);

package/packages/daemon/dist/tui/mirror/ui/overlay-frame.jsx

@@ -13,9 +13,9 @@ export function OverlayFrame(props) {
     const width = () => size().width;
     const height = () => size().height;
     // Empty border sides below keep OpenTUI border styling from enabling a frame.
-    const bordered = () => !props.surface && width() >= 4 && height() >= 3;
+    const bordered = () => props.surface === false && width() >= 4 && height() >= 3;
     const padding = () => overlaySurfacePadding(width(), height());
-    const innerWidth = () => Math.max(1, width() - (props.surface ? padding().horizontal * 2 : bordered() ? 2 : 0));
+    const innerWidth = () => Math.max(1, width() - (props.surface !== false ? padding().horizontal * 2 : bordered() ? 2 : 0));
     const left = () => {
         if (props.placement === "anchor")
             return Math.max(0, Math.min(props.anchor?.x ?? 0, viewportWidth() - width()));
@@ -30,17 +30,19 @@ export function OverlayFrame(props) {
             return Math.min(1, viewportHeight() - height());
         return Math.max(0, Math.floor((viewportHeight() - height()) / 2));
     };
-    const frame = () => (<box id="ui-overlay-frame" position="absolute" left={left()} top={top()} width={width()} height={height()} zIndex={props.zIndex ?? 100} border={bordered() ? true : []} borderStyle="rounded" borderColor={props.theme.roles.borders.focused} backgroundColor={props.surface ? props.theme.roles.surfaces.command : props.theme.roles.surfaces.panelRaised} flexDirection="column" paddingLeft={props.surface ? padding().horizontal : bordered() ? 1 : 0} paddingRight={props.surface ? padding().horizontal : 0} paddingTop={props.surface ? padding().vertical : 0} paddingBottom={props.surface ? padding().vertical : 0} overflow="hidden" onMouseDown={(event) => {
+    const frame = () => (<box id="ui-overlay-frame" position="absolute" left={left()} top={top()} width={width()} height={height()} zIndex={props.zIndex ?? 100} border={bordered() ? true : []} borderStyle="rounded" borderColor={props.theme.roles.borders.focused} backgroundColor={props.surface !== false
+            ? props.theme.roles.surfaces.command
+            : props.theme.roles.surfaces.panelRaised} flexDirection="column" paddingLeft={props.surface !== false ? padding().horizontal : bordered() ? 1 : 0} paddingRight={props.surface !== false ? padding().horizontal : 0} paddingTop={props.surface !== false ? padding().vertical : 0} paddingBottom={props.surface !== false ? padding().vertical : 0} overflow="hidden" onMouseDown={(event) => {
             event.preventDefault();
             event.stopPropagation();
         }}>
       {props.title && height() >= 4 ? (<box width={innerWidth()} height={1} flexShrink={0} flexDirection="row">
-          <text width={Math.max(1, innerWidth() - (props.surface && innerWidth() >= 20 ? 4 : 0))} fg={props.theme.roles.text.primary} overflow="hidden">
+          <text width={Math.max(1, innerWidth() - (props.surface !== false && innerWidth() >= 20 ? 4 : 0))} fg={props.theme.roles.text.primary} overflow="hidden">
             <strong>
-              {clipTerminal(props.title, Math.max(1, innerWidth() - (props.surface && innerWidth() >= 20 ? 4 : 0)))}
+              {clipTerminal(props.title, Math.max(1, innerWidth() - (props.surface !== false && innerWidth() >= 20 ? 4 : 0)))}
             </strong>
           </text>
-          {props.surface && innerWidth() >= 20 ? (<text width={4} fg={props.theme.roles.text.muted} onMouseDown={(event) => {
+          {props.surface !== false && innerWidth() >= 20 ? (<text width={4} fg={props.theme.roles.text.muted} onMouseDown={(event) => {
                     event.preventDefault();
                     event.stopPropagation();
                     if (event.button === 0 && props.active !== false)
@@ -51,7 +53,7 @@ export function OverlayFrame(props) {
             </text>) : null}
         </box>) : null}
       {props.children}
-      {props.footer && height() >= 5 ? (<text width={innerWidth()} height={1} flexShrink={0} fg={props.theme.roles.text.muted} bg={props.surface
+      {props.footer && height() >= 5 ? (<text width={innerWidth()} height={1} flexShrink={0} fg={props.theme.roles.text.muted} bg={props.surface !== false
                 ? props.theme.roles.surfaces.command
                 : props.theme.roles.surfaces.panelRaised} overflow="hidden">
           {clipTerminal(props.footer, innerWidth())}

package/packages/daemon/dist/tui/mirror/ui/overlay-list-row.jsx

@@ -5,7 +5,7 @@ import { clipTerminal, terminalDisplayWidth } from "../terminal-text.js";
 import { overlayRowPalette } from "./overlay-surface.js";
 import { componentPalette } from "./state.js";
 export function OverlayListRow(props) {
-    const palette = () => props.surface
+    const palette = () => props.surface !== false
         ? overlayRowPalette(props.theme, {
             selected: props.selected,
             disabled: props.disabled,
@@ -18,7 +18,7 @@ export function OverlayListRow(props) {
                 ? "● "
                 : "  "
             : props.selected
-                ? props.surface
+                ? props.surface !== false
                     ? "  "
                     : "› "
                 : props.reserveMarker

package/packages/daemon/dist/tui/mirror/ui/overlay-model.js

@@ -50,3 +50,13 @@ export function overlaySurfacePadding(width, height) {
         vertical: height >= 8 ? 1 : 0,
     };
 }
+/** Content geometry for the default calm overlay, after viewport clamping. */
+export function overlaySurfaceMetrics(input) {
+    const size = overlayFrameSize(input);
+    const padding = overlaySurfacePadding(size.width, size.height);
+    return {
+        ...size,
+        contentWidth: Math.max(1, size.width - padding.horizontal * 2),
+        contentHeight: Math.max(0, size.height - padding.vertical * 2),
+    };
+}

package/packages/daemon/dist/tui/mirror/ui/status-bar.jsx

@@ -2,7 +2,7 @@ import { clipTerminal } from "../terminal-text.js";
 import { componentPalette } from "./state.js";
 import { useKeyboardRoute } from "./keyboard-router.jsx";
 export function StatusBar(props) {
-    return (<box id="ui-status-bar" width={props.width} height={1} flexDirection="row" justifyContent="space-between" backgroundColor={props.theme.roles.surfaces.header} overflow="hidden">
+    return (<box id="ui-status-bar" width={props.width} height={1} flexDirection="row" justifyContent="space-between" backgroundColor={props.theme.roles.surfaces.panel} overflow="hidden">
       {props.children}
     </box>);
 }
@@ -58,7 +58,7 @@ export function StatusSegment(props) {
         loading: props.loading,
         empty: props.empty,
     }, props.tone);
-    const background = () => palette().state === "base" ? props.theme.roles.surfaces.header : palette().background;
+    const background = () => palette().state === "base" ? props.theme.roles.surfaces.panel : palette().background;
     const foreground = () => {
         if (palette().state !== "base")
             return palette().foreground;

package/packages/daemon/dist/tui/mirror/ui/surface.jsx

@@ -35,7 +35,7 @@ export function Surface(props) {
             case "raised":
                 return local.theme.roles.surfaces.panelRaised;
             case "header":
-                return local.theme.roles.surfaces.header;
+                return local.theme.roles.surfaces.panel;
             case "panel":
             default:
                 return local.theme.roles.surfaces.panel;

package/packages/daemon/dist/tui/mirror/ui/tabs.jsx

@@ -19,9 +19,7 @@ export function Tabs(props) {
     const addWidth = () => (props.onAdd ? terminalDisplayWidth(props.addLabel ?? "+") + 2 : 0);
     const equalWidth = () => Math.max(1, Math.min(32, Math.floor(((props.width ?? 0) - addWidth()) / Math.max(1, props.items.length))));
     const itemWidth = (item) => props.fit === "equal" && props.width ? equalWidth() : terminalDisplayWidth(tabText(item));
-    const background = () => props.variant === "header"
-        ? props.theme.roles.surfaces.header
-        : props.theme.roles.surfaces.panel;
+    const background = () => props.theme.roles.surfaces.panel;
     useKeyboardRoute((event) => {
         if (!props.focused || event.eventType !== "press")
             return false;

package/packages/daemon/dist/tui/mirror/workspace/application-shortcuts.js

@@ -0,0 +1,45 @@
+import { applicationCommandDescription } from "./application-command-description.js";
+/** Display metadata only. Context-specific keyboard owners remain authoritative. */
+export const APPLICATION_SHORTCUTS = [
+    ...["home", "terminals", "switch-session"].map((command) => {
+        const description = applicationCommandDescription(command);
+        return { category: "Application", label: description.label, keys: description.shortcut };
+    }),
+    { category: "Application", label: "Commands", keys: "F5" },
+    { category: "Application", label: "Agent attention", keys: "F7" },
+    { category: "Application", label: "Sidebar / Sessions when hidden", keys: "Ctrl+G" },
+    { category: "Home", label: "Find an agent or workspace", keys: "/" },
+    { category: "Home", label: "Cycle machine filter", keys: "f" },
+    { category: "Home", label: "Toggle attention filter", keys: "a" },
+    { category: "Home", label: "Open selected agent", keys: "Enter" },
+    { category: "Command and session menus", label: "Search actions or sessions", keys: "Type" },
+    { category: "Command and session menus", label: "Choose a result", keys: "↑ / ↓" },
+    { category: "Command and session menus", label: "Activate selected result", keys: "Enter" },
+    { category: "Command and session menus", label: "Search / navigation mode", keys: "Ctrl+Space" },
+    { category: "Menu navigation mode", label: "Move selection", keys: "j / k" },
+    { category: "Menu navigation mode", label: "First / last result", keys: "g / G" },
+    { category: "Menu navigation mode", label: "Return to search", keys: "i" },
+    {
+        category: "Command and session menus",
+        label: "Previous / next page",
+        keys: "PageUp / PageDown",
+    },
+    {
+        category: "Command and session menus",
+        label: "Previous / next half page",
+        keys: "Ctrl+U / Ctrl+D",
+    },
+    { category: "Sessions", label: "Local / all hosts", keys: "Ctrl+H" },
+    { category: "Sessions", label: "Favorite session", keys: "Ctrl+F" },
+    { category: "Sessions", label: "Browse windows without activating", keys: "Ctrl+← / Ctrl+→" },
+    { category: "Sessions", label: "Show / hide preview", keys: "Ctrl+P" },
+    { category: "Sessions", label: "Expand / restore preview", keys: "Ctrl+E" },
+    { category: "Sessions", label: "New session", keys: "Ctrl+N" },
+    { category: "Sessions", label: "Confirm close session", keys: "Ctrl+X" },
+    { category: "Sessions", label: "Retry selected host", keys: "Ctrl+R" },
+    ...["shortcuts", "whats-new"].map((command) => {
+        const description = applicationCommandDescription(command);
+        return { category: "Help in menus", label: description.label, keys: description.shortcut };
+    }),
+    { category: "Help in menus", label: "Back / dismiss", keys: "Esc" },
+];

package/packages/daemon/src/command-center/tmux-servers.ts

@@ -258,9 +258,10 @@ export function mountTmuxServerRoutes(app: Hono, options: TmuxServerRoutesOption
           )
         )
           throw new TmuxServerScopeError("stale-generation");
-        const snapshot = await owner.terminalInventoryRuntime.discoverTerminalRuntimeSession(
+        // Agent lists need the same status enrichment as pane headers. Raw
+        // terminal inventory omits these facts and falls back to process activity.
+        const snapshot = await owner.terminalInventoryRuntime.discoverApplicationShellSession(
           workspace.sessionName,
-          c.req.raw.signal,
         );
         // Discovery can yield while a same-name session is replaced. Revalidate
         // the captured incarnation before publishing agent metadata as current.

package/packages/daemon/src/tui/mirror/__snapshots__/shell-chrome-renderer.test.tsx.snap

@@ -24,7 +24,7 @@ exports[`ShellChrome OpenTUI renderer renders deterministic %sx%s compact shell
                     │                                                          │
                     │                                                          │
                     └──────────────────────────────────────────────────────────┘
-  F5 · ^q quit       web  Live                                               F5"
+  F5 · ^q quit       F6 Sessions  F7 Attention                      F5 Commands"
 `;
 
 exports[`ShellChrome OpenTUI renderer renders deterministic %sx%s standard shell chrome 1`] = `
@@ -67,7 +67,7 @@ exports[`ShellChrome OpenTUI renderer renders deterministic %sx%s standard shell
                             │                                                                                          │
                             │                                                                                          │
                             └──────────────────────────────────────────────────────────────────────────────────────────┘
-  F5 palette · ^q quit       web  Live                                                                      F5 Commands"
+  F5 palette · ^q quit       F6 Sessions  F7 Attention                                                      F5 Commands"
 `;
 
 exports[`ShellChrome OpenTUI renderer renders deterministic %sx%s wide shell chrome 1`] = `
@@ -130,5 +130,5 @@ exports[`ShellChrome OpenTUI renderer renders deterministic %sx%s wide shell chr
                             │                                                                                                                                                                          │
                             │                                                                                                                                                                          │
                             └──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┘
-  F5 palette · ^q quit       tmux-ide  web  Claude Code  Live                                                                                                                               F5 Commands"
+  F5 palette · ^q quit       F6 Sessions  F7 Attention                                                                                                                                      F5 Commands"
 `;

package/packages/daemon/src/tui/mirror/runtime/__snapshots__/application-shell-view-renderer.test.tsx.snap

@@ -13,7 +13,7 @@ exports[`production ApplicationShellView retains shell, window strip, pane chrom
 
 …
 
-                     main  Live                                              F5"
+                     F6 Sessions  F7 Attention                      F5 Commands"
 `;
 
 exports[`production ApplicationShellView retains shell, window strip, pane chrome, and canvas at %sx%s 2`] = `
@@ -29,7 +29,7 @@ exports[`production ApplicationShellView retains shell, window strip, pane chrom
 
 …
 
-                             main  Live                                                                     F5 Commands"
+                             F6 Sessions  F7 Attention                                                      F5 Commands"
 `;
 
 exports[`production ApplicationShellView retains shell, window strip, pane chrome, and canvas at %sx%s 3`] = `
@@ -45,24 +45,24 @@ exports[`production ApplicationShellView retains shell, window strip, pane chrom
 
 …
 
-                             tmux-ide  main  Live                                                                                                                                           F5 Commands"
+                             F6 Sessions  F7 Attention                                                                                                                                      F5 Commands"
 `;
 
 exports[`production ApplicationShellView reacts palette geometry through narrow live resizes 1`] = `
 "  ⌂  ●❯                live
- Y  Command palette  esc
+ t  Command palette  esc
  m   Search commands…
  2    Home            F1
  C    Terminals       F2  …
       New terminal wind…
 
 
- main  Live              F5"
+ ↑↓ Select      F5 Commands"
 `;
 
 exports[`production ApplicationShellView reacts palette geometry through narrow live resizes 2`] = `
 "  ⌂  ●❯        live
- YCommand palette
+ tCommand palette
  m …rch commands…
  2  Home        F1w
  C                …
@@ -83,5 +83,5 @@ exports[`production ApplicationShellView preserves canonical attention while pri
 
 …
 
-                             main  Live                                                                     F5 Commands"
+                             F6 Sessions  F7 Attention                                                      F5 Commands"
 `;

package/packages/daemon/src/tui/mirror/runtime/application-add-machine-dialog.tsx

@@ -2,6 +2,7 @@
 import { Show } from "solid-js";
 import type { SemanticThemeSnapshot } from "../theme.ts";
 import { clipTerminal } from "../terminal-text.ts";
+import { overlaySurfaceMetrics } from "../ui/overlay-model.ts";
 import { Dialog } from "../ui/dialog.tsx";
 import { TuiButton } from "../ui/button.tsx";
 
@@ -20,7 +21,13 @@ export interface ApplicationAddMachineDialogProps {
 /** Collects an SSH target only; the owner validates and opens the connection. */
 export function ApplicationAddMachineDialog(props: ApplicationAddMachineDialogProps) {
   const width = () => Math.max(1, Math.min(58, props.width - (props.width >= 8 ? 4 : 0)));
-  const contentWidth = () => Math.max(1, width() - 4);
+  const contentWidth = () =>
+    overlaySurfaceMetrics({
+      viewportWidth: props.width,
+      viewportHeight: props.height,
+      preferredWidth: width(),
+      preferredHeight: 10,
+    }).contentWidth;
   return (
     <Show when={props.open}>
       <Dialog