PineUiPhoenix.Components.Badge (Pine UI v0.2.0)

Small status and category labels.

A port of the Pines badge, plus two variants the original library carried: a status dot and a dismissible pill.

<.badge>New</.badge>
<.badge variant="success" dot>Active</.badge>
<.badge variant="info" dismissible>Beta</.badge>

Summary

badge(assigns)

Renders a badge.

Renders a badge.

<.badge variant="success">Completed</.badge>
<.badge variant="warning" dot>Pending</.badge>
<.badge variant="info" dismissible>New feature</.badge>

variant (:string) - Defaults to "default". Must be one of "default", "primary", "secondary", "success", "warning", "danger", "info", or "outline".
dot (:boolean) - Shows a leading status dot tinted to the variant. Defaults to false.
dismissible (:boolean) - Adds a close button that hides the badge. This is the one part of the component that needs Alpine; everything else is pure Tailwind.
Defaults to false.
class (:string) - Defaults to nil.
Global attributes are accepted.