```jsx
<Button.List>
  <Button color="success">Save changes</Button>
  <Button color="secondary">Save and continue</Button>
  <Button color="danger">Cancel</Button>
</Button.List>
```

If the list is very long, it will automatically wrap on multiple lines,
while keeping all buttons evenly spaced.

```jsx
<Button.List>
  <Button color="secondary">One</Button>
  <Button color="secondary">Two</Button>
  <Button color="secondary">Three</Button>
  <Button color="secondary">Four</Button>
  <Button color="secondary">Five</Button>
  <Button color="secondary">Six</Button>
  <Button color="secondary">Seven</Button>
  <Button color="secondary">Eight</Button>
  <Button color="secondary">Nine</Button>
  <Button color="secondary">Ten</Button>
  <Button color="secondary">Eleven</Button>
  <Button color="secondary">Twelve</Button>
  <Button color="secondary">Thirteen</Button>
  <Button color="secondary">Fourteen</Button>
  <Button color="secondary">Fifteen</Button>
  <Button color="secondary">Sixteen</Button>
  <Button color="secondary">Seventeen</Button>
  <Button color="secondary">Eighteen</Button>
  <Button color="secondary">Nineteen</Button>
</Button.List>
```

### List Buttons Alignment

```jsx
<Button.List align="center">
  <Button color="primary">color='primary'</Button>
  <Button color="secondary">color='secondary'</Button>
</Button.List>
```

```jsx
<Button.List align="right">
  <Button color="primary">color='primary'</Button>
  <Button color="secondary">color='secondary'</Button>
</Button.List>
```
