A chat interface that includes inline source citations with expandable source cards. Responses include numbered references that link to source details.
Loading interactive preview...
Automatically installs the pattern and its dependencies in your project.
Download the complete pattern as a standalone Next.js project.
Add your AI provider API key to enable real functionality.
Open http://localhost:3000 to see the pattern in action.
The pattern is ready to use. Modify the components, API routes, and styling to fit your application.
app/page.tsxapp/api/Build research tools that provide answers with proper citations to academic papers, journals, and scholarly sources.
Create systems that answer legal questions with citations to case law, statutes, and legal precedents.
Develop healthcare assistants that provide medical information with citations to research studies and clinical guidelines.
Build platforms that verify claims and provide evidence-backed answers with source attribution and credibility scores.
Integrate third-party search APIs (Tavily, Exa) with the AI SDK to build a grounded search agent with source citations.
Retrieval-Augmented Generation: embed documents, store in a vector database, and retrieve context for grounded AI responses.
Stream text responses from AI models in real-time using streamText and the useChat hook.
The chat-with-citations pattern demo is being prepared.
Download the pattern to try it with your API key