# `PhoenixKitWeb.Components.Core.StatusDot`
[🔗](https://github.com/BeamLabEU/phoenix_kit/blob/v2.13.11/lib/phoenix_kit_web/components/core/status_dot.ex#L1)

A tiny semantic status indicator: a coloured dot with an optional
label. The generic companion to the domain-specific badges in
`PhoenixKitWeb.Components.Core.Badge` — for "online/offline",
"connected", "live socket up", "syncing" and every other place a
little coloured circle keeps getting hand-rolled.

Origin: extracted from NordSwitch (device online state, websocket
health, account connection state).

# `status_dot`

Renders a status dot, optionally with a label.

## Examples

    <.status_dot variant={:success} label="online" />
    <.status_dot variant={:error} label="socket down" size={:sm} />
    <.status_dot variant={:info} pulse />

    <%!-- boolean convenience for the overwhelmingly common case --%>
    <.status_dot up={@device.online} label={if @device.online, do: "online", else: "offline"} />

## Attributes

* `variant` (`:atom`) - Semantic colour; overrides `up` when set. Defaults to `nil`. Must be one of `:success`, `:error`, `:warning`, `:info`, `:neutral`, or `nil`.
* `up` (`:boolean`) - Boolean convenience: true → success, false → error (ignored when `variant` set). Defaults to `nil`.
* `label` (`:string`) - Optional text next to the dot. Defaults to `nil`.
* `size` (`:atom`) - Dot size. Defaults to `:md`. Must be one of `:xs`, `:sm`, or `:md`.
* `pulse` (`:boolean`) - Animate the dot (attention/live state). Defaults to `false`.
* `class` (`:any`) - Extra classes for the wrapper. Defaults to `nil`.
* `state_label` (`:string`) - Overrides the announced state name. The defaults are generic (`up` reads "online"/"offline"); anything else — a payment, a job — should say so itself. Defaults to `nil`.
* Global attributes are accepted. Extra attributes for the wrapper (title, data-*, …).

---

*Consult [api-reference.md](api-reference.md) for complete listing*