Skip to main content

Streaming

The Client SDK provides real-time access to streaming content through the message parts array. Each part has its own status, enabling responsive UIs that update as the agent generates responses.

Streaming State

tsx

Building a Streaming UI

tsx

Rendering Streaming Parts

Parts update in real-time during streaming. Use the part's status to show appropriate UI:

tsx

Tool Call States

Tool calls progress through multiple states:

tsx

Status Indicator

tsx

Handling Completion

tsx

See Error Handling for comprehensive error handling patterns.

text

When stop() is called:

  1. The HTTP request is aborted (requires signal in transport)
  2. Any partial text/reasoning is finalized with done status
  3. In-progress tool calls are marked as cancelled
  4. The onStop callback is invoked
  5. Status changes to idle

Partial content is preserved in the message, so users don't lose what was already generated.

Auto-Scroll

Chat interfaces should scroll to the bottom as new content streams in, but pause if the user has scrolled up to read earlier messages. The useAutoScroll hook handles this:

tsx

The hook returns four values:

Return ValuePurpose
scrollRefAttach to the scrollable container's ref
handleScrollAttach to the container's onScroll — tracks whether the user is near the bottom
scrollOnUpdateCall inside a useEffect when messages change — scrolls to bottom if the user hasn't scrolled up
resetAutoScrollCall when the user sends a message — forces the next update to scroll to bottom

You can customize the hook with options:

tsx

Named Thread Content

Content from named threads (like "summary") streams separately and is identified by the thread property:

tsx