VolChat

<VolChat> streams answers from POST /v1/chat, renders [n] markers as clickable chips, lists the sources under each answer and shows the RAPTOR clusters as pills. Conversation context (sessionId) is kept automatically until the user clicks New chat.

<VolChat
  case="papers"
  title="Ask the papers"
  suggestions={["What is graph RAG?", "Recent work on RAPTOR"]}
  onCitation={(citation, index) => viewer.flyTo(citation.nodeIndex)}
  onCluster={(cluster) => highlight(cluster.nodeIndices)}
  onAnswer={(res) => setFocus(res.citations.map((c) => c.nodeIndex))}
  className="h-[600px]"
/>

Props

Prop	Type	Default	Description
case	CaseId	provider defaultCase	Corpus to ask.
onCitation	(citation, index, message) => void	—	Click on a marker or a source. index is 0-based.
onCluster	(cluster: AnswerCluster) => void	—	Click on a cluster pill.
onAnswer	(response: ChatResponse) => void	—	Called once the stream completes.
title	string | null	"Ask VOL"	Header title; null hides the header.
placeholder	string	"Ask a question about this corpus…"	Input placeholder.
suggestions	string[]	[]	Starter questions shown in the empty state.
showSources	boolean	true	Render VolCitationList under each answer.
className	string	—	Extra classes for the card (set a height here).

Behaviour

• Enter sends, Shift+Enter inserts a new line; while streaming the send button becomes Stop.
• Errors (HTTP or error events) are shown inline in the answer bubble.
• The component fills its container height (min-height: 420px).

Need a different layout? Build your own UI on useVolChat.