- Added:
- Props:
onSelectedCellChange
⚠️ This replaces theonCellSelected
andonCellDeSelected
props
enableFilters
⚠️ This replaces theenableHeaderFilters
andcolumn.filterable
props
filters
onFiltersChange
enableCellCopyPaste
enableCellDragAndDrop
rows
⚠️ This replace therowGetter
androwsCount
props
rowClass
column.cellClass(row)
function support:column = { ..., cellClass(row) { return string; } }
column.minWidth
column.maxWidth
column.headerCellClass
column.formatterOptions
- More info in #2104
scrollToRow
method⚠️ This replaces thescrollToRowIndex
prop
- Props:
- Removed:
- Support:
⚠️ IE11
- Packages:
⚠️ react-data-grid-addons
- Props:
⚠️ cellContentRenderer
⚠️ contextMenu
- Check the Context Menu example
⚠️ enableCellSelect
⚠️ enableCellAutoFocus
⚠️ getValidFilterValues
⚠️ onCellCopyPaste
⚠️ onSelectedCellRangeChange
⚠️ onGridKeyDown
⚠️ onGridKeyUp
⚠️ onRowDoubleClick
⚠️ onHeaderDrop
⚠️ draggableHeaderCell
- Check #2007 on how to migrate
⚠️ rowGroupRenderer
⚠️ onRowExpandToggle
- Check #2012 on how to migrate
⚠️ rowsContainer
⚠️ Subrow props:getSubRowDetails
,onCellExpand
,onDeleteSubRow
, andonAddSubRow
- Check #1853 on how to migrate
⚠️ cellMetaData
(fromRow
andCell
props)⚠️ value
(fromcolumn.formatter
props)
- Ref handlers:
⚠️ openCellEditor
, useselectCell
instead.
⚠️ React elements are no longer supported, please use components instead.- For example:
const column = { key: 'example', name: 'Example', - formatter: <CustomFormatter length={5} /> + formatter: (props) => <CustomFormatter {...props} length={5} /> };
⚠️ column.events
⚠️ column.getCellActions
- Check #1845 on how to migrate
⚠️ column.getRowMetaData
⚠️ column.filterable
⚠️ column.draggable
⚠️ cellRangeSelection.{onStart,onUpdate,onEnd}
⚠️ fromRowId
,toRowId
, andfromRowData
fromonRowsUpdate
argument⚠️ Stopped exportingHeaderCell
- Support:
- Renamed:
⚠️ minHeight
toheight
⚠️ minWidth
towidth
⚠️ onGridSort
toonSort
⚠️ onGridRowsUpdated
toonRowsUpdate
⚠️ emptyRowsView
toemptyRowsRenderer
⚠️ rowData
torow
⚠️ fromRowData
tofromRow
⚠️ idx
torowIdx
inRow
renderer
- Changed:
⚠️ Started publishing ES2020/ESM modules instead of ES5/CommonJS modules.- Using
@babel/preset-env
withcore-js
is recommended to enable compatibility for the browsers your project aims to support.
- Using
⚠️ Improved support for summary rows:summaryRows
types are now independent fromrows
- Added
column.summaryCellClass
andcolumn.summaryFormatter
props column.formatter
isn't used anymore to render summary row cells.
- Only visible headers cells are now rendered. #1837
⚠️ therowKey
prop is now required for row selection.⚠️ column.cellClass
does not affect header cells anymore.⚠️ onScroll
will directly pass the UIEvent rather than the scrollLeft and scrollRight only.
- Added:
- TypeScript declaration files
column.cellContentRenderer
- More info in this gist
summaryRows
prop #1773sortColumn
andsortDirection
props⚠️ The internal sort states have been removed.- Check #1768 on how to migrate.
selectedRows
andonSelectedRowsChange
props⚠️ Row selection has been reimplemented.- A new
SelectColumn
is now available to import and add a row selection column. - Check #1762 on how to migrate.
- Removed:
- Packages:
react-data-grid-examples
- Use the website as reference, or clone the repo locally and run
npm install
+npm start
- Use the website as reference, or clone the repo locally and run
- Props:
⚠️ onCellsDragged
⚠️ onDragHandleDoubleClick
⚠️ onRows
⚠️ onRowUpdated
⚠️ rowScrollTimeout
⚠️ toolbar
- Check #1769 on how to migrate
⚠️ isScrolling
(fromcolumn.formatter
props)
⚠️ ContainerEditorWrapper
⚠️ EditorBase
⚠️ setScrollLeft
fromRow
andCell
rendererssetScrollLeft
instance method was previously required on custom Cell and Row renderers and it can be safely removed now.- More info in #1793
⚠️ Dropped ImmutableJS support.⚠️ Dropped dynamic height row support.- This was not officially supported, but it was still possible to implement dynamic rows via custom Row renderer. This was a buggy feature so it has been removed.
⚠️ Removed row reordering support.
- Packages:
- Renamed:
ReactDataGrid
toDataGrid
- Changed:
⚠️ The stylesheets are now bundled separately:react-data-grid/dist/react-data-grid.css
⚠️ Reimplemented stylesheets, renamed various class names #1780- No longer depends on bootstrap
- Resizing a column now immediately resizes all its cells instead of just its header.
- Improved performance across the board.
⚠️ react-data-grid-addons
has no default export anymore- Use
import * as DataGridAddons from 'react-data-grid-addons';
instead
- Use
⚠️ The stylesheets are now bundled separately:react-data-grid-addons/dist/react-data-grid-addons.css
- Removed:
⚠️ AutoComplete
editor⚠️ Utils
- Bugfix: fix: draggable resizing col jumps to right (1421)
- Bugfix: Cell Tooltip - Focus Issues (1422)
- Bugfix: Fix formatter exports (1409)
- Bugfix: Fix outside click logic for committing changes (1404)
- TechDebt Add ESLint Rules (1396 1397 1396 1399)
- TechDebt: Upgrade build tools to latest versions (1350)
- Feature: Cleanup zIndex logic (1393)
- Breaking Use react portals for cell editors (1369)
- TechDebt: Upgrade build tools to latest versions (1350)
- Bugfix: Custom Formatters Example - Styling Fix (1364)
- Bugfix: Fix website publishing and remove ImmutableJS dependency (1366)
- Bugfix: Remove react-data-grid dependency from the addons package (1354)
- Bugfix: Fix drag fill in IE 11 (1359)
- Bugfix: Ensure webpack uses correct common js external ref (1370)
- Feature: Move DropTargetRowContainer static styles to CSS class for user customization (1308)
- Bugfix: Replace use of i for column index which is no longer passed in (1344)
- Bugfix: Remove utils from documentation as an exported module (1374)
- TechDebt: Upgrade eslint packages (1376)
- Bugfix: Cleanup DraggableContainer and fix styles (1379)
- Bugfix: Fix frozen-columns source url (1355)
- TechDebt: Defining the ref callback as a bound method (1353)
- Bugfix: Fix cell focusing logic (1352)
- Bugfix: RDG Tree Cell Expand Styling Issues (1316)
- Bugfix: Fix grouping example (1311)
- Bugfix: Remove contain layout css (1346)
- Bugfix: Preserve window scroll position on cell selection (1349)
- Bugfix: Fix CopyMask columns (1289)
- Feature: Improve Cell navigation Performance (1123)
- Feature: Scrolling improvements (1254)
- Feature: Remove react-data-grid dependency from react-data-grid-addons bundle (1272)
- Bugfix: Fix editor refs (#1183)
- Feature: Support
React v16
(#1116) - Feature: Set sort column and direction with props (#649)
- Bugfix: Filtering should ignore null values (#1147)
- Bugfix: Resize column doesnt work on firefox when also draggable (#1121)
- Breaking: Migrate to
react-context-menu 2.9.2
(#1081)