Skip to main content
This guide covers changes to the beta DataTable component. These APIs may continue to evolve before the stable release.

​
Overview

The row activation API has been removed from DataTable. The following props are no longer available:
  • isActivatable — Removed.
  • activeRowIds — Removed.
  • defaultActiveRowIds — Removed.
  • onActivateRow — Removed.
Consumers that used row activation should migrate to row selection instead, using the existing isSelectable, selectedRowIds, defaultSelectedRowIds, and onSelectRow props. onClickRow has been added for consumers who need both.

​
Design Rationale

​
Why remove row activation?

Row activation and row selection were two overlapping interaction patterns that served the same purpose—reacting to a user choosing a row. Maintaining two parallel APIs added complexity without a clear UX distinction. Since DataTable is a beta component, removing the activation API now keeps the surface clean before the stable release. Row selection with onSelectRow handles the same use cases. If your previous onActivateRow handler opened a drawer or performed a side effect on row click, you can wire that same logic into onSelectRow.

​
Migration Guide

​
Simple case: activation only

If you were only using isActivatable and onActivateRow with no separate selection, swap to isSelectable and onSelectRow: 
// Before
<DataTable
  isActivatable
  onActivateRow={(rowId) => openDrawer(rowId)}
  rows={rows}
  columns={columns}
/>

// After
<DataTable
  isSelectable
  onSelectRow={(rowId) => openDrawer(rowId)}
  rows={rows}
  columns={columns}
/>
isSelectable renders a checkbox column for each row. If you previously relied on clicking anywhere on the row to trigger activation, users will now click the checkbox to trigger onSelectRow. Consider whether this UX change is acceptable for your use case.

​
Combined case: activation and selection together

If your table used both isActivatable (e.g., to open a drawer) and isSelectable (e.g., to populate a selected-IDs set), combine both callbacks into onSelectRow: 
// Before
<DataTable
  isActivatable
  onActivateRow={(rowId) => openDrawer(rowId)}
  isSelectable
  selectedRowIds={selectedIds}
  onSelectRow={(rowId) => setSelectedIds((prev) => new Set(prev).add(rowId))}
  rows={rows}
  columns={columns}
/>

// After
<DataTable
  isSelectable
  selectedRowIds={selectedIds}
  onSelectRow={(rowId) => {
    openDrawer(rowId);
    setSelectedIds((prev) => new Set(prev).add(rowId));
  }}
  rows={rows}
  columns={columns}
/>

​
Controlled active state

If you were controlling active row state via activeRowIds or defaultActiveRowIds, use selectedRowIds or defaultSelectedRowIds instead: 
// Before
<DataTable
  isActivatable
  activeRowIds={activeIds}
  onActivateRow={setActiveId}
  rows={rows}
  columns={columns}
/>

// After
<DataTable
  isSelectable
  selectedRowIds={selectedIds}
  onSelectRow={setSelectedId}
  rows={rows}
  columns={columns}
/>

​
Breaking Changes

These changes require code updates before upgrading. The previous API is no longer supported.
The following DataTableProps have been removed:
  • isActivatable — Use isSelectable instead
  • activeRowIds — Use selectedRowIds instead
  • defaultActiveRowIds — Use defaultSelectedRowIds instead
  • onActivateRow — Use onSelectRow instead
Last modified on June 12, 2026