Real Excel files.
Inside your app.

"use client";
import { Spreadsheet } from "gridpath";

export function Sheet({ file }: { file?: ArrayBuffer }) {
  return (
    <div style={{ height: 600 }}>
      <Spreadsheet file={file} fileName="Budget.xlsx" />
    </div>
  );
}

That's a working spreadsheet with a toolbar, autosave and version history. Problems arrive at onError with a code and a hint you can show: a CSV gets "a text file, not an .xlsx workbook", not a blank grid.

import { Spreadsheet, httpStore } from "gridpath";

const store = httpStore({
  url: "/api/books",
  // Called before every request; leave it out with cookie sessions.
  headers: async () => ({ Authorization: `Bearer ${await getToken()}` }),
});

<Spreadsheet store={store} documentId={book.id} />

// Your API: PUT and GET /api/books/{id}, GET /api/books,
// GET /api/books/{id}/versions. The Next.js example has the routes.

The status says where edits are. While your backend can't be reached, they wait in the browser and the save retries; if the tab closes first, they reopen next time. The REST contract

import Anthropic from "@anthropic-ai/sdk";
import { AGENT_INSTRUCTIONS, agentTools } from "gridpath/agent";

export async function POST(req: Request) {
  const { messages } = await req.json();
  const reply = await new Anthropic().messages.create({
    model: "claude-opus-5-5",
    max_tokens: 16000,
    system: AGENT_INSTRUCTIONS,
    tools: agentTools(),
    messages,
  });
  return Response.json(reply);
}
// In the browser: run each tool call with sheet.ai.run(name, input).

Your model and your key, on your server; GridPath never sees either, or the file. The agent's edits land highlighted and nothing is saved until the user accepts them. The browser loop is twenty lines