Components / Layout
Stack
Children in a vertical flex column with a token gap.
@ruckc/truss-ui Layout
Import
import { Stack } from '@ruckc/truss-ui';Playground
gap
align
as
API
The element to render.
| Prop | Type | Default | Description |
|---|---|---|---|
gap | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 4 | Space between children: a spacing token step, 1 to 12 (`--tr-space-N`). |
align | 'start' | 'center' | 'end' | 'stretch' | 'stretch' | Cross-axis (horizontal) alignment. |
as | string | 'div' | The element to render. |
children snippet | Snippet | — | Content, as a Svelte snippet. |