v8.4.0

8.4.0

New features

• Removable sorting — clicking a sorted header now cycles asc → desc → unsorted, so a sort can be cleared without reloading the page. → Sorting docs
• Multi-column sorting — new sortMulti prop. Ctrl/⌘-click headers to build a sort stack; priority follows click order and a numbered badge marks each sorted column. → Sorting docs (#1325)
• SortColumn<T> type exported — represents a single entry in the sort stack ({ column, sortDirection }).
• onSort gains a fourth sortColumns: SortColumn<T>[] argument with the full sort config. Existing three-argument handlers are unaffected.

Behavior changes

• A third click on a sorted header now removes the sort (previously it stayed on descending). Server-side onSort handlers should treat an empty sortColumns array as "no sort" and drop their ORDER BY. This was always the intent buy 8.0.0 accidentally shipped without it

v8.3.0

New features

• Localization — new localization prop on DataTable replaces the three separate option props (columnFilterOptions, expandableRowsOptions, and pagination aria-label fields on paginationComponentOptions). Pass a single object to translate every string and aria-label in the table — filter panel, pagination navigation, and expand/collapse buttons. → Localization docs
• Built-in locales — import pre-built translations from the react-data-table-component/locales subpath. Ships with: English (en), French (fr), Spanish (es), German (de), Brazilian Portuguese (ptBR), Arabic — Modern Standard (ar), Egyptian (arEG), Levantine (arLV), Hebrew (he), Chinese Simplified (zhCN), Chinese Traditional (zhTW), Japanese (ja), Korean (ko), Ukrainian (uk). Each locale is individually tree-shakeable.
• New utility exports: emptyFilterState(type) and isFilterActive(filter). → Filtering docs

Deprecations

The following will continue to work in 8.x but will be removed in v9. TypeScript will show a deprecation hint.

• columnFilterOptions prop — use localization with a filter key instead.
• expandableRowsOptions prop — use localization with an expandable key instead.
• Pagination aria-label fields on paginationComponentOptions (navigationAriaLabel, firstPageAriaLabel, previousPageAriaLabel, nextPageAriaLabel, lastPageAriaLabel) — use localization with a pagination key instead.
• ColumnFilterOptions and ExpandableRowsOptions types — use Localization['filter'] and Localization['expandable'] instead.

v8.2.0

What's Changed

• feat: implement clearSort functionality and add SortResetDemo example (#1320)
• feat: add onScroll prop to table API (#1319)
• feat: add pagination position feature with top, bottom, and both options (#1318)
• feat: add footer row support with customizable content (#1317)
• feat: add controlled paginationPage prop and update API documentation (#1316)
• chore: update issue templates and add contributing guidelines (#1315)

Full changelog: v8.1.0...v8.2.0

v8.1.0

Release Notes for v8.1.0

Additive feature release. No breaking changes.
See what's new for narrative coverage.

New features

• Inline editing now supports number, date, checkbox, and custom editor types.
  New column-level validate hook gates the edit before onCellEdit fires.
  → Inline editing
• Shift-click range selection on row checkboxes.
  Enabled by default — opt out with selectableRowsRange={false}.
  New selectedRows prop drives controlled selection.
  → Row selection
• New headless export hook useTableExport: build CSV/JSON, trigger a download, or copy to clipboard.
  → Export

Bug fixes & polish

• Expandable row open/close animation now works correctly.
  Switched from a max-height tween (which appeared instant at realistic content heights) to the CSS grid grid-template-rows: 0fr → 1fr trick, giving a true height transition.
  Close animation added — the row stays mounted while animating out, then unmounts. Both directions respect animateRows and prefers-reduced-motion.
• Fixed useLayoutEffect SSR warning in Next.js App Router and Astro SSR modes.
  The effect now falls back to useEffect on the server.
  → SSR
• Inline editing: added CSS for checkbox and custom editor types, and validation error tooltip styles (.rdt_cellEditError, .rdt_editErrorTip).

v8.0.1

v8.0.1

Patch release with internal improvements, dependency updates, and CI automation.

Bug Fixes & Improvements

• Memoization improvements — enhanced useEffect and useMemo hooks across DataTable components to reduce unnecessary re-renders
• useIsomorphicLayoutEffect — introduced in column resizing logic for correct SSR behavior
• useColorMode simplified — streamlined state management for color mode detection
• Removed unused onSort callback from useTableState to clean up internal props

Internal / DX

• ESLint upgraded — migrated from .eslintrc.js to flat config (eslint.config.js); updated all plugins to latest versions
• @testing-library/dom added as dev dependency; @testing-library/react updated
• Test cleanup — removed unnecessary eslint-disable comments across test files; refactored Checkbox to eliminate no-param-reassign suppression
• Linting scripts — simplified to remove file extension filtering from source directory
• Build — migrated from yarn to npm; removed yarn.lock
• CI — added automated release workflow with npm Trusted Publishing (OIDC)

v8.0.0: Refactor/v8 (#1308)

v8.0.0

This is a major release with significant breaking changes. It modernizes the library's internals, drops styled-components, and requires React 18+.

Breaking Changes

• React 18 minimum — useId() and useTransition() are now required
• styled-components removed — replaced with plain CSS (DataTable.css) using rdt_ class namespace
• CSS custom properties — theming now uses --rdt-* CSS variables via the theme prop; ThemeProvider is replaced by StylesContext
• clearSelectedRows prop removed — replaced with an imperative ref API: useRef<DataTableHandle> → ref.current.clearSelectedRows()
• TableProps split — broken into SelectionProps, PaginationProps, ExpandableProps, and SortProps
• filterValues / onFilterChange — now accept a structured FilterState object instead of a plain string
• deepmerge dependency removed — replaced with inline mergeDeep<T>
• Build output changed — rollup replaced with tsup; ships ESM + CJS + DTS; CSS is inlined into JS by default (no separate CSS import needed unless using the ./css export)

New Features

• Column visibility — useColumnVisibility hook with show/hide support
• Column filter redesign — FilterState supports multiple operators, conditions, and AND/OR logic toggles; filterType prop specifies input type per column
• Column resize — extracted into useColumnResize hook
• Skeleton loading — built-in skeleton load state
• Middle-click row interactions — support for opening rows in a new tab
• Row selection — keyField support with selectedIdSet for improved performance
• HeadContext / RowContext — eliminates prop drilling in DataTableHead
• aria-sort — added to sortable column headers for improved accessibility
• TablePaginationFooter and ColumnFilter components added
• DataTableHandle type exposes imperative clearSelectedRows() API

Internal / DX

• Jest + jest-styled-components replaced with Vitest
• Storybook replaced with Astro docs site
• Build migrated from rollup + yarn to tsup + npm
• src/DataTable/ restructured into flat src/components/ layout
• Action<T> discriminated union now includes ColumnsAction<T> with exhaustiveness check

v7.7.1

bump version

v7.7.0

What's Changed

• Fix Markdown Tables in Storybook (Netlify) by @ADTC in #1204
• Fix width of table columns and fix some mistakes in Storybook (Netlify) by @ADTC in #1206
• Add support for table aria-label (accessibility) by @deiberchacon in #1273
• bump deps by @jbetancur in #1274

New Contributors

• @ADTC made their first contribution in #1204
• @deiberchacon made their first contribution in #1273

Full Changelog: v7.6.2...v7.7.0

v7.6.2

What's Changed

• Fix declarations by @jbetancur in #1199

Full Changelog: v7.6.1...v7.6.2

v7.6.1

What's Changed

• fix broken stories by @jbetancur in #1197

Full Changelog: v7.6.0...v7.6.1