Skip to content

ComponentsTable

Components

Table

Native tables on the cds recipe: outset DataTable, inset / full / no separators, hover pill rows, row links and actions, selection mode, toolbar, pagination, mini analytics tables.

Data table

Header 28 (13/17 w435, secondary), rows with 28px actions 46 (plain rows unchanged), cell padding 8 × 12; hovering a selected row stacks one ghost-hover layer; inset 1px separators hidden around the hovered row; DataTable outsets 12px.

Active sessions
DeviceLocationCreatedActions
Chrome on macOSCurrentSan Francisco, USOct 21, 2026
Safari on iPhoneSan Francisco, USOct 18, 2026
Desktop app on WindowsLisbon, PTSep 30, 2026
Toolbar, hover actions, pagination, empty
Showing 1–8 of 26
NameOwnerUpdatedActions
Open Aurora AuroraYou1d ago
Open Basalt BasaltDesign team2d ago
Open Cinder CinderDesign team3d ago
Open Dune DuneYou4d ago
Open Ember EmberDesign team5d ago
Open Fjord FjordDesign team6d ago
Open Grove GroveYou7d ago
Open Harbor HarborDesign team8d ago

Headerless list with selection

Collapsed header, StatusDot + title, time ↔ ⋮ overlay swap, dimmed row, selection mode (checkbox column, row click toggles), loading row.

Project chats
Select Title Actions
Refactor the billing module
Refactor the billing module2 hours ago
Draft the launch notes for the October release
Draft the launch notes for the October releaseYesterday
Weekly metrics digest
Weekly metrics digest3 days ago
Archived exploration
Archived explorationSep 12

Separators and mini

separator="full"
ConnectorStatus
Drive Connected
Calendar Connected
Linear Connected
variant="mini"Analytics card: 32px rows, numeric cells right-aligned, no dividers or hover.
Agent Requests Share
claude-code-review12,48041%
docs-assistant8,11227%
support-triage-bot-with-a-long-name5,90419%