Data Grid

Advanced table with sorting and selection.

Props

keyboardIcon
string | boolean
Whether to show the keyboard navigation indicator icon when navigating with arrow keys.
Defaults to true.
keyboardIconPosition
left | right
Position of the keyboard navigation indicator icon.
Defaults to left.
keyboardNav
layout | table
Navigation mode. "table" navigates like a table (up/down between rows), "layout" allows wrapping between rows with left/right arrows.
Defaults to table.
Examples
Examples show common usage patterns and implementation guidance.

No usage guidelines have been documented for this component yet.

All GoA Design System components are built to meet WCAG 2.2 AA standards. The following guidelines provide additional context for accessible implementation.

Keyboard

First cell
Second cell
Third cell
Fourth cell
Add data-grid attributes to rows and cells for keyboard navigation to work.