av-grid

av-grid is the data grid from Persephone, released as its own library. It has no dependencies, works without a framework, and stays smooth with 100,000+ rows.

▶ Live demo has seventeen examples, including a 100,000-row benchmark.

100,000 rows with custom cells, pinned columns and a totals row: range selection, Excel-style copy and paste, editing, filtering, search and theming

Core features

• Virtualized on both axes. Columns are pinned on either edge, footer rows are pinned, and columns can be grouped.
• Excel-style work. You get range selection, keyboard navigation, and copy, cut and paste. Copy also works as JSON or as an HTML table.
• Editing. Cells are validated, columns with options get dropdowns, and rows and columns can be added or deleted.
• Sorting, filtering and search. It can also use server-side data.
• Custom cells, a context menu you can extend, and resizable, reorderable columns.
• Themed with CSS custom properties. There’s no build step and no CSS-in-JS.

import { AVGrid } from "av-grid";

const grid = AVGrid.create("#host", { rows: data });

Columns, widths, data types and alignment are inferred from the rows.

Already in Persephone

Open any .json, .csv or .jsonl file in Persephone and it opens in this grid. Sort it, filter it, paste from Excel, and copy back.

Source and docs: github.com/andriy-viyatyk/av-grid.