diff --git a/packages/pi-agent-core/src/agent-loop.ts b/packages/pi-agent-core/src/agent-loop.ts
index ff2bab0f9..a544b58c1 100644
--- a/packages/pi-agent-core/src/agent-loop.ts
+++ b/packages/pi-agent-core/src/agent-loop.ts
@@ -234,8 +234,9 @@ async function runLoop(
 
 			const toolResults: ToolResultMessage[] = [];
 			if (hasMoreToolCalls && config.externalToolExecution) {
-				// External execution mode: tools were handled by the provider (e.g., Claude Code SDK).
-				// Emit synthetic tool events for TUI rendering but skip local dispatch.
+				// External execution mode: tools were handled by the provider
+				// (e.g., Claude Code SDK). Emit tool_execution events for each
+				// tool call. The TUI adds these as components after the message.
 				for (const tc of toolCalls as AgentToolCall[]) {
 					stream.push({
 						type: "tool_execution_start",
diff --git a/packages/pi-tui/src/components/box.ts b/packages/pi-tui/src/components/box.ts
index c99b8600b..9dd692750 100644
--- a/packages/pi-tui/src/components/box.ts
+++ b/packages/pi-tui/src/components/box.ts
@@ -31,6 +31,16 @@ export class Box implements Component {
 		this.invalidateCache();
 	}
 
+	insertChildBefore(component: Component, before: Component): void {
+		const index = this.children.indexOf(before);
+		if (index !== -1) {
+			this.children.splice(index, 0, component);
+		} else {
+			this.children.push(component);
+		}
+		this.invalidateCache();
+	}
+
 	removeChild(component: Component): void {
 		const index = this.children.indexOf(component);
 		if (index !== -1) {