Luke UI
GitHub repository

Cluster

Arrange direct children on the logical inline axis with wrapping.

Cluster lays out direct children on the logical inline axis. Read Layout to choose a layout component.

Cluster: Basic
Loading Cluster: Basic example

Alignment

justifyContent defaults to flex-start. alignItems defaults to center.

Cluster: Alignment
Loading Cluster: Alignment example

Wrapping

flexWrap defaults to wrap. Set nowrap when children should stay on one line, or wrap-reverse to reverse wrap direction. Responsive objects use the same breakpoint keys as other layout props.

Cluster: No wrap
Loading Cluster: No wrap example

Choose the rendered element

Cluster uses Box's elementType and render contract.

Cluster: List
Loading Cluster: List example

API

ClusterProps also accepts compatible DOM and ARIA attributes and event handlers for its rendered element.

Prop

Type