{%- from 'components/fieldset/macro.html' import tnaFieldset -%}

{% macro tnaRadios(params) %}
{%- call tnaFieldset({
  'headingLevel': params.headingLevel,
  'headingSize': params.headingSize,
  'id': params.id,
  'legend': params.label,
  'hint': params.hint,
  'smallerHint': True,
  'error': params.error,
  'classes': params.formItemClasses,
  'attributes': params.formItemAttributes
}) %}
  <div class="tna-radios{% if params.small or params.inline %} tna-radios--small{% endif %}{% if params.inline %} tna-radios--inline{% endif %}" id="{{ params.id }}">
    {%- for item in params['items'] %}
    <div class="tna-radios__item">
      <input type="radio" id="{{ params.id }}-{{ item.value }}"{% if params.classes %} class="{{ params.classes }}"{% endif %} value="{{ item.value }}" name="{{ params.name }}"{% if params.selected and item.value == params.selected %} checked{% endif %}
      {%- if params.attributes %}{% for attribute, value in params.attributes.items() %} {{ attribute }}{% if value != '' %}="{{ value }}"{% endif %}{% endfor %}{% endif %}>
      <label for="{{ params.id }}-{{ item.value }}" class="tna-radios__item-label">
        {{ item.text }}
        {%- if item.hint %}
        <span class="tna-radios__item-hint"><span class="tna-visually-hidden">(</span>{{ item.hint }}<span class="tna-visually-hidden">)</span></span>
        {%- endif %}
      </label>
    </div>
    {%- endfor %}
  </div>
{%- endcall %}
{% endmacro %}