# Vercel AI SDK + Tabstack

> Give your Vercel AI SDK apps reliable web access. Schema-enforced extraction, research, generation, and browser automation as drop-in AI SDK tools.

Category: Agent Frameworks
Language: TypeScript
Package: `@tabstack/ai`
Canonical URL: https://tabstack.ai/integrations/vercel-ai-sdk

## Why Vercel AI SDK + Tabstack

Wiring web access into an AI SDK app usually means hand-rolled fetches, HTML parsing, and prompt gymnastics to coax structured data out of messy text. [`@tabstack/ai`](https://www.npmjs.com/package/@tabstack/ai) replaces that with a hosted API exposed as typed `tool()` definitions: define the shape with Zod or JSON Schema and get that shape back, with JS-heavy pages rendered server-side. No Playwright, no binaries. One key covers extraction, research, generation, and automation.

## Quickstart

Install the adapter and set your key:

```bash
npm install @tabstack/ai ai zod

export TABSTACK_API_KEY="your-key-here"
```

Pass the tool set straight to `generateText` (or `streamText`):

```ts
import { openai } from "@ai-sdk/openai";
import { generateText, stepCountIs } from "ai";
import { tabstackTools } from "@tabstack/ai";

const { text } = await generateText({
  model: openai("gpt-4o"),
  tools: tabstackTools,
  stopWhen: stepCountIs(5), // let the model call a tool, then use the result
  prompt: "What are Vercel's pricing plans and how do they compare?",
});

console.log(text);
```

`tabstackTools` reads `TABSTACK_API_KEY` from the environment and is a named object keyed by tool name. Pass all of them, or pick a subset:

```ts
import { streamText, stepCountIs } from "ai";
import { tabstackTools } from "@tabstack/ai";

const result = streamText({
  model: openai("gpt-4o"),
  tools: {
    research_question: tabstackTools.research_question,
    extract_page_content: tabstackTools.extract_page_content,
  },
  stopWhen: stepCountIs(5),
  prompt: "Summarize the latest on quantum error correction, with sources.",
});

for await (const chunk of result.textStream) process.stdout.write(chunk);
```

## The tools

| Tool | What it does |
| --- | --- |
| `extract_structured_data` | Pull specific fields from a URL into a JSON shape you define. |
| `extract_page_content` | Fetch a page as clean markdown. |
| `research_question` | Synthesized answer with cited sources across multiple pages. |
| `generate_structured_data` | Fetch a page, then AI-transform it into derived or reshaped JSON. |
| `automate_browser_task` | Run a multi-step, natural-language browser task. |

## Common use cases

- Add live web research with citations to a chat app in a few lines.
- Stream a model answer that pulls typed data from a URL mid-response.
- Gate expensive automation behind a `stepCountIs` budget.
- Ship only the tools a given surface needs by passing a subset.

## Next steps

- [Adapter on GitHub](https://github.com/Mozilla-Ocho/tabstack-integrations-typescript)
- [@tabstack/ai on npm](https://www.npmjs.com/package/@tabstack/ai)
- [Get an API key](https://console.tabstack.ai/signup)

---

- All integrations: https://tabstack.ai/integrations
- Agent quickstart, every endpoint in one file: https://tabstack.ai/agents.md
- Full documentation: https://docs.tabstack.ai/