{#
/**
 * @file
 * Icon list component.
 *
 * @param array  $attr        Shorthand of $list_attr.
 * @param array  $list_attr   List attributes.
 * @param array  $item_attr   List item attributes.
 * @param array  $icon_attr   Icon attibutes.
 * @param array  $action_attr Action attributes.
 * @param string $action_tag  Action tag.
 * @param array  $items       Items:
 *   - Use the icon name in key and the url in value for each entry of this array.
 *   - You can pass an array instead of the url to pass custom attributes to the action.
 *
 * @block $item
 *   Use this block to override the component behavior inside the list items.
 * @block $icon
 *   Use this block to override the icons.
 */
#}

{% set list_attributes =
  merge_html_attributes(
    attr ?? list_attr ?? null,
    { class: ['flex justify-start items-center gap-3'] }
  )
%}

{% set item_attributes = merge_html_attributes(item_attr ?? null, {}) %}

{% set icon_attributes = merge_html_attributes(icon_attr ?? null, { class: 'flex items-center' }) %}

<ul {{ html_attributes(list_attributes) }}>
  {% for name, value in items %}
    {%- set rendered_icon -%}
      {%- block icon -%}
        {%- include '@ui/Icon/Icon.twig' with {
          name: name,
          attr: icon_attributes,
          ignore_missing: true
        } only -%}
      {%- endblock -%}
    {%- endset -%}

    {% if rendered_icon is not empty %}
      {% if value is iterable %}
        {% set href = value.attr.href ?? value.href ?? null %}
        {% set label = value.attr.label ?? value.label ?? (name|capitalize) %}
        {% set title = value.attr.title ?? value.title ?? null %}
        {% set tag = value.tag
          ?? (action_tag|default(href is defined and href is not null ? 'a' : 'button'))
        %}
        {% set current_attr = merge_html_attributes(value.attr ?? {}, action_attr ?? {}) %}
      {% else %}
        {% set href = value %}
        {% set label = name|capitalize %}
        {% set tag = action_tag|default('a') %}
        {% set current_attr = action_attr ?? {} %}
      {% endif %}

      {% set action_attributes =
        merge_html_attributes(
          current_attr ?? null,
          {
            title: title ?? label,
            aria_label: label,
            class: 'block p-1 hover:opacity-80 cursor-pointer'
          }|merge(tag == 'button' ? { type: 'button' } : { href: href })
        )
      %}

      <li {{ html_attributes(item_attributes) }}>
        {% block item %}
          {% html_element tag with action_attributes %}
            {{ rendered_icon }}
            <span class="sr-only">{{ label }}</span>
          {% end_html_element %}
        {% endblock %}
      </li>
    {% endif %}
  {% endfor %}
</ul>