SpreadSheet NPM package is no longer available for purchase/license. Stay tuned.
UPDATE: Now with Formula Support

SpreadSheet Grid

Excel-like DataGrid component for React JS. Built for high performance rendering similar to google sheets.

  • High performance (uses canvas for rendering)
  • Declarative
  • Easily customizable
  • Supports row, column freezing, autofilter views, cell styling and formatting etc
  • Formulas with Cross-sheet references
  • View features
Get StartedDemo
fx

Sheet1

Developer friendly

SpreadSheet Grid is very easy to implement and it is highly customizable

Built using React

Declaratively render cells, editors, tooltips, context menu very quickly

High Performance

Data is rendered in Canvas, which means no DOM nodes. So you are able to display millions of rows and columns without any peformance impact.

Features

No data-binding

SpreadSheet Grid can work as a controlled and uncontrolled component. It renders based on the props just like any React component.

Frozen rows and columns

Freezing rows and columns is a breeze. You can customize this on for each sheet.

Learn more

Autofilters

Filter views lets you slice and dice data right in the SpreadSheet Grid

Learn more

Custom Editors

You can use your own React component as Cell Editors

Learn more

Custom Cell Renderers

Using React Konva, you can declaratively render any canvas element on to SpreadSheet Grid.

Learn more

Data validation

Validate your data, prompting user to select from dropdown, datepicker, checkbox etc

Learn more

Styling

Each cell in the grid can be customized as per your liking. Add borders, colors, stroke styles or custom gradients very easily.

Learn more

Copy/Paste/Cut and Undo/Redo

All operations have first-class support in SpreadSheet Grid.

Learn more

Custom fonts

You can use any fonts in SpreadSheet Grid. It can be linked locally or loaded from Google fonts, typekit, fonts.com etc.

Learn more

Context Menu

Either use the built-in Context Menu or easily switch to your own React Component

Learn more

Merge cells

Merging multiple cells is a breeze. Use this to create nested or spanned headers or data.

Learn more

Export and Import Excel and CSV files

You are able to import any excel or csv files to SpreadSheet Grid. Exporting to the formats is also supported.

Learn more

Hide, Insert, Delete rows and columns

Rows and columns can be easily hidden or shown. Currently these functions are available in Context Menu or as Sheet Config

Learn more

Text Formatting

Full support for text formatting, just like Excel and Google sheets. Align, change fonts, make text bold, add underline or custom number format is very easy.

Learn more

Data types

SpreadSheet Grid supports numbers, string, checkbox, hyperlink, error, date (soon), rich text(soon), formula(soon)

Learn more

Dark mode

Excel may not support it yet, But SpreadSheet Grid does. Switch to dark mode and start working on your datasheet at your convenience.

Outline/Grouping support (coming soon)

Allow collapsing rows and columns using native excel outline feature.

Filter sorting (coming soon)

Currently, sorting should be done outside SpreadSheet Grid, but core support is landing soon.

Conditional formatting (coming soon)

Currently conditional formatting can be done using a custom cell renderer. Core support will be available soon.

Formula (beta)

Make complex calculations, with cross-sheet references, external data source etc. High performance as calculations run in a separate thread.

Learn more