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

# TableEmpty

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

> 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.

Vue component: [TableEmpty](/v3/reference/api/vue/TableEmpty.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/TableEmpty.md#theme-key-TableEmpty-root) | `p-4 whitespace-nowrap align-middle text-body text-foreground` | 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. |
| [content](/v3/reference/theming/keys/TableEmpty.md#theme-key-TableEmpty-content) | 4 classes | The centered content stack inside the empty cell. Consumer icon nodes marked `data-slot="icon"` pick up muted, loading, or error treatment from `data-variant`. |

<a id="theme-key-TableEmpty-root"></a>

## root

> 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.

Default classes:

`p-4 whitespace-nowrap align-middle text-body text-foreground`

Source: `client/lib/theme/vueda-tailwind/grid/TableEmpty.theme.js:19`

<a id="theme-key-TableEmpty-content"></a>

## content

> The centered content stack inside the empty cell. Consumer icon nodes marked `data-slot="icon"` pick up muted, loading, or error treatment from `data-variant`.

Default classes:

```text
flex flex-col items-center justify-center gap-2.5 py-10 text-center text-muted-foreground
[&>[data-slot=icon]]:text-xl [&>[data-slot=icon]]:text-muted-foreground/70
data-[variant=loading]:[&>[data-slot=icon]]:animate-spin
data-[variant=error]:[&>[data-slot=icon]]:text-destructive/80
```

Source: `client/lib/theme/vueda-tailwind/grid/TableEmpty.theme.js:25`