> ## Documentation Index
> Fetch the complete documentation index at: https://docs.chatropic.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Streaming & events

> How replies stream into the chat UI, and the callbacks you can hook

Agent replies stream token by token over server-sent events. Both the web embed and the React Native SDK handle the stream internally: they show a thinking indicator, append text as it arrives, render structured UI, and surface errors. You do not parse the stream yourself.

## Events during a turn

Understanding the event sequence helps when debugging what users see:

| Event            | What the chat UI does                                            |
| ---------------- | ---------------------------------------------------------------- |
| `agent:thinking` | Shows the thinking indicator                                     |
| `agent:typing`   | Appends streamed text to the reply bubble                        |
| `ui:render`      | Renders a structured widget (result list, form, navigation card) |
| `agent:done`     | Finalizes the message text and any attached UI payload           |
| `agent:error`    | Shows a user-safe error message in the conversation              |

## React Native callbacks

The SDK exposes lifecycle hooks for analytics and app behavior. They observe the turn; they do not modify it.

```tsx theme={null}
<ChatWidgetLauncher
  publishableKey="cpk_live_..."
  onUserMessage={(msg) => analytics.track("support_message_sent")}
  onAgentDone={(reply) => analytics.track("support_reply_received")}
  onNavigate={(path) => navigation.navigate(path)}
/>
```

| Callback        | Fires when                      |
| --------------- | ------------------------------- |
| `onUserMessage` | The user sends a message        |
| `onAgentDone`   | The agent completes a turn      |
| `onNavigate`    | The user taps a navigation card |

<CardGroup cols={2}>
  <Card title="Actions & UI payloads" icon="puzzle-piece" href="/developer-guides/integration/actions-and-ui">
    What `ui:render` produces.
  </Card>

  <Card title="Error handling" icon="triangle-exclamation" href="/developer-guides/integration/error-handling">
    What users see when a turn fails.
  </Card>
</CardGroup>