feat(react): add keyboard-accessible row click to DataTable

[grandmaester]

Summary

Ports the row-click behaviour from the UDS data table into our shared DataTable, so rows are reachable by keyboard and not just by pointer.

Why

DataTable already supported onRowClick, but only as a bare onClick on <tr>: no tabIndex, no role, no key handling. That is invisible to keyboard and screen-reader users.

It matters now because of permission gating. Once a row's action menu is hidden for users without mutating permissions, row-click becomes their only route to a details view. Without keyboard support, those users cannot reach member, invitation, domain or provider details at all.

What

Behaviour	Detail
Focusable rows	tabIndex={0} and an accessible label when onRowClick is set
Keyboard activation	Enter or Space, only when the row itself is focused
Focus ring	focus-visible ring so keyboard focus is visible
Control guard	Clicks on an interactive descendant (menu trigger, checkbox, switch, link) no longer navigate

The guard uses UDS's focusable-element check rather than relying on every cell remembering to stop propagation:

const FOCUSABLE_SELECTOR =
  'a[href], button, input, select, textarea, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]';

const focusable = (event.target as HTMLElement).closest(FOCUSABLE_SELECTOR);
if (focusable && focusable !== event.currentTarget) return;

Packages

• packages/core — adds the view_row label to en-US, fr and ja
• packages/react — DataTable
• examples

Testing

Tested after integrating with Member Table:

• react typecheck clean, 1840 tests / 112 files pass

• core typecheck clean, 1109 tests pass

• eslint and prettier clean

• This change adds unit test coverage

• Tested for both SPA and RWA flows, all example apps working

• All existing and new tests complete without errors

Checklist

• Breaking change
• Requires docs update
• Backward compatible

Contributing

• I have read the Auth0 general contribution guidelines
• I have read the Auth0 Code of Conduct

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 3d5e69ba-a6c3-4433-a2a8-71c93806c23e

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}