Spreadsheet

AI Datagrid: an AI spreadsheet template

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.

How it works

Each chat message is sent to one agent built with eve. Along with your words, the browser sends a compact description of the grid — its columns and their types, the active filters and sorts, and any cells you have selected — so the model can reason about the sheet without reading every row.

The agent answers by calling tools. Every tool returns a typed payload, validated with zod on both sides, and the browser applies it to the grid exactly as if you had made the edit yourself: new columns appear, filters narrow the rows, enriched values fill the selected cells.

Because the grid state stays in the browser and the agent only ever proposes edits, nothing is lost if a model call fails, and the same pattern carries over to any client-side editor you want an agent to drive.

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

What the grid does

  • Spreadsheet editing — click or press Enter to edit a cell in place, Tab and the arrow keys to move, Shift and Cmd or Ctrl plus the arrows to extend a selection, and Cmd or Ctrl+Z to undo
  • Copy, cut and paste — move ranges between cells, or paste tab-separated data from Excel, Google Sheets or Numbers; the grid offers to add rows when a paste runs past the end
  • Columns you can shape — resize and reorder columns by dragging, and pin, hide, sort or configure any column from its header menu
  • Filtering and sorting — stack multiple filters and multi-column sorts per view, with operators matched to each column type
  • Virtual scrolling — rows and columns are virtualized with TanStack Virtual, so a thousand-row sheet scrolls as smoothly as ten rows
  • Row height and density — switch between short, medium, tall and extra-tall rows to fit long text

Column types

  • Short text — names, titles and other single-line values
  • Long text — notes, descriptions and comments, edited in a larger popover
  • Number — prices, quantities and scores, with optional min, max and step
  • Date — deadlines and publish dates, picked from a calendar
  • Select — one option from a fixed list, such as status or priority
  • Multi-select — several options at once, such as tags or skills
  • Checkbox — true or false values like done, active or verified
  • URL — links to websites and resources
  • File — attachments such as documents and images

What the AI assistant can do

  • generate_columns — designs a table from a description ("a sales pipeline", "a reading list") and adds typed columns with sensible options
  • update_columns — renames columns, changes their type, or edits their options and AI prompt
  • delete_columns — removes columns you no longer need
  • enrich_cells — fills the cells you selected with model-generated values, one structured call per cell, following each column's prompt
  • add_filters, remove_filters, clear_filters — turn a plain-English condition into grid filters and back
  • add_sorts, remove_sorts, clear_sorts — order rows by one or more columns from a spoken request

Keyboard shortcuts

  • Arrow keys, Tab, Shift+Tab — move between cells
  • Home, End, Cmd+arrow — jump to the first or last column or row
  • Shift+arrow, Cmd+Shift+arrow — extend the selection one cell or to the edge of the table
  • Cmd+A — select every cell
  • Enter, F2 or double-click — start editing a cell; Shift+Enter inserts a row below
  • Cmd+C, Cmd+X, Cmd+V — copy, cut and paste cell ranges
  • Delete or Backspace — clear the selected cells; with Cmd, delete the selected rows
  • Cmd+Z, Cmd+Shift+Z — undo and redo
  • Cmd+F — search the grid, with Enter and Shift+Enter to step through matches
  • Cmd+Shift+F, Cmd+Shift+S — open the filter or sort menu

Demos

  • Spreadsheet — a blank 26-column spreadsheet to type into or generate from
  • Companies — 50 sample companies
  • People — 50 sample people covering every column type
  • Articles — 50 sample articles with date columns
  • Generate demo — the agent designs and adds columns from a prompt
  • Enrich demo — select cells, then ask the agent to fill them in
  • Filter and sort demo — the agent turns a plain-English request into filters and sorts

Questions

  • Is it free? — yes. The template is MIT licensed. AI requests are billed by Vercel AI Gateway to whichever key runs them — yours on the demo, or your server's when you deploy your own copy
  • Do I need an account? — no. The grid works without signing in or entering anything; only the AI assistant asks for a Vercel AI Gateway key
  • Where is my data stored? — only in your browser tab. There is no database, and reloading the page resets the sample data
  • Which model does it use? — an OpenAI model routed through Vercel AI Gateway; the model id lives in one file, so swapping providers is a one-line change
  • Can I use it in my own product? — yes — fork the repository, replace the sample data with your own source, and keep or drop the agent tools you need

More

  • About — What AI Datagrid is, how it works, and who maintains it.
  • Contact — How to reach the maintainer of AI Datagrid.
  • Privacy — What AI Datagrid collects, and where your prompts and API key go.
  • /llms.txt — this overview for language models
  • /sitemap.xml — every indexable URL
  • Source on GitHub — clone, fork or file an issue
Add row