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