A React spreadsheet component with Excel and CSV built in

Read and write Excel (.xlsx) and CSV in the browser, evaluate spreadsheet formulas, and render an editable, virtualized data grid — from one package with no runtime dependencies.

Open the demos Source on GitHub a1sheet on npm

Try it

A quarter of regional numbers: currency and percent formats, a frozen header, a total row, conditional formatting on attainment, and a SORT that re-ranks the block below. Click a cell and type — the formulas recalculate as you go.

Loading the live spreadsheet… (it needs JavaScript; everything else on this page does not.)

This is the library itself, built from the current commit — not a video or a screenshot.

Install

npm install a1sheet     # React is a peer dependency

import { Spreadsheet } from "a1sheet/react";

<Spreadsheet defaultWorkbook={wb} />;

What it does

Excel and CSV, both directions

Import keeps number formats, fonts, fills, borders, merges, freeze panes, column widths, tables, conditional formats, data validation, defined names, and in-cell images. Export writes them back.

A formula engine

Over 100 functions including the dynamic-array set — LET, LAMBDA, MAP, SORT, UNIQUE, FILTER, XLOOKUP — with arrays that spill, structured table references, and cycle detection.

A grid that scales

Rows and columns are both virtualized over a real scroll extent. A 100,000-row sheet scrolls through 2,600,026 px with about a dozen rows mounted.

Composition, not configuration

Sheet.Root holds the state; every other part is a child you place, replace, or leave out. There is no showToolbar prop — an absent toolbar is an unrendered <Sheet.Toolbar/>.

Zero runtime dependencies

No grid library, no XLSX library, no date library. The ZIP reader, the DEFLATE codec, the OOXML scanner, the formula engine, and the grid are all in the package, and a test fails if a dependency is ever added.

Runs without React too

The a1sheet entrypoint never imports React, so file handling and formula evaluation work in Node and in a Web Worker. a1sheet/react is the only place React appears.

Common questions

How do I read an .xlsx file in React?

import { readWorkbookFile } from "a1sheet";

const { sheets, namedRanges } = await readWorkbookFile(file);

How do I export a spreadsheet to Excel from the browser?

import { downloadXlsx } from "a1sheet";

downloadXlsx(sheets, { filename: "report.xlsx" });

Can I evaluate formulas without rendering anything?

import { createEvaluator } from "a1sheet";

const ev = createEvaluator({ "0_0": "6", "1_0": "=A1*7" }, {});
ev.getCellDisplay(1, 0); // 42

Is CSV export safe to open in Excel?

Yes. Values starting with =, +, -, @, tab, or CR are neutralized on the way out, because a CSV opened in a spreadsheet application will otherwise execute them. Download filenames are sanitized against separators and traversal.

How does it compare to SheetJS, ExcelJS, or AG Grid?

If you need	Consider
Only to parse or write spreadsheet files, no UI	SheetJS (`xlsx`), ExcelJS, PapaParse for CSV
Only a grid, with your own data layer	react-data-grid, AG Grid, Handsontable, TanStack Table
Only a formula engine	HyperFormula, formula.js
Files, formulas, and an editable grid that agree with each other	a1sheet

Check each one's license and bundle size against your own constraints — they differ, and some grids are commercially licensed. a1sheet is MIT with an empty dependencies.

Documentation

The Storybook is the documentation: 12 pages and 49 interactive stories covering composition, formulas, file I/O, theming, state, and scale. Every story is executed by the test suite, so a broken demo fails CI rather than failing in front of you.

The README covers the API, and LIMITATIONS.md lists every gap with the extension point where the work would start.