Skip to content

Latest commit

 

History

History
45 lines (31 loc) · 1.59 KB

README.md

File metadata and controls

45 lines (31 loc) · 1.59 KB
Raw

Build Status codecov

Extensions for React-Datasheet

React-Datasheet provides a strong core of data grid functionality that can be easily extended to support different behaviors through it's use of render props. This packages adds custom renderers to support:

  • Reordering columns and rows via drag-and-drop
  • Resizing columns by dragging

Installation

Install from npm (install react-datasheet also):

$ npm install --save react-datasheet-ex

To use the drag-and-drop features, install react-dnd as well:

$ npm install --save react-dnd react-dnd-html5-backend

Import as needed:

import {Sheet, Row} from 'react-datasheet-ex';
import {DragDropHeader, DragDropRow} from 'react-datasheet-ex/drag-drop';
import {WidthResizeHandle, ResizableHeaderContainer, ResizableHeader} from 'react-datasheet-ex/resize';

// we need a few styles, too
import 'react-datasheet-ex/react-datasheet-ex.css';

Documentation

Storybook examples and documentation here: https://patrick-jones.github.io/react-datasheet-ex/

The story source code is also a good place to look for guidance.