---
url: "https://vueda.dev/v3/reference/theming/keys/family/grid.md"
title: "grid keys"
---

# grid keys

Source file: `client/lib/theme/vueda-tailwind/grid/index.js`

## Table primitives

| Component | Kind | Slots | Description |
| --- | --- | --- | --- |
| [Table](/v3/reference/theming/keys/Table.md) | key | 3 | The card surface around the scroll container: fill, radius, and [--vueda-hairline-width](/v3/reference/theming/tokens/base.md#css-token-vueda-hairline-width) edge. Its padding matches the edge width, so the scroll container sits inside the painted edge and no row or sticky header cell can cover it. |
| [TableBody](/v3/reference/theming/keys/TableBody.md) | key | 1 | The `<tbody>` section wrapper. It removes the last row's divider from that row's cells so the enclosing [Table.frame](/v3/reference/theming/keys/Table.md#theme-key-Table-frame) edge remains the closing edge instead of doubling the table bottom. |
| [TableCaption](/v3/reference/theming/keys/TableCaption.md) | key | 1 | The native caption below a table. Use it for low-emphasis supporting copy tied to the table, with spacing that keeps it visually outside the bordered data surface. |
| [TableCell](/v3/reference/theming/keys/TableCell.md) | key | 1 | The body cell slot for `<td>` elements. It applies the density tiers from [Table.table](/v3/reference/theming/keys/Table.md#theme-key-Table-table), keeps checkbox columns compact, and honors `data-numeric` or `data-mono` directly on the cell. |
| [TableEmpty](/v3/reference/theming/keys/TableEmpty.md) | key | 2 | The spanning empty-state cell. It keeps the row aligned with regular [TableCell.root](/v3/reference/theming/keys/TableCell.md#theme-key-TableCell-root) cells while allowing `colspan` and consumer classes to define the empty row's table footprint. |
| [TableFooter](/v3/reference/theming/keys/TableFooter.md) | key | 1 | The `<tfoot>` section wrapper for summary and total rows. Its muted fill and top divider separate aggregates from body rows while leaving row cells free to handle numeric alignment. The divider sits on the first footer row's cells, and the last footer row drops its own divider, because the separated border model does not paint borders on `<tfoot>` or `<tr>`. |
| [TableHead](/v3/reference/theming/keys/TableHead.md) | key | 1 | The header cell slot for `<th>` elements. It owns compact header typography, density heights, sticky positioning, checkbox offsets, and numeric sort-icon ordering; see [Table.table](/v3/reference/theming/keys/Table.md#theme-key-Table-table). |
| [TableHeader](/v3/reference/theming/keys/TableHeader.md) | key | 1 | The `<thead>` section wrapper. Empty by default: header cells take their bottom divider from [TableRow.root](/v3/reference/theming/keys/TableRow.md#theme-key-TableRow-root), and because that border belongs to the cell, a sticky [TableHead.root](/v3/reference/theming/keys/TableHead.md#theme-key-TableHead-root) carries it over scrolling body content. |
| [TableRow](/v3/reference/theming/keys/TableRow.md) | key | 1 | The row slot shared by header, body, and footer sections. It provides hover feedback, selected-row tinting, the leading selected rail, and the standard divider. The divider sits on the row's cells rather than the `<tr>`: [Table.table](/v3/reference/theming/keys/Table.md#theme-key-Table-table) uses the separated border model, which does not paint borders on rows. |
| [TableRowActions](/v3/reference/theming/keys/TableRowActions.md) | key | 2 | The inline wrapper for row actions. It stays invisible until the row is hovered, focused within, or selected, keeping scan-heavy tables clear until actions are relevant. |