React Datasheet screenshot

React Datasheet

Author Avatar Theme by Nadbm
Updated: 23 May 2022
5434 Stars

Excel-like data grid (table) component for React

Overview:

React-Datasheet is a simple react component designed to create a spreadsheet. It allows users to select cells, cut, copy, paste, and navigate using keyboard keys. While this project is seeking new maintainers, it currently offers various features including callbacks for onCellsChanged, the ability to supply custom editors and view controls, and extensive control over generated markup through custom renderers.

Features:

  • Select cells, cut, copy, and paste cells
  • Navigation using keyboard keys
  • Deletion using keyboard keys
  • Callbacks for onCellsChanged
  • ValueRenderer for visible data
  • DataRenderer for underlying data
  • Custom editors and view controls with custom renderers
  • Extensive control over generated markup via custom renderers

Installation:

To install React-Datasheet, follow these steps:

  1. Install from npm:
    npm install react-datasheet
    
  2. Import in your project:
    import DataSheet from 'react-datasheet';
    

Summary:

React-Datasheet is a user-friendly react component that enables the creation of spreadsheets within a web application. It provides essential features like cell selection, copy-paste functionality, keyboard navigation, and customizable renderers for data display. While the project is currently seeking new maintainers, it remains a useful tool for those looking to incorporate spreadsheet capabilities into their React-based projects.