Overview
Chat components display the conversation between a user and an agent in realtime. They render two types of content: speech transcriptions (what the agent and user say, converted to text) and text messages (typed input sent through chat). As the conversation progresses, the transcript updates automatically with new messages, and an indicator shows when the agent is processing or composing a response.
Code
Components
AgentChatTranscript
Renders the full conversation history between the user and agent, including both speech transcriptions and text messages. Messages appear in realtime as they're spoken or sent, with the transcript automatically scrolling to show the latest content. Use this as the primary chat interface in your agent frontend.
The component integrates with LiveKit's text streams to receive transcription data, so it works automatically within an AgentSessionProvider context — no manual data fetching or state management required.
AgentChatTranscript reference
Full API reference and props documentation.
AgentChatIndicator
Displays a typing or thinking indicator when the agent is processing input or composing a response. This gives users visual feedback during pauses in the conversation — for example, while the agent is calling an external tool or generating a long response. The indicator responds to the agent's state, appearing automatically during thinking and speaking phases.
AgentChatIndicator reference
Full API reference and props documentation.
Related
These guides cover the underlying data systems that chat components build on.