dorj-data-grid

A flexible and feature-rich React data grid component, supporting inline and form editing, custom renderers, Persian date support, and more.

Features

• Inline and form-based editing modes
• Custom cell renderers and editors
• Support for Persian dates and localization
• Paging, sorting, and filtering
• Row selection and bulk actions
• Integration with Material-UI and FontAwesome
• Copy/paste rows as JSON
• Extensible with custom forms and row headers/footers

Installation

npm install dorj-data-grid

Usage

import DataGrid from 'dorj-data-grid';

const options = {
  columns: [
    { name: 'id', label: 'ID', kind: 'int', isReadOnly: true },
    { name: 'name', label: 'Name', kind: 'text' },
    // ...other columns
  ],
  canAdd: true,
  canDelete: true,
  editMode: 'inline', // or 'form', 'externalForm'
  // ...other options
};

const api = {
  queryData: async () => { /* fetch data */ },
  createData: async () => { /* create new row */ },
  updateData: async (record, name, value) => { /* update cell */ },
  deleteData: async (ids) => { /* delete rows */ },
  // ...other API methods
};

<DataGrid options={options} api={api} />

Development

• Build: npm run build
• Dev: npm run dev

License

MIT

Author: Dorj IT