{% load i18n brickwork_icons %}{% spaceless %}
{% comment %}
A small status/label badge (neutral information only, never error comms, STA-008).
An optional leading icon is decorative by default (ICO-009): the badge text
already conveys the status. Every documented variant, including the "neutral"
default, has a matching .bw-badge--<variant> rule in the shipped CSS (#100).

Dismissible (04-interfaces 4b Dismissible section, 0.9.0, CMP-012): with the
tag's dismissible=True the root gains x-data="bwDismissible()" (semver-public,
BR-BW-JS-004; no props, state { visible }, method dismiss(), emits
bw:dismiss { id }) and an icon-only close button ships WITH the hidden
attribute; bwDismissible removes hidden at init, so the no-JS floor shows no
dead control. The close control deliberately skips the bw-btn chrome (a
button-sized control would break the compact badge; CSS lane owns its
hit-area treatment). Dismissal removes the element from the DOM only;
persistence stays host-owned. Exit at --bw-duration-fast/--bw-ease-in;
reduced motion removes instantly (BR-BW-TOK-009). REGRESSION NOTE: with
dismissible=False (the default) the rendered output is byte-identical to the
0.8.0 template; the conditional blocks below add not even whitespace when
False.

States: dismissed/not-dismissed when dismissible=True (x-data="bwDismissible()",
  the same primitive _alert.html and _toast.html share); five variant
  states (neutral default, success, warning, danger, info), each its own
  .bw-badge--<variant> colour pairing.
Accessibility: plain inline text, no role of its own (a status label is not
  an alert or a live region). The leading icon is decorative by default
  (bw_icon decorative=True): the label text is the accessible name, never
  the icon alone. The dismiss control is icon-only with a translated
  "Dismiss" aria-label. Covered by axe.spec.mjs via the badge row in
  list-*.html (the four documented variants, plus an icon); dismiss
  behaviour is asserted at the Python/string level
  (tests/test_components.py), not by a browser-driven interaction.
Responsive: no breakpoint switch; no width-dependent CSS on any
  .bw-badge* selector.
{% endcomment %}
<span class="bw-badge bw-badge--{{ variant }}"{% if dismissible %} x-data="bwDismissible()"{% endif %}>
  {% if icon %}{% bw_icon icon size="sm" decorative=True css_class="bw-badge__icon" %}{% endif %}
  {{ label }}
{% if dismissible %}{% translate "Dismiss" as bw_badge_close_label %}  <button class="bw-badge__close" type="button" hidden aria-label="{{ bw_badge_close_label }}" data-bw-dismiss>{% bw_icon "close" size="sm" decorative=True %}</button>
{% endif %}</span>
{% endspaceless %}