TanStack AI – A Type‑Safe, Provider‑Agnostic SDK for Building Generative‑AI Apps

What it is – A collection of TypeScript packages that let you write streaming chat, tool‑calling agents, structured‑output flows, multimodal generation (image, audio, video, docs), real‑time voice, and code‑execution agents. The core SDK is provider‑agnostic; you add adapters for OpenAI, Anthropic, Gemini, Ollama, etc., and framework bindings for React, Vue, Solid, Svelte, Preact, or a head‑less client.

---

Core ideas

Concept	What it gives you
Composable activities	Chat, generation, realtime, tools, etc. are separate “activities” you import only when needed, keeping bundles tiny.
Provider‑agnostic adapters	Swap OpenAI, Anthropic, Grok, Ollama, Cloudflare Workers AI, etc., with a single adapter object.
Type‑safe contracts	Tools, structured outputs, and even per‑model payloads are defined with Zod/Valibot/ArkType or raw JSON Schema, so TypeScript knows the exact shape of inputs and results.
Framework‑native hooks	useChat, useRealtimeChat, generation hooks, and UI components for React, Vue, Solid, Svelte, Preact.
Agent Skills integration	Packages can expose a SKILL.md that coding assistants (Claude, Cursor, Copilot…) can install automatically, turning the SDK into a first‑class skill for AI‑assisted development.

---

Getting started (quick‑start)

# Core SDK + an OpenAI adapter
pnpm add @tanstack/ai @tanstack/ai-openai

# For a React UI (hooks + UI components)
pnpm add @tanstack/ai-react @tanstack/ai-client

Server‑side streaming chat example

import { chat, toServerSentEventsResponse } from '@tanstack/ai'
import { openaiText } from '@tanstack/ai-openai'

export async function POST(req: Request) {
  const { messages } = await req.json()
  const stream = chat({
    adapter: openaiText('gpt-5.2'),
    messages,
  })
  return toServerSentEventsResponse(stream)   // SSE for the browser
}

The same chat call works in the browser, in a worker, or inside a test script.

---

Key features

1. Streaming chat & tool calls

• Typed message objects (role, content).
• Built‑in support for tool definitions (toolDefinition) that can be executed on server or client with the same type contract.
• Automatic tool‑approval flow and lazy discovery for dynamic tool loading.

2. Structured outputs

const Person = z.object({ name: z.string(), age: z.number() })
const result = await chat({
  adapter: openaiText('gpt-5.2'),
  messages: [{ role: 'user', content: 'Give me a short bio of Ada Lovelace' }],
  outputSchema: Person,
})
// result is typed as { name: string; age: number }

Works with any schema library or raw JSON Schema.

3. Multimodal generation

• One‑line adapters like openaiImage, falVideo, geminiSpeech let you request images, video, audio, transcription, summarisation, etc., using the same generationClient pattern.

4. Real‑time voice chat

Adapters expose a realtime session that mints tokens and streams audio chunks, enabling low‑latency voice assistants.

5. Code Mode

Models can write TypeScript that runs inside a sandboxed VM, allowing loops, branching, and parallel tool calls—useful for complex orchestration or data‑processing agents.

6. Observability & DevTools

• Event streams for messages, tool calls, usage, and errors.
• OpenTelemetry exporter for vendor‑neutral traces.
• Optional UI devtools package to inspect live streams.

---

Ecosystem & extensibility

Piece	Purpose
@tanstack/ai-client	Headless client – core logic without framework bindings.
@tanstack/ai‑react, ‑solid, ‑vue, ‑svelte, ‑preact	Hooks/composables for the respective UI library.
@tanstack/ai‑react/ui (and similar)	Ready‑made headless UI components for chat windows (deprecated in favor of custom UI).
Provider adapters (‑openai, ‑anthropic, ‑gemini, ‑ollama, ‑groq, …)	Translate the generic SDK calls into each vendor’s HTTP API.
@tanstack/ai‑openrouter	Single API key that routes to 300+ models, with per‑request cost tracking.
@tanstack/ai‑cloudflare	Runs on Cloudflare Workers, exposing AI Gateway, embeddings, etc.

Because each activity and adapter is tree‑shakable, you only ship the code you actually use.

---

Who might use this?

• Full‑stack developers building chat‑bots, AI‑augmented UIs, or internal tools that need type safety.
• Product teams that want to switch between providers (OpenAI ↔ Anthropic ↔ local Ollama) without rewriting code.
• LLM‑ops engineers looking for a unified observability layer and OpenTelemetry support.
• Tool‑building platforms that expose typed tool contracts to downstream agents.
• Educational or hobby projects that want a ready‑made, well‑documented SDK rather than rolling their own HTTP wrappers.

---

Documentation & community

• Full docs – https://tanstack.com/ai (overview, quick‑starts, comparison with Vercel AI SDK, advanced topics).
• GitHub discussions, Discord, and a sponsor program for contributors.
• Agent Skills – a unique feature that lets coding assistants automatically install the SDK as a skill, turning TanStack AI into a first‑class assistant for developers.

---

TL;DR

TanStack AI is a type‑safe, modular TypeScript SDK for building any kind of generative‑AI application—chat, tool‑calling agents, multimodal generation, realtime voice, or sandboxed code execution. It abstracts over many providers via adapters, offers framework‑specific hooks, and emphasizes developer ergonomics (schemas, observability, tree‑shaking). Ideal for teams that want strong TypeScript guarantees while staying provider‑agnostic.