farai 0.1.7 → 0.1.8

package/dist/cli/index.js

@@ -33041,16 +33041,32 @@ function createRuntimePort(runtime, options = {}) {
               }
             });
           } catch {
-            mcpResult = await callMcpServerTool({
-              workspace: session.workspace,
-              configWorkspace: runtime.workspace,
-              session,
-              server: "mitmproxy-mcp",
-              tool: "get_traffic_summary",
-              args: {
-                limit: options2.limit ?? 300
-              }
-            });
+            try {
+              mcpResult = await callMcpServerTool({
+                workspace: session.workspace,
+                configWorkspace: runtime.workspace,
+                session,
+                server: "mitmproxy-mcp",
+                tool: "get_flow_summary_v2",
+                args: {
+                  limit: options2.limit ?? 300,
+                  ...options2.kind ? {
+                    kind: options2.kind
+                  } : {}
+                }
+              });
+            } catch {
+              mcpResult = await callMcpServerTool({
+                workspace: session.workspace,
+                configWorkspace: runtime.workspace,
+                session,
+                server: "mitmproxy-mcp",
+                tool: "get_traffic_summary",
+                args: {
+                  limit: options2.limit ?? 300
+                }
+              });
+            }
           }
           const flows = proxyFlowsFromMcpTrafficSummary(mcpResult, options2);
           if (flows.length > 0 || listMcpServerStatuses(activeSessionId).some((status2) => status2.name === "mitmproxy-mcp" && status2.running))
@@ -33083,6 +33099,21 @@ function createRuntimePort(runtime, options = {}) {
             if (detail)
               return detail;
           } catch {}
+          try {
+            const compatibleResult = await callMcpServerTool({
+              workspace: session.workspace,
+              configWorkspace: runtime.workspace,
+              session,
+              server: "mitmproxy-mcp",
+              tool: "inspect_flow_v2",
+              args: {
+                flow_id: id2
+              }
+            });
+            const compatibleDetail = proxyFlowDetailFromMcpInspect(compatibleResult);
+            if (compatibleDetail)
+              return compatibleDetail;
+          } catch {}
           const legacyResult = await callMcpServerTool({
             workspace: session.workspace,
             configWorkspace: runtime.workspace,
@@ -38745,6 +38776,18 @@ function routeSlash(key) {
   }
 }
 function routeBase(key, ctx) {
+  if (key.meta) {
+    if (key.name === "1")
+      return consumed({
+        kind: "mainTab.set",
+        tab: "chat"
+      });
+    if (key.name === "2")
+      return consumed({
+        kind: "mainTab.set",
+        tab: "proxy"
+      });
+  }
   if (key.ctrl) {
     switch (key.name) {
       case "1":
@@ -40394,10 +40437,8 @@ function args(value) {
 
 // src/agent-tui/transcript/cells/user-cell.tsx
 function UserPrompt(props) {
-  const dims = useTerminalDimensions();
   const lines = createMemo(() => stripOuterBlankLines2(sanitizeText2(props.row.text)).split(`
 `));
-  const width = () => Math.max(1, dims().width);
   return (() => {
     var _el$ = createElement("box");
     insert(_el$, createComponent2(For, {
@@ -40412,7 +40453,8 @@ function UserPrompt(props) {
         insert(_el$4, line || " ");
         effect((_p$) => {
           var _v$ = {
-            width: width(),
+            width: "100%",
+            minWidth: 0,
             flexDirection: "row",
             backgroundColor: COLOR.userMessageBg
           }, _v$2 = index() === 0 ? COLOR.accent : COLOR.dim, _v$3 = COLOR.text;
@@ -40429,7 +40471,8 @@ function UserPrompt(props) {
       })()
     }));
     effect((_$p) => setProp(_el$, "style", {
-      width: width(),
+      width: "100%",
+      minWidth: 0,
       flexDirection: "column",
       marginTop: 1,
       marginBottom: 1,
@@ -40449,7 +40492,6 @@ var init_user_cell = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid();
-  init_solid2();
   init_theme();
 });
 
@@ -42844,6 +42886,7 @@ var init_transcript = __esm(() => {
 // src/agent-tui/surfaces/center-surface.tsx
 function CenterSurfaceView(props) {
   const tui = useTuiStore();
+  const dims = useTerminalDimensions();
   const loader = createSurfaceLoader(() => props.frame);
   const title = () => surfaceTitle(props.frame);
   const kindLabel = () => props.frame.kind;
@@ -42885,13 +42928,13 @@ function CenterSurfaceView(props) {
       minWidth: 0
     });
     insertNode(_el$4, createTextNode(`\u203A `));
-    insert(_el$6, () => truncateLine2(title(), 96));
+    insert(_el$6, () => truncateLine2(title(), Math.max(4, dims().width - terminalWidth(kindLabel()) - 10)));
     insert(_el$7, kindLabel);
     insertNode(_el$8, _el$9);
     setProp(_el$8, "style", {
       height: 1
     });
-    insert(_el$9, () => surfaceSubtitle(props.frame));
+    insert(_el$9, () => truncateLine2(surfaceSubtitle(props.frame), Math.max(1, dims().width - 4)));
     insert(_el$, createComponent2(Show, {
       get when() {
         return props.frame.kind === "proxy_flow";
@@ -43185,7 +43228,7 @@ function WebSocketFlowView(props) {
   let lastScrollSequence = 0;
   const selectedIndex = createMemo(() => Math.min(Math.max(0, tui.store.ui.proxyWebSocketMessageIndex), Math.max(0, props.flow.messages.length - 1)));
   const selectedMessage = createMemo(() => props.flow.messages[selectedIndex()]);
-  const contentWidth = () => Math.max(36, dims().width - (props.compact ? 4 : 8));
+  const contentWidth = () => Math.max(1, dims().width - (props.compact ? 4 : 8));
   const inspectorGap = () => dims().height >= 22 ? 1 : 0;
   createEffect(() => {
     const flowId = props.flow.id;
@@ -43858,7 +43901,8 @@ function ProxyLogView() {
   });
   const defaultListHeight = () => Math.max(7, Math.min(14, Math.floor(dims().height * 0.34)));
   const listHeight = () => clampProxyListHeight(listHeightOverride() ?? defaultListHeight(), dims().height);
-  const tableWidth = () => Math.max(30, dims().width - 4);
+  const compactHeight = () => dims().height < 20;
+  const tableWidth = () => Math.max(1, dims().width - 4);
   const beginListResize = (event) => {
     if (event.button !== 0)
       return;
@@ -43966,22 +44010,9 @@ function ProxyLogView() {
     });
   });
   return (() => {
-    var _el$ = createElement("box"), _el$2 = createElement("box"), _el$3 = createElement("text"), _el$5 = createElement("box"), _el$6 = createElement("box"), _el$7 = createElement("text"), _el$8 = createElement("scrollbox"), _el$9 = createElement("box"), _el$0 = createElement("text"), _el$1 = createElement("text"), _el$10 = createElement("box"), _el$11 = createElement("text"), _el$12 = createElement("box");
+    var _el$ = createElement("box"), _el$2 = createElement("box"), _el$3 = createElement("text"), _el$5 = createElement("box"), _el$6 = createElement("box"), _el$7 = createElement("text"), _el$8 = createElement("scrollbox");
     insertNode(_el$, _el$2);
     insertNode(_el$, _el$5);
-    insertNode(_el$, _el$9);
-    insertNode(_el$, _el$10);
-    insertNode(_el$, _el$12);
-    setProp(_el$, "style", {
-      flexGrow: 1,
-      flexShrink: 1,
-      minHeight: 0,
-      flexDirection: "column",
-      paddingTop: 1,
-      paddingBottom: 1,
-      paddingLeft: 2,
-      paddingRight: 2
-    });
     setProp(_el$, "onMouseDrag", resizeList);
     setProp(_el$, "onMouseDragEnd", finishListResize);
     setProp(_el$, "onMouseUp", finishListResize);
@@ -44038,8 +44069,8 @@ function ProxyLogView() {
             flexDirection: "column",
             marginTop: 1
           });
-          insert(_el$14, () => `no ${tui.store.ui.proxyFilter === "all" ? "captured proxy" : tui.store.ui.proxyFilter} flows yet`);
-          insert(_el$15, () => proxyHint().toLowerCase());
+          insert(_el$14, () => truncate2(`no ${tui.store.ui.proxyFilter === "all" ? "captured proxy" : tui.store.ui.proxyFilter} flows yet`, tableWidth()));
+          insert(_el$15, () => truncate2(proxyHint().toLowerCase(), tableWidth()));
           effect((_p$) => {
             var _v$7 = COLOR.dim, _v$8 = COLOR.dim;
             _v$7 !== _p$.e && (_p$.e = setProp(_el$14, "fg", _v$7, _p$.e));
@@ -44088,103 +44119,140 @@ function ProxyLogView() {
         });
       }
     }));
-    insertNode(_el$9, _el$0);
-    insertNode(_el$9, _el$1);
-    setProp(_el$9, "style", {
-      height: 1,
-      flexShrink: 0,
-      flexDirection: "row",
-      justifyContent: "space-between",
-      marginTop: 1
-    });
-    insert(_el$0, () => truncate2(selectedFlow() && selectedPresentation() ? `${selectedPresentation().kind} \xB7 ${selectedPresentation().method} ${selectedFlow().url}` : "no flow selected", Math.max(8, tableWidth() - 20)));
-    insert(_el$1, () => truncate2(detailLoading() ? "loading detail" : detailError() ?? "", 18));
-    insertNode(_el$10, _el$11);
-    setProp(_el$10, "style", {
-      height: 1,
-      flexShrink: 0,
-      alignItems: "center",
-      justifyContent: "flex-start"
-    });
-    setProp(_el$10, "onMouseDown", beginListResize);
-    setProp(_el$11, "selectable", false);
-    insert(_el$11, () => "\u2500".repeat(Math.max(1, dims().width - 4)));
-    setProp(_el$12, "style", {
-      flexGrow: 1,
-      minHeight: 0,
-      flexDirection: "column",
-      paddingTop: 1
-    });
-    insert(_el$12, createComponent2(Show, {
+    insert(_el$, createComponent2(Show, {
       get when() {
-        return detail();
+        return !compactHeight();
       },
-      get fallback() {
-        return (() => {
-          var _el$17 = createElement("box"), _el$18 = createElement("text");
-          insertNode(_el$17, _el$18);
-          setProp(_el$17, "style", {
-            flexDirection: "column"
+      get children() {
+        return [(() => {
+          var _el$9 = createElement("box"), _el$0 = createElement("text"), _el$1 = createElement("text");
+          insertNode(_el$9, _el$0);
+          insertNode(_el$9, _el$1);
+          setProp(_el$9, "style", {
+            height: 1,
+            flexShrink: 0,
+            flexDirection: "row",
+            justifyContent: "space-between",
+            marginTop: 1
           });
-          insertNode(_el$18, createTextNode(`select a flow to inspect protocol-aware details`));
-          effect((_$p) => setProp(_el$18, "fg", COLOR.dim, _$p));
-          return _el$17;
-        })();
-      },
-      children: (flow) => (() => {
-        var _el$20 = createElement("box");
-        setProp(_el$20, "style", {
-          flexGrow: 1,
-          minHeight: 0,
-          flexDirection: "column"
-        });
-        insert(_el$20, createComponent2(Show, {
-          get when() {
-            return isSummaryOnly(flow());
-          },
-          get children() {
-            var _el$21 = createElement("box"), _el$22 = createElement("text");
-            insertNode(_el$21, _el$22);
-            setProp(_el$21, "style", {
-              height: 1,
-              flexShrink: 0,
-              marginBottom: 1
-            });
-            insertNode(_el$22, createTextNode(`full body unavailable; showing captured metadata`));
-            effect((_$p) => setProp(_el$22, "fg", COLOR.warning, _$p));
-            return _el$21;
-          }
-        }), null);
-        insert(_el$20, createComponent2(ProxyFlowSplitView, {
-          get flow() {
-            return flow();
-          },
-          compact: true
-        }), null);
-        return _el$20;
-      })()
-    }));
+          insert(_el$0, () => truncate2(selectedFlow() && selectedPresentation() ? `${selectedPresentation().kind} \xB7 ${selectedPresentation().method} ${selectedFlow().url}` : "no flow selected", Math.max(8, tableWidth() - 20)));
+          insert(_el$1, () => truncate2(detailLoading() ? "loading detail" : detailError() ?? "", 18));
+          effect((_p$) => {
+            var _v$ = COLOR.dim, _v$2 = detailLoading() ? COLOR.accent : detailError() ? COLOR.error : COLOR.dim;
+            _v$ !== _p$.e && (_p$.e = setProp(_el$0, "fg", _v$, _p$.e));
+            _v$2 !== _p$.t && (_p$.t = setProp(_el$1, "fg", _v$2, _p$.t));
+            return _p$;
+          }, {
+            e: undefined,
+            t: undefined
+          });
+          return _el$9;
+        })(), (() => {
+          var _el$10 = createElement("box"), _el$11 = createElement("text");
+          insertNode(_el$10, _el$11);
+          setProp(_el$10, "style", {
+            height: 1,
+            flexShrink: 0,
+            alignItems: "center",
+            justifyContent: "flex-start"
+          });
+          setProp(_el$10, "onMouseDown", beginListResize);
+          setProp(_el$11, "selectable", false);
+          insert(_el$11, () => "\u2500".repeat(Math.max(1, dims().width - 4)));
+          effect((_$p) => setProp(_el$11, "fg", dividerDragging() ? COLOR.accent : COLOR.border, _$p));
+          return _el$10;
+        })(), (() => {
+          var _el$12 = createElement("box");
+          setProp(_el$12, "style", {
+            flexGrow: 1,
+            minHeight: 0,
+            flexDirection: "column",
+            paddingTop: 1
+          });
+          insert(_el$12, createComponent2(Show, {
+            get when() {
+              return detail();
+            },
+            get fallback() {
+              return (() => {
+                var _el$17 = createElement("box"), _el$18 = createElement("text");
+                insertNode(_el$17, _el$18);
+                setProp(_el$17, "style", {
+                  flexDirection: "column"
+                });
+                insertNode(_el$18, createTextNode(`select a flow to inspect protocol-aware details`));
+                effect((_$p) => setProp(_el$18, "fg", COLOR.dim, _$p));
+                return _el$17;
+              })();
+            },
+            children: (flow) => (() => {
+              var _el$20 = createElement("box");
+              setProp(_el$20, "style", {
+                flexGrow: 1,
+                minHeight: 0,
+                flexDirection: "column"
+              });
+              insert(_el$20, createComponent2(Show, {
+                get when() {
+                  return isSummaryOnly(flow());
+                },
+                get children() {
+                  var _el$21 = createElement("box"), _el$22 = createElement("text");
+                  insertNode(_el$21, _el$22);
+                  setProp(_el$21, "style", {
+                    height: 1,
+                    flexShrink: 0,
+                    marginBottom: 1
+                  });
+                  insertNode(_el$22, createTextNode(`full body unavailable; showing captured metadata`));
+                  effect((_$p) => setProp(_el$22, "fg", COLOR.warning, _$p));
+                  return _el$21;
+                }
+              }), null);
+              insert(_el$20, createComponent2(ProxyFlowSplitView, {
+                get flow() {
+                  return flow();
+                },
+                compact: true
+              }), null);
+              return _el$20;
+            })()
+          }));
+          return _el$12;
+        })()];
+      }
+    }), null);
     effect((_p$) => {
-      var _v$ = COLOR.text, _v$2 = {
+      var _v$3 = {
+        flexGrow: 1,
+        flexShrink: 1,
+        minHeight: 0,
+        flexDirection: "column",
+        paddingTop: compactHeight() ? 0 : 1,
+        paddingBottom: compactHeight() ? 0 : 1,
+        paddingLeft: 2,
+        paddingRight: 2
+      }, _v$4 = COLOR.text, _v$5 = compactHeight() ? {
+        flexGrow: 1,
+        flexShrink: 1,
+        minHeight: 0,
+        flexDirection: "column"
+      } : {
         height: listHeight(),
         flexShrink: 0,
         flexDirection: "column",
         marginTop: 1
-      }, _v$3 = COLOR.dim, _v$4 = COLOR.dim, _v$5 = detailLoading() ? COLOR.accent : detailError() ? COLOR.error : COLOR.dim, _v$6 = dividerDragging() ? COLOR.accent : COLOR.border;
-      _v$ !== _p$.e && (_p$.e = setProp(_el$3, "fg", _v$, _p$.e));
-      _v$2 !== _p$.t && (_p$.t = setProp(_el$5, "style", _v$2, _p$.t));
-      _v$3 !== _p$.a && (_p$.a = setProp(_el$7, "fg", _v$3, _p$.a));
-      _v$4 !== _p$.o && (_p$.o = setProp(_el$0, "fg", _v$4, _p$.o));
-      _v$5 !== _p$.i && (_p$.i = setProp(_el$1, "fg", _v$5, _p$.i));
-      _v$6 !== _p$.n && (_p$.n = setProp(_el$11, "fg", _v$6, _p$.n));
+      }, _v$6 = COLOR.dim;
+      _v$3 !== _p$.e && (_p$.e = setProp(_el$, "style", _v$3, _p$.e));
+      _v$4 !== _p$.t && (_p$.t = setProp(_el$3, "fg", _v$4, _p$.t));
+      _v$5 !== _p$.a && (_p$.a = setProp(_el$5, "style", _v$5, _p$.a));
+      _v$6 !== _p$.o && (_p$.o = setProp(_el$7, "fg", _v$6, _p$.o));
       return _p$;
     }, {
       e: undefined,
       t: undefined,
       a: undefined,
-      o: undefined,
-      i: undefined,
-      n: undefined
+      o: undefined
     });
     return _el$;
   })();
@@ -44319,6 +44387,9 @@ function isSummaryOnly(flow) {
   return !flow.response && flow.answerCount > 0;
 }
 function proxyHeaderLine(width) {
+  if (width < 38) {
+    return truncate2([pad("", 2), pad("method", 8), "host / path"].join(""), width);
+  }
   if (width < 96) {
     return truncate2([pad("", 2), pad("proto", 7), pad("method", 8), pad("sts", 5), "host / path"].join(""), width);
   }
@@ -44338,10 +44409,11 @@ function proxyFlowTablePresentation(flow, filter) {
 function ProxyRow(props) {
   const pathWidth = () => Math.max(18, props.width - 98);
   const compactTarget = () => truncate2(`${props.flow.host}${props.flow.path || "/"}`, Math.max(8, props.width - 22));
+  const narrowTarget = () => truncate2(`${props.flow.host}${props.flow.path || "/"}`, Math.max(1, props.width - 10));
   const presentation = () => proxyFlowTablePresentation(props.flow, props.filter);
   return createComponent2(Show, {
     get when() {
-      return props.width >= 96;
+      return props.width >= 38;
     },
     get fallback() {
       return [(() => {
@@ -44353,91 +44425,119 @@ function ProxyRow(props) {
       })(), (() => {
         var _el$38 = createElement("text");
         setProp(_el$38, "selectable", false);
-        insert(_el$38, () => pad(presentation().kind, 7));
-        effect((_$p) => setProp(_el$38, "fg", COLOR.dim, _$p));
+        insert(_el$38, () => pad(presentation().method, 8));
+        effect((_$p) => setProp(_el$38, "fg", methodColor(presentation().method), _$p));
         return _el$38;
       })(), (() => {
         var _el$39 = createElement("text");
         setProp(_el$39, "selectable", false);
-        insert(_el$39, () => pad(presentation().method, 8));
-        effect((_$p) => setProp(_el$39, "fg", methodColor(presentation().method), _$p));
+        insert(_el$39, narrowTarget);
+        effect((_$p) => setProp(_el$39, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
         return _el$39;
-      })(), (() => {
-        var _el$40 = createElement("text");
-        setProp(_el$40, "selectable", false);
-        insert(_el$40, () => pad(String(props.flow.status ?? "-"), 5));
-        effect((_$p) => setProp(_el$40, "fg", statusColor(props.flow.status), _$p));
-        return _el$40;
-      })(), (() => {
-        var _el$41 = createElement("text");
-        setProp(_el$41, "selectable", false);
-        insert(_el$41, compactTarget);
-        effect((_$p) => setProp(_el$41, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
-        return _el$41;
       })()];
     },
     get children() {
-      return [(() => {
-        var _el$27 = createElement("text");
-        setProp(_el$27, "selectable", false);
-        insert(_el$27, () => pad(props.selected ? ">" : "", 2));
-        effect((_$p) => setProp(_el$27, "fg", props.selected ? COLOR.accent : COLOR.dim, _$p));
-        return _el$27;
-      })(), (() => {
-        var _el$28 = createElement("text");
-        setProp(_el$28, "selectable", false);
-        insert(_el$28, () => pad(shortTime(props.flow.timestamp), 9));
-        effect((_$p) => setProp(_el$28, "fg", COLOR.dim, _$p));
-        return _el$28;
-      })(), (() => {
-        var _el$29 = createElement("text");
-        setProp(_el$29, "selectable", false);
-        insert(_el$29, () => pad(presentation().kind, 7));
-        effect((_$p) => setProp(_el$29, "fg", COLOR.dim, _$p));
-        return _el$29;
-      })(), (() => {
-        var _el$30 = createElement("text");
-        setProp(_el$30, "selectable", false);
-        insert(_el$30, () => pad(presentation().method, 8));
-        effect((_$p) => setProp(_el$30, "fg", methodColor(presentation().method), _$p));
-        return _el$30;
-      })(), (() => {
-        var _el$31 = createElement("text");
-        setProp(_el$31, "selectable", false);
-        insert(_el$31, () => pad(String(props.flow.status ?? "-"), 5));
-        effect((_$p) => setProp(_el$31, "fg", statusColor(props.flow.status), _$p));
-        return _el$31;
-      })(), (() => {
-        var _el$32 = createElement("text");
-        setProp(_el$32, "selectable", false);
-        insert(_el$32, () => pad(truncate2(props.flow.host, 29), 30));
-        effect((_$p) => setProp(_el$32, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
-        return _el$32;
-      })(), (() => {
-        var _el$33 = createElement("text");
-        setProp(_el$33, "selectable", false);
-        insert(_el$33, () => pad(truncate2(props.flow.path || "/", pathWidth() - 1), pathWidth()));
-        effect((_$p) => setProp(_el$33, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
-        return _el$33;
-      })(), (() => {
-        var _el$34 = createElement("text");
-        setProp(_el$34, "selectable", false);
-        insert(_el$34, () => pad(truncate2(normalizeContentType(props.flow.contentType), 15), 16));
-        effect((_$p) => setProp(_el$34, "fg", COLOR.dim, _$p));
-        return _el$34;
-      })(), (() => {
-        var _el$35 = createElement("text");
-        setProp(_el$35, "selectable", false);
-        insert(_el$35, () => pad(formatBytes(props.flow.responseBytes ?? props.flow.requestBytes), 8));
-        effect((_$p) => setProp(_el$35, "fg", COLOR.dim, _$p));
-        return _el$35;
-      })(), (() => {
-        var _el$36 = createElement("text");
-        setProp(_el$36, "selectable", false);
-        insert(_el$36, () => formatDuration(props.flow.durationMs));
-        effect((_$p) => setProp(_el$36, "fg", COLOR.dim, _$p));
-        return _el$36;
-      })()];
+      return createComponent2(Show, {
+        get when() {
+          return props.width >= 96;
+        },
+        get fallback() {
+          return [(() => {
+            var _el$40 = createElement("text");
+            setProp(_el$40, "selectable", false);
+            insert(_el$40, () => pad(props.selected ? ">" : "", 2));
+            effect((_$p) => setProp(_el$40, "fg", props.selected ? COLOR.accent : COLOR.dim, _$p));
+            return _el$40;
+          })(), (() => {
+            var _el$41 = createElement("text");
+            setProp(_el$41, "selectable", false);
+            insert(_el$41, () => pad(presentation().kind, 7));
+            effect((_$p) => setProp(_el$41, "fg", COLOR.dim, _$p));
+            return _el$41;
+          })(), (() => {
+            var _el$42 = createElement("text");
+            setProp(_el$42, "selectable", false);
+            insert(_el$42, () => pad(presentation().method, 8));
+            effect((_$p) => setProp(_el$42, "fg", methodColor(presentation().method), _$p));
+            return _el$42;
+          })(), (() => {
+            var _el$43 = createElement("text");
+            setProp(_el$43, "selectable", false);
+            insert(_el$43, () => pad(String(props.flow.status ?? "-"), 5));
+            effect((_$p) => setProp(_el$43, "fg", statusColor(props.flow.status), _$p));
+            return _el$43;
+          })(), (() => {
+            var _el$44 = createElement("text");
+            setProp(_el$44, "selectable", false);
+            insert(_el$44, compactTarget);
+            effect((_$p) => setProp(_el$44, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
+            return _el$44;
+          })()];
+        },
+        get children() {
+          return [(() => {
+            var _el$27 = createElement("text");
+            setProp(_el$27, "selectable", false);
+            insert(_el$27, () => pad(props.selected ? ">" : "", 2));
+            effect((_$p) => setProp(_el$27, "fg", props.selected ? COLOR.accent : COLOR.dim, _$p));
+            return _el$27;
+          })(), (() => {
+            var _el$28 = createElement("text");
+            setProp(_el$28, "selectable", false);
+            insert(_el$28, () => pad(shortTime(props.flow.timestamp), 9));
+            effect((_$p) => setProp(_el$28, "fg", COLOR.dim, _$p));
+            return _el$28;
+          })(), (() => {
+            var _el$29 = createElement("text");
+            setProp(_el$29, "selectable", false);
+            insert(_el$29, () => pad(presentation().kind, 7));
+            effect((_$p) => setProp(_el$29, "fg", COLOR.dim, _$p));
+            return _el$29;
+          })(), (() => {
+            var _el$30 = createElement("text");
+            setProp(_el$30, "selectable", false);
+            insert(_el$30, () => pad(presentation().method, 8));
+            effect((_$p) => setProp(_el$30, "fg", methodColor(presentation().method), _$p));
+            return _el$30;
+          })(), (() => {
+            var _el$31 = createElement("text");
+            setProp(_el$31, "selectable", false);
+            insert(_el$31, () => pad(String(props.flow.status ?? "-"), 5));
+            effect((_$p) => setProp(_el$31, "fg", statusColor(props.flow.status), _$p));
+            return _el$31;
+          })(), (() => {
+            var _el$32 = createElement("text");
+            setProp(_el$32, "selectable", false);
+            insert(_el$32, () => pad(truncate2(props.flow.host, 29), 30));
+            effect((_$p) => setProp(_el$32, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
+            return _el$32;
+          })(), (() => {
+            var _el$33 = createElement("text");
+            setProp(_el$33, "selectable", false);
+            insert(_el$33, () => pad(truncate2(props.flow.path || "/", pathWidth() - 1), pathWidth()));
+            effect((_$p) => setProp(_el$33, "fg", props.selected ? COLOR.accent : COLOR.text, _$p));
+            return _el$33;
+          })(), (() => {
+            var _el$34 = createElement("text");
+            setProp(_el$34, "selectable", false);
+            insert(_el$34, () => pad(truncate2(normalizeContentType(props.flow.contentType), 15), 16));
+            effect((_$p) => setProp(_el$34, "fg", COLOR.dim, _$p));
+            return _el$34;
+          })(), (() => {
+            var _el$35 = createElement("text");
+            setProp(_el$35, "selectable", false);
+            insert(_el$35, () => pad(formatBytes(props.flow.responseBytes ?? props.flow.requestBytes), 8));
+            effect((_$p) => setProp(_el$35, "fg", COLOR.dim, _$p));
+            return _el$35;
+          })(), (() => {
+            var _el$36 = createElement("text");
+            setProp(_el$36, "selectable", false);
+            insert(_el$36, () => formatDuration(props.flow.durationMs));
+            effect((_$p) => setProp(_el$36, "fg", COLOR.dim, _$p));
+            return _el$36;
+          })()];
+        }
+      });
     }
   });
 }
@@ -44607,9 +44707,10 @@ function Composer() {
             const command = () => fitTerminal(option.title, commandWidth());
             const desc = () => truncateLine2(option.description ?? "", descWidth());
             return (() => {
-              var _el$9 = createElement("box"), _el$0 = createElement("text"), _el$1 = createElement("text");
+              var _el$9 = createElement("box"), _el$0 = createElement("text"), _el$1 = createElement("text"), _el$10 = createElement("text");
               insertNode(_el$9, _el$0);
               insertNode(_el$9, _el$1);
+              insertNode(_el$9, _el$10);
               setProp(_el$9, "style", {
                 flexDirection: "row"
               });
@@ -44621,17 +44722,21 @@ function Composer() {
                 composer.focus();
               });
               setProp(_el$0, "selectable", false);
-              insert(_el$0, () => `  ${command()}`);
+              insert(_el$0, () => active() ? "\u203A " : "  ");
               setProp(_el$1, "selectable", false);
-              insert(_el$1, desc);
+              insert(_el$1, command);
+              setProp(_el$10, "selectable", false);
+              insert(_el$10, desc);
               effect((_p$) => {
-                var _v$0 = active() ? COLOR.accent : COLOR.text, _v$1 = COLOR.dim;
+                var _v$0 = active() ? COLOR.accent : COLOR.dim, _v$1 = active() ? COLOR.accent : COLOR.text, _v$10 = COLOR.dim;
                 _v$0 !== _p$.e && (_p$.e = setProp(_el$0, "fg", _v$0, _p$.e));
                 _v$1 !== _p$.t && (_p$.t = setProp(_el$1, "fg", _v$1, _p$.t));
+                _v$10 !== _p$.a && (_p$.a = setProp(_el$10, "fg", _v$10, _p$.a));
                 return _p$;
               }, {
                 e: undefined,
-                t: undefined
+                t: undefined,
+                a: undefined
               });
               return _el$9;
             })();
@@ -44688,6 +44793,7 @@ var init_composer2 = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid2();
+  init_solid2();
   init_solid();
   init_solid2();
   init_store4();
@@ -45075,6 +45181,8 @@ var init_footer = __esm(() => {
 // src/agent-tui/bottom-pane/pending-input-preview.tsx
 function PendingInputPreview() {
   const tui = useTuiStore();
+  const dims = useTerminalDimensions();
+  const contentWidth = () => Math.max(1, dims().width - 4);
   return createComponent2(Show, {
     get when() {
       return tui.store.snapshot.pendingSteers.length > 0 || tui.store.snapshot.queuedPrompts.length > 0;
@@ -45091,7 +45199,10 @@ function PendingInputPreview() {
         get children() {
           return [(() => {
             var _el$2 = createElement("text");
-            insertNode(_el$2, createTextNode(`\u2022 steering at the next safe boundary`));
+            insert(_el$2, (() => {
+              var _c$ = memo2(() => dims().width >= 42);
+              return () => _c$() ? "\u2022 steering at the next safe boundary" : `\u2022 ${tui.store.snapshot.pendingSteers.length} steering`;
+            })());
             effect((_$p) => setProp(_el$2, "fg", COLOR.dim, _$p));
             return _el$2;
           })(), createComponent2(For, {
@@ -45099,20 +45210,20 @@ function PendingInputPreview() {
               return tui.store.snapshot.pendingSteers.slice(0, 3);
             },
             children: (item) => (() => {
-              var _el$8 = createElement("text");
-              insert(_el$8, () => `  \u21B3 ${truncateLine2(item.text.replace(/\s+/g, " "), 110)}`);
-              effect((_$p) => setProp(_el$8, "fg", COLOR.dim, _$p));
-              return _el$8;
+              var _el$6 = createElement("text");
+              insert(_el$6, () => `  \u21B3 ${truncateLine2(item.text.replace(/\s+/g, " "), contentWidth())}`);
+              effect((_$p) => setProp(_el$6, "fg", COLOR.dim, _$p));
+              return _el$6;
             })()
           }), createComponent2(Show, {
             get when() {
               return tui.store.snapshot.pendingSteers.length > 3;
             },
             get children() {
-              var _el$4 = createElement("text");
-              insert(_el$4, () => `  \u2026 ${tui.store.snapshot.pendingSteers.length - 3} more`);
-              effect((_$p) => setProp(_el$4, "fg", COLOR.dim, _$p));
-              return _el$4;
+              var _el$3 = createElement("text");
+              insert(_el$3, () => `  \u2026 ${tui.store.snapshot.pendingSteers.length - 3} more`);
+              effect((_$p) => setProp(_el$3, "fg", COLOR.dim, _$p));
+              return _el$3;
             }
           })];
         }
@@ -45123,29 +45234,32 @@ function PendingInputPreview() {
         },
         get children() {
           return [(() => {
-            var _el$5 = createElement("text");
-            insertNode(_el$5, createTextNode(`\u2022 queued follow-ups \xB7 \u2191 edit latest`));
-            effect((_$p) => setProp(_el$5, "fg", COLOR.dim, _$p));
-            return _el$5;
+            var _el$4 = createElement("text");
+            insert(_el$4, (() => {
+              var _c$2 = memo2(() => dims().width >= 42);
+              return () => _c$2() ? "\u2022 queued follow-ups \xB7 \u2191 edit latest" : `\u2022 ${tui.store.snapshot.queuedPrompts.length} queued \xB7 \u2191 edit`;
+            })());
+            effect((_$p) => setProp(_el$4, "fg", COLOR.dim, _$p));
+            return _el$4;
           })(), createComponent2(For, {
             get each() {
               return tui.store.snapshot.queuedPrompts.slice(0, 3);
             },
             children: (item, index) => (() => {
-              var _el$9 = createElement("text");
-              insert(_el$9, () => `  ${index() + 1}. ${truncateLine2(item.text.replace(/\s+/g, " "), 110)}`);
-              effect((_$p) => setProp(_el$9, "fg", COLOR.dim, _$p));
-              return _el$9;
+              var _el$7 = createElement("text");
+              insert(_el$7, () => `  ${index() + 1}. ${truncateLine2(item.text.replace(/\s+/g, " "), contentWidth())}`);
+              effect((_$p) => setProp(_el$7, "fg", COLOR.dim, _$p));
+              return _el$7;
             })()
           }), createComponent2(Show, {
             get when() {
               return tui.store.snapshot.queuedPrompts.length > 3;
             },
             get children() {
-              var _el$7 = createElement("text");
-              insert(_el$7, () => `  \u2026 ${tui.store.snapshot.queuedPrompts.length - 3} more`);
-              effect((_$p) => setProp(_el$7, "fg", COLOR.dim, _$p));
-              return _el$7;
+              var _el$5 = createElement("text");
+              insert(_el$5, () => `  \u2026 ${tui.store.snapshot.queuedPrompts.length - 3} more`);
+              effect((_$p) => setProp(_el$5, "fg", COLOR.dim, _$p));
+              return _el$5;
             }
           })];
         }
@@ -45162,7 +45276,6 @@ var init_pending_input_preview = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid2();
-  init_solid2();
   init_solid();
   init_store4();
   init_renderers2();
@@ -45172,15 +45285,18 @@ var init_pending_input_preview = __esm(() => {
 // src/agent-tui/bottom-pane/status-indicator.tsx
 function StatusIndicator(props) {
   const tui = useTuiStore();
+  const dims = useTerminalDimensions();
   const detail = () => {
     const value = tui.store.ui.statusDetail;
     return value && value !== "working" && !isFooterStatusDetail(value) ? ` \u2022 ${value}` : "";
   };
   const text = () => {
-    if (props.activity)
-      return `\u2022 ${props.activity} (${fmtElapsed(props.elapsed)}${detail()} \u2022 esc to interrupt)`.toLowerCase();
+    if (props.activity) {
+      const value2 = dims().width >= 56 ? `\u2022 ${props.activity} (${fmtElapsed(props.elapsed)}${detail()} \u2022 esc to interrupt)` : `\u2022 ${props.activity} ${fmtElapsed(props.elapsed)} \xB7 esc interrupt`;
+      return truncateLine2(value2.toLowerCase(), Math.max(1, dims().width));
+    }
     const value = tui.store.ui.statusDetail;
-    return (value && value !== "working" && !isFooterStatusDetail(value) ? `\u2022 ${value}` : "").toLowerCase();
+    return truncateLine2((value && value !== "working" && !isFooterStatusDetail(value) ? `\u2022 ${value}` : "").toLowerCase(), Math.max(1, dims().width));
   };
   return (() => {
     var _el$ = createElement("box"), _el$2 = createElement("text");
@@ -45200,7 +45316,9 @@ var init_status_indicator = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid2();
+  init_solid2();
   init_store4();
+  init_renderers2();
   init_theme();
   init_footer_state();
 });
@@ -45234,13 +45352,14 @@ function displayRows(matches, selectedId) {
 
 // src/agent-tui/overlays/selection-row.tsx
 function SelectionMenuHint(props) {
+  const dims = useTerminalDimensions();
   return (() => {
     var _el$ = createElement("box"), _el$2 = createElement("text");
     insertNode(_el$, _el$2);
     setProp(_el$, "style", {
       marginTop: 1
     });
-    insert(_el$2, () => `  ${props.text}`);
+    insert(_el$2, () => `  ${truncateLine2(props.text, Math.max(1, dims().width - 2))}`);
     effect((_$p) => setProp(_el$2, "fg", COLOR.dim, _$p));
     return _el$;
   })();
@@ -45305,6 +45424,7 @@ var init_selection_row = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid();
+  init_solid2();
   init_mouse();
   init_renderers2();
   init_theme();
@@ -45807,9 +45927,7 @@ function AgentsOverlay(props) {
             const status2 = () => agentStatusLine(item(), current(), now());
             const titleWidth = () => Math.max(8, props.width - terminalWidth(status2()) - 10);
             const metadata = () => item().role === "main" ? ["main thread", item().model].filter(Boolean).join(" \xB7 ") : [`${"  ".repeat(Math.max(0, item().depth - 1))}${item().lane ?? "general"}`, item().mode === "detached" ? "background" : "attached", item().model].filter(Boolean).join(" \xB7 ");
-            const select = (event) => {
-              if (!isPrimaryClick(event))
-                return;
+            const select = () => {
               const enabled = props.matches.filter((match) => !match.option.disabled);
               const index = enabled.findIndex((match) => match.option.id === row.option.id);
               if (props.frame.expandedId === row.option.id) {
@@ -45819,11 +45937,22 @@ function AgentsOverlay(props) {
               tui.actions.overlaySetIndex(index, enabled.length);
               tui.actions.agentDetailToggle(row.option.id);
             };
+            const selectClick = createPrimaryClickGesture(select);
             return (() => {
               var _el$32 = createElement("box"), _el$33 = createElement("box"), _el$34 = createElement("text"), _el$35 = createElement("text"), _el$36 = createElement("text"), _el$37 = createElement("text"), _el$38 = createElement("text");
               insertNode(_el$32, _el$33);
               insertNode(_el$32, _el$38);
-              setProp(_el$32, "onMouseUp", select);
+              spread(_el$32, mergeProps3({
+                get style() {
+                  return {
+                    width: "100%",
+                    flexDirection: "column",
+                    paddingLeft: 1,
+                    paddingRight: 1,
+                    backgroundColor: row.selected ? COLOR.panelActive : COLOR.panel
+                  };
+                }
+              }, selectClick), true);
               insertNode(_el$33, _el$34);
               insertNode(_el$33, _el$35);
               insertNode(_el$33, _el$36);
@@ -45869,27 +45998,19 @@ function AgentsOverlay(props) {
                 }
               }), null);
               effect((_p$) => {
-                var _v$13 = {
-                  width: "100%",
-                  flexDirection: "column",
-                  paddingLeft: 1,
-                  paddingRight: 1,
-                  backgroundColor: row.selected ? COLOR.panelActive : COLOR.panel
-                }, _v$14 = row.selected ? COLOR.accent : COLOR.dim, _v$15 = agentColor(item()), _v$16 = COLOR.text, _v$17 = COLOR.dim, _v$18 = COLOR.dim;
-                _v$13 !== _p$.e && (_p$.e = setProp(_el$32, "style", _v$13, _p$.e));
-                _v$14 !== _p$.t && (_p$.t = setProp(_el$34, "fg", _v$14, _p$.t));
-                _v$15 !== _p$.a && (_p$.a = setProp(_el$35, "fg", _v$15, _p$.a));
-                _v$16 !== _p$.o && (_p$.o = setProp(_el$36, "fg", _v$16, _p$.o));
-                _v$17 !== _p$.i && (_p$.i = setProp(_el$37, "fg", _v$17, _p$.i));
-                _v$18 !== _p$.n && (_p$.n = setProp(_el$38, "fg", _v$18, _p$.n));
+                var _v$13 = row.selected ? COLOR.accent : COLOR.dim, _v$14 = agentColor(item()), _v$15 = COLOR.text, _v$16 = COLOR.dim, _v$17 = COLOR.dim;
+                _v$13 !== _p$.e && (_p$.e = setProp(_el$34, "fg", _v$13, _p$.e));
+                _v$14 !== _p$.t && (_p$.t = setProp(_el$35, "fg", _v$14, _p$.t));
+                _v$15 !== _p$.a && (_p$.a = setProp(_el$36, "fg", _v$15, _p$.a));
+                _v$16 !== _p$.o && (_p$.o = setProp(_el$37, "fg", _v$16, _p$.o));
+                _v$17 !== _p$.i && (_p$.i = setProp(_el$38, "fg", _v$17, _p$.i));
                 return _p$;
               }, {
                 e: undefined,
                 t: undefined,
                 a: undefined,
                 o: undefined,
-                i: undefined,
-                n: undefined
+                i: undefined
               });
               return _el$32;
             })();
@@ -46067,6 +46188,7 @@ var init_list_overlay = __esm(() => {
   init_solid2();
   init_solid2();
   init_solid2();
+  init_solid2();
   init_solid();
   init_solid2();
   init_overlay_options();
@@ -46630,32 +46752,42 @@ function ModelProviderWizard() {
           children: (row) => {
             const selected = () => wizard().protocol === row[0];
             return (() => {
-              var _el$19 = createElement("box"), _el$20 = createElement("text"), _el$21 = createElement("text"), _el$22 = createElement("text");
+              var _el$19 = createElement("box"), _el$20 = createElement("text"), _el$21 = createElement("text");
               insertNode(_el$19, _el$20);
               insertNode(_el$19, _el$21);
-              insertNode(_el$19, _el$22);
               setProp(_el$19, "style", {
                 flexDirection: "row"
               });
-              setProp(_el$19, "onMouseUp", () => tui.actions.modelProviderWizardPatch({
-                protocol: row[0]
-              }));
+              setProp(_el$19, "onMouseUp", (event) => {
+                if (isPrimaryClick(event))
+                  tui.actions.modelProviderWizardPatch({
+                    protocol: row[0]
+                  });
+              });
               setProp(_el$20, "selectable", false);
               insert(_el$20, () => selected() ? "\u203A " : "  ");
               setProp(_el$21, "selectable", false);
               insert(_el$21, () => row[1]);
-              setProp(_el$22, "selectable", false);
-              insert(_el$22, () => `  ${row[2]}`);
+              insert(_el$19, createComponent2(Show, {
+                get when() {
+                  return dims().width >= 56;
+                },
+                get children() {
+                  var _el$22 = createElement("text");
+                  setProp(_el$22, "selectable", false);
+                  insert(_el$22, () => `  ${row[2]}`);
+                  effect((_$p) => setProp(_el$22, "fg", COLOR.dim, _$p));
+                  return _el$22;
+                }
+              }), null);
               effect((_p$) => {
-                var _v$18 = selected() ? COLOR.accent : COLOR.dim, _v$19 = COLOR.text, _v$20 = COLOR.dim;
+                var _v$18 = selected() ? COLOR.accent : COLOR.dim, _v$19 = COLOR.text;
                 _v$18 !== _p$.e && (_p$.e = setProp(_el$20, "fg", _v$18, _p$.e));
                 _v$19 !== _p$.t && (_p$.t = setProp(_el$21, "fg", _v$19, _p$.t));
-                _v$20 !== _p$.a && (_p$.a = setProp(_el$22, "fg", _v$20, _p$.a));
                 return _p$;
               }, {
                 e: undefined,
-                t: undefined,
-                a: undefined
+                t: undefined
               });
               return _el$19;
             })();
@@ -46683,7 +46815,7 @@ function ModelProviderWizard() {
     setProp(_el$8, "style", {
       marginTop: 1
     });
-    insert(_el$9, () => `  ${wizardHint(wizard().field, wizard().busy)}`);
+    insert(_el$9, () => `  ${truncateLine2(wizardHint(wizard().field, wizard().busy), Math.max(1, dims().width - 2))}`);
     effect((_p$) => {
       var _v$ = COLOR.text, _v$2 = COLOR.dim, _v$3 = COLOR.dim;
       _v$ !== _p$.e && (_p$.e = setProp(_el$3, "fg", _v$, _p$.e));
@@ -46700,7 +46832,9 @@ function ModelProviderWizard() {
 }
 function ProviderReview() {
   const tui = useTuiStore();
+  const dims = useTerminalDimensions();
   const wizard = () => tui.store.ui.modelProviderWizard;
+  const width = () => Math.max(1, dims().width - 2);
   return (() => {
     var _el$23 = createElement("box"), _el$24 = createElement("text"), _el$25 = createElement("text"), _el$26 = createElement("text"), _el$27 = createElement("text");
     insertNode(_el$23, _el$24);
@@ -46712,23 +46846,17 @@ function ProviderReview() {
       marginTop: 1,
       paddingLeft: 2
     });
-    insert(_el$24, () => wizard().id || "unnamed provider");
-    insert(_el$25, () => wizard().baseUrl || "base url missing");
-    insert(_el$26, () => `${modelProviderProtocolLabel(wizard().protocol)} \xB7 ${wizard().model || "discover models automatically"}`);
-    insert(_el$27, (() => {
-      var _c$ = memo2(() => !!wizard().apiKey);
-      return () => _c$() ? "new api key will be stored securely" : memo2(() => !!wizard().removeCredential)() ? "stored api key will be removed" : wizard().credentialStored ? "stored api key will be retained" : "no api key";
-    })());
+    insert(_el$24, () => truncateLine2(wizard().id || "unnamed provider", width()));
+    insert(_el$25, () => truncateLine2(wizard().baseUrl || "base url missing", width()));
+    insert(_el$26, () => truncateLine2(`${modelProviderProtocolLabel(wizard().protocol)} \xB7 ${wizard().model || "discover models automatically"}`, width()));
+    insert(_el$27, () => truncateLine2(wizard().apiKey ? "new api key will be stored securely" : wizard().removeCredential ? "stored api key will be removed" : wizard().credentialStored ? "stored api key will be retained" : "no api key", width()));
     insert(_el$23, createComponent2(Show, {
       get when() {
         return wizard().probe;
       },
       get children() {
         var _el$28 = createElement("text");
-        insert(_el$28, (() => {
-          var _c$2 = memo2(() => !!wizard().probe?.ok);
-          return () => _c$2() ? `probe ready \xB7 ${wizard().probe?.models.length} models \xB7 ${wizard().probe?.latencyMs}ms` : `probe failed \xB7 ${wizard().probe?.error ?? "unknown error"}`;
-        })());
+        insert(_el$28, () => truncateLine2(wizard().probe?.ok ? `probe ready \xB7 ${wizard().probe?.models.length} models \xB7 ${wizard().probe?.latencyMs}ms` : `probe failed \xB7 ${wizard().probe?.error ?? "unknown error"}`, width()));
         effect((_$p) => setProp(_el$28, "fg", wizard().probe?.ok ? COLOR.success : COLOR.error, _$p));
         return _el$28;
       }
@@ -46745,11 +46873,11 @@ function ProviderReview() {
       }
     }), null);
     effect((_p$) => {
-      var _v$21 = COLOR.text, _v$22 = COLOR.dim, _v$23 = COLOR.dim, _v$24 = COLOR.dim;
-      _v$21 !== _p$.e && (_p$.e = setProp(_el$24, "fg", _v$21, _p$.e));
-      _v$22 !== _p$.t && (_p$.t = setProp(_el$25, "fg", _v$22, _p$.t));
-      _v$23 !== _p$.a && (_p$.a = setProp(_el$26, "fg", _v$23, _p$.a));
-      _v$24 !== _p$.o && (_p$.o = setProp(_el$27, "fg", _v$24, _p$.o));
+      var _v$20 = COLOR.text, _v$21 = COLOR.dim, _v$22 = COLOR.dim, _v$23 = COLOR.dim;
+      _v$20 !== _p$.e && (_p$.e = setProp(_el$24, "fg", _v$20, _p$.e));
+      _v$21 !== _p$.t && (_p$.t = setProp(_el$25, "fg", _v$21, _p$.t));
+      _v$22 !== _p$.a && (_p$.a = setProp(_el$26, "fg", _v$22, _p$.a));
+      _v$23 !== _p$.o && (_p$.o = setProp(_el$27, "fg", _v$23, _p$.o));
       return _p$;
     }, {
       e: undefined,
@@ -46813,6 +46941,7 @@ var init_model_provider_wizard = __esm(() => {
   init_model_provider_state();
   init_theme();
   init_renderers2();
+  init_mouse();
 });
 
 // src/agent-tui/bottom-pane/model-provider-removal.tsx
@@ -46902,6 +47031,7 @@ function BottomPane() {
   const tui = useTuiStore();
   const exit = useExit();
   const composer = useComposerControl();
+  const dims = useTerminalDimensions();
   const [elapsed, setElapsed] = createSignal(0);
   let tick;
   const frame = () => tui.store.ui.overlayStack.at(-1);
@@ -47001,10 +47131,10 @@ function BottomPane() {
         return tui.store.ui.lastError;
       },
       children: (error) => (() => {
-        var _el$4 = createElement("text");
-        insert(_el$4, () => `\u2022 error \xB7 ${truncateLine2(error(), 160)}`);
-        effect((_$p) => setProp(_el$4, "fg", COLOR.error, _$p));
-        return _el$4;
+        var _el$3 = createElement("text");
+        insert(_el$3, () => `\u2022 error \xB7 ${truncateLine2(error(), Math.max(1, dims().width - 10))}`);
+        effect((_$p) => setProp(_el$3, "fg", COLOR.error, _$p));
+        return _el$3;
       })()
     }), null);
     insert(_el$, createComponent2(Show, {
@@ -47021,7 +47151,7 @@ function BottomPane() {
       },
       get children() {
         var _el$2 = createElement("text");
-        insertNode(_el$2, createTextNode(`  question pending \xB7 ctrl+q answer \xB7 chat input remains available`));
+        insert(_el$2, () => dims().width >= 64 ? "  question pending \xB7 ctrl+q answer \xB7 chat input remains available" : "  question pending \xB7 ctrl+q answer");
         effect((_$p) => setProp(_el$2, "fg", COLOR.warning, _$p));
         return _el$2;
       }
@@ -47114,57 +47244,92 @@ function BottomPane() {
 }
 function ProxyTabFooter() {
   const tui = useTuiStore();
+  const dims = useTerminalDimensions();
+  const layout = () => proxyTabFooterLayout(dims().width, tui.store.ui.proxyFilter);
   return (() => {
-    var _el$5 = createElement("box"), _el$6 = createElement("text"), _el$8 = createElement("text");
-    insertNode(_el$5, _el$6);
-    insertNode(_el$5, _el$8);
-    setProp(_el$5, "style", {
+    var _el$4 = createElement("box"), _el$5 = createElement("text"), _el$6 = createElement("text");
+    insertNode(_el$4, _el$5);
+    insertNode(_el$4, _el$6);
+    setProp(_el$4, "style", {
       height: 1,
       flexDirection: "row",
       justifyContent: "space-between",
       paddingLeft: 1,
       paddingRight: 1
     });
-    insertNode(_el$6, createTextNode(`\u2191\u2193 flow \xB7 tab detail \xB7 p/n ws msg \xB7 \u2190\u2192 filter \xB7 a/h/w tabs \xB7 ctrl+1 chat`));
-    insert(_el$8, () => `proxy \xB7 ${tui.store.ui.proxyFilter}`);
+    insert(_el$5, () => layout().left);
+    insert(_el$6, () => layout().right);
     effect((_p$) => {
       var _v$ = COLOR.dim, _v$2 = COLOR.dim;
-      _v$ !== _p$.e && (_p$.e = setProp(_el$6, "fg", _v$, _p$.e));
-      _v$2 !== _p$.t && (_p$.t = setProp(_el$8, "fg", _v$2, _p$.t));
+      _v$ !== _p$.e && (_p$.e = setProp(_el$5, "fg", _v$, _p$.e));
+      _v$2 !== _p$.t && (_p$.t = setProp(_el$6, "fg", _v$2, _p$.t));
       return _p$;
     }, {
       e: undefined,
       t: undefined
     });
-    return _el$5;
+    return _el$4;
   })();
 }
 function CenterSurfaceFooter(props) {
+  const dims = useTerminalDimensions();
+  const layout = () => centerSurfaceFooterLayout(props.frame, dims().width);
   return (() => {
-    var _el$9 = createElement("box"), _el$0 = createElement("text"), _el$1 = createElement("text");
-    insertNode(_el$9, _el$0);
-    insertNode(_el$9, _el$1);
-    setProp(_el$9, "style", {
+    var _el$7 = createElement("box"), _el$8 = createElement("text"), _el$9 = createElement("text");
+    insertNode(_el$7, _el$8);
+    insertNode(_el$7, _el$9);
+    setProp(_el$7, "style", {
       height: 1,
       flexDirection: "row",
       justifyContent: "space-between",
       paddingLeft: 1,
       paddingRight: 1
     });
-    insert(_el$0, () => centerSurfaceFooter(props.frame).toLowerCase());
-    insert(_el$1, () => props.frame.kind.toLowerCase());
+    insert(_el$8, () => layout().left);
+    insert(_el$9, () => layout().right);
     effect((_p$) => {
       var _v$3 = COLOR.dim, _v$4 = COLOR.dim;
-      _v$3 !== _p$.e && (_p$.e = setProp(_el$0, "fg", _v$3, _p$.e));
-      _v$4 !== _p$.t && (_p$.t = setProp(_el$1, "fg", _v$4, _p$.t));
+      _v$3 !== _p$.e && (_p$.e = setProp(_el$8, "fg", _v$3, _p$.e));
+      _v$4 !== _p$.t && (_p$.t = setProp(_el$9, "fg", _v$4, _p$.t));
       return _p$;
     }, {
       e: undefined,
       t: undefined
     });
-    return _el$9;
+    return _el$7;
   })();
 }
+function proxyTabFooterLayout(width, filter) {
+  const hint = width >= 88 ? "\u2191\u2193 flow \xB7 tab detail \xB7 p/n ws msg \xB7 \u2190\u2192 filter \xB7 a/h/w tabs \xB7 alt+1 chat" : width >= 56 ? "alt+1 chat \xB7 \u2191\u2193 flow \xB7 tab detail \xB7 \u2190\u2192 filter" : width >= 32 ? "alt+1 chat \xB7 \u2191\u2193 flow" : "alt+1 chat";
+  return fitFooterLine(hint, [{
+    id: "proxy",
+    kind: "message",
+    text: `proxy \xB7 ${filter}`
+  }], Math.max(0, width - 2));
+}
+function centerSurfaceFooterLayout(frame, width) {
+  const hint = width >= 64 ? centerSurfaceFooter(frame).toLowerCase() : compactCenterSurfaceFooter(frame);
+  return fitFooterLine(hint, [{
+    id: "surface",
+    kind: "message",
+    text: frame.kind.toLowerCase()
+  }], Math.max(0, width - 2));
+}
+function compactCenterSurfaceFooter(frame) {
+  switch (frame.kind) {
+    case "report":
+      return "esc back \xB7 s save";
+    case "container":
+      return "esc back \xB7 t toggle \xB7 r refresh";
+    case "confirm":
+      return "esc cancel \xB7 enter confirm";
+    case "proxy_flow":
+      return "esc back \xB7 tab pane";
+    case "alert":
+    case "detail":
+      return "esc back";
+  }
+}
 var init_bottom_pane = __esm(() => {
   init_solid2();
   init_solid2();
@@ -47251,6 +47416,9 @@ ${note.text}`).join(`
       return [createComponent2(KeyboardController, {}), (() => {
         var _el$ = createElement("box"), _el$2 = createElement("box");
         insertNode(_el$, _el$2);
+        setProp(_el$, "minHeight", 0);
+        setProp(_el$, "overflow", "hidden");
+        setProp(_el$, "flexDirection", "column");
         insert(_el$, createComponent2(MainTabs, {}), _el$2);
         setProp(_el$2, "id", "main-surface-viewport");
         setProp(_el$2, "style", {
@@ -47284,13 +47452,17 @@ ${note.text}`).join(`
           })
         }));
         insert(_el$, createComponent2(BottomPane, {}), null);
-        effect((_$p) => setProp(_el$, "style", {
-          width: dims().width,
-          height: dims().height,
-          minHeight: 0,
-          overflow: "hidden",
-          flexDirection: "column"
-        }, _$p));
+        effect((_p$) => {
+          var _v$ = dims().width, _v$2 = dims().height, _v$3 = COLOR.bg;
+          _v$ !== _p$.e && (_p$.e = setProp(_el$, "width", _v$, _p$.e));
+          _v$2 !== _p$.t && (_p$.t = setProp(_el$, "height", _v$2, _p$.t));
+          _v$3 !== _p$.a && (_p$.a = setProp(_el$, "backgroundColor", _v$3, _p$.a));
+          return _p$;
+        }, {
+          e: undefined,
+          t: undefined,
+          a: undefined
+        });
         return _el$;
       })()];
     }
@@ -47333,10 +47505,10 @@ function MainTabs() {
     });
     insert(_el$8, () => `[2] proxy${proxyCount() ? ` (${proxyCount()})` : ""}`);
     effect((_p$) => {
-      var _v$ = active() === "chat" ? COLOR.accent : COLOR.dim, _v$2 = COLOR.dim, _v$3 = active() === "proxy" ? COLOR.accent : COLOR.dim;
-      _v$ !== _p$.e && (_p$.e = setProp(_el$4, "fg", _v$, _p$.e));
-      _v$2 !== _p$.t && (_p$.t = setProp(_el$6, "fg", _v$2, _p$.t));
-      _v$3 !== _p$.a && (_p$.a = setProp(_el$8, "fg", _v$3, _p$.a));
+      var _v$4 = active() === "chat" ? COLOR.accent : COLOR.dim, _v$5 = COLOR.dim, _v$6 = active() === "proxy" ? COLOR.accent : COLOR.dim;
+      _v$4 !== _p$.e && (_p$.e = setProp(_el$4, "fg", _v$4, _p$.e));
+      _v$5 !== _p$.t && (_p$.t = setProp(_el$6, "fg", _v$5, _p$.t));
+      _v$6 !== _p$.a && (_p$.a = setProp(_el$8, "fg", _v$6, _p$.a));
       return _p$;
     }, {
       e: undefined,
@@ -47574,9 +47746,37 @@ __export(exports_agent_tui, {
   formatResumeHint: () => formatResumeHint,
   ensureSession: () => ensureSession,
   createRuntimePort: () => createRuntimePort,
+  createDeferredResizeHandler: () => createDeferredResizeHandler,
   SessionResolutionError: () => SessionResolutionError
 });
-import { createCliRenderer as createCliRenderer2 } from "@opentui/core";
+import { createCliRenderer as createCliRenderer2, RGBA } from "@opentui/core";
+function createDeferredResizeHandler(resize, readSize, schedule = (callback) => setTimeout(callback, 0), cancel = clearTimeout) {
+  let timer;
+  let disposed = false;
+  const onResize2 = () => {
+    if (disposed)
+      return;
+    if (timer !== undefined)
+      cancel(timer);
+    timer = schedule(() => {
+      timer = undefined;
+      if (disposed)
+        return;
+      const size = readSize();
+      if (size)
+        resize(size.width, size.height);
+    });
+  };
+  return {
+    onResize: onResize2,
+    dispose: () => {
+      disposed = true;
+      if (timer !== undefined)
+        cancel(timer);
+      timer = undefined;
+    }
+  };
+}
 async function runOpenTui(input) {
   const capabilities = input.capabilities ?? {
     compact: true,
@@ -47681,29 +47881,24 @@ async function destroyRenderer(renderer) {
   } catch {}
 }
 async function createManagedRenderer(onDestroy) {
-  const existingListeners = new Set(process.listeners("SIGWINCH"));
   const renderer = await createCliRenderer2({
     autoFocus: false,
+    backgroundColor: COLOR.bg,
     exitOnCtrlC: false,
     onDestroy
   });
-  const rendererListeners = process.listeners("SIGWINCH").filter((listener) => !existingListeners.has(listener));
-  for (const listener of rendererListeners)
-    process.off("SIGWINCH", listener);
-  if (rendererListeners.length === 0)
-    return {
-      renderer,
-      disposeResize: () => {}
-    };
-  const onResize2 = () => {
-    const size = validTerminalSize(process.stdout.columns, process.stdout.rows);
-    if (size)
-      renderer.resize(size.width, size.height);
-  };
-  process.on("SIGWINCH", onResize2);
+  const resize = createDeferredResizeHandler((width, height) => {
+    renderer.resize(width, height);
+    renderer.currentRenderBuffer.clear(RGBA.fromInts(1, 1, 1, 255));
+    renderer.requestRender();
+  }, () => validTerminalSize(process.stdout.columns, process.stdout.rows));
+  process.on("SIGWINCH", resize.onResize);
   return {
     renderer,
-    disposeResize: () => process.off("SIGWINCH", onResize2)
+    disposeResize: () => {
+      process.off("SIGWINCH", resize.onResize);
+      resize.dispose();
+    }
   };
 }
 function validTerminalSize(columns, rows) {
@@ -47775,6 +47970,7 @@ var init_agent_tui = __esm(() => {
   init_session_title();
   init_session_catalog();
   init_update_check();
+  init_theme();
   SessionResolutionError = class SessionResolutionError extends Error {
     constructor(query, workspace, sessions2) {
       const recent = sessions2.slice(0, 5).map((session) => `  ${session.id}  ${session.title?.trim() || DEFAULT_SESSION_TITLE}`).join(`
@@ -50355,5 +50551,5 @@ Examples:
 `);
 }
 
-//# debugId=90702708DD95C63C64756E2164756E21
+//# debugId=B089044398C9A98564756E2164756E21
 //# sourceMappingURL=index.js.map