Table — Loidolt Theme

import { Table } from '@loidolt/theme-svelte';

Example

Recent projects
	Format		Status
Crater Lake	SVG	12	Ready
Grand Teton	PDF	4	Review
Rainier	SVG	31	Draft

Notes

The scroll region carries tabindex="0": without it a scrollable region is unreachable by keyboard.
sticky needs a bounded container — set --ldt-table-height, or the page scrolls and nothing sticks.
Pass empty only when there are no rows; the component cannot see inside children to count them.
A trailing action cell takes class="ldt-table__actions": right-aligned, nowrap, inline forms.

Props

Generated from the component source, so it cannot drift from the implementation.

Table props
Prop	Type	Default	Notes
`children` required	`Snippet`	`—`
`caption`	`string`	`—`	Names the table and its scroll region.
`class`	`string`	`—`	`class` lands on the `<table>`; use `wrapperClass` for the scroll container.
`columns`	`number`	`—`	Columns the empty cell spans. Defaults to the whole row.
`empty`	`Snippet`	`—`	Rendered in place of the rows, as a single full-width cell. Pass it only when there is nothing to show — `empty={rows.length === 0 ? nothingYet : undefined}` — since the component cannot see inside `children` to count rows.
`ref` bindable	`HTMLTableElement \| null`	`null`
`regionLabel`	`string`	`'Data table'`	Accessible name for the scroll region when there is no `caption`.
`sticky`	`boolean`	`false`	Pins the header row while the body scrolls. Needs a bounded scroll container — set `--ldt-table-height` on the wrapper, or the page scrolls instead and nothing sticks.
`wrapperClass`	`string`	`—`
`wrapperRef` bindable	`HTMLDivElement \| null`	`null`

Plus the attributes of HTMLTableAttributes, forwarded to the root element.