{#
/**
 * @file
 * Template for a Nav component.
 *
 * Available config:
 * - alignment: left | right | center | vertical.
 * - style: tabs | pills
 * - fill: fill | justify
 * - utility_classes: An array of utility classes.
 */
#}
{% import _self as menus %}

{% set nav_classes = [ 'menu' ]|merge(utility_classes ? utility_classes : []) %}
{% set parent_link_attributes = create_attribute() %}

{% if items %}
  <ul class="navigation__sub-menu" aria-label="{{ id }}" id="{{ 'sub-menu-' ~ id }}">
    {% if render_submenu_toggle and parent_item %}
      {% if parent_item.current %}
        {% set parent_link_attributes = parent_link_attributes.setAttribute('aria-current', 'page') %}
      {% endif %}
     <li{{ parent_item.attributes.addClass('menu__item','menu__item--parent', parent_item.in_active_trail ? 'menu__item--active-trail') }}>
        {{ link(parent_item.title, parent_item.url, parent_link_attributes.addClass('menu__link')) }}
      </li>
    {% endif %}
    {% block items %}
      {% for item in items %}
        {% set nav_item_classes = [
            'menu__item',
            'menu__item--level-' ~ (menu_level + 1),
            item.in_active_trail ? 'menu__item--active-trail',
            item.below ? 'menu__item--has-children',
            item.published == false ? 'unpublished'
        ] %}
        {% set link_attributes = create_attribute() %}
        {% set nav_link_classes = ['menu__link'] %}
        {% set aria_id = (item.title ~ '-submenu-' ~ loop.index )|clean_id %}
        {% set aria_current = item.in_active_trail and not item.is_expanded ? 'page' : null %}
        {% if item.url.options.attributes.class is iterable %}
          {% set nav_link_classes = nav_link_classes|merge(item.url.options.attributes.class) %}
        {% elseif item.url.options.attributes.class %}
          {% set nav_link_classes = nav_link_classes|merge([item.url.options.attributes.class]) %}
        {% endif %}
        {% if item.current %}
          {% set link_attributes = link_attributes.setAttribute('aria-current', 'page') %}
        {% endif %}
        <li{{ item.attributes.addClass(nav_item_classes) }}>
          {% if item.is_expanded and item.below %}
            {% if render_submenu_toggle %}
            <button type="button" aria-expanded="false" class="menu__toggle" aria-controls="{{ 'sub-menu-subnav__' ~ aria_id }}">
              {{ item.title }}
              <span class="material-symbols-sharp" aria-hidden="true">expand_more</span>
            </button>
            {% endif %}

            {{ link(item.title, item.url, link_attributes.addClass(nav_link_classes|merge(['menu__toggle-link'])) ) }}

            {% if render_submenu_toggle %}
              <button type="button" aria-expanded="false" class="menu__toggle menu__toggle-sm" aria-controls="{{ 'sub-menu-subnav__' ~ aria_id }}">
                Expand {{ item.title }}
                <span class="material-symbols-sharp" aria-hidden="true">expand_more</span>
              </button>
            {% endif %}

            {% if item.below %}
              {{ include("sector_theme:subnav", {
                id: 'subnav__' ~ aria_id,
                utility_classes: [ 'menu__menu', 'hidden' ],
                items: item.below,
                menu_level: menu_level + 1,
                sub_parent_item: link(item.title, item.url, { 'class': ['menu__link']}),
              })}}
            {% endif %}
          {% else %}
            {{ link(item.title, item.url, link_attributes.addClass(nav_link_classes|join(' '))) }}
          {% endif %}
        </li>
      {% endfor %}
    {% endblock %}
  </ul>
  {% if libraries %}
    {% for library in libraries %}
      {{ attach_library(library) }}
    {% endfor %}
  {% endif %}
{% endif %}
