agent-sdk-streaming

Agent SDK Streaming

Streaming is the difference between "this agent works" and "this agent feels alive". Stream text as it generates, show tool activity, and never block the UI on a long tool call.

When to Use

• Building any interactive agent UI
• Long-running agents where users need to see progress
• Debugging "why does my agent hang?" (often: you're not reading the stream)

Event Types

The SDK emits a typed stream of events. Core types:

Event	When	UI treatment
assistant with text block	Model generates text	Append to current message bubble
assistant with thinking	Extended thinking	Show "thinking..." spinner
assistant with tool_use	Model decides to call tool	Show tool badge ("calling web_fetch...")
user with tool_result	Tool returned	Show result or just acknowledge
system with progress	Tool progress notification	Update progress bar
result	Turn complete	Remove spinner, finalize

TypeScript Streaming

import { query } from "@anthropic-ai/claude-agent-sdk";

const ui = new ChatUI();

for await (const msg of query({ prompt, options: { model: "claude-sonnet-4-6" } })) {
  switch (msg.type) {
    case "assistant": {
      for (const block of msg.message.content) {
        if (block.type === "text") ui.appendText(block.text);
        if (block.type === "thinking") ui.showThinking(block.thinking);
        if (block.type === "tool_use") ui.showToolCall(block.name, block.input);
      }
      break;
    }
    case "user": {
      for (const block of msg.message.content) {
        if (block.type === "tool_result") ui.showToolResult(block.tool_use_id, block.content);
      }
      break;
    }
    case "result": {
      ui.finalize(msg.result);
      break;
    }
  }
}

Text Deltas vs Messages

Some SDK versions emit full messages (with cumulative text) rather than deltas. Handle both:

let lastText = "";
// on assistant text:
const newText = block.text.slice(lastText.length);
ui.appendText(newText);
lastText = block.text;