# Table Footer

## Usage

`<tfoot>` wrapper for children mode. Holds summary or total rows beneath the body. A row must sit inside a section: `<table>` cannot contain a `<tr>` directly, because the HTML parser inserts an implied `<tbody>` when it parses server-rendered markup and Vue does not when it renders on the client, so the two trees mismatch on hydration. Children mode only: the data-driven `data={...}` path renders a header and a body, never a footer.

```ts
import { TableFooter } from '@astryx-vue/core/Table'
```

## Props

`TableFooter` has no props of its own. Everything it shows comes in through the default slot, and anything else is a native attribute.

## Slots

| Slot | Description |
| --- | --- |
| `default` | The `<tfoot>` rows. Required. |

## Native attributes

The root element is `<tfoot>`.

The root element receives:

- HTML attributes.
- `aria-*` attributes.
- `data-*` attributes.
- `class`.
- `style`.
- Native event listeners.

The React API styles the footer with `xstyle`, which takes a `stylex.create()` value. In Vue, pass `class` or `style` instead; both land on the `<tfoot>`.