Group

Compose elements and components in flex container
Import

Usage

Group allows you to compose any elements and components in flex container. Use these props to change elements position inside Group:

  • position controls justify-content property
  • grow if true sets flex-grow property to 1 for all child elements
  • spacing controls space between elements – predefined values from theme.spacing or number for spacing in px
  • noWrap controls flex-wrap property and if set to true prevents elements from wrapping on next line once space on current line was exceeded
  • direction controls flex-direction: row (default) for horizontal orientation, column for vertical
Spacing
<Group>
<Button variant="outline">1</Button>
<Button variant="outline">2</Button>
<Button variant="outline">3</Button>
</Group>