Spacer
Flexible or fixed-size spacer for pushing siblings apart inside flex containers.
Preview
Import
import { Spacer } from "@sigil-ui/components";Usage
Grows to fill available space within a flex parent:
<Flex>
<span>Left</span>
<Spacer />
<span>Right</span>
</Flex>Fixed height
<Flex direction="column">
<div>Top</div>
<Spacer height={32} />
<div>Bottom</div>
</Flex>Fixed width
<Flex>
<div>A</div>
<Spacer width={48} />
<div>B</div>
</Flex>Props
| Prop | Type | Default | Description |
|---|---|---|---|
height | number | string | — | Fixed height (number = px). If omitted, grows via flex-1 |
width | number | string | — | Fixed width (number = px) |
className | string | — | Additional CSS classes |