Spinner
Reusable spinner component.
Usage
Components are auto-discovered. Use the component directly in any .wrn view:
<Spinner
label="Loading"
size="md"
/>Legacy mount name: data-component="Spinner".
Props and attributes
| Prop | Type | Requirement | Default |
|---|---|---|---|
class | string | Optional | "" |
label | string | Optional | "Loading" |
size | string | Optional | "md" |
Slots
This component does not declare a slot.
Events
This component does not declare a custom event.
Source contract
Installed source: components/Spinner.wrn
component Spinner {
props {
class = ""
label = "Loading"
size = "md"
}
view {
<span role="status" aria-label="{label}" class="inline-block animate-spin rounded-full border-2 border-slate-300 border-r-violet-600 {size === 'sm' ? 'size-4' : size === 'lg' ? 'size-10' : 'size-6'} {class}">
</span>
}
}