hstack

Usage

Components are auto-discovered. Use the component directly in any .wrn view:

<hstack
  gap="4"
  align="center"
/>

Legacy mount name: data-component="hstack".

Props and attributes

Slots

• default

Events

This component does not declare a custom event.

Source contract

Installed source: components/hstack.wrn

// Horizontal stack: row layout with a gap and cross-axis alignment.
// align: start | center | end | stretch
component HStack {
  props {
    gap = "4"
    align = "center"
    class = ""
  }
  view {
        <div class="wire-hstack wire-gap-{gap} wire-items-{align} {class}">
        <slot>
        </slot>
        </div>
    }
}