# AI Datagrid

> AI Datagrid is an open-source, forkable Next.js template for an Excel-like spreadsheet driven by an AI agent: generate columns, enrich cells, and filter or sort the grid in plain English.

AI Datagrid is a working spreadsheet in the browser — inline cell editing, column resizing and reordering, sorting, filtering, copy and paste, keyboard navigation and virtual scrolling over thousands of rows — paired with a chat composer that edits the grid for you.

Ask the assistant to generate a set of columns for a new table, to enrich selected cells with values the model infers, or to filter and sort the data in natural language. Every change the agent makes lands in the grid as a normal edit you can inspect and change.

It is a template, not a hosted product: clone it, run `pnpm install && pnpm dev`, and build your own Airtable, Notion database or Google Sheets alternative on top. It is built with Next.js 16, React 19, TanStack Table and Virtual, and eve, Vercel's agent framework, calling models through the Vercel AI Gateway. The source is MIT licensed at https://github.com/kyh/ai-datagrid.

**When to use AI Datagrid:**

- **Starting an AI-assisted spreadsheet or database UI**: fork AI Datagrid when you need an editable, virtualized grid with typed columns (short and long text, number, date, select, multi-select, checkbox, URL, file) and want an agent wired to it from day one
- **Learning how to connect an agent to client-side UI state**: the repo shows a complete eve agent whose tools (generate_columns, enrich_cells, add_filters, add_sorts and more) return typed payloads the browser applies to the grid
- **Prototyping bulk enrichment or natural-language filtering**: select cells and describe the values you want, or describe a filter in plain English, and see the tool calls applied live
- **Not a fit**: AI Datagrid is not a hosted SaaS, a data store or a public API. There are no accounts, nothing is saved server-side, and AI features need your own Vercel AI Gateway key

How to use it: send `Accept: text/markdown` to any page URL to get this kind of Markdown instead of HTML. To run it yourself, `git clone https://github.com/kyh/ai-datagrid`, add an `AI_GATEWAY_API_KEY` to `.env.local`, and run `pnpm dev`; the repo's AGENTS.md is written for coding agents.

## Demos

- [Spreadsheet](https://datagrid.kyh.io): a blank 26-column spreadsheet to type into or generate from
- [Companies](https://datagrid.kyh.io/companies): 50 sample companies
- [People](https://datagrid.kyh.io/people): 50 sample people covering every column type
- [Articles](https://datagrid.kyh.io/articles): 50 sample articles with date columns
- [Generate demo](https://datagrid.kyh.io/generate-demo): the agent designs and adds columns from a prompt
- [Enrich demo](https://datagrid.kyh.io/enrich-demo): select cells, then ask the agent to fill them in
- [Filter and sort demo](https://datagrid.kyh.io/filter-sort-demo): the agent turns a plain-English request into filters and sorts

## About

- [About](https://datagrid.kyh.io/about): What AI Datagrid is, how it works, and who maintains it.
- [Contact](https://datagrid.kyh.io/contact): How to reach the maintainer of AI Datagrid.
- [Privacy](https://datagrid.kyh.io/privacy): What AI Datagrid collects, and where your prompts and API key go.

## Optional

- [Sitemap](https://datagrid.kyh.io/sitemap.xml): every indexable URL
- [robots.txt](https://datagrid.kyh.io/robots.txt): crawler policy; AI agents are welcome
- [Source on GitHub](https://github.com/kyh/ai-datagrid): MIT licensed
- [AGENTS.md](https://github.com/kyh/ai-datagrid/blob/main/AGENTS.md): how to run and verify the template headlessly
