# Introduction

A shadcn-style registry of complete, production-ready AI agent recipes. Copy, paste, ship.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



**agentcn** is a registry of complete, production-ready agent recipes. It is **not** a UI component registry — each recipe distributes the
backend agent files (instructions, tools, skills, workflows) that you copy
straight into your project with the [shadcn CLI](https://ui.shadcn.com).

## Philosophy [#philosophy]

agentcn follows the shadcn model for backend agents: copy-paste recipes you can
own, with zero lock-in and sensible defaults that work immediately.

Agents are too often shipped as opaque packages — you import a black box and
fight its constraints the moment you need something different. agentcn takes the
opposite approach. You get the full source of each agent and stay close to your
framework's primitives, so you can read every line, swap the model, extend the
tools, or reshape the output without working around a library.

## Why agentcn? [#why-agentcn]

Most agent setups are either too opinionated or too scattered. agentcn is built
for teams that want to ship quickly without giving up control:

* **Own Your Code:** Copy recipes into your project and customize everything.
* **Start Fast:** Run one command and get a working agent with production-ready
  defaults.
* **Scale Safely:** Build on Eve or Flue directly, then drop to the raw
  framework APIs whenever you need more control.

## Frameworks [#frameworks]

Every recipe ships in both flavors where it makes sense, so you can adopt the
pattern in whichever framework you already use:

* **[Eve](https://vercel.com/docs/eve)** — a filesystem-first framework for
  durable backend AI agents that run on Vercel Functions.
* **[Flue](https://flueframework.com)** — an agent runtime with first-class
  subagents, skills, and bounded workflows.
* **[Mastra](https://mastra.ai)** — an agent framework with built-in tools,
  memory, and workflow orchestration.
* **[LangGraph](https://www.langchain.com/langgraph)** — LangGraph agents built with Dawn,
  a meta-framework that discovers agents, tools, and skills automatically via
  `dawn.config.ts`.

## Features [#features]

<div className="not-prose grid gap-4 sm:grid-cols-2 mt-4">
  <FeatureCard icon="ZapIcon" title="Zero Config" description="Works out of the box with sensible defaults. No boilerplate needed." />

  <FeatureCard icon="SunMoonIcon" title="Framework Native" description="Uses your framework's built-in primitives — no extra abstractions." />

  <FeatureCard icon="LayoutGridIcon" title="Composable" description="Combine agents, tools, and workflows into complex pipelines." />

  <FeatureCard icon="Code2Icon" title="TypeScript" description="Full type safety with comprehensive TypeScript support." />

  <FeatureCard icon="ClipboardCopyIcon" title="Copy & Paste" description="Own your code. No runtime dependencies, just install into your project." />

  <FeatureCard icon="BlocksIcon" title="shadcn Compatible" description="Uses the same registry format — add components with npx shadcn add." />
</div>



# Installation

Install an agent recipe into your Eve, Flue, Mastra, or LangGraph (Dawn) project.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



## Prerequisites [#prerequisites]

Complete these before running the install command.

**1. An agent project.** Start from an existing one or scaffold a new project:

* **Eve** — `npx eve@latest init my-agent` ([docs](https://vercel.com/docs/eve)).
  Recipes install under `agent/`, which Eve discovers automatically.
* **Flue** — `npx flue@latest init my-agent` ([docs](https://flueframework.com)).
  Recipes install under `agents/`, `workflows/`, `tools/`, and `skills/`.
* **Mastra** — `npx create-mastra@latest` ([docs](https://mastra.ai)).
  Recipes install under `src/mastra/agents/<name>/`, which Mastra discovers automatically.
* **LangGraph (Dawn)** — `npx dawn init my-agent` ([docs](https://dawn-ai.dev)).
  Recipes install under the project root alongside `dawn.config.ts`. Dawn is the
  meta-framework that discovers LangGraph agents, tools, and skills automatically.

**2. The framework package.** Each recipe declares its framework package (`eve`,
`@flue/runtime`, `@mastra/core`, or `@dawn-ai/sdk`) as a dependency, so the
shadcn CLI prompts to install it if it is missing.

**3. Environment variables.** Some recipes call external services and need
secrets set in your project's environment — for example `BRIGHTDATA_API_KEY` for
web search, `WORKSPACE_DIR` for the sandboxed assistant, or a database URL for the
SQL recipe. The required keys are documented in each recipe's tools and
instructions; add them to your `.env` before invoking the agent.

**4. Live preview (optional).** To run a recipe's preview from this docs site,
set `ANTHROPIC_API_KEY`. The Eve preview can additionally proxy a deployed Eve
instance via `EVE_PREVIEW_URL` — see the
[Preview Backend](https://github.com/shadcn-labs/agentcn#preview-backend) notes.

## Add a Recipe [#add-a-recipe]

From your project root, run the install command shown on the recipe's page. For
example, the [Deep Search](/docs/agents/eve/deep-search) agent:

### Eve [#eve]

```bash
npx shadcn@latest add @agentcn/eve/deep-search
```

### Flue [#flue]

```bash
npx shadcn@latest add @agentcn/flue/deep-search
```

### Mastra [#mastra]

```bash
npx shadcn@latest add @agentcn/mastra/deep-search
```

### LangGraph (Dawn) [#langgraph-dawn]

```bash
npx shadcn@latest add @agentcn/langgraph/deep-search
```

The CLI writes the recipe's files into your project at their target paths — for
Eve, under `agent/`; for Flue, under `agents/`, `workflows/`, `tools/`, and
`skills/`; for Mastra, under `src/mastra/agents/<name>/` with `config.ts`,
`instructions.md`, and `tools/*.ts`; for LangGraph (Dawn), under the project root
with `index.ts`, `instructions.md`, `tools/`, and `subagents/`. Your framework
discovers them automatically.

Prefer short names like `@agentcn/eve/deep-search`? Register the namespace once —
see [Registry](/docs/registry).

## Customize [#customize]

The installed files are plain source — you own them. Common changes:

* **Swap the model** in the agent definition.
* **Extend the tools** by adding files alongside the installed ones.
* **Reshape the output** schema to capture the fields you care about.

See each recipe's **Customization** section for specifics.

## Usage [#usage]

Start your project's dev server (for example `pnpm dev`) and invoke the agent
through your framework — Eve exposes it through a durable session, Flue through
its route handler, Dawn via `dawn dev`. You can also try any recipe before
installing it using the **live preview** embedded in its docs page.


# MCP

Use the shadcn MCP server to discover and install agentcn recipes from your editor.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



[MCP](https://modelcontextprotocol.io/) is an open protocol that standardizes how
applications provide context to LLMs. The shadcn CLI can register an MCP server
so your editor can discover registry items — including the agent recipes you
install from **agentcn** via the same CLI.

## Configure MCP [#configure-mcp]

Run:

```bash
npx shadcn@latest mcp init
```

Choose your MCP client when prompted, then enable the MCP server in that client
to finish setup.

To resolve recipes by short name (`@agentcn/eve/deep-search`), add the namespace
to `components.json` first — see [Registry](/docs/registry).

## Usage [#usage]

With MCP enabled, ask your editor to scaffold and install agent recipes, then
wire them into your project. Example prompts:

* Add the **Deep Search** recipe for Eve and set up the `BRIGHTDATA_API_KEY` it needs.
* Install the **Chat with PDF** recipe for Flue and show me how to call it.
* Build a Slack bot from the **Slack Agent** recipe and explain the approval flow.
* Set up the **Chat with Database** recipe and point it at my Postgres schema.
* Compare the Eve and Flue versions of the **GitHub PR Review** recipe.
* Install the **Deep Search** recipe for Mastra and configure the tools.

Install recipes with `npx shadcn@latest add @agentcn/<framework>/<recipe>` — see
[Registry](/docs/registry) for details. This site also
exposes [`llms.txt`](/llms.txt) and an [API catalog](/.well-known/api-catalog)
for agents that prefer to browse the registry directly.


# Registry

Use the agentcn registry with the shadcn CLI.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



The **agentcn** registry ships complete Eve, Flue, Mastra, and LangGraph (Dawn)
agent recipes in the [shadcn registry format](https://ui.shadcn.com/docs/registry).
Each item bundles everything one recipe needs — the agent definition, instructions,
tools, skills, and workflows. Register the namespace once in `components.json`,
then pull recipes by name with the CLI.

## Setup [#setup]

Add a **registries** entry pointing at this site. See the
[shadcn registry documentation](https://ui.shadcn.com/docs/registry) for every
`components.json` field and behavior.

```json
{
  "registries": {
    "@agentcn": "https://agentcn.vercel.app/r/{name}.json"
  }
}
```

You can replace `@agentcn` with another namespace; it only needs to match what
you pass to `shadcn add`.

## Usage [#usage]

Recipe names are `<framework>/<slug>` — the same path as the JSON file under
`/r/` (without the `.json` extension). Install with the namespace and the recipe
name:

```bash
# Eve
npx shadcn@latest add @agentcn/eve/deep-search
```

```bash
# Flue
npx shadcn@latest add @agentcn/flue/deep-search
```

```bash
# Mastra
npx shadcn@latest add @agentcn/mastra/deep-search
```

```bash
# LangGraph (Dawn)
npx shadcn@latest add @agentcn/langgraph/deep-search
```

Without a registry alias, use the full URL shown on each recipe page:

```bash
npx shadcn@latest add https://agentcn.vercel.app/r/eve/deep-search.json
```

## Browse the registry [#browse-the-registry]

The registry index lists every recipe and the framework it ships for:

```bash
curl https://agentcn.vercel.app/r/registry.json
```

Browse the catalog in the [Agents](/docs/agents) section, or follow the
[Installation](/docs/installation) guide for the one-time project setup.


# Agents

Here you can find all the agent-recipes available in the library.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<AgentsList />


# June 20, 2026 - Initial Release

17 agent recipes for Eve and Flue.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).





We shipped the initial release of agentcn with 17 agent recipes for both Eve and Flue.

<div className="mt-6 flex w-full items-center justify-center gap-4 rounded-lg border bg-muted/50 py-32">
  <EveIcon className="h-8 w-auto" />

  <PlusIcon className="size-8 text-muted-foreground" />

  <FlueIcon className="h-12 w-auto" />
</div>


# June 23, 2026 - Bright Data Integration

Bright Data is now the default provider for the Browser, Deep Search, and Chat with YouTube agents.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



Bright Data joins agentcn as a gold sponsor.

<div className="mt-6 flex w-full items-center justify-center rounded-lg border border-sponsor-gold-slot-border bg-sponsor-gold-slot-bg py-32">
  <img src="/sponsors/brightdata-light.svg" alt="Bright Data" className="h-12 w-auto dark:hidden" />

  <img src="/sponsors/brightdata-dark.svg" alt="Bright Data" className="hidden h-12 w-auto dark:block" />
</div>

We made [Bright Data](https://get.brightdata.com/zdgqtwgnmhkw) the default provider for the Browser, Deep Search, and Chat with YouTube agents — real-time SERP results, the Web Unlocker, and a managed anti-bot browser, all configured through `BRIGHTDATA_*` environment variables.


# June 25, 2026 - AI SEO Audit and Extract DESIGN.md

Two new context.dev-powered agent recipes for Eve and Flue.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



Two new context.dev-powered agent recipes, each shipped for both Eve and Flue, bringing the catalog to 19.

**What's New:**

* **AI SEO Audit** — fetches a page through context.dev and scores its readability to AI answer engines (ChatGPT, Claude, Perplexity) across six categories, returning the failing checks and a copy-paste, agent-ready fix prompt.
* **Extract DESIGN.md** — pulls a site's design tokens, brand assets, screenshot, and page Markdown through context.dev and composes a self-contained `DESIGN.md` design-system document.
* Both recipes wire into the catalog, docs, and live previews, and add the `CONTEXT_DEV_API_KEY` environment variable.


# July 4, 2026 - Mastra Support

19 Mastra agent recipes added to the registry.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).





We've added Mastra as a supported framework, bringing the total to 57 agent recipes across Eve, Flue, and Mastra.

<div className="mt-6 flex w-full items-center justify-center rounded-lg border bg-muted/50 py-32">
  <MastraIcon className="size-12" />
</div>

Mastra is a TypeScript framework for building AI agents with support for workflows, RAG, memory, and tool-calling. Today, we're adding complete support for Mastra's file-based agent convention.

### What's New [#whats-new]

* **19 Mastra agents** - Every recipe from the catalog is now available for Mastra: `ai-seo-audit`, `browser-agent`, `chat-with-pdf`, `chat-with-youtube`, `claw`, `company-knowledge`, `csv-to-questions`, `deep-search`, `docs-chatbot`, `docs-expert`, `extract-design-md`, `feedback-summary`, `flashcards-pdf`, `github-review`, `google-sheets`, `meeting-notes`, `slack-agent`, `text-to-sql`, and `weather`.
* **File-based agent pattern** - All agents follow Mastra's convention with `config.ts`, `instructions.md`, `tools/*.ts`, `memory.ts`, and `workflows/` where applicable.
* **Production-ready** - Agents include proper tooling, memory, workflows, and subagents matching official Mastra template repos.

### Installation [#installation]

Install any Mastra agent with the shadcn CLI:

```bash
npx shadcn@latest add @agentcn/mastra/weather
```

Or copy the files manually:

```bash
npm install @mastra/core @mastra/libsql @mastra/memory
```

### File-Based Convention [#file-based-convention]

Mastra agents use a file-based convention where each option maps to a file:

```text
agents/weather/
├── config.ts          # Model and agent config (uses agentConfig())
├── instructions.md    # Agent instructions
├── memory.ts          # Memory instance
├── tools/
│   └── get_weather.ts # Tool definition (default export)
└── workflows/
    └── weather.ts     # Workflow definition
```

```tsx
// config.ts - Uses agentConfig() from @mastra/core/agent
import { agentConfig } from "@mastra/core/agent";

export default agentConfig({
  model: "openai/gpt-5.2",
});
```

### Switching Frameworks [#switching-frameworks]

Use the framework switcher on any agent page to see the Eve, Flue, and Mastra versions side by side. The agents work the same way — only the implementation changes.

<Button size="sm">
  <Link href="/docs/agents/mastra" className="mt-6 no-underline!">
    Browse Mastra Agents
  </Link>
</Button>


# July 9, 2026 - LangGraph Support

19 LangGraph agent recipes added to the registry, built with Dawn as the meta-framework.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).





We've added LangGraph as a supported framework, built with [Dawn](https://dawn-ai.dev) as the meta-framework — bringing the total to 76 agent recipes across four frameworks.

<div className="mt-6 flex w-full items-center justify-center rounded-lg border bg-muted/50 py-32">
  <LangGraphIcon className="size-12" />
</div>

[LangGraph](https://www.langchain.com/langgraph) is a low-level orchestration framework for building controllable agents as graphs. It provides customizable architectures, long-term memory, and human-in-the-loop to reliably handle complex tasks.

### What's New [#whats-new]

* **19 LangGraph agents** - Every recipe from the catalog is now available for LangGraph: `ai-seo-audit`, `browser-agent`, `chat-with-pdf`, `chat-with-youtube`, `claw`, `company-knowledge`, `csv-to-questions`, `deep-search`, `docs-chatbot`, `docs-expert`, `extract-design-md`, `feedback-summary`, `flashcards-pdf`, `github-review`, `google-sheets`, `meeting-notes`, `slack-agent`, `text-to-sql`, and `weather`.
* **Dawn meta-framework** - Agents use `@dawn-ai/sdk` and follow Dawn's file convention with `index.ts`, `instructions.md`, `tools/`, and `subagents/` where applicable.
* **Production-ready** - Agents include proper tooling, skills, and subagents matching LangGraph best practices.

### Installation [#installation]

Install any LangGraph agent with the shadcn CLI:

```bash
npx shadcn@latest add @agentcn/langgraph/weather
```

Or copy the files manually:

```bash
npm install @dawn-ai/sdk
```

### Dawn File Convention [#dawn-file-convention]

LangGraph agents built with Dawn use a file-based convention:

```text
weather/
├── index.ts              # Agent definition (model + config)
├── instructions.md       # Agent instructions
└── tools/
    └── get_weather.ts    # Tool definition
```

```ts
// index.ts
import { agent } from "@dawn-ai/sdk";

export default agent({
  model: "anthropic/claude-sonnet-4-6",
  description: "Looks up the current weather for a location.",
});
```

After copying, run `dawn check` to regenerate route and tool metadata. Use `dawn dev`, `dawn build`, and `dawn verify` for the full workflow.

### Switching Frameworks [#switching-frameworks]

Use the framework switcher on any agent page to see the Eve, Flue, Mastra, and LangGraph versions side by side. The agents work the same way — only the implementation changes.

<Button size="sm">
  <Link href="/docs/agents/langgraph" className="mt-6 no-underline!">
    Browse LangGraph Agents
  </Link>
</Button>


# Changelog

Latest updates and announcements for agentcn.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



## July 2026 - LangGraph Support [#july-2026---langgraph-support]

We added 19 LangGraph agent recipes built with Dawn as the meta-framework, bringing the catalog to 76 recipes across four frameworks. LangGraph recipes use Dawn's file convention (`index.ts` + `instructions.md` + `tools/*.ts`).

## July 2026 - Mastra Framework Support [#july-2026---mastra-framework-support]

We added 19 Mastra agent recipes to the registry, bringing the catalog to 57 recipes across three frameworks. Mastra recipes use the file-based agent convention (`config.ts` + `instructions.md` + `tools/*.ts`).

## June 2026 - Initial Release [#june-2026---initial-release]

We shipped the initial release of agentcn with 19 agent recipes for both Eve and Flue.


# AI SEO Audit

Runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total, returning failing checks and an agent-ready fix prompt.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="ai-seo-audit" />

<AgentPreview
  agent="ai-seo-audit"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Page URL&#x22;,
    placeholder: &#x22;https://example.com/blog/how-it-works&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **AI SEO Audit Agent** evaluates a page for how readable it is to AI answer
engines — ChatGPT, Claude, and Perplexity — rather than classic blue-link
search. It fetches the page through context.dev (never touching the site
directly), then runs a **deterministic rubric** of \~30 checks across six
categories to a 0–100 total. The model doesn't eyeball the score — `audit_page`
computes it in `agent/lib/rules.ts`, so the same page always yields the same
result. The agent presents the breakdown, lists the failing checks by impact,
and returns an **agent-ready fix prompt** you can paste straight into a coding
agent. Reach for it when you want a page to get cited by AI assistants.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/ai-seo-audit
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve context.dev
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/ai-seo-audit/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/tools/audit_page.ts" title="agent/tools/audit_page.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/lib/audit.ts" title="agent/lib/audit.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/lib/rules.ts" title="agent/lib/rules.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/lib/agent-fix-prompt.ts" title="agent/lib/agent-fix-prompt.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/lib/audit-types.ts" title="agent/lib/audit-types.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/lib/url.ts" title="agent/lib/url.ts" />

      <ComponentSource src="registry/eve/ai-seo-audit/agent/skills/seo-audit/SKILL.md" title="agent/skills/seo-audit/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts              # Agent definition (model + config)
├── instructions.md       # Audit-and-report instructions
├── tools/
│   └── audit_page.ts     # Runs the deterministic audit, returns the scored result
├── lib/
│   ├── audit.ts          # Fetches via context.dev, parses, and scores the rules
│   ├── rules.ts          # The ~30 checks and six category weights
│   ├── agent-fix-prompt.ts # Builds the copy-paste fix prompts from the findings
│   ├── audit-types.ts    # Shared result types
│   └── url.ts            # URL normalization helpers
└── skills/
    └── seo-audit/
        └── SKILL.md      # How the agent presents the audit_page result
```

## Customization [#customization]

* **Fetching.** The page is fetched through [context.dev](https://context.dev) —
  the recipe never hits the audited site directly. Set `CONTEXT_DEV_API_KEY`.
* **Tune the rubric.** Edit `agent/lib/rules.ts` to add checks, reweight
  categories, or change the scoring bands — this is the single source of truth
  for the score.
* **Reshape the output.** Edit `agent/instructions.md` or `SKILL.md` to emit
  JSON, a shorter summary, or a different fix-prompt format.
* **Swap the model.** Edit `agent/agent.ts`. The model only narrates the
  deterministic result, so any capable model works.


# Browser

Drives a real browser with Playwright using a snapshot-and-selector pattern to complete web tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="browser-agent" />

<AgentPreview
  agent="browser-agent"
  framework="eve"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder:
      &#x22;Go to news.ycombinator.com and list the top 3 story titles.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Browser Agent** completes tasks on the live web by driving a real Chromium
browser. It uses a snapshot-and-selector loop — the model sees a stable list of
interactive elements instead of brittle CSS — to navigate, click, and type. Reach
for it to automate flows, scrape interactive pages, or test UIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/browser-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve playwright
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/browser-agent/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/browser-agent/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/browser-agent/agent/lib/browser.ts" title="agent/lib/browser.ts" />

      <ComponentSource src="registry/eve/browser-agent/agent/tools/browser_goto.ts" title="agent/tools/browser_goto.ts" />

      <ComponentSource src="registry/eve/browser-agent/agent/tools/browser_snapshot.ts" title="agent/tools/browser_snapshot.ts" />

      <ComponentSource src="registry/eve/browser-agent/agent/tools/browser_click.ts" title="agent/tools/browser_click.ts" />

      <ComponentSource src="registry/eve/browser-agent/agent/tools/browser_type.ts" title="agent/tools/browser_type.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts                  # Agent definition (model + config)
├── instructions.md           # Snapshot-then-act loop instructions
├── lib/
│   └── browser.ts            # Shared Playwright page + snapshot helper
└── tools/
    ├── browser_goto.ts       # Navigate to a URL
    ├── browser_snapshot.ts   # Read the current page + elements
    ├── browser_click.ts      # Click an element by selector
    └── browser_type.ts       # Type into an input by selector
```

## Customization [#customization]

* **Managed remote browser.** `lib/browser.ts` connects to the [Bright Data
  Browser API](https://docs.brightdata.com/scraping-automation/scraping-browser) —
  a managed, anti-bot-resistant Chromium with no local infra. Set
  `BRIGHTDATA_BROWSER_AUTH` to your zone `username:password`, or point
  `BROWSER_CDP_URL` at any other CDP endpoint. With neither set it falls back to
  local Chromium for development.
* **Richer snapshots.** Extend `lib/browser.ts` to include roles, ARIA, or
  bounding boxes.
* **Add actions.** Add tools for scrolling, file uploads, or screenshots.
* **Swap the model.** Edit `agent/agent.ts`.


# Chat with PDF

Indexes a PDF into a vector store and answers questions over it with page-cited retrieval.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="chat-with-pdf" />

<AgentPreview
  agent="chat-with-pdf"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/whitepaper.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What does the paper conclude about latency?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with PDF Agent** lets you ask questions about a PDF and get answers
grounded in the document, with a page citation for every claim. It indexes the
PDF into a vector store, retrieves only the relevant chunks per question, and can
also generate comprehension quizzes from real passages. Reach for it to turn
manuals, papers, and reports into something you can query.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/chat-with-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve @libsql/client @ai-sdk/openai ai unpdf
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/chat-with-pdf/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/chat-with-pdf/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/chat-with-pdf/agent/lib/vector-store.ts" title="agent/lib/vector-store.ts" />

      <ComponentSource src="registry/eve/chat-with-pdf/agent/tools/index_pdf.ts" title="agent/tools/index_pdf.ts" />

      <ComponentSource src="registry/eve/chat-with-pdf/agent/tools/search_docs.ts" title="agent/tools/search_docs.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts              # Agent definition (model + config)
├── instructions.md       # Retrieval-grounded answering instructions
├── lib/
│   └── vector-store.ts   # libSQL vector store + embeddings helpers
└── tools/
    ├── index_pdf.ts      # Chunk, embed, and store a PDF
    └── search_docs.ts    # Retrieve relevant chunks for a query
```

## Customization [#customization]

* **Swap the vector store.** `lib/vector-store.ts` wraps libSQL — replace it with
  Pinecone, Qdrant, Chroma, or pgvector behind the same `upsertChunks`/`search`
  functions.
* **Tune chunking.** Adjust `chunkText`'s size and overlap for your documents.
* **Swap the embedding model.** Change the model in `lib/vector-store.ts`.
* **Add quizzes.** The instructions already support quiz generation from
  retrieved passages — extend them with your preferred format.


# Chat with YouTube

Fetches a video's metadata and transcript, then answers questions with clickable timestamp citations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="chat-with-youtube" />

<AgentPreview
  agent="chat-with-youtube"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;YouTube URL&#x22;,
    placeholder: &#x22;https://youtu.be/dQw4w9WgXcQ&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Summarize the video with chapter timestamps.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with YouTube Agent** answers questions about a video using its
transcript. It pulls the video's metadata and full transcript, then summarizes,
answers follow-ups, and generates chapter timestamps — each citation a clickable
link straight to that moment. Reach for it to skim long talks, lectures, or
podcasts without watching end to end.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/chat-with-youtube
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/chat-with-youtube/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/chat-with-youtube/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/chat-with-youtube/agent/lib/brightdata.ts" title="agent/lib/brightdata.ts" />

      <ComponentSource src="registry/eve/chat-with-youtube/agent/tools/video_metadata.ts" title="agent/tools/video_metadata.ts" />

      <ComponentSource src="registry/eve/chat-with-youtube/agent/tools/get_transcript.ts" title="agent/tools/get_transcript.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts                # Agent definition (model + config)
├── instructions.md         # Transcript-grounded answering instructions
├── lib/
│   └── brightdata.ts       # Web Unlocker fetch + YouTube parsing helpers
└── tools/
    ├── video_metadata.ts   # Title / author / id via oEmbed
    └── get_transcript.ts   # Timestamped transcript segments
```

## Customization [#customization]

* **Reliable fetching.** Metadata and transcripts are pulled through the [Bright
  Data Web Unlocker](https://docs.brightdata.com/scraping-automation/web-unlocker),
  which handles YouTube at scale with no rate limits or blocks. Set
  `BRIGHTDATA_API_KEY` (and optionally `BRIGHTDATA_UNLOCKER_ZONE`).
* **Add chapters export.** Add a tool that writes the chapter list back as a
  YouTube description or VTT file.
* **Handle missing transcripts.** Fall back to an STT service when a video has no
  captions.
* **Swap metadata source.** Use the YouTube Data API for richer metadata.
* **Swap the model.** Edit `agent/agent.ts`.


# Claw Autonomous Assistant

Operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="claw" />

<AgentPreview
  agent="claw"
  framework="eve"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder: &#x22;Scaffold a Vite + React app in ./app and run the build.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

**Claw** is an autonomous assistant that operates a sandboxed workspace to finish
multi-step tasks. It reads and writes files, runs shell commands scoped to a
workspace directory, and follows reusable skills. Reach for it as a base for
coding assistants, repo automation, or any agent that needs a real filesystem.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/claw
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/claw/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/claw/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/claw/agent/lib/workspace.ts" title="agent/lib/workspace.ts" />

      <ComponentSource src="registry/eve/claw/agent/tools/read_file.ts" title="agent/tools/read_file.ts" />

      <ComponentSource src="registry/eve/claw/agent/tools/write_file.ts" title="agent/tools/write_file.ts" />

      <ComponentSource src="registry/eve/claw/agent/tools/run_shell.ts" title="agent/tools/run_shell.ts" />

      <ComponentSource src="registry/eve/claw/agent/skills/workspace/SKILL.md" title="agent/skills/workspace/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Autonomous, sandbox-safe instructions
├── lib/
│   └── workspace.ts     # Sandbox root + path guard
├── tools/
│   ├── read_file.ts     # Read a workspace file
│   ├── write_file.ts    # Write a workspace file
│   └── run_shell.ts     # Run a command in the workspace
└── skills/
    └── workspace/
        └── SKILL.md     # Plan / inspect / act / verify procedure
```

## Customization [#customization]

* **Harden the sandbox.** Run `run_shell` inside a container or jail; the path
  guard only constrains file paths, not arbitrary commands.
* **Add web browsing.** Pair with the [Browser Agent](/docs/agents/eve/browser-agent)
  tools for tasks that need the web.
* **Add skills.** Drop more `SKILL.md` procedures under `skills/`.
* **Swap the model.** Edit `agent/agent.ts`.


# Company Knowledge

Indexes internal documents into a vector store and answers questions over them, with PII redaction.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="company-knowledge" />

<AgentPreview
  agent="company-knowledge"
  framework="eve"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What's our policy on refund requests over $500?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Company Knowledge Agent** answers questions over your internal documents —
issues, wiki pages, notes. It indexes them into a vector store, searches the
corpus first, and redacts personal data (emails, phone numbers, SSNs, card
numbers, API keys) from responses. Reach for it to build an internal "ask the
company" assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/company-knowledge
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve @libsql/client @ai-sdk/openai ai
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/company-knowledge/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/company-knowledge/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/company-knowledge/agent/lib/pii.ts" title="agent/lib/pii.ts" />

      <ComponentSource src="registry/eve/company-knowledge/agent/lib/vector-store.ts" title="agent/lib/vector-store.ts" />

      <ComponentSource src="registry/eve/company-knowledge/agent/tools/index_document.ts" title="agent/tools/index_document.ts" />

      <ComponentSource src="registry/eve/company-knowledge/agent/tools/search_knowledge.ts" title="agent/tools/search_knowledge.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts                 # Agent definition (model + config)
├── instructions.md          # Corpus-first, PII-safe instructions
├── lib/
│   ├── pii.ts               # PII redaction helper
│   └── vector-store.ts      # libSQL vector store + embeddings
└── tools/
    ├── index_document.ts    # Add a document to the corpus
    └── search_knowledge.ts  # Search the corpus (redacted)
```

## Customization [#customization]

* **Connect sources.** Feed `index_document` from Linear, Notion, or your wiki —
  on a schedule for fresh data.
* **Swap the vector store.** Replace `lib/vector-store.ts` with pgvector/Neon,
  Pinecone, or Qdrant.
* **Tune redaction.** Edit the patterns in `lib/pii.ts` for your data.
* **Swap the model.** Edit `agent/agent.ts`.


# CSV to Questions

Summarizes a CSV dataset to stay within token limits, then generates focused analytical questions.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="csv-to-questions" />

<AgentPreview
  agent="csv-to-questions"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;CSV URL&#x22;,
    placeholder: &#x22;https://example.com/world-gdp.csv&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **CSV to Questions Agent** takes a CSV dataset and turns it into a set of
sharp, answerable analytical questions. It first summarizes the data — columns,
types, ranges, patterns — to compress large files and avoid token-limit errors,
then generates questions a data analyst would actually ask. Reach for it to
kickstart exploratory analysis or build study material from raw data.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/csv-to-questions
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/csv-to-questions/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/csv-to-questions/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/csv-to-questions/agent/tools/fetch_csv.ts" title="agent/tools/fetch_csv.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts            # Agent definition (model + config)
├── instructions.md     # Summarize-then-question instructions
└── tools/
    └── fetch_csv.ts    # Loads a CSV file from a URL
```

## Customization [#customization]

* **Read local files.** Swap `fetch_csv` to read from disk or object storage
  instead of a URL.
* **Control the question style.** Edit `instructions.md` to bias toward trends,
  comparisons, or hypothesis tests.
* **Swap the model.** Edit `agent/agent.ts`. A large-context model handles wide
  datasets without truncation.
* **Chunk huge files.** Summarize in row batches and merge the profiles before
  generating questions.


# Deep Search

Researches a question, evaluates its own findings, and iterates until the answer is complete and cited.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="deep-search" />

<AgentPreview
  agent="deep-search"
  framework="eve"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Research question&#x22;,
    placeholder:
      &#x22;What pricing models do the top 3 observability vendors use?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Deep Search Agent** takes a research question, searches the web, and then
critiques its own findings — re-searching to close gaps until the question is
fully answered. It returns an answer grounded only in the sources it found, with
a citation for every claim. Reach for it whenever a single search isn't enough
and you need a verified, sourced answer.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/deep-search
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/deep-search/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/deep-search/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/deep-search/agent/tools/web_search.ts" title="agent/tools/web_search.ts" />

      <ComponentSource src="registry/eve/deep-search/agent/skills/research/SKILL.md" title="agent/skills/research/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts              # Agent definition (model + config)
├── instructions.md       # Self-evaluating research instructions
├── tools/
│   └── web_search.ts     # Web search via the Bright Data SERP API
└── skills/
    └── research/
        └── SKILL.md      # Iterative research procedure
```

## Customization [#customization]

* **Search provider.** Searches run through the [Bright Data SERP
  API](https://docs.brightdata.com/scraping-automation/serp-api) — real-time,
  unblocked results billed per successful request. Set `BRIGHTDATA_API_KEY` (and
  optionally `BRIGHTDATA_SERP_ZONE`). Edit `agent/tools/web_search.ts` to point
  at a different provider — keep the input/output shape.
* **Bound the iterations.** Add a max-rounds guard in `instructions.md` so the
  agent stops after N search rounds.
* **Swap the model.** Edit `agent/agent.ts` — `anthropic/claude-sonnet-4-6` for
  deeper synthesis, `anthropic/claude-haiku-4-5` for speed.
* **Add scraping.** Add a `scrape_url` tool so the agent can read full pages, not
  just search snippets.


# Docs Chatbot

Answers questions about a library's functions by looking up structured documentation.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="docs-chatbot" />

<AgentPreview
  agent="docs-chatbot"
  framework="eve"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Tell me about the getPlanetaryData function.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Chatbot Agent** answers questions about a code library's API. It looks
up structured function documentation — signatures, parameters, and examples — and
answers using only what the docs say. Reach for it to drop a grounded "ask the
docs" assistant into a docs site, an IDE, or a support channel.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/docs-chatbot
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/docs-chatbot/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/docs-chatbot/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/docs-chatbot/agent/data/functions.json" title="agent/data/functions.json" />

      <ComponentSource src="registry/eve/docs-chatbot/agent/tools/lookup_docs.ts" title="agent/tools/lookup_docs.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Docs-grounded answering instructions
├── data/
│   └── functions.json   # Sample documentation source
└── tools/
    └── lookup_docs.ts   # Looks up functions by name or keyword
```

## Customization [#customization]

* **Point at your docs.** Replace `data/functions.json` with your generated API
  docs (e.g. from TypeDoc), or change `lookup_docs` to fetch from a remote source.
* **Improve matching.** Swap the substring filter for embeddings-based search to
  handle paraphrased questions.
* **Expose it as MCP.** Wrap `lookup_docs` in an MCP server so other clients can
  query the same docs.
* **Swap the model.** Edit `agent/agent.ts`.


# Docs Expert

Answers questions about libraries and APIs by searching the live web and citing sources.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="docs-expert" />

<AgentPreview
  agent="docs-expert"
  framework="eve"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;How do I stream responses with the Vercel AI SDK?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Expert Agent** answers technical questions about libraries, APIs, and
tools by searching the live web — preferring official documentation and citing
every claim. Reach for it as a grounded "ask the docs" helper that returns
copy-pasteable answers instead of hallucinated APIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/docs-expert
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/docs-expert/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/docs-expert/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/docs-expert/agent/tools/web_search.ts" title="agent/tools/web_search.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts            # Agent definition (model + config)
├── instructions.md     # Cite-your-sources answering instructions
└── tools/
    └── web_search.ts   # Web search via the Exa API
```

## Customization [#customization]

* **Swap the search provider.** Edit `web_search.ts` for Brave, Tavily, or a
  docs-specific index.
* **Constrain to your docs.** Restrict queries to a domain to build a
  product-specific expert.
* **Add page fetching.** Add a `scrape_url` tool so the agent reads full pages.
* **Swap the model.** Edit `agent/agent.ts`.


# Extract DESIGN.md

Turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing the document in a single Claude call.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="extract-design-md" />

<AgentPreview
  agent="extract-design-md"
  framework="eve"
  inputFields="[
  {
    name: &#x22;domain&#x22;,
    label: &#x22;Domain&#x22;,
    placeholder: &#x22;stripe.com&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Extract DESIGN.md Agent** turns any public website into design artifacts.
The `compose_design_md` tool gathers the styleguide, brand, a homepage
screenshot, and clean page Markdown through context.dev, then returns **three
outputs**, which the agent relays verbatim:

* **DESIGN.md** — composed in **one Claude call** (screenshot passed as
  a vision image): token frontmatter (`version: alpha`, colors, typography,
  rounded, spacing, components) plus the canonical sections (Overview, Colors,
  Typography, Layout, Elevation, Shapes, Components, Do's and Don'ts).
* **Tailwind v4 `@theme` block** — derived **deterministically** from the
  styleguide + brand in `agent/lib/derive-tokens.ts`.
* **CSS `:root` tokens** — the same tokens as vanilla CSS variables.

It follows the [designmd.supply](https://designmd.supply) pipeline — the same
prompt spec and deterministic token derivers — running on Claude.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/extract-design-md
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve context.dev ai @ai-sdk/anthropic
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/extract-design-md/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/extract-design-md/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/extract-design-md/agent/tools/compose_design_md.ts" title="agent/tools/compose_design_md.ts" />

      <ComponentSource src="registry/eve/extract-design-md/agent/lib/compose.ts" title="agent/lib/compose.ts" />

      <ComponentSource src="registry/eve/extract-design-md/agent/lib/design-md.ts" title="agent/lib/design-md.ts" />

      <ComponentSource src="registry/eve/extract-design-md/agent/lib/derive-tokens.ts" title="agent/lib/derive-tokens.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts              # Agent definition (model + config)
├── instructions.md       # Call compose_design_md, relay all three artifacts
├── tools/
│   └── compose_design_md.ts  # Returns DESIGN.md + Tailwind + CSS
└── lib/
    ├── compose.ts        # Fetches signals; Claude call + token derivers
    ├── design-md.ts      # The verbatim DESIGN.md prompt spec
    └── derive-tokens.ts  # Deterministic Tailwind v4 @theme + CSS :root tokens
```

## Customization [#customization]

* **Data source.** The styleguide, screenshot, and Markdown are pulled through
  [context.dev](https://context.dev). Set `CONTEXT_DEV_API_KEY`, and
  `ANTHROPIC_API_KEY` for the model call.
* **Reshape the document.** Edit `agent/lib/design-md.ts` — the prompt spec is
  the single source of truth for the frontmatter keys, token names, and sections.
* **Swap the model.** Change the model in `agent/lib/compose.ts` — it uses
  `claude-sonnet-4-6` (vision-capable). The reference uses `gpt-5.4-mini`; any
  multimodal model that can read the screenshot works.
* **Temperature.** Adjust `temperature` in `agent/lib/compose.ts` (the reference
  uses `0.2`) to trade determinism for variety.


# Customer Feedback Summary

Retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="feedback-summary" />

<AgentPreview
  agent="feedback-summary"
  framework="eve"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;What are the critical issues from enterprise customers?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Customer Feedback Summary Agent** answers questions about your customer
feedback. It retrieves entries from your data source, categorizes them by theme
and segment, and produces an executive summary with representative quotes and
concrete recommendations. Reach for it to turn a backlog of reviews, tickets, or
survey responses into something a team can act on.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/feedback-summary
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/feedback-summary/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/feedback-summary/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/feedback-summary/agent/tools/get_feedback.ts" title="agent/tools/get_feedback.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Retrieve / categorize / summarize instructions
└── tools/
    └── get_feedback.ts  # Paginated feedback retrieval
```

## Customization [#customization]

* **Connect your source.** Point `get_feedback` at your database, support desk,
  or reviews API — keep the pagination + segment parameters.
* **Change the categories.** Edit `instructions.md` to use your own taxonomy
  (severity tiers, product areas, sentiment).
* **Swap the model.** Edit `agent/agent.ts` — a larger model for nuanced
  synthesis, a smaller one for speed.
* **Add a scorer.** Track summary quality across runs to tune the prompt.


# Flash Cards from PDF

Turns a PDF into study flash cards, with optional AI-generated images per concept.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="flashcards-pdf" />

<AgentPreview
  agent="flashcards-pdf"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/biology-chapter.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Flash Cards from PDF Agent** turns a document into ready-to-study flash
cards. It extracts the text, identifies the concepts worth memorizing, and writes
concise front/back pairs — and on request, generates an illustrative image for
each card. Reach for it to build study decks from textbooks, slides, or notes.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/flashcards-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve unpdf
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/flashcards-pdf/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/flashcards-pdf/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/flashcards-pdf/agent/tools/parse_pdf.ts" title="agent/tools/parse_pdf.ts" />

      <ComponentSource src="registry/eve/flashcards-pdf/agent/tools/generate_image.ts" title="agent/tools/generate_image.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts               # Agent definition (model + config)
├── instructions.md        # Card-writing instructions
└── tools/
    ├── parse_pdf.ts       # Extract text from a PDF
    └── generate_image.ts  # Generate an image for a concept
```

## Customization [#customization]

* **Change the card style.** Edit `instructions.md` for cloze deletions,
  definitions, or Q\&A pairs.
* **Swap the image model.** Edit `generate_image.ts` to use a different provider
  or skip images entirely.
* **Export the deck.** Add a tool that writes cards to Anki, CSV, or your SRS.
* **Swap the model.** Edit `agent/agent.ts`.


# GitHub PR Code Review

Fetches a GitHub pull request and returns adaptive, file-by-file code review feedback.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="github-review" />

<AgentPreview
  agent="github-review"
  framework="eve"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Pull request URL&#x22;,
    placeholder: &#x22;https://github.com/owner/repo/pull/123&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **GitHub PR Code Review Agent** reviews a pull request and returns actionable
feedback. It fetches the PR's files and patches, adapts its depth to the diff
size, and reports bugs, security issues, and style notes grouped by file — ending
with an approve / request-changes recommendation. Reach for it to triage reviews
or give contributors fast first-pass feedback.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/github-review
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/github-review/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/github-review/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/github-review/agent/tools/fetch_pr.ts" title="agent/tools/fetch_pr.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts          # Agent definition (model + config)
├── instructions.md   # Adaptive, file-by-file review instructions
└── tools/
    └── fetch_pr.ts   # Fetches PR metadata + changed files
```

## Customization [#customization]

* **Tune the depth thresholds.** Edit `instructions.md` to change how review depth
  scales with PR size.
* **Skip more files.** Add glob patterns for generated or vendored paths.
* **Post back to GitHub.** Add a tool that creates a review via the GitHub API
  instead of replying in chat.
* **Swap the model.** Edit `agent/agent.ts`.


# Google Sheets Analysis

Reads, analyzes, and edits Google Sheets via the Sheets API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="google-sheets" />

<AgentPreview
  agent="google-sheets"
  framework="eve"
  inputFields="[
  {
    name: &#x22;spreadsheetId&#x22;,
    label: &#x22;Spreadsheet ID&#x22;,
    placeholder: &#x22;1A2b3C4d5E6f7G8h9I0j…&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;request&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;Total revenue by region and write it to F1.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Google Sheets Analysis Agent** reads a spreadsheet, answers questions about
it, and — on request — writes results back. It loads ranges in A1 notation,
computes totals/trends/joins, and updates cells only when you ask. Reach for it to
turn a sheet into a conversational analyst or to automate routine spreadsheet
edits.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/google-sheets
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/google-sheets/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/google-sheets/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/google-sheets/agent/tools/read_range.ts" title="agent/tools/read_range.ts" />

      <ComponentSource src="registry/eve/google-sheets/agent/tools/update_range.ts" title="agent/tools/update_range.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Read-before-write analysis instructions
└── tools/
    ├── read_range.ts    # Reads a range (A1 notation)
    └── update_range.ts  # Writes values to a range
```

## Customization [#customization]

* **Use a service account.** Mint the access token from a service account for
  unattended runs.
* **Add operations.** Add tools for appending rows, formatting, or creating sheets.
* **Guard writes.** Require explicit confirmation before any `update_range` call.
* **Swap the model.** Edit `agent/agent.ts`.


# Eve Agents

Here you can find all the agent recipes for the Eve framework

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<AgentsList framework="eve" />


# Meeting Notes

Turns a raw meeting transcript into a structured summary, decisions, and action items.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="meeting-notes" />

<AgentPreview
  agent="meeting-notes"
  framework="eve"
  inputFields="[
  {
    name: &#x22;transcript&#x22;,
    label: &#x22;Transcript&#x22;,
    placeholder: &#x22;Paste the raw meeting transcript here…&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Meeting Notes Agent** takes a raw meeting transcript and returns clean,
structured notes: a short summary, the decisions that were made, action items as
owner/task pairs, and any open questions. Reach for it to close out standups,
planning sessions, or customer calls without writing up notes by hand.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/meeting-notes
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/meeting-notes/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/meeting-notes/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/meeting-notes/agent/tools/save_notes.ts" title="agent/tools/save_notes.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts           # Agent definition (model + config)
├── instructions.md    # Notes-extraction instructions
└── tools/
    └── save_notes.ts  # Saves the structured notes
```

## Customization [#customization]

* **Reshape the notes.** Edit the schema in `save_notes` to add fields like
  attendees, risks, or next meeting date.
* **Persist the output.** Change `save_notes` to write to Notion, Linear, or a
  database instead of returning JSON.
* **Tune the extraction.** Edit `instructions.md` to change how owners are
  inferred or how decisions are phrased.
* **Swap the model.** Edit `agent/agent.ts` for longer transcripts or faster runs.


# Slack

Replies to Slack mentions and DMs, scoped to the thread, via the Slack Web API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="slack-agent" />

<AgentPreview
  agent="slack-agent"
  framework="eve"
  inputFields="[
  {
    name: &#x22;message&#x22;,
    label: &#x22;Message&#x22;,
    placeholder: &#x22;@bot what's the status of the deploy?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Slack Agent** turns your agent into a Slack bot. It answers mentions and
direct messages, keeps each conversation scoped to its thread, and replies with
Slack formatting. Reach for it to put an assistant where your team already works —
an on-call helper, a docs bot, or a triage assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/slack-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/slack-agent/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/slack-agent/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/slack-agent/agent/tools/post_message.ts" title="agent/tools/post_message.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Slack reply style + threading instructions
└── tools/
    └── post_message.ts  # Posts a (threaded) Slack message
```

## Customization [#customization]

* **Verify signatures.** Add Slack request-signature verification in your event
  route before invoking the agent.
* **Add more actions.** Add tools for reactions, file uploads, or opening modals.
* **Scope memory by thread.** Key agent sessions on `thread_ts` for clean context.
* **Swap the model.** Edit `agent/agent.ts`.


# Chat with Database

Introspects a database schema, converts questions to SQL, and runs read-only queries.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="text-to-sql" />

<AgentPreview
  agent="text-to-sql"
  framework="eve"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Show me the top 5 customers by revenue last quarter.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with Database Agent** answers questions about your data in plain
English. It introspects the schema, writes the SQL, runs it read-only, and
explains the results. Reach for it to give non-SQL users a safe way to query a
database, or to prototype analytics without hand-writing queries.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/text-to-sql
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve @libsql/client
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/text-to-sql/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/text-to-sql/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/text-to-sql/agent/lib/db.ts" title="agent/lib/db.ts" />

      <ComponentSource src="registry/eve/text-to-sql/agent/tools/introspect_schema.ts" title="agent/tools/introspect_schema.ts" />

      <ComponentSource src="registry/eve/text-to-sql/agent/tools/run_query.ts" title="agent/tools/run_query.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts                   # Agent definition (model + config)
├── instructions.md            # Introspect → SQL → execute instructions
├── lib/
│   └── db.ts                  # Database client (SQLite by default)
└── tools/
    ├── introspect_schema.ts   # Lists tables and columns
    └── run_query.ts           # Runs a read-only SELECT
```

## Customization [#customization]

* **Swap the database.** Replace the client in `lib/db.ts` with Postgres or MySQL.
* **Allow writes (carefully).** The `run_query` tool blocks non-`SELECT` SQL by
  default — relax that only behind explicit confirmation.
* **Add row limits.** Cap result size in `run_query` to protect against huge scans.
* **Swap the model.** Edit `agent/agent.ts`.


# Weather

Looks up the current weather for a location via the Open-Meteo API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="eve" agent="weather" />

<AgentPreview
  agent="weather"
  framework="eve"
  inputFields="[
  {
    name: &#x22;location&#x22;,
    label: &#x22;Location&#x22;,
    placeholder: &#x22;Pune&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Weather Agent** is the classic starter: ask about a place and it reports the
current conditions. It geocodes the location and fetches live weather from the
free Open-Meteo API — no key required. Reach for it as a minimal, end-to-end
example of an agent with a single tool.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/eve/weather
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install eve
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/eve/weather/agent/agent.ts" title="agent/agent.ts" />

      <ComponentSource src="registry/eve/weather/agent/instructions.md" title="agent/instructions.md" />

      <ComponentSource src="registry/eve/weather/agent/tools/get_weather.ts" title="agent/tools/get_weather.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agent/
├── agent.ts             # Agent definition (model + config)
├── instructions.md      # Weather assistant instructions
└── tools/
    └── get_weather.ts   # Geocode + current forecast (Open-Meteo)
```

## Customization [#customization]

* **Add a forecast.** Extend `get_weather` to request daily/hourly data.
* **Add units.** Pass a `units` parameter (metric/imperial) to the API.
* **Add more tools.** This is a good base to graduate into a travel or planning
  agent.
* **Swap the model.** Edit `agent/agent.ts`.


# AI SEO Audit

Runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total, returning failing checks and an agent-ready fix prompt.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="ai-seo-audit" />

<AgentPreview
  agent="ai-seo-audit"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Page URL&#x22;,
    placeholder: &#x22;https://example.com/blog/how-it-works&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **AI SEO Audit Agent** evaluates a page for how readable it is to AI answer
engines — ChatGPT, Claude, and Perplexity — rather than classic blue-link
search. It fetches the page through context.dev (never touching the site
directly), then runs a **deterministic rubric** of \~30 checks across six
categories to a 0–100 total. The model doesn't eyeball the score — `audit_page`
computes it in `lib/rules.ts`, so the same page always yields the same result.
The agent presents the breakdown, lists the failing checks by impact, and
returns an **agent-ready fix prompt** you can paste straight into a coding agent.
Reach for it when you want a page to get cited by AI assistants.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/ai-seo-audit
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime context.dev
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/ai-seo-audit/agents/ai-seo-audit.ts" title="agents/ai-seo-audit.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/tools/audit-page.ts" title="tools/audit-page.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/lib/audit.ts" title="lib/audit.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/lib/rules.ts" title="lib/rules.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/lib/agent-fix-prompt.ts" title="lib/agent-fix-prompt.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/lib/audit-types.ts" title="lib/audit-types.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/lib/url.ts" title="lib/url.ts" />

      <ComponentSource src="registry/flue/ai-seo-audit/skills/seo-audit/SKILL.md" title="skills/seo-audit/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── ai-seo-audit.ts       # Agent: call audit_page, then present the result
tools/
└── audit-page.ts         # Runs the deterministic audit, returns the scored result
lib/
├── audit.ts              # Fetches via context.dev, parses, and scores the rules
├── rules.ts              # The ~30 checks and six category weights
├── agent-fix-prompt.ts   # Builds the copy-paste fix prompts from the findings
├── audit-types.ts        # Shared result types
└── url.ts                # URL normalization helpers
skills/
└── seo-audit/
    └── SKILL.md          # How the agent presents the audit_page result
```

## Customization [#customization]

* **Fetching.** The page is fetched through [context.dev](https://context.dev) —
  the recipe never hits the audited site directly. Set `CONTEXT_DEV_API_KEY`.
* **Tune the rubric.** Edit `lib/rules.ts` to add checks, reweight categories, or
  change the scoring bands — this is the single source of truth for the score.
* **Reshape the output.** Adjust the agent instructions or `SKILL.md` to emit
  JSON, a shorter summary, or a different fix-prompt format.
* **Swap the model.** Change the `model` on the agent in `agents/ai-seo-audit.ts`.
  The model only narrates the deterministic result, so any capable model works.


# Browser

Drives a real browser with Playwright using a snapshot-and-selector pattern to complete web tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="browser-agent" />

<AgentPreview
  agent="browser-agent"
  framework="flue"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder:
      &#x22;Go to news.ycombinator.com and list the top 3 story titles.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Browser Agent** completes tasks on the live web by driving a real Chromium
browser. It uses a snapshot-and-selector loop — the model sees a stable list of
interactive elements instead of brittle CSS — to navigate, click, and type. Reach
for it to automate flows, scrape interactive pages, or test UIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/browser-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime playwright
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/browser-agent/agents/browser-agent.ts" title="agents/browser-agent.ts" />

      <ComponentSource src="registry/flue/browser-agent/tools/browser.ts" title="tools/browser.ts" />

      <ComponentSource src="registry/flue/browser-agent/lib/browser.ts" title="lib/browser.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── browser-agent.ts    # Agent with the four browser tools
tools/
└── browser.ts          # browser_goto / snapshot / click / type
lib/
└── browser.ts          # Shared Playwright page + snapshot helper
```

## Customization [#customization]

* **Managed remote browser.** `lib/browser.ts` connects to the [Bright Data
  Browser API](https://docs.brightdata.com/scraping-automation/scraping-browser) —
  a managed, anti-bot-resistant Chromium with no local infra. Set
  `BRIGHTDATA_BROWSER_AUTH` to your zone `username:password`, or point
  `BROWSER_CDP_URL` at any other CDP endpoint. With neither set it falls back to
  local Chromium for development.
* **Richer snapshots.** Extend `lib/browser.ts` to include roles, ARIA, or
  bounding boxes.
* **Add actions.** Add tools for scrolling, file uploads, or screenshots.
* **Swap the model.** Change the `model` field on the agent.


# Chat with PDF

Indexes a PDF into a vector store and answers questions over it with page-cited retrieval.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="chat-with-pdf" />

<AgentPreview
  agent="chat-with-pdf"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/whitepaper.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What does the paper conclude about latency?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with PDF Agent** lets you ask questions about a PDF and get answers
grounded in the document, with a page citation for every claim. It indexes the
PDF into a vector store, retrieves only the relevant chunks per question, and can
also generate comprehension quizzes from real passages. Reach for it to turn
manuals, papers, and reports into something you can query.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/chat-with-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime @libsql/client @ai-sdk/openai ai unpdf
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/chat-with-pdf/agents/chat-with-pdf.ts" title="agents/chat-with-pdf.ts" />

      <ComponentSource src="registry/flue/chat-with-pdf/workflows/chat-with-pdf.ts" title="workflows/chat-with-pdf.ts" />

      <ComponentSource src="registry/flue/chat-with-pdf/tools/index-pdf.ts" title="tools/index-pdf.ts" />

      <ComponentSource src="registry/flue/chat-with-pdf/tools/search-docs.ts" title="tools/search-docs.ts" />

      <ComponentSource src="registry/flue/chat-with-pdf/lib/vector-store.ts" title="lib/vector-store.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── chat-with-pdf.ts      # Conversational Q&A agent
workflows/
└── chat-with-pdf.ts      # Index-then-answer, typed cited output
tools/
├── index-pdf.ts          # Chunk, embed, and store a PDF
└── search-docs.ts        # Retrieve relevant chunks for a query
lib/
└── vector-store.ts       # libSQL vector store + embeddings helpers
```

## Customization [#customization]

* **Swap the vector store.** `lib/vector-store.ts` wraps libSQL — replace it with
  Pinecone, Qdrant, Chroma, or pgvector behind the same functions.
* **Tune chunking.** Adjust `chunkText`'s size and overlap for your documents.
* **Reshape the answer.** Edit the `Answer` valibot schema in the workflow.
* **Swap the embedding model.** Change the model in `lib/vector-store.ts`.


# Chat with YouTube

Fetches a video's metadata and transcript, then answers questions with clickable timestamp citations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="chat-with-youtube" />

<AgentPreview
  agent="chat-with-youtube"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;YouTube URL&#x22;,
    placeholder: &#x22;https://youtu.be/dQw4w9WgXcQ&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Summarize the video with chapter timestamps.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with YouTube Agent** answers questions about a video using its
transcript. It pulls the video's metadata and full transcript, then summarizes,
answers follow-ups, and generates chapter timestamps — each citation a clickable
link straight to that moment. Reach for it to skim long talks, lectures, or
podcasts without watching end to end.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/chat-with-youtube
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/chat-with-youtube/agents/chat-with-youtube.ts" title="agents/chat-with-youtube.ts" />

      <ComponentSource src="registry/flue/chat-with-youtube/lib/brightdata.ts" title="lib/brightdata.ts" />

      <ComponentSource src="registry/flue/chat-with-youtube/tools/metadata.ts" title="tools/metadata.ts" />

      <ComponentSource src="registry/flue/chat-with-youtube/tools/transcript.ts" title="tools/transcript.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── chat-with-youtube.ts  # Agent that composes the two tools
lib/
└── brightdata.ts         # Web Unlocker fetch + YouTube parsing helpers
tools/
├── metadata.ts           # Title / author / id via oEmbed
└── transcript.ts         # Timestamped transcript segments
```

## Customization [#customization]

* **Reliable fetching.** Metadata and transcripts are pulled through the [Bright
  Data Web Unlocker](https://docs.brightdata.com/scraping-automation/web-unlocker),
  which handles YouTube at scale with no rate limits or blocks. Set
  `BRIGHTDATA_API_KEY` (and optionally `BRIGHTDATA_UNLOCKER_ZONE`).
* **Add chapters export.** Add a tool that writes the chapter list as a
  description or VTT file.
* **Handle missing transcripts.** Fall back to an STT service when captions are
  unavailable.
* **Add a workflow.** Wrap the tools in a workflow with a typed chapters schema.
* **Swap the model.** Change the `model` field on the agent.


# Claw Autonomous Assistant

Operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="claw" />

<AgentPreview
  agent="claw"
  framework="flue"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder: &#x22;Scaffold a Vite + React app in ./app and run the build.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

**Claw** is an autonomous assistant that operates a sandboxed workspace to finish
multi-step tasks. It reads and writes files, runs shell commands scoped to a
workspace directory, and follows reusable skills. Reach for it as a base for
coding assistants, repo automation, or any agent that needs a real filesystem.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/claw
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/claw/agents/claw.ts" title="agents/claw.ts" />

      <ComponentSource src="registry/flue/claw/tools/read-file.ts" title="tools/read-file.ts" />

      <ComponentSource src="registry/flue/claw/tools/write-file.ts" title="tools/write-file.ts" />

      <ComponentSource src="registry/flue/claw/tools/run-shell.ts" title="tools/run-shell.ts" />

      <ComponentSource src="registry/flue/claw/lib/workspace.ts" title="lib/workspace.ts" />

      <ComponentSource src="registry/flue/claw/skills/workspace/SKILL.md" title="skills/workspace/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── claw.ts              # Agent + workspace skill + tools
tools/
├── read-file.ts         # Read a workspace file
├── write-file.ts        # Write a workspace file
└── run-shell.ts         # Run a command in the workspace
lib/
└── workspace.ts         # Sandbox root + path guard
skills/
└── workspace/
    └── SKILL.md         # Plan / inspect / act / verify procedure
```

## Customization [#customization]

* **Harden the sandbox.** Run `run_shell` inside a container or jail; the path
  guard only constrains file paths, not arbitrary commands.
* **Add web browsing.** Pair with the [Browser Agent](/docs/agents/flue/browser-agent)
  tools for tasks that need the web.
* **Add skills.** Drop more `SKILL.md` procedures under `skills/`.
* **Swap the model.** Change the `model` field on the agent.


# Company Knowledge

Indexes internal documents into a vector store and answers questions over them, with PII redaction.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="company-knowledge" />

<AgentPreview
  agent="company-knowledge"
  framework="flue"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What's our policy on refund requests over $500?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Company Knowledge Agent** answers questions over your internal documents —
issues, wiki pages, notes. It indexes them into a vector store, searches the
corpus first, and redacts personal data (emails, phone numbers, SSNs, card
numbers, API keys) from responses. Reach for it to build an internal "ask the
company" assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/company-knowledge
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime @libsql/client @ai-sdk/openai ai
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/company-knowledge/agents/company-knowledge.ts" title="agents/company-knowledge.ts" />

      <ComponentSource src="registry/flue/company-knowledge/workflows/index-knowledge.ts" title="workflows/index-knowledge.ts" />

      <ComponentSource src="registry/flue/company-knowledge/tools/search-knowledge.ts" title="tools/search-knowledge.ts" />

      <ComponentSource src="registry/flue/company-knowledge/tools/index-document.ts" title="tools/index-document.ts" />

      <ComponentSource src="registry/flue/company-knowledge/lib/vector-store.ts" title="lib/vector-store.ts" />

      <ComponentSource src="registry/flue/company-knowledge/lib/pii.ts" title="lib/pii.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── company-knowledge.ts     # Corpus-first, PII-safe agent
workflows/
└── index-knowledge.ts       # Scheduled re-index workflow
tools/
├── search-knowledge.ts      # Search the corpus (redacted)
└── index-document.ts        # Add a document to the corpus
lib/
├── vector-store.ts          # libSQL vector store + embeddings
└── pii.ts                   # PII redaction helper
```

## Customization [#customization]

* **Connect sources.** Feed `index-knowledge` from Linear, Notion, or your wiki
  on a cron for fresh data.
* **Swap the vector store.** Replace `lib/vector-store.ts` with pgvector/Neon,
  Pinecone, or Qdrant.
* **Tune redaction.** Edit the patterns in `lib/pii.ts` for your data.
* **Swap the model.** Change the `model` field on the agent.


# CSV to Questions

Summarizes a CSV dataset to stay within token limits, then generates focused analytical questions.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="csv-to-questions" />

<AgentPreview
  agent="csv-to-questions"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;CSV URL&#x22;,
    placeholder: &#x22;https://example.com/world-gdp.csv&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **CSV to Questions Agent** takes a CSV dataset and turns it into a set of
sharp, answerable analytical questions. It first summarizes the data — columns,
types, ranges, patterns — to compress large files and avoid token-limit errors,
then generates questions a data analyst would actually ask. Reach for it to
kickstart exploratory analysis or build study material from raw data.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/csv-to-questions
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/csv-to-questions/agents/csv-to-questions.ts" title="agents/csv-to-questions.ts" />

      <ComponentSource src="registry/flue/csv-to-questions/workflows/csv-to-questions.ts" title="workflows/csv-to-questions.ts" />

      <ComponentSource src="registry/flue/csv-to-questions/tools/fetch-csv.ts" title="tools/fetch-csv.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── csv-to-questions.ts   # Single-agent variant with the fetch_csv tool
workflows/
└── csv-to-questions.ts   # summarizer → questioner pipeline (typed output)
tools/
└── fetch-csv.ts          # Loads a CSV file from a URL
```

## Customization [#customization]

* **Read local files.** Swap `fetch-csv.ts` to read from disk or object storage.
* **Reshape the output.** Edit the `Questions` valibot schema to add fields such
  as difficulty or the column each question targets.
* **Swap the models.** Use a large-context model on the summarizer for wide
  datasets; a smaller one on the questioner for speed.
* **Chunk huge files.** Summarize in row batches and merge before questioning.


# Deep Search

Researches a question, evaluates its own findings, and iterates until the answer is complete and cited.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="deep-search" />

<AgentPreview
  agent="deep-search"
  framework="flue"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Research question&#x22;,
    placeholder:
      &#x22;What pricing models do the top 3 observability vendors use?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Deep Search Agent** takes a research question, searches the web, and then
critiques its own findings — re-searching to close gaps until the question is
fully answered. It returns an answer grounded only in the sources it found, with
a citation for every claim. Reach for it whenever a single search isn't enough
and you need a verified, sourced answer.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/deep-search
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/deep-search/agents/deep-search.ts" title="agents/deep-search.ts" />

      <ComponentSource src="registry/flue/deep-search/workflows/deep-search.ts" title="workflows/deep-search.ts" />

      <ComponentSource src="registry/flue/deep-search/tools/search.ts" title="tools/search.ts" />

      <ComponentSource src="registry/flue/deep-search/skills/research/SKILL.md" title="skills/research/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── deep-search.ts        # Orchestrator + searcher/evaluator subagents
workflows/
└── deep-search.ts        # Bounded iteration returning a cited answer
tools/
└── search.ts             # Web search via the Bright Data SERP API
skills/
└── research/
    └── SKILL.md          # Iterative research procedure
```

## Customization [#customization]

* **Search provider.** Searches run through the [Bright Data SERP
  API](https://docs.brightdata.com/scraping-automation/serp-api) — real-time,
  unblocked results billed per successful request. Set `BRIGHTDATA_API_KEY` (and
  optionally `BRIGHTDATA_SERP_ZONE`). Edit `tools/search.ts` to point at a
  different provider — keep the parameters and return shape.
* **Tune the loop.** Adjust `maxRounds` in `workflows/deep-search.ts` to trade
  depth for cost.
* **Reshape the answer.** Edit the `Answer` valibot schema to add fields such as
  confidence or a source list.
* **Swap the model.** Change the `model` on the orchestrator or subagents.


# Docs Chatbot

Answers questions about a library's functions by looking up structured documentation.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="docs-chatbot" />

<AgentPreview
  agent="docs-chatbot"
  framework="flue"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Tell me about the getPlanetaryData function.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Chatbot Agent** answers questions about a code library's API. It looks
up structured function documentation — signatures, parameters, and examples — and
answers using only what the docs say. Reach for it to drop a grounded "ask the
docs" assistant into a docs site, an IDE, or a support channel.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/docs-chatbot
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/docs-chatbot/agents/docs-chatbot.ts" title="agents/docs-chatbot.ts" />

      <ComponentSource src="registry/flue/docs-chatbot/tools/lookup-docs.ts" title="tools/lookup-docs.ts" />

      <ComponentSource src="registry/flue/docs-chatbot/data/functions.json" title="data/functions.json" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── docs-chatbot.ts      # Agent with the lookup_docs tool
tools/
└── lookup-docs.ts       # Looks up functions by name or keyword
data/
└── functions.json       # Sample documentation source
```

## Customization [#customization]

* **Point at your docs.** Replace `data/functions.json` with your generated API
  docs, or change `lookup-docs.ts` to fetch from a remote source.
* **Improve matching.** Swap the substring filter for embeddings-based search.
* **Expose it as MCP.** Wrap the tool in an MCP server for other clients.
* **Swap the model.** Change the `model` field on the agent.


# Docs Expert

Answers questions about libraries and APIs by searching the live web and citing sources.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="docs-expert" />

<AgentPreview
  agent="docs-expert"
  framework="flue"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;How do I stream responses with the Vercel AI SDK?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Expert Agent** answers technical questions about libraries, APIs, and
tools by searching the live web — preferring official documentation and citing
every claim. Reach for it as a grounded "ask the docs" helper that returns
copy-pasteable answers instead of hallucinated APIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/docs-expert
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/docs-expert/agents/docs-expert.ts" title="agents/docs-expert.ts" />

      <ComponentSource src="registry/flue/docs-expert/tools/search.ts" title="tools/search.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── docs-expert.ts      # Agent with the web_search tool
tools/
└── search.ts           # Web search via the Exa API
```

## Customization [#customization]

* **Swap the search provider.** Edit `search.ts` for Brave, Tavily, or a
  docs-specific index.
* **Constrain to your docs.** Restrict queries to a domain to build a
  product-specific expert.
* **Add page fetching.** Add a `scrape_url` tool so the agent reads full pages.
* **Swap the model.** Change the `model` field on the agent.


# Extract DESIGN.md

Turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing the document in a single Claude call.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="extract-design-md" />

<AgentPreview
  agent="extract-design-md"
  framework="flue"
  inputFields="[
  {
    name: &#x22;domain&#x22;,
    label: &#x22;Domain&#x22;,
    placeholder: &#x22;stripe.com&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Extract DESIGN.md Agent** turns any public website into design artifacts.
Given a domain, it gathers the styleguide, brand, a homepage screenshot, and
clean page Markdown through context.dev, then returns **three outputs**:

* **DESIGN.md** — composed in **one Claude call** (screenshot passed as
  a vision image): token frontmatter (`version: alpha`, colors, typography,
  rounded, spacing, components) plus the canonical sections (Overview, Colors,
  Typography, Layout, Elevation, Shapes, Components, Do's and Don'ts).
* **Tailwind v4 `@theme` block** — derived **deterministically** from the
  styleguide + brand in `lib/derive-tokens.ts`.
* **CSS `:root` tokens** — the same tokens as vanilla CSS variables.

It follows the [designmd.supply](https://designmd.supply) pipeline — the same
prompt spec and deterministic token derivers — running on Claude.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/extract-design-md
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime context.dev ai @ai-sdk/anthropic
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/extract-design-md/workflows/extract-design-md.ts" title="workflows/extract-design-md.ts" />

      <ComponentSource src="registry/flue/extract-design-md/lib/compose.ts" title="lib/compose.ts" />

      <ComponentSource src="registry/flue/extract-design-md/lib/design-md.ts" title="lib/design-md.ts" />

      <ComponentSource src="registry/flue/extract-design-md/lib/derive-tokens.ts" title="lib/derive-tokens.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
workflows/
└── extract-design-md.ts  # Workflow: returns DESIGN.md + Tailwind + CSS
lib/
├── compose.ts            # Fetches signals; Claude call + token derivers
├── design-md.ts          # The verbatim DESIGN.md prompt spec
└── derive-tokens.ts      # Deterministic Tailwind v4 @theme + CSS :root tokens
```

## Customization [#customization]

* **Data source.** The styleguide, screenshot, and Markdown are pulled through
  [context.dev](https://context.dev). Set `CONTEXT_DEV_API_KEY`, and
  `ANTHROPIC_API_KEY` for the model call.
* **Reshape the document.** Edit `lib/design-md.ts` — the prompt spec is the
  single source of truth for the frontmatter keys, token names, and sections.
* **Swap the model.** Change the model in `lib/compose.ts` — it uses
  `claude-sonnet-4-6` (vision-capable). The reference uses `gpt-5.4-mini`; any
  multimodal model that can read the screenshot works.
* **Temperature.** Adjust `temperature` in `lib/compose.ts` (the reference uses
  `0.2`) to trade determinism for variety.


# Customer Feedback Summary

Retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="feedback-summary" />

<AgentPreview
  agent="feedback-summary"
  framework="flue"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;What are the critical issues from enterprise customers?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Customer Feedback Summary Agent** answers questions about your customer
feedback. It retrieves entries from your data source, categorizes them by theme
and segment, and produces an executive summary with representative quotes and
concrete recommendations. Reach for it to turn a backlog of reviews, tickets, or
survey responses into something a team can act on.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/feedback-summary
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/feedback-summary/agents/feedback-summary.ts" title="agents/feedback-summary.ts" />

      <ComponentSource src="registry/flue/feedback-summary/tools/get-feedback.ts" title="tools/get-feedback.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── feedback-summary.ts  # Agent definition with the get_feedback tool
tools/
└── get-feedback.ts      # Paginated feedback retrieval
```

## Customization [#customization]

* **Connect your source.** Point `get-feedback.ts` at your database, support
  desk, or reviews API — keep the pagination + segment parameters.
* **Change the categories.** Edit the agent instructions to use your own taxonomy.
* **Add a workflow.** Wrap retrieval + summarization in a workflow with a typed
  report schema if you want structured output.
* **Swap the model.** Change the `model` field on the agent.


# Flash Cards from PDF

Turns a PDF into study flash cards, with optional AI-generated images per concept.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="flashcards-pdf" />

<AgentPreview
  agent="flashcards-pdf"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/biology-chapter.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Flash Cards from PDF Agent** turns a document into ready-to-study flash
cards. It extracts the text, identifies the concepts worth memorizing, and writes
concise front/back pairs — and on request, generates an illustrative image for
each card. Reach for it to build study decks from textbooks, slides, or notes.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/flashcards-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime unpdf
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/flashcards-pdf/agents/flashcards-pdf.ts" title="agents/flashcards-pdf.ts" />

      <ComponentSource src="registry/flue/flashcards-pdf/workflows/flashcards-pdf.ts" title="workflows/flashcards-pdf.ts" />

      <ComponentSource src="registry/flue/flashcards-pdf/tools/parse-pdf.ts" title="tools/parse-pdf.ts" />

      <ComponentSource src="registry/flue/flashcards-pdf/tools/generate-image.ts" title="tools/generate-image.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── flashcards-pdf.ts      # Conversational card-writing agent
workflows/
└── flashcards-pdf.ts      # Typed Flashcards output
tools/
├── parse-pdf.ts           # Extract text from a PDF
└── generate-image.ts      # Generate an image for a concept
```

## Customization [#customization]

* **Reshape the deck.** Edit the `Flashcards` valibot schema to add tags, hints,
  or difficulty.
* **Swap the image model.** Edit `generate-image.ts` or drop images entirely.
* **Export the deck.** Add a tool that writes to Anki, CSV, or your SRS.
* **Swap the model.** Change the `model` field on the agent.


# GitHub PR Code Review

Fetches a GitHub pull request and returns adaptive, file-by-file code review feedback.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="github-review" />

<AgentPreview
  agent="github-review"
  framework="flue"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Pull request URL&#x22;,
    placeholder: &#x22;https://github.com/owner/repo/pull/123&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **GitHub PR Code Review Agent** reviews a pull request and returns actionable
feedback. It fetches the PR's files and patches, adapts its depth to the diff
size, and reports bugs, security issues, and style notes grouped by file — ending
with an approve / request-changes recommendation. Reach for it to triage reviews
or give contributors fast first-pass feedback.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/github-review
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/github-review/agents/github-review.ts" title="agents/github-review.ts" />

      <ComponentSource src="registry/flue/github-review/workflows/github-review.ts" title="workflows/github-review.ts" />

      <ComponentSource src="registry/flue/github-review/tools/fetch-pr.ts" title="tools/fetch-pr.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── github-review.ts      # Chat review agent
workflows/
└── github-review.ts      # pr-review workflow → typed Review
tools/
└── fetch-pr.ts           # Fetches PR metadata + changed files
```

## Customization [#customization]

* **Reshape the review.** Edit the `Review` valibot schema (add line numbers,
  suggested patches).
* **Tune depth + skips.** Adjust the agent instructions for size thresholds and
  ignored paths.
* **Post back to GitHub.** Add a tool that creates a review via the GitHub API.
* **Swap the model.** Use Sonnet for depth or Haiku for speed.


# Google Sheets Analysis

Reads, analyzes, and edits Google Sheets via the Sheets API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="google-sheets" />

<AgentPreview
  agent="google-sheets"
  framework="flue"
  inputFields="[
  {
    name: &#x22;spreadsheetId&#x22;,
    label: &#x22;Spreadsheet ID&#x22;,
    placeholder: &#x22;1A2b3C4d5E6f7G8h9I0j…&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;request&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;Total revenue by region and write it to F1.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Google Sheets Analysis Agent** reads a spreadsheet, answers questions about
it, and — on request — writes results back. It loads ranges in A1 notation,
computes totals/trends/joins, and updates cells only when you ask. Reach for it to
turn a sheet into a conversational analyst or to automate routine spreadsheet
edits.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/google-sheets
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/google-sheets/agents/google-sheets.ts" title="agents/google-sheets.ts" />

      <ComponentSource src="registry/flue/google-sheets/tools/read-range.ts" title="tools/read-range.ts" />

      <ComponentSource src="registry/flue/google-sheets/tools/update-range.ts" title="tools/update-range.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── google-sheets.ts     # Agent with read + update tools
tools/
├── read-range.ts        # Reads a range (A1 notation)
└── update-range.ts      # Writes values to a range
```

## Customization [#customization]

* **Use a service account.** Mint the access token from a service account for
  unattended runs.
* **Add operations.** Add tools for appending rows, formatting, or creating sheets.
* **Guard writes.** Require explicit confirmation before any `update_range` call.
* **Swap the model.** Change the `model` field on the agent.


# Flue Agents

Here you can find all the agent recipes for the Flue framework

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<AgentsList framework="flue" />


# Meeting Notes

Turns a raw meeting transcript into a structured summary, decisions, and action items.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="meeting-notes" />

<AgentPreview
  agent="meeting-notes"
  framework="flue"
  inputFields="[
  {
    name: &#x22;transcript&#x22;,
    label: &#x22;Transcript&#x22;,
    placeholder: &#x22;Paste the raw meeting transcript here…&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Meeting Notes Agent** takes a raw meeting transcript and returns clean,
structured notes: a short summary, the decisions that were made, action items as
owner/task pairs, and any open questions. Reach for it to close out standups,
planning sessions, or customer calls without writing up notes by hand.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/meeting-notes
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/meeting-notes/agents/meeting-notes.ts" title="agents/meeting-notes.ts" />

      <ComponentSource src="registry/flue/meeting-notes/workflows/meeting-notes.ts" title="workflows/meeting-notes.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── meeting-notes.ts    # Single-agent variant
workflows/
└── meeting-notes.ts    # Workflow returning a typed Notes object
```

## Customization [#customization]

* **Reshape the notes.** Edit the `Notes` valibot schema to add fields like
  attendees, risks, or next meeting date.
* **Persist the output.** Add a tool that writes the notes to Notion, Linear, or
  a database.
* **Tune the extraction.** Edit the agent instructions to change how owners are
  inferred or how decisions are phrased.
* **Swap the model.** Change the `model` field for longer transcripts or speed.


# Slack

Replies to Slack mentions and DMs, scoped to the thread, via the Slack Web API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="slack-agent" />

<AgentPreview
  agent="slack-agent"
  framework="flue"
  inputFields="[
  {
    name: &#x22;message&#x22;,
    label: &#x22;Message&#x22;,
    placeholder: &#x22;@bot what's the status of the deploy?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Slack Agent** turns your agent into a Slack bot. It answers mentions and
direct messages, keeps each conversation scoped to its thread, and replies with
Slack formatting. Reach for it to put an assistant where your team already works —
an on-call helper, a docs bot, or a triage assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/slack-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/slack-agent/agents/slack-agent.ts" title="agents/slack-agent.ts" />

      <ComponentSource src="registry/flue/slack-agent/tools/post-message.ts" title="tools/post-message.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── slack-agent.ts       # Agent + route handler stub for Slack events
tools/
└── post-message.ts      # Posts a (threaded) Slack message
```

## Customization [#customization]

* **Verify signatures.** Implement Slack signature verification in the exported
  `route` before calling `next()`.
* **Add more actions.** Add tools for reactions, file uploads, or modals.
* **Scope memory by thread.** Key sessions on `thread_ts` for clean context.
* **Swap the model.** Change the `model` field on the agent.


# Chat with Database

Introspects a database schema, converts questions to SQL, and runs read-only queries.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="text-to-sql" />

<AgentPreview
  agent="text-to-sql"
  framework="flue"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Show me the top 5 customers by revenue last quarter.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with Database Agent** answers questions about your data in plain
English. It introspects the schema, writes the SQL, runs it read-only, and
explains the results. Reach for it to give non-SQL users a safe way to query a
database, or to prototype analytics without hand-writing queries.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/text-to-sql
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime @libsql/client
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/text-to-sql/agents/text-to-sql.ts" title="agents/text-to-sql.ts" />

      <ComponentSource src="registry/flue/text-to-sql/tools/introspect-schema.ts" title="tools/introspect-schema.ts" />

      <ComponentSource src="registry/flue/text-to-sql/tools/run-query.ts" title="tools/run-query.ts" />

      <ComponentSource src="registry/flue/text-to-sql/lib/db.ts" title="lib/db.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── text-to-sql.ts            # Agent with the two database tools
tools/
├── introspect-schema.ts      # Lists tables and columns
└── run-query.ts              # Runs a read-only SELECT
lib/
└── db.ts                     # Database client (SQLite by default)
```

## Customization [#customization]

* **Swap the database.** Replace the client in `lib/db.ts` with Postgres or MySQL.
* **Allow writes (carefully).** `run-query.ts` blocks non-`SELECT` SQL by default.
* **Add a workflow.** Wrap introspect + query in a workflow with a typed result.
* **Swap the model.** Change the `model` field on the agent.


# Weather

Looks up the current weather for a location via the Open-Meteo API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="flue" agent="weather" />

<AgentPreview
  agent="weather"
  framework="flue"
  inputFields="[
  {
    name: &#x22;location&#x22;,
    label: &#x22;Location&#x22;,
    placeholder: &#x22;Pune&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Weather Agent** is the classic starter: ask about a place and it reports the
current conditions. It geocodes the location and fetches live weather from the
free Open-Meteo API — no key required. Reach for it as a minimal, end-to-end
example of an agent with a single tool.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/flue/weather
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @flue/runtime
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/flue/weather/agents/weather.ts" title="agents/weather.ts" />

      <ComponentSource src="registry/flue/weather/tools/get-weather.ts" title="tools/get-weather.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
agents/
└── weather.ts          # Agent with the get_weather tool
tools/
└── get-weather.ts      # Geocode + current forecast (Open-Meteo)
```

## Customization [#customization]

* **Add a forecast.** Extend `get-weather.ts` to request daily/hourly data.
* **Add units.** Pass a `units` parameter (metric/imperial) to the API.
* **Add a workflow.** Wrap it in a workflow with a typed forecast schema.
* **Swap the model.** Change the `model` field on the agent.


# AI SEO Audit

Runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total, returning failing checks and an agent-ready fix prompt.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="ai-seo-audit" />

<AgentPreview
  agent="ai-seo-audit"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Page URL&#x22;,
    placeholder: &#x22;https://example.com/blog/how-it-works&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **AI SEO Audit Agent** evaluates a page for how readable it is to AI answer
engines — ChatGPT, Claude, and Perplexity — rather than classic blue-link
search. It fetches the page through context.dev (never touching the site
directly), then runs a **deterministic rubric** of \~30 checks across six
categories to a 0–100 total. The model doesn't eyeball the score — `audit_page`
computes it in `lib/rules.ts`, so the same page always yields the same
result. The agent presents the breakdown, lists the failing checks by impact,
and returns an **agent-ready fix prompt** you can paste straight into a coding
agent. Reach for it when you want a page to get cited by AI assistants.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/ai-seo-audit
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/ai-seo-audit/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/lib/agent-fix-prompt.ts" title="lib/agent-fix-prompt.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/lib/audit-types.ts" title="lib/audit-types.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/lib/audit.ts" title="lib/audit.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/lib/rules.ts" title="lib/rules.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/lib/url.ts" title="lib/url.ts" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/skills/seo-audit/SKILL.md" title="skills/seo-audit/SKILL.md" />

      <ComponentSource src="registry/langgraph/ai-seo-audit/tools/audit_page.ts" title="tools/audit_page.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/agent-fix-prompt.ts
├── lib/audit-types.ts
├── lib/audit.ts
├── lib/rules.ts
├── lib/url.ts
├── skills/seo-audit/SKILL.md
├── tools/audit_page.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Browser

A browser-operating agent that interacts with live web pages using Playwright-based tools with accessibility-tree ref ids.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="browser-agent" />

<AgentPreview
  agent="browser-agent"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder:
      &#x22;Go to news.ycombinator.com and list the top 3 story titles.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Browser Agent** completes tasks on the live web by driving a real Chromium
browser. It uses Playwright-based tools with accessibility-tree ref ids for
stable element targeting, web search as a fallback, and persists state to
Turso (libSQL). Reach for it to automate flows, scrape interactive pages, or
test UIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/browser-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @ai-sdk/openai @dawn-ai/sdk playwright-chromium
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/browser-agent/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/browser-agent/instructions.md" title="instructions.md" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Chat with PDF

Indexes a PDF into a vector store and answers questions over it with page-cited retrieval and stratified sampling.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="chat-with-pdf" />

<AgentPreview
  agent="chat-with-pdf"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/whitepaper.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What does the paper conclude about latency?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with PDF Agent** lets you ask questions about a PDF and get answers
grounded in the document, with a page citation for every claim. It indexes the
PDF into a vector store, retrieves only the relevant chunks per question using
stratified sampling across page ranges, and can also generate comprehension
quizzes from real passages. Reach for it to turn manuals, papers, and reports
into something you can query.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/chat-with-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk pdf-parse
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/chat-with-pdf/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/chat-with-pdf/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/chat-with-pdf/lib/vector-store.ts" title="lib/vector-store.ts" />

      <ComponentSource src="registry/langgraph/chat-with-pdf/tools/list_documents.ts" title="tools/list_documents.ts" />

      <ComponentSource src="registry/langgraph/chat-with-pdf/tools/query_pdf.ts" title="tools/query_pdf.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/vector-store.ts
├── tools/list_documents.ts
├── tools/query_pdf.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Chat with YouTube

Fetches a video's metadata and transcript, then answers questions with clickable timestamp citations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="chat-with-youtube" />

<AgentPreview
  agent="chat-with-youtube"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;YouTube URL&#x22;,
    placeholder: &#x22;https://youtu.be/dQw4w9WgXcQ&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Summarize the video with chapter timestamps.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with YouTube Agent** answers questions about a video using its
transcript. It pulls the video's metadata and full transcript, then summarizes,
answers follow-ups, and generates chapter timestamps — each citation a clickable
link straight to that moment. Reach for it to skim long talks, lectures, or
podcasts without watching end to end.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/chat-with-youtube
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk youtube-transcript-scraper
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/chat-with-youtube/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/chat-with-youtube/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/chat-with-youtube/lib/youtube-utils.ts" title="lib/youtube-utils.ts" />

      <ComponentSource src="registry/langgraph/chat-with-youtube/tools/youtube-metadata.ts" title="tools/youtube-metadata.ts" />

      <ComponentSource src="registry/langgraph/chat-with-youtube/tools/youtube-transcript.ts" title="tools/youtube-transcript.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/youtube-utils.ts
├── tools/youtube-metadata.ts
├── tools/youtube-transcript.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Claw Autonomous Assistant

Operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="claw" />

<AgentPreview
  agent="claw"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder: &#x22;Scaffold a Vite + React app in ./app and run the build.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

**Claw** is an autonomous assistant that operates a sandboxed workspace to finish
multi-step tasks. It reads and writes files, runs shell commands scoped to a
workspace directory, and follows reusable skills. Reach for it as a base for
coding assistants, repo automation, or any agent that needs a real filesystem.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/claw
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/claw/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/claw/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/claw/lib/workspace.ts" title="lib/workspace.ts" />

      <ComponentSource src="registry/langgraph/claw/skills/workspace/SKILL.md" title="skills/workspace/SKILL.md" />

      <ComponentSource src="registry/langgraph/claw/tools/delete_file.ts" title="tools/delete_file.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/edit_file.ts" title="tools/edit_file.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/grep.ts" title="tools/grep.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/list_files.ts" title="tools/list_files.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/read_file.ts" title="tools/read_file.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/run_shell.ts" title="tools/run_shell.ts" />

      <ComponentSource src="registry/langgraph/claw/tools/write_file.ts" title="tools/write_file.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/workspace.ts
├── skills/workspace/SKILL.md
├── tools/delete_file.ts
├── tools/edit_file.ts
├── tools/grep.ts
├── tools/list_files.ts
├── tools/read_file.ts
├── tools/run_shell.ts
├── tools/write_file.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Company Knowledge

Indexes internal documents into a vector store and answers questions over them, with PII redaction.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="company-knowledge" />

<AgentPreview
  agent="company-knowledge"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What's our policy on refund requests over $500?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Company Knowledge Agent** answers questions over your internal documents —
issues, wiki pages, notes. It indexes them into a vector store, searches the
corpus first, and redacts personal data (emails, phone numbers, SSNs, card
numbers, API keys) from responses. Reach for it to build an internal "ask the
company" assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/company-knowledge
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @ai-sdk/openai @dawn-ai/sdk @libsql/client ai
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/company-knowledge/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/company-knowledge/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/company-knowledge/lib/pii.ts" title="lib/pii.ts" />

      <ComponentSource src="registry/langgraph/company-knowledge/lib/vector-store.ts" title="lib/vector-store.ts" />

      <ComponentSource src="registry/langgraph/company-knowledge/tools/index_document.ts" title="tools/index_document.ts" />

      <ComponentSource src="registry/langgraph/company-knowledge/tools/search_knowledge.ts" title="tools/search_knowledge.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/pii.ts
├── lib/vector-store.ts
├── tools/index_document.ts
├── tools/search_knowledge.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# CSV to Questions

Summarizes a CSV dataset to stay within token limits, then generates focused analytical questions.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="csv-to-questions" />

<AgentPreview
  agent="csv-to-questions"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;CSV URL&#x22;,
    placeholder: &#x22;https://example.com/world-gdp.csv&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **CSV to Questions Agent** takes a CSV dataset and turns it into a set of
sharp, answerable analytical questions. It first summarizes the data — columns,
types, ranges, patterns — to compress large files and avoid token-limit errors,
then generates questions a data analyst would actually ask. Reach for it to
kickstart exploratory analysis or build study material from raw data.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/csv-to-questions
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/csv-to-questions/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/csv-to-questions/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/csv-to-questions/tools/fetch_csv.ts" title="tools/fetch_csv.ts" />

      <ComponentSource src="registry/langgraph/csv-to-questions/tools/generate_questions.ts" title="tools/generate_questions.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/fetch_csv.ts
├── tools/generate_questions.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Deep Search

A multi-agent deep search system that researches questions by clarifying intent, planning queries, evaluating results, and synthesizing answers.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="deep-search" />

<AgentPreview
  agent="deep-search"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;initialQuery&#x22;,
    label: &#x22;Research question&#x22;,
    placeholder:
      &#x22;What pricing models do the top 3 observability vendors use?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Deep Search Agent** is a multi-agent system that researches questions through an iterative process. It clarifies user intent, plans search queries, evaluates results for completeness, and synthesizes a comprehensive answer. The system uses 4 specialized agents working together in a workflow to produce well-researched, cited answers.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/deep-search
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/deep-search/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/deep-search/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/deep-search/skills/research/SKILL.md" title="skills/research/SKILL.md" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/answerer/index.ts" title="subagents/answerer/index.ts" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/answerer/instructions.md" title="subagents/answerer/instructions.md" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/intent-clarifier/index.ts" title="subagents/intent-clarifier/index.ts" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/intent-clarifier/instructions.md" title="subagents/intent-clarifier/instructions.md" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/research-planner/index.ts" title="subagents/research-planner/index.ts" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/research-planner/instructions.md" title="subagents/research-planner/instructions.md" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/search-result-evaluator/index.ts" title="subagents/search-result-evaluator/index.ts" />

      <ComponentSource src="registry/langgraph/deep-search/subagents/search-result-evaluator/instructions.md" title="subagents/search-result-evaluator/instructions.md" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── skills/research/SKILL.md
├── subagents/answerer/index.ts
├── subagents/answerer/instructions.md
├── subagents/intent-clarifier/index.ts
├── subagents/intent-clarifier/instructions.md
├── subagents/research-planner/index.ts
├── subagents/research-planner/instructions.md
├── subagents/search-result-evaluator/index.ts
├── subagents/search-result-evaluator/instructions.md
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Docs Chatbot

Answers questions about a library's functions by looking up structured documentation.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="docs-chatbot" />

<AgentPreview
  agent="docs-chatbot"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Tell me about the getPlanetaryData function.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Chatbot Agent** answers questions about a code library's API. It looks
up structured function documentation — signatures, parameters, and examples — and
answers using only what the docs say. Reach for it to drop a grounded "ask the
docs" assistant into a docs site, an IDE, or a support channel.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/docs-chatbot
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/docs-chatbot/data/functions.json" title="data/functions.json" />

      <ComponentSource src="registry/langgraph/docs-chatbot/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/docs-chatbot/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/docs-chatbot/tools/lookup_docs.ts" title="tools/lookup_docs.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── data/functions.json
├── index.ts
├── instructions.md
├── tools/lookup_docs.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Docs Expert

Answers questions about libraries and APIs by searching the live web and citing sources.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="docs-expert" />

<AgentPreview
  agent="docs-expert"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;How do I stream responses with the Vercel AI SDK?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Expert Agent** answers technical questions about libraries, APIs, and
tools by searching the live web — preferring official documentation and citing
every claim. Reach for it as a grounded "ask the docs" helper that returns
copy-pasteable answers instead of hallucinated APIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/docs-expert
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/docs-expert/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/docs-expert/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/docs-expert/tools/web_search.ts" title="tools/web_search.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/web_search.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Extract DESIGN.md

Turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing the document in a single Claude call.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="extract-design-md" />

<AgentPreview
  agent="extract-design-md"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;domain&#x22;,
    label: &#x22;Domain&#x22;,
    placeholder: &#x22;stripe.com&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Extract DESIGN.md Agent** turns any public website into design artifacts.
The `compose_design_md` tool gathers the styleguide, brand, a homepage
screenshot, and clean page Markdown through context.dev, then returns **three
outputs**, which the agent relays verbatim:

* **DESIGN.md** — composed in **one Claude call** (screenshot passed as
  a vision image): token frontmatter (`version: alpha`, colors, typography,
  rounded, spacing, components) plus the canonical sections (Overview, Colors,
  Typography, Layout, Elevation, Shapes, Components, Do's and Don'ts).
* **Tailwind v4 `@theme` block** — derived **deterministically** from the
  styleguide + brand in `lib/derive-tokens.ts`.
* **CSS `:root` tokens** — the same tokens as vanilla CSS variables.

It follows the [designmd.supply](https://designmd.supply) pipeline — the same
prompt spec and deterministic token derivers — running on Claude.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/extract-design-md
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/extract-design-md/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/extract-design-md/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/extract-design-md/lib/compose.ts" title="lib/compose.ts" />

      <ComponentSource src="registry/langgraph/extract-design-md/lib/derive-tokens.ts" title="lib/derive-tokens.ts" />

      <ComponentSource src="registry/langgraph/extract-design-md/lib/design-md.ts" title="lib/design-md.ts" />

      <ComponentSource src="registry/langgraph/extract-design-md/tools/compose_design_md.ts" title="tools/compose_design_md.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/compose.ts
├── lib/derive-tokens.ts
├── lib/design-md.ts
├── tools/compose_design_md.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Customer Feedback Summary

Retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="feedback-summary" />

<AgentPreview
  agent="feedback-summary"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;What are the critical issues from enterprise customers?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Customer Feedback Summary Agent** answers questions about your customer
feedback. It retrieves entries from your data source, categorizes them by theme
and segment, and produces an executive summary with representative quotes and
concrete recommendations. Reach for it to turn a backlog of reviews, tickets, or
survey responses into something a team can act on.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/feedback-summary
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/feedback-summary/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/feedback-summary/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/feedback-summary/tools/get_feedback.ts" title="tools/get_feedback.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/get_feedback.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Flash Cards from PDF

Turns a PDF into study flash cards, with optional AI-generated images per concept.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="flashcards-pdf" />

<AgentPreview
  agent="flashcards-pdf"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/biology-chapter.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Flash Cards from PDF Agent** turns a document into ready-to-study flash
cards. It extracts the text, identifies the concepts worth memorizing, and writes
concise front/back pairs — and on request, generates an illustrative image for
each card. Reach for it to build study decks from textbooks, slides, or notes.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/flashcards-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk pdf-parse
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/flashcards-pdf/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/flashcards-pdf/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/flashcards-pdf/tools/generate_image.ts" title="tools/generate_image.ts" />

      <ComponentSource src="registry/langgraph/flashcards-pdf/tools/parse_pdf.ts" title="tools/parse_pdf.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/generate_image.ts
├── tools/parse_pdf.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# GitHub PR Code Review

Fetches a GitHub pull request and returns adaptive, file-by-file code review feedback.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="github-review" />

<AgentPreview
  agent="github-review"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Pull request URL&#x22;,
    placeholder: &#x22;https://github.com/owner/repo/pull/123&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **GitHub PR Code Review Agent** reviews a pull request and returns actionable
feedback. It fetches the PR's files and patches, adapts its depth to the diff
size, and reports bugs, security issues, and style notes grouped by file — ending
with an approve / request-changes recommendation. Reach for it to triage reviews
or give contributors fast first-pass feedback.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/github-review
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/github-review/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/github-review/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/github-review/tools/fetch_pr.ts" title="tools/fetch_pr.ts" />

      <ComponentSource src="registry/langgraph/github-review/tools/get_file_content.ts" title="tools/get_file_content.ts" />

      <ComponentSource src="registry/langgraph/github-review/tools/get_pr_files.ts" title="tools/get_pr_files.ts" />

      <ComponentSource src="registry/langgraph/github-review/tools/parse_github_url.ts" title="tools/parse_github_url.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/fetch_pr.ts
├── tools/get_file_content.ts
├── tools/get_pr_files.ts
├── tools/parse_github_url.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Google Sheets Analysis

Reads, analyzes, and edits Google Sheets via the Sheets API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="google-sheets" />

<AgentPreview
  agent="google-sheets"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;spreadsheetId&#x22;,
    label: &#x22;Spreadsheet ID&#x22;,
    placeholder: &#x22;1A2b3C4d5E6f7G8h9I0j…&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;request&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;Total revenue by region and write it to F1.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Google Sheets Analysis Agent** reads a spreadsheet, answers questions about
it, and — on request — writes results back. It loads ranges in A1 notation,
computes totals/trends/joins, and updates cells only when you ask. Reach for it to
turn a sheet into a conversational analyst or to automate routine spreadsheet
edits.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/google-sheets
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/google-sheets/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/google-sheets/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/google-sheets/tools/read_range.ts" title="tools/read_range.ts" />

      <ComponentSource src="registry/langgraph/google-sheets/tools/update_range.ts" title="tools/update_range.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/read_range.ts
├── tools/update_range.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# LangGraph Agents

Here you can find all the agent recipes for the LangGraph framework

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<AgentsList framework="langgraph" />


# Meeting Notes

Turns a raw meeting transcript into a structured summary, decisions, and action items.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="meeting-notes" />

<AgentPreview
  agent="meeting-notes"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;transcript&#x22;,
    label: &#x22;Transcript&#x22;,
    placeholder: &#x22;Paste the raw meeting transcript here…&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Meeting Notes Agent** takes a raw meeting transcript and returns clean,
structured notes: a short summary, the decisions that were made, action items as
owner/task pairs, and any open questions. Reach for it to close out standups,
planning sessions, or customer calls without writing up notes by hand.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/meeting-notes
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/meeting-notes/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/meeting-notes/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/meeting-notes/tools/get_transcript.ts" title="tools/get_transcript.ts" />

      <ComponentSource src="registry/langgraph/meeting-notes/tools/list_meetings.ts" title="tools/list_meetings.ts" />

      <ComponentSource src="registry/langgraph/meeting-notes/tools/save_notes.ts" title="tools/save_notes.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/get_transcript.ts
├── tools/list_meetings.ts
├── tools/save_notes.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Slack

Replies to Slack mentions and DMs, scoped to the thread, via the Slack Web API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="slack-agent" />

<AgentPreview
  agent="slack-agent"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;message&#x22;,
    label: &#x22;Message&#x22;,
    placeholder: &#x22;@bot what's the status of the deploy?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Slack Agent** turns your agent into a Slack bot. It answers mentions and
direct messages, keeps each conversation scoped to its thread, and replies with
Slack formatting. Reach for it to put an assistant where your team already works —
an on-call helper, a docs bot, or a triage assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/slack-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/slack-agent/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/slack-agent/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/slack-agent/tools/post_message.ts" title="tools/post_message.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/post_message.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Chat with Database

Introspects a database schema, converts questions to SQL, and runs read-only queries.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="text-to-sql" />

<AgentPreview
  agent="text-to-sql"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Show me the top 5 customers by revenue last quarter.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with Database Agent** answers questions about your data in plain
English. It introspects the schema, writes the SQL, runs it read-only, and
explains the results. Reach for it to give non-SQL users a safe way to query a
database, or to prototype analytics without hand-writing queries.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/text-to-sql
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk @libsql/client
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/text-to-sql/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/text-to-sql/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/text-to-sql/lib/db.ts" title="lib/db.ts" />

      <ComponentSource src="registry/langgraph/text-to-sql/tools/execute-sql.ts" title="tools/execute-sql.ts" />

      <ComponentSource src="registry/langgraph/text-to-sql/tools/introspect-database.ts" title="tools/introspect-database.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── lib/db.ts
├── tools/execute-sql.ts
├── tools/introspect-database.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# Weather

Looks up the current weather for a location via the Open-Meteo API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="langgraph" agent="weather" />

<AgentPreview
  agent="weather"
  framework="langgraph"
  inputFields="[
  {
    name: &#x22;location&#x22;,
    label: &#x22;Location&#x22;,
    placeholder: &#x22;Pune&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Weather Agent** is the classic starter: ask about a place and it reports the
current conditions. It geocodes the location and fetches live weather from the
free Open-Meteo API — no key required. Reach for it as a minimal, end-to-end
example of an agent with a single tool.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/langgraph/weather
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @dawn-ai/sdk
      ```

      <Step>
        Copy and paste the following agent route files into your project.
      </Step>

      <ComponentSource src="registry/langgraph/weather/index.ts" title="index.ts" />

      <ComponentSource src="registry/langgraph/weather/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/langgraph/weather/tools/get_weather.ts" title="tools/get_weather.ts" />

      <Step>
        Run `dawn check` after copying so route and tool metadata are regenerated.
        `dawn dev`, `dawn build`, and `dawn verify` also run the same discovery path.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── index.ts
├── instructions.md
├── tools/get_weather.ts
```

## Customization [#customization]

* Edit `index.ts` to change the model, description, or system prompt.
* Add route-local tools under `tools/`; tool input and output types are inferred from TypeScript.
* Run `dawn verify` before deploying generated LangGraph artifacts.


# AI SEO Audit

Runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total, returning failing checks and an agent-ready fix prompt.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="ai-seo-audit" />

<AgentPreview
  agent="ai-seo-audit"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Page URL&#x22;,
    placeholder: &#x22;https://example.com/blog/how-it-works&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **AI SEO Audit Agent** evaluates a page for how readable it is to AI answer
engines — ChatGPT, Claude, and Perplexity — rather than classic blue-link
search. It fetches the page through context.dev (never touching the site
directly), then runs a **deterministic rubric** of \~30 checks across six
categories to a 0–100 total. The model doesn't eyeball the score — `audit_page`
computes it in `lib/rules.ts`, so the same page always yields the same
result. The agent presents the breakdown, lists the failing checks by impact,
and returns an **agent-ready fix prompt** you can paste straight into a coding
agent. Reach for it when you want a page to get cited by AI assistants.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/ai-seo-audit
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core context.dev
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/ai-seo-audit/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/ai-seo-audit/tools/audit_page.ts" title="tools/audit_page.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/lib/audit.ts" title="lib/audit.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/lib/rules.ts" title="lib/rules.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/lib/agent-fix-prompt.ts" title="lib/agent-fix-prompt.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/lib/audit-types.ts" title="lib/audit-types.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/lib/url.ts" title="lib/url.ts" />

      <ComponentSource src="registry/mastra/ai-seo-audit/skills/seo-audit/SKILL.md" title="skills/seo-audit/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts              # Agent definition (model + config)
├── instructions.md        # Audit-and-report instructions
├── tools/
│   └── audit_page.ts      # Runs the deterministic audit, returns the scored result
├── lib/
│   ├── audit.ts           # Fetches via context.dev, parses, and scores the rules
│   ├── rules.ts           # The ~30 checks and six category weights
│   ├── agent-fix-prompt.ts # Builds the copy-paste fix prompts from the findings
│   ├── audit-types.ts     # Shared result types
│   └── url.ts             # URL normalization helpers
└── skills/
    └── seo-audit/
        └── SKILL.md       # How the agent presents the audit_page result
```

## Customization [#customization]

* **Fetching.** The page is fetched through [context.dev](https://context.dev) —
  the recipe never hits the audited site directly. Set `CONTEXT_DEV_API_KEY`.
* **Tune the rubric.** Edit `lib/rules.ts` to add checks, reweight
  categories, or change the scoring bands — this is the single source of truth
  for the score.
* **Reshape the output.** Edit `instructions.md` or `SKILL.md` to emit
  JSON, a shorter summary, or a different fix-prompt format.
* **Swap the model.** Edit `config.ts`. The model only narrates the
  deterministic result, so any capable model works.


# Browser

A browser-operating agent that interacts with live web pages using Playwright-based tools with accessibility-tree ref ids.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="browser-agent" />

<AgentPreview
  agent="browser-agent"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder:
      &#x22;Go to news.ycombinator.com and list the top 3 story titles.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Browser Agent** completes tasks on the live web by driving a real Chromium
browser. It uses Playwright-based tools with accessibility-tree ref ids for
stable element targeting, web search as a fallback, and persists state to
Turso (libSQL). Reach for it to automate flows, scrape interactive pages, or
test UIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/browser-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @mastra/agent-browser @mastra/libsql @mastra/memory @ai-sdk/openai playwright-chromium
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/browser-agent/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/browser-agent/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/browser-agent/memory.ts" title="memory.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts          # Agent config with browser, model, and web_search tool
├── instructions.md    # Comprehensive browser operation instructions
└── memory.ts          # Memory with last 10 messages
```

## Environment Variables [#environment-variables]

```bash
BROWSER_HEADLESS=      # Optional: Set to "false" for visible browser (default: true)
BROWSER_CDP_URL=       # Optional: CDP endpoint for remote browser
TURSO_DATABASE_URL=    # Required: Turso libSQL URL for storage
TURSO_AUTH_TOKEN=      # Optional: Turso auth token
```

## How It Works [#how-it-works]

1. **Navigate** - Call `browser_goto` with the target URL
2. **Snapshot** - Call `browser_snapshot` to get the accessibility tree with ref ids
3. **Interact** - Use ref ids from snapshot for `browser_click`, `browser_type`, etc.
4. **Re-snapshot** - Take new snapshot after actions to see updated state
5. **Verify** - Take final snapshot to confirm results before reporting
6. **Fallback** - Use `web_search` for quick factual questions

## Customization [#customization]

* **Remote browser.** Set `BROWSER_CDP_URL` to connect to a remote CDP endpoint like Bright Data Browser API.
* **Headless mode.** Set `BROWSER_HEADLESS=false` for visible browser during development.
* **Swap models.** Edit the `model` field in `config.ts`.
* **Adjust steps.** Modify `maxSteps` in `config.ts` (default: 100).


# Chat with PDF

Indexes a PDF into a vector store and answers questions over it with page-cited retrieval and stratified sampling.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="chat-with-pdf" />

<AgentPreview
  agent="chat-with-pdf"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/whitepaper.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What does the paper conclude about latency?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with PDF Agent** lets you ask questions about a PDF and get answers
grounded in the document, with a page citation for every claim. It indexes the
PDF into a vector store, retrieves only the relevant chunks per question using
stratified sampling across page ranges, and can also generate comprehension
quizzes from real passages. Reach for it to turn manuals, papers, and reports
into something you can query.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/chat-with-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @mastra/libsql @mastra/rag pdf-parse
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/chat-with-pdf/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/chat-with-pdf/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/chat-with-pdf/memory.ts" title="memory.ts" />

      <ComponentSource src="registry/mastra/chat-with-pdf/lib/vector-store.ts" title="lib/vector-store.ts" />

      <ComponentSource src="registry/mastra/chat-with-pdf/tools/list_documents.ts" title="tools/list_documents.ts" />

      <ComponentSource src="registry/mastra/chat-with-pdf/tools/query_pdf.ts" title="tools/query_pdf.ts" />

      <ComponentSource src="registry/mastra/chat-with-pdf/workflows/index_pdf.ts" title="workflows/index_pdf.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts              # Agent definition (model + config)
├── instructions.md        # Detailed assistant instructions
├── memory.ts              # Memory instance for conversation history
├── lib/
│   └── vector-store.ts    # LibSQLVector store + index management
├── tools/
│   ├── list_documents.ts  # List all indexed PDF documents
│   └── query_pdf.ts       # Query with stratified page sampling
└── workflows/
    └── index_pdf.ts       # 3-step workflow: download → chunk → embed
```

## Customization [#customization]

* **Swap the vector store.** `lib/vector-store.ts` uses `@mastra/libsql` — replace it with
  Pinecone, Qdrant, Chroma, or pgvector by swapping the vector store import.
* **Tune chunking.** Adjust the `splitIntoChunks` step's `maxSize` and `overlap` in `workflows/index_pdf.ts`.
* **Swap the embedding model.** Change the model in tools and workflows from `openai/text-embedding-3-small`.
* **Add quizzes.** The instructions already support quiz generation from
  retrieved passages — extend them with your preferred format.
* **Add more tools.** Create additional tools in `tools/` — they'll be auto-discovered.


# Chat with YouTube

Fetches a video's metadata and transcript, then answers questions with clickable timestamp citations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="chat-with-youtube" />

<AgentPreview
  agent="chat-with-youtube"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;YouTube URL&#x22;,
    placeholder: &#x22;https://youtu.be/dQw4w9WgXcQ&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Summarize the video with chapter timestamps.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with YouTube Agent** answers questions about a video using its
transcript. It pulls the video's metadata and full transcript, then summarizes,
answers follow-ups, and generates chapter timestamps — each citation a clickable
link straight to that moment. Reach for it to skim long talks, lectures, or
podcasts without watching end to end.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/chat-with-youtube
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @mastra/libsql @mastra/memory youtube-transcript-scraper
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/chat-with-youtube/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/chat-with-youtube/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/chat-with-youtube/memory.ts" title="memory.ts" />

      <ComponentSource src="registry/mastra/chat-with-youtube/lib/youtube-utils.ts" title="lib/youtube-utils.ts" />

      <ComponentSource src="registry/mastra/chat-with-youtube/tools/youtube-metadata.ts" title="tools/youtube-metadata.ts" />

      <ComponentSource src="registry/mastra/chat-with-youtube/tools/youtube-transcript.ts" title="tools/youtube-transcript.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts                    # Agent definition (model + config)
├── instructions.md              # Comprehensive YouTube assistant instructions
├── memory.ts                    # Memory instance
├── lib/
│   └── youtube-utils.ts         # Video ID extraction + timestamp formatting
└── tools/
    ├── youtube-metadata.ts      # Fetch video title, author, description, duration
    └── youtube-transcript.ts    # Fetch timestamped transcript segments
```

## How It Works [#how-it-works]

1. **Get Metadata** - `fetch-youtube-metadata` retrieves video title, author, description, and duration
2. **Get Transcript** - `fetch-youtube-transcript` fetches the full transcript with timestamps
3. **Answer Questions** - The agent answers based on transcript content with clickable timestamp citations
4. **Generate Chapters** - Creates chapter timestamps in YouTube description format

## Customization [#customization]

* **Swap the model.** Edit the `model` field in `config.ts`.
* **Add chapters export.** Add a tool that writes the chapter list back as a YouTube description or VTT file.
* **Handle missing transcripts.** Fall back to an STT service when a video has no captions.
* **Swap metadata source.** Use the YouTube Data API for richer metadata.


# Claw Autonomous Assistant

Operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="claw" />

<AgentPreview
  agent="claw"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;task&#x22;,
    label: &#x22;Task&#x22;,
    placeholder: &#x22;Scaffold a Vite + React app in ./app and run the build.&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

**Claw** is an autonomous assistant that operates a sandboxed workspace to finish
multi-step tasks. It reads and writes files, runs shell commands scoped to a
workspace directory, and follows reusable skills. Reach for it as a base for
coding assistants, repo automation, or any agent that needs a real filesystem.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/claw
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/claw/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/claw/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/claw/lib/workspace.ts" title="lib/workspace.ts" />

      <ComponentSource src="registry/mastra/claw/tools/read_file.ts" title="tools/read_file.ts" />

      <ComponentSource src="registry/mastra/claw/tools/write_file.ts" title="tools/write_file.ts" />

      <ComponentSource src="registry/mastra/claw/tools/run_shell.ts" title="tools/run_shell.ts" />

      <ComponentSource src="registry/mastra/claw/skills/workspace/SKILL.md" title="skills/workspace/SKILL.md" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Autonomous, sandbox-safe instructions
├── lib/
│   └── workspace.ts      # Sandbox root + path guard
├── tools/
│   ├── read_file.ts      # Read a workspace file
│   ├── write_file.ts     # Write a workspace file
│   └── run_shell.ts      # Run a command in the workspace
└── skills/
    └── workspace/
        └── SKILL.md      # Plan / inspect / act / verify procedure
```

## Customization [#customization]

* **Harden the sandbox.** Run `run_shell` inside a container or jail; the path
  guard only constrains file paths, not arbitrary commands.
* **Add web browsing.** Pair with the [Browser Agent](/docs/agents/mastra/browser-agent)
  tools for tasks that need the web.
* **Add skills.** Drop more `SKILL.md` procedures under `skills/`.
* **Swap the model.** Edit `config.ts`.


# Company Knowledge

Indexes internal documents into a vector store and answers questions over them, with PII redaction.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="company-knowledge" />

<AgentPreview
  agent="company-knowledge"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;What's our policy on refund requests over $500?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Company Knowledge Agent** answers questions over your internal documents —
issues, wiki pages, notes. It indexes them into a vector store, searches the
corpus first, and redacts personal data (emails, phone numbers, SSNs, card
numbers, API keys) from responses. Reach for it to build an internal "ask the
company" assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/company-knowledge
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @libsql/client @ai-sdk/openai ai
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/company-knowledge/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/company-knowledge/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/company-knowledge/lib/pii.ts" title="lib/pii.ts" />

      <ComponentSource src="registry/mastra/company-knowledge/lib/vector-store.ts" title="lib/vector-store.ts" />

      <ComponentSource src="registry/mastra/company-knowledge/tools/index_document.ts" title="tools/index_document.ts" />

      <ComponentSource src="registry/mastra/company-knowledge/tools/search_knowledge.ts" title="tools/search_knowledge.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts                 # Agent definition (model + config)
├── instructions.md           # Corpus-first, PII-safe instructions
├── lib/
│   ├── pii.ts                # PII redaction helper
│   └── vector-store.ts       # libSQL vector store + embeddings
└── tools/
    ├── index_document.ts     # Add a document to the corpus
    └── search_knowledge.ts   # Search the corpus (redacted)
```

## Customization [#customization]

* **Connect sources.** Feed `index_document` from Linear, Notion, or your wiki —
  on a schedule for fresh data.
* **Swap the vector store.** Replace `lib/vector-store.ts` with pgvector/Neon,
  Pinecone, or Qdrant.
* **Tune redaction.** Edit the patterns in `lib/pii.ts` for your data.
* **Swap the model.** Edit `config.ts`.


# CSV to Questions

Summarizes a CSV dataset to stay within token limits, then generates focused analytical questions.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="csv-to-questions" />

<AgentPreview
  agent="csv-to-questions"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;CSV URL&#x22;,
    placeholder: &#x22;https://example.com/world-gdp.csv&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **CSV to Questions Agent** takes a CSV dataset and turns it into a set of
sharp, answerable analytical questions. It first summarizes the data — columns,
types, ranges, patterns — to compress large files and avoid token-limit errors,
then generates questions a data analyst would actually ask. Reach for it to
kickstart exploratory analysis or build study material from raw data.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/csv-to-questions
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/csv-to-questions/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/csv-to-questions/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/csv-to-questions/tools/fetch_csv.ts" title="tools/fetch_csv.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts            # Agent definition (model + config)
├── instructions.md      # Summarize-then-question instructions
└── tools/
    └── fetch_csv.ts     # Loads a CSV file from a URL
```

## Customization [#customization]

* **Read local files.** Swap `fetch_csv` to read from disk or object storage
  instead of a URL.
* **Control the question style.** Edit `instructions.md` to bias toward trends,
  comparisons, or hypothesis tests.
* **Swap the model.** Edit `config.ts`. A large-context model handles wide
  datasets without truncation.
* **Chunk huge files.** Summarize in row batches and merge the profiles before
  generating questions.


# Deep Search

A multi-agent deep search system that researches questions by clarifying intent, planning queries, evaluating results, and synthesizing answers.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="deep-search" />

<AgentPreview
  agent="deep-search"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;initialQuery&#x22;,
    label: &#x22;Research question&#x22;,
    placeholder:
      &#x22;What pricing models do the top 3 observability vendors use?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Deep Search Agent** is a multi-agent system that researches questions through an iterative process. It clarifies user intent, plans search queries, evaluates results for completeness, and synthesizes a comprehensive answer. The system uses 4 specialized agents working together in a workflow to produce well-researched, cited answers.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/deep-search
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @mastra/libsql
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/deep-search/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/deep-search/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/deep-search/subagents/intent-clarifier/config.ts" title="subagents/intent-clarifier/config.ts" />

      <ComponentSource src="registry/mastra/deep-search/subagents/intent-clarifier/instructions.md" title="subagents/intent-clarifier/instructions.md" />

      <ComponentSource src="registry/mastra/deep-search/subagents/research-planner/config.ts" title="subagents/research-planner/config.ts" />

      <ComponentSource src="registry/mastra/deep-search/subagents/research-planner/instructions.md" title="subagents/research-planner/instructions.md" />

      <ComponentSource src="registry/mastra/deep-search/subagents/search-result-evaluator/config.ts" title="subagents/search-result-evaluator/config.ts" />

      <ComponentSource src="registry/mastra/deep-search/subagents/search-result-evaluator/instructions.md" title="subagents/search-result-evaluator/instructions.md" />

      <ComponentSource src="registry/mastra/deep-search/subagents/answerer/config.ts" title="subagents/answerer/config.ts" />

      <ComponentSource src="registry/mastra/deep-search/subagents/answerer/instructions.md" title="subagents/answerer/instructions.md" />

      <ComponentSource src="registry/mastra/deep-search/skills/research/SKILL.md" title="skills/research/SKILL.md" />

      <ComponentSource src="registry/mastra/deep-search/workflows/deep-search.ts" title="workflows/deep-search.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts                          # Main agent config with workflow
├── instructions.md                    # Main agent instructions
├── subagents/
│   ├── intent-clarifier/
│   │   ├── config.ts                  # Intent clarifier config
│   │   └── instructions.md            # Generates clarifying questions
│   ├── research-planner/
│   │   ├── config.ts                  # Research planner config
│   │   └── instructions.md            # Writes search queries
│   ├── search-result-evaluator/
│   │   ├── config.ts                  # Search evaluator config
│   │   └── instructions.md            # Evaluates result quality
│   └── answerer/
│       ├── config.ts                  # Answerer config
│       └── instructions.md            # Synthesizes final answer
├── skills/
│   └── research/
│       └── SKILL.md                   # Research procedure
└── workflows/
    └── deep-search.ts                 # Orchestrates all agents
```

## How It Works [#how-it-works]

1. **Clarify Intent** - The intent-clarifier agent asks 3 clarifying questions to understand the user's needs
2. **Plan Queries** - The research-planner agent generates 3-5 search queries based on the clarified intent
3. **Search** - The system executes searches using Bright Data SERP API
4. **Evaluate** - The search-result-evaluator agent checks if results are sufficient
5. **Iterate** - If results are insufficient, the system loops back to step 2 (up to 4 iterations)
6. **Answer** - The answerer agent synthesizes a comprehensive, cited answer

## Environment Variables [#environment-variables]

```bash
BRIGHTDATA_API_KEY=       # Required: Bright Data API key
BRIGHTDATA_SERP_ZONE=     # Optional: Bright Data SERP zone (defaults to "serp_api")
```

## Customization [#customization]

* **Search provider.** Replace the `performSearch` function in `workflows/deep-search.ts` with another provider like [Exa](https://exa.ai), SerpAPI, or Google Custom Search.
* **Swap models.** Edit the `model` field in each subagent's `config.ts`.
* **Adjust iterations.** Modify the loop limit in `workflows/deep-search.ts` (currently 4).
* **Add more agents.** Create new subagents under `subagents/` and wire them into the workflow.


# Docs Chatbot

Answers questions about a library's functions by looking up structured documentation.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="docs-chatbot" />

<AgentPreview
  agent="docs-chatbot"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Tell me about the getPlanetaryData function.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Chatbot Agent** answers questions about a code library's API. It looks
up structured function documentation — signatures, parameters, and examples — and
answers using only what the docs say. Reach for it to drop a grounded "ask the
docs" assistant into a docs site, an IDE, or a support channel.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/docs-chatbot
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/docs-chatbot/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/docs-chatbot/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/docs-chatbot/data/functions.json" title="data/functions.json" />

      <ComponentSource src="registry/mastra/docs-chatbot/tools/lookup_docs.ts" title="tools/lookup_docs.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Docs-grounded answering instructions
├── data/
│   └── functions.json    # Sample documentation source
└── tools/
    └── lookup_docs.ts    # Looks up functions by name or keyword
```

## Customization [#customization]

* **Point at your docs.** Replace `data/functions.json` with your generated API
  docs (e.g. from TypeDoc), or change `lookup_docs` to fetch from a remote source.
* **Improve matching.** Swap the substring filter for embeddings-based search to
  handle paraphrased questions.
* **Expose it as MCP.** Wrap `lookup_docs` in an MCP server so other clients can
  query the same docs.
* **Swap the model.** Edit `config.ts`.


# Docs Expert

Answers questions about libraries and APIs by searching the live web and citing sources.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="docs-expert" />

<AgentPreview
  agent="docs-expert"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;How do I stream responses with the Vercel AI SDK?&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Docs Expert Agent** answers technical questions about libraries, APIs, and
tools by searching the live web — preferring official documentation and citing
every claim. Reach for it as a grounded "ask the docs" helper that returns
copy-pasteable answers instead of hallucinated APIs.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/docs-expert
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/docs-expert/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/docs-expert/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/docs-expert/tools/web_search.ts" title="tools/web_search.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts            # Agent definition (model + config)
├── instructions.md      # Cite-your-sources answering instructions
└── tools/
    └── web_search.ts    # Web search via the Exa API
```

## Customization [#customization]

* **Swap the search provider.** Edit `web_search.ts` for Brave, Tavily, or a
  docs-specific index.
* **Constrain to your docs.** Restrict queries to a domain to build a
  product-specific expert.
* **Add page fetching.** Add a `scrape_url` tool so the agent reads full pages.
* **Swap the model.** Edit `config.ts`.


# Extract DESIGN.md

Turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing the document in a single Claude call.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="extract-design-md" />

<AgentPreview
  agent="extract-design-md"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;domain&#x22;,
    label: &#x22;Domain&#x22;,
    placeholder: &#x22;stripe.com&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Extract DESIGN.md Agent** turns any public website into design artifacts.
The `compose_design_md` tool gathers the styleguide, brand, a homepage
screenshot, and clean page Markdown through context.dev, then returns **three
outputs**, which the agent relays verbatim:

* **DESIGN.md** — composed in **one Claude call** (screenshot passed as
  a vision image): token frontmatter (`version: alpha`, colors, typography,
  rounded, spacing, components) plus the canonical sections (Overview, Colors,
  Typography, Layout, Elevation, Shapes, Components, Do's and Don'ts).
* **Tailwind v4 `@theme` block** — derived **deterministically** from the
  styleguide + brand in `lib/derive-tokens.ts`.
* **CSS `:root` tokens** — the same tokens as vanilla CSS variables.

It follows the [designmd.supply](https://designmd.supply) pipeline — the same
prompt spec and deterministic token derivers — running on Claude.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/extract-design-md
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core context.dev ai @ai-sdk/anthropic
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/extract-design-md/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/extract-design-md/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/extract-design-md/tools/compose_design_md.ts" title="tools/compose_design_md.ts" />

      <ComponentSource src="registry/mastra/extract-design-md/lib/compose.ts" title="lib/compose.ts" />

      <ComponentSource src="registry/mastra/extract-design-md/lib/design-md.ts" title="lib/design-md.ts" />

      <ComponentSource src="registry/mastra/extract-design-md/lib/derive-tokens.ts" title="lib/derive-tokens.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts                  # Agent definition (model + config)
├── instructions.md            # Call compose_design_md, relay all three artifacts
├── tools/
│   └── compose_design_md.ts   # Returns DESIGN.md + Tailwind + CSS
└── lib/
    ├── compose.ts             # Fetches signals; Claude call + token derivers
    ├── design-md.ts           # The verbatim DESIGN.md prompt spec
    └── derive-tokens.ts       # Deterministic Tailwind v4 @theme + CSS :root tokens
```

## Customization [#customization]

* **Data source.** The styleguide, screenshot, and Markdown are pulled through
  [context.dev](https://context.dev). Set `CONTEXT_DEV_API_KEY`, and
  `ANTHROPIC_API_KEY` for the model call.
* **Reshape the document.** Edit `lib/design-md.ts` — the prompt spec is
  the single source of truth for the frontmatter keys, token names, and sections.
* **Swap the model.** Change the model in `lib/compose.ts` — it uses
  `claude-sonnet-4-6` (vision-capable). The reference uses `gpt-5.4-mini`; any
  multimodal model that can read the screenshot works.
* **Temperature.** Adjust `temperature` in `lib/compose.ts` (the reference
  uses `0.2`) to trade determinism for variety.


# Customer Feedback Summary

Retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="feedback-summary" />

<AgentPreview
  agent="feedback-summary"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;query&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;What are the critical issues from enterprise customers?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Customer Feedback Summary Agent** answers questions about your customer
feedback. It retrieves entries from your data source, categorizes them by theme
and segment, and produces an executive summary with representative quotes and
concrete recommendations. Reach for it to turn a backlog of reviews, tickets, or
survey responses into something a team can act on.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/feedback-summary
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/feedback-summary/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/feedback-summary/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/feedback-summary/tools/get_feedback.ts" title="tools/get_feedback.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Retrieve / categorize / summarize instructions
└── tools/
    └── get_feedback.ts   # Paginated feedback retrieval
```

## Customization [#customization]

* **Connect your source.** Point `get_feedback` at your database, support desk,
  or reviews API — keep the pagination + segment parameters.
* **Change the categories.** Edit `instructions.md` to use your own taxonomy
  (severity tiers, product areas, sentiment).
* **Swap the model.** Edit `config.ts` — a larger model for nuanced
  synthesis, a smaller one for speed.
* **Add a scorer.** Track summary quality across runs to tune the prompt.


# Flash Cards from PDF

Turns a PDF into study flash cards, with optional AI-generated images per concept.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="flashcards-pdf" />

<AgentPreview
  agent="flashcards-pdf"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;PDF URL&#x22;,
    placeholder: &#x22;https://example.com/biology-chapter.pdf&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Flash Cards from PDF Agent** turns a document into ready-to-study flash
cards. It extracts the text, identifies the concepts worth memorizing, and writes
concise front/back pairs — and on request, generates an illustrative image for
each card. Reach for it to build study decks from textbooks, slides, or notes.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/flashcards-pdf
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core unpdf
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/flashcards-pdf/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/flashcards-pdf/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/flashcards-pdf/tools/parse_pdf.ts" title="tools/parse_pdf.ts" />

      <ComponentSource src="registry/mastra/flashcards-pdf/tools/generate_image.ts" title="tools/generate_image.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts               # Agent definition (model + config)
├── instructions.md         # Card-writing instructions
└── tools/
    ├── parse_pdf.ts        # Extract text from a PDF
    └── generate_image.ts   # Generate an image for a concept
```

## Customization [#customization]

* **Change the card style.** Edit `instructions.md` for cloze deletions,
  definitions, or Q\&A pairs.
* **Swap the image model.** Edit `generate_image.ts` to use a different provider
  or skip images entirely.
* **Export the deck.** Add a tool that writes cards to Anki, CSV, or your SRS.
* **Swap the model.** Edit `config.ts`.


# GitHub PR Code Review

Fetches a GitHub pull request and returns adaptive, file-by-file code review feedback.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="github-review" />

<AgentPreview
  agent="github-review"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;url&#x22;,
    label: &#x22;Pull request URL&#x22;,
    placeholder: &#x22;https://github.com/owner/repo/pull/123&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **GitHub PR Code Review Agent** reviews a pull request and returns actionable
feedback. It fetches the PR's files and patches, adapts its depth to the diff
size, and reports bugs, security issues, and style notes grouped by file — ending
with an approve / request-changes recommendation. Reach for it to triage reviews
or give contributors fast first-pass feedback.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/github-review
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/github-review/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/github-review/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/github-review/tools/fetch_pr.ts" title="tools/fetch_pr.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts          # Agent definition (model + config)
├── instructions.md    # Adaptive, file-by-file review instructions
└── tools/
    └── fetch_pr.ts    # Fetches PR metadata + changed files
```

## Customization [#customization]

* **Tune the depth thresholds.** Edit `instructions.md` to change how review depth
  scales with PR size.
* **Skip more files.** Add glob patterns for generated or vendored paths.
* **Post back to GitHub.** Add a tool that creates a review via the GitHub API
  instead of replying in chat.
* **Swap the model.** Edit `config.ts`.


# Google Sheets Analysis

Reads, analyzes, and edits Google Sheets via the Sheets API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="google-sheets" />

<AgentPreview
  agent="google-sheets"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;spreadsheetId&#x22;,
    label: &#x22;Spreadsheet ID&#x22;,
    placeholder: &#x22;1A2b3C4d5E6f7G8h9I0j…&#x22;,
    type: &#x22;text&#x22;,
  },
  {
    name: &#x22;request&#x22;,
    label: &#x22;Request&#x22;,
    placeholder: &#x22;Total revenue by region and write it to F1.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Google Sheets Analysis Agent** reads a spreadsheet, answers questions about
it, and — on request — writes results back. It loads ranges in A1 notation,
computes totals/trends/joins, and updates cells only when you ask. Reach for it to
turn a sheet into a conversational analyst or to automate routine spreadsheet
edits.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/google-sheets
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/google-sheets/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/google-sheets/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/google-sheets/tools/read_range.ts" title="tools/read_range.ts" />

      <ComponentSource src="registry/mastra/google-sheets/tools/update_range.ts" title="tools/update_range.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Read-before-write analysis instructions
└── tools/
    ├── read_range.ts     # Reads a range (A1 notation)
    └── update_range.ts   # Writes values to a range
```

## Customization [#customization]

* **Use a service account.** Mint the access token from a service account for
  unattended runs.
* **Add operations.** Add tools for appending rows, formatting, or creating sheets.
* **Guard writes.** Require explicit confirmation before any `update_range` call.
* **Swap the model.** Edit `config.ts`.


# Mastra Agents

Here you can find all the agent recipes for the Mastra framework

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<AgentsList framework="mastra" />


# Meeting Notes

Turns a raw meeting transcript into a structured summary, decisions, and action items.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="meeting-notes" />

<AgentPreview
  agent="meeting-notes"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;transcript&#x22;,
    label: &#x22;Transcript&#x22;,
    placeholder: &#x22;Paste the raw meeting transcript here…&#x22;,
    type: &#x22;textarea&#x22;,
  },
]"
/>

## Summary [#summary]

The **Meeting Notes Agent** takes a raw meeting transcript and returns clean,
structured notes: a short summary, the decisions that were made, action items as
owner/task pairs, and any open questions. Reach for it to close out standups,
planning sessions, or customer calls without writing up notes by hand.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/meeting-notes
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/meeting-notes/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/meeting-notes/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/meeting-notes/tools/save_notes.ts" title="tools/save_notes.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts           # Agent definition (model + config)
├── instructions.md     # Notes-extraction instructions
└── tools/
    └── save_notes.ts   # Saves the structured notes
```

## Customization [#customization]

* **Reshape the notes.** Edit the schema in `save_notes` to add fields like
  attendees, risks, or next meeting date.
* **Persist the output.** Change `save_notes` to write to Notion, Linear, or a
  database instead of returning JSON.
* **Tune the extraction.** Edit `instructions.md` to change how owners are
  inferred or how decisions are phrased.
* **Swap the model.** Edit `config.ts` for longer transcripts or faster runs.


# Slack

Replies to Slack mentions and DMs, scoped to the thread, via the Slack Web API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="slack-agent" />

<AgentPreview
  agent="slack-agent"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;message&#x22;,
    label: &#x22;Message&#x22;,
    placeholder: &#x22;@bot what's the status of the deploy?&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Slack Agent** turns your agent into a Slack bot. It answers mentions and
direct messages, keeps each conversation scoped to its thread, and replies with
Slack formatting. Reach for it to put an assistant where your team already works —
an on-call helper, a docs bot, or a triage assistant.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/slack-agent
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/slack-agent/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/slack-agent/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/slack-agent/tools/post_message.ts" title="tools/post_message.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Slack reply style + threading instructions
└── tools/
    └── post_message.ts   # Posts a (threaded) Slack message
```

## Customization [#customization]

* **Verify signatures.** Add Slack request-signature verification in your event
  route before invoking the agent.
* **Add more actions.** Add tools for reactions, file uploads, or opening modals.
* **Scope memory by thread.** Key agent sessions on `thread_ts` for clean context.
* **Swap the model.** Edit `config.ts`.


# Chat with Database

Introspects a database schema, converts questions to SQL, and runs read-only queries.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="text-to-sql" />

<AgentPreview
  agent="text-to-sql"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;question&#x22;,
    label: &#x22;Question&#x22;,
    placeholder: &#x22;Show me the top 5 customers by revenue last quarter.&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Chat with Database Agent** answers questions about your data in plain
English. It introspects the schema, writes the SQL, runs it read-only, and
explains the results. Reach for it to give non-SQL users a safe way to query a
database, or to prototype analytics without hand-writing queries.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/text-to-sql
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core @libsql/client
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/text-to-sql/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/text-to-sql/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/text-to-sql/lib/db.ts" title="lib/db.ts" />

      <ComponentSource src="registry/mastra/text-to-sql/tools/introspect-database.ts" title="tools/introspect-database.ts" />

      <ComponentSource src="registry/mastra/text-to-sql/tools/execute-sql.ts" title="tools/execute-sql.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts                   # Agent definition (model + config)
├── instructions.md             # Introspect → SQL → execute instructions
├── lib/
│   └── db.ts                   # Database client (SQLite by default)
└── tools/
    ├── introspect-database.ts  # Lists tables and columns
    └── execute-sql.ts          # Runs a read-only SELECT
```

## Customization [#customization]

* **Swap the database.** Replace the client in `lib/db.ts` with Postgres or MySQL.
* **Allow writes (carefully).** The `run_query` tool blocks non-`SELECT` SQL by
  default — relax that only behind explicit confirmation.
* **Add row limits.** Cap result size in `run_query` to protect against huge scans.
* **Swap the model.** Edit `config.ts`.


# Weather

Looks up the current weather for a location via the Open-Meteo API.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).



<DocsBaseSwitcher base="mastra" agent="weather" />

<AgentPreview
  agent="weather"
  framework="mastra"
  inputFields="[
  {
    name: &#x22;location&#x22;,
    label: &#x22;Location&#x22;,
    placeholder: &#x22;Pune&#x22;,
    type: &#x22;text&#x22;,
  },
]"
/>

## Summary [#summary]

The **Weather Agent** is the classic starter: ask about a place and it reports the
current conditions. It geocodes the location and fetches live weather from the
free Open-Meteo API — no key required. Reach for it as a minimal, end-to-end
example of an agent with a single tool.

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger value="cli">
      Command
    </TabsTrigger>

    <TabsTrigger value="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent value="cli">
    ```bash
    npx shadcn@latest add @agentcn/mastra/weather
    ```
  </TabsContent>

  <TabsContent value="manual">
    <Steps>
      <Step>
        Install the following dependencies:
      </Step>

      ```bash
      npm install @mastra/core
      ```

      <Step>
        Copy and paste the following code into your project.
      </Step>

      <ComponentSource src="registry/mastra/weather/config.ts" title="config.ts" />

      <ComponentSource src="registry/mastra/weather/instructions.md" title="instructions.md" />

      <ComponentSource src="registry/mastra/weather/tools/get_weather.ts" title="tools/get_weather.ts" />

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Composition [#composition]

```text
├── config.ts             # Agent definition (model + config)
├── instructions.md       # Weather assistant instructions
└── tools/
    └── get_weather.ts    # Geocode + current forecast (Open-Meteo)
```

## Customization [#customization]

* **Add a forecast.** Extend `get_weather` to request daily/hourly data.
* **Add units.** Pass a `units` parameter (metric/imperial) to the API.
* **Add more tools.** This is a good base to graduate into a travel or planning
  agent.
* **Swap the model.** Edit `config.ts`.