Primitives
Spacer
Spacing utility component that adds consistent vertical or horizontal whitespace. Values are multiples of 4px.
Installation
npm install @trinkui/reactImport
import { Spacer } from "@trinkui/react";Vertical Spacing
Block A
Block B (y=4, 16px gap)
Block C (y=8, 32px gap)
Block D (y=16, 64px gap)
Horizontal Spacing
Left
Middle (x=4)
Right (x=8)
Props
| Prop | Type | Default | Description |
|---|---|---|---|
x | number | — | Horizontal space in multiples of 4px (e.g. x={4} = 16px) |
y | number | — | Vertical space in multiples of 4px (e.g. y={4} = 16px) |
className | string | — | Additional CSS classes |
Accessibility
- Renders with
aria-hidden="true"since it is purely decorative. - Does not affect the accessibility tree or screen reader output.