Cluster

Groups child elements with a consistent gap between them.

Read more Read less

Common use cases are groups of buttons, groups of tags, or similar items.

The grouping is visual, so no role is set. If the children form a set that should also be grouped for assistive technology, pass role="group" and a label.

Maturity: Stable

Usage

<.cluster>
  <div>some item</div>
  <div>some other item</div>
</.cluster>

With a role and a label:

<.cluster role="group" aria-label="Actions">
  <.button>Edit</.button>
  <.button>Delete</.button>
</.cluster>
Attribute Type Documentation Default Value
class :any

Any additional classes to be added.

Read more Read less
[]

Variations of the component should be expressed via modifier attributes, and it is preferable to use styles on the parent container to arrange components on the page, but if you have to, you can use this attribute to pass additional utility classes to the component.

The value can be a string or a list of strings.

rest :global

Any additional HTML attributes.

Required inner_block * :slot
<.button type="button">Adopt</.button>
<.button type="button">Save for later</.button>
<.button type="button">Share</.button>