{% set _tag_name = tag_name|default(href ? 'a' : 'span') %}

{% set _extra_content %}
  {% block extra %}
    {% if icon %}
      {% include '@cloudfour/components/icon/icon.twig' with {
        name: icon,
      } only %}
    {% endif %}
  {% endblock %}
{% endset %}

<{{_tag_name}}
  class="c-badge{% if class %} {{class}}{% endif %}"
  {%- if _tag_name == 'a' %}
    href="{{href|default('#')}}"
    {% if rel %}rel="{{rel}}"{% endif %}
  {% endif -%}>
  {% if _extra_content|trim %}
    <span class="c-badge__extra">
      {{_extra_content}}
    </span>
  {% endif %}
  <span class="c-badge__content">
    {%- if parenthetical -%}
      <span class="u-hidden-visually">(</span>
    {%- endif -%}
    {%- block content -%}
      {{label|default('Label')}}
    {%- endblock -%}
    {%- if parenthetical -%}
      <span class="u-hidden-visually">)</span>
    {%- endif -%}
  </span>
</{{_tag_name}}>