{#
  do_nav macro recursively renders a navigation structure as nested unordered lists.
  - nav - a nav object.
  -- nav object: {
    list_modifiers (string),
    items (array of items objects: {title, url})
  }
  - is_sub_nav - boolean that specifies if a nav as actually a sub-nav (child).
  - is_toggle - boolean that specifies if menu item should be a button for toggling another element on the page.
#}

{% macro do_nav(nav, is_sub_nav) %}
  {# Required for recursion. #}
  {% import _self as self %}

  {# Set up basic class variables for each nav level. #}
  {# Base class for every nav list element. #}
  {% set nav_base_class =  'mds-nav__list' %}

  {#
    Check if nav is nested (a sub-nav) - this is set only on recursion - or if it's the root nav.
    else nav.list_modifiers will be used e.g., 'mds-l-flex-col' etc.
  #}
  {%
    set nav_extra_classes = (is_sub_nav ? 'mds-nav__sub-nav' : nav.list_modifiers)
  %}

  <ul class="{{ nav_base_class }} {{ nav_extra_classes }}">

    {# Loop through nav items. #}
    {% for item in nav.items %}
      {# Specify that the li tag contains sub-nav via class if item has items. #}
      <li class="mds-nav__item {{ (item.items is defined ? 'mds-nav__sub-nav-container' : null )  }}">

        {# TODO: probably should check if an item has items here as well and change a link to a header or button
         -- especially if --drop-down modifier is set for a11y reasons - a link should not be the trigger for the drop-down. TBD. #}
        {% if item.is_toggle %}
          {% include '@mds/button/button.twig' with {
            button_icon: item.button_icon,
            button_label: item.button_label,
            button_modifiers: item.button_modifiers,
            icon_alt: item.icon_alt,
            icon_size: item.icon_size
          }%}
        {% else %}
          {# Use link component for item - allowing for item.modifiers (link variants, like buttons etc.) and setting an active/'selected' class. #}
          {% include "@mds/links/link.twig" with {
            link_icon: item.icon,
            link_icon_alt: item.icon_alt,
            link_icon_size: item.icon_size,
            link_icon_label: item.icon_label,
            link_attributes: item.attributes,
            link_url: item.url,
            link_content: item.title,
            link_base_class: 'mds-nav__link ' ~ item.modifiers ~ (item.active is defined ? 'mds-nav__link--selected' : null )}
          %}
        {% endif %}

        {# Recurse if nav item contains more items (sub-nav). #}
        {% if item.items is defined %}

          {# Pass item as new nav, set is_sub_nav to true. #}
          {{ _self.do_nav(item, true) }}
        {% endif %}
      </li>

    {% endfor %}

  </ul>
{% endmacro %}