AI
AI SDK Patterns

Command Palette

Search for a command to run...

PatternsComposeGitHub
All Patterns

Core / SDK

9
  • Structured Output
  • Generative UI
  • JSON Renderer
  • Text Generation
  • Image Generation
  • Streaming Object
  • Code ArtifactPopular
  • Form Generator
  • CSV Editor

Chat

5
  • Streaming ChatPopular
  • Markdown Chat
  • Reasoning Display
  • Chat with Citations
  • Multi-Modal ChatNew

Agents

5
  • Tool CallingPopular
  • Multi-Step AgentPopular
  • Routing Agent
  • Orchestrator Agent
  • Evaluator-Optimizer

Tools

4
  • Web Search Agent
  • RAG PipelinePopular
  • MCP Client AgentNew
  • Text-to-SQLNew

Workflows

7
  • Human-in-the-Loop
  • Sequential Workflow
  • Parallel Workflow
  • Durable Multi-Turn Chat Agent
  • Human-in-the-Loop Approval Workflow
  • Scheduled/Delayed AI Task
  • Refinement Loop
PatternsComposeAI SDK DocsGitHub

Built with AI SDK · shadcn/ui · Next.js

© 2026 AI SDK Patterns

Text-to-SQL

Natural language to SQL: ask questions about data in plain English, the AI generates and executes SQL queries, and displays results in a table. Uses an in-memory SQLite database with sample data.

Newtoolsadvancedsqldatabasetext-to-sqltool-callingstructured-outputbetter-sqlite3

Loading interactive preview...

Installation

Option 1: Install via CLI

pnpm dlx shadcn@latest add https://ai-sdk-patterns.vercel.app/r/text-to-sql

Automatically installs the pattern and its dependencies in your project.

Option 2: Copy or Download

Download the complete pattern as a standalone Next.js project.

Usage

1. Set up environment variables

# .env.local
ANTHROPIC_API_KEY=your_anthropic_key
OPENAI_API_KEY=your_openai_key
GOOGLE_GENERATIVE_AI_API_KEY=your_google_key

Add your AI provider API key to enable real functionality.

2. Run the development server

npm run dev
# or
pnpm dev
# or
yarn dev

Open http://localhost:3000 to see the pattern in action.

3. Customize for your needs

The pattern is ready to use. Modify the components, API routes, and styling to fit your application.

  • Update the UI components in app/page.tsx
  • Modify API logic in app/api/
  • Adjust styling with Tailwind CSS classes
  • Add your own business logic and data sources

Use Cases

Business Intelligence Dashboards

Let non-technical users query databases in plain English, generating reports and insights without writing SQL.

Customer Data Exploration

Build self-service analytics tools where product and marketing teams can explore user data conversationally.

Log and Metrics Analysis

Query application logs, performance metrics, and operational data using natural language for faster incident response.

Inventory and Sales Reporting

Enable warehouse and sales teams to check stock levels, sales trends, and order status by simply asking questions.

Technical Details

Dependencies

• Next.js 16+ (App Router)
• AI SDK v6
• React 19+
• Tailwind CSS
• TypeScript

Files Included

• app/page.tsx
• app/api/sql/route.ts
• lib/db.ts
• lib/model.ts

Related patterns

Tool Calling

Let the AI model call functions and use external tools with the multi-step tool loop.

Structured Output

Generate typed, validated JSON data using Zod schemas and the generateObject function.

Ask questions about your data
employeesdepartmentsprojects

🔒 Demo mode - converts natural language to SQL queries