Status renders a small pulsing or static dot that communicates a system or user state at a glance. Colour variants map to the daisyUI semantic palette: success for online, error for offline, warning for degraded.
Basic Status
<c-lb.status />
<c-lb.status variant="neutral" />
<c-lb.status variant="primary" />
<c-lb.status variant="secondary" />
<c-lb.status variant="accent" />
<c-lb.status variant="info" />
<c-lb.status variant="success" />
<c-lb.status variant="warning" />
<c-lb.status variant="error" />
Sizes
<c-lb.status variant="success" size="xs" />
<c-lb.status variant="success" size="sm" />
<c-lb.status variant="success" size="md" />
<c-lb.status variant="success" size="lg" />
<c-lb.status variant="success" size="xl" />
Animated
<div class="flex flex-col gap-2">
<c-lb.status variant="error" size="lg" animate="ping" />
<c-lb.status variant="info" size="lg" animate="bounce" />
</div>
API Reference
c-lb.status
| Property | Type | Default | Required | Description |
|---|---|---|---|---|
| class | string | - | No | Additional CSS classes to apply |
| variant |
neutral
primary
secondary
accent
info
success
warning
error
|
- | No | Status color variant |
| size |
xs
sm
md
lg
xl
|
md
|
No | Status indicator size |
| animate |
ping
bounce
|
- | No | Animation effect for the status indicator |