github jbetancur/react-data-table-component v8.0.0

latest releases: v8.1.0, v8.0.1
4 hours ago

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 minimumuseId() 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 visibilityuseColumnVisibility hook with show/hide support
  • Column filter redesignFilterState 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 selectionkeyField 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

Don't miss a new react-data-table-component release

NewReleases is sending notifications on new releases.