Summary
Functions
Attributes
size(:string) - Defaults to"md". Must be one of"xs","sm","md","lg", or"xl".variant(:string) - Defaults to"light". Must be one of"light","dark","soft", or"outline".color(:string) - Defaults to"primary". Must be one of"primary","secondary","info","success","warning","danger", or"gray".role(:string) - Defaults to"note". Must be one of"note", or"status".with_icon(:boolean) - adds some icon base classes. Defaults tofalse.dot(:boolean) - renders a small filled circle before the label - the status-badge convention. The dot rides the badge's own colour and is decorative (aria-hidden), so the label has to carry the meaning on its own. Renders before an icon when both are set. Defaults tofalse.dot_color(:string) - colours the dot independently of the badge. nil, the default, inherits the badge's colour exactly as before. Set it for the neutral chip - quiet chrome, one semantic dot:<.badge color="gray" variant="outline" dot dot_color="success">Production</.badge>. The stop matches what an inherited dot of that colour shows on the same variant, so the override moves the hue and nothing else. Thedarkvariant is the exception - its inherited dot is currentColor, which no ramp can match - so an override there takes the 400 stop, and is a visible change even when it names the badge's own colour. Keep it to that shape: when the badge already carries a semantic colour of its own, leave the dot inherited rather than putting two meanings in one chip - a success badge with a danger dot reads as neither. Defaults tonil. Must be one ofnil,"primary","secondary","info","success","warning","danger", or"gray".class(:any) - CSS class for parent div. Defaults tonil.label(:string) - label your badge. Defaults tonil.- Global attributes are accepted.
Slots
inner_block