{% from "govuk/macros/attributes.njk" import govukAttributes %}
{% from "../logo/macro.njk" import ccsLogo -%}

<header class="ccs-header {%- if params.classes %} {{ params.classes }}{% endif %}" data-module="ccs-header"
  {{- govukAttributes(params.attributes) }}>
  {% if params.serviceAuthentication %}
    <div class="ccs-header__service-authentication">
      <div class="ccs-header__service-authentication-container {{ params.containerClasses | default('govuk-width-container') }}">
        <ul class="ccs-header__service-authentication-list">
          {% for item in params.serviceAuthentication %}
            {% if item.text or item.html %}
              <li class="ccs-header__service-authentication-item">
                {% if item.href %}
                  {% if item.method %}
                    <form class="button_to" method="post" action="{{ item.href }}">
                      {% if item.method != 'post' %}
                        <input type="hidden" name="_method" value="{{ item.method }}" autocomplete="off">
                      {% endif %}
                      <button class="ccs-header__button_as_link" type="submit"
                        {{- govukAttributes(item.attributes) }}>
                  {% else %}
                    <a class="ccs-header__link" href="{{ item.href }}"
                      {{- govukAttributes(item.attributes) }}>
                  {% endif %}
                {% endif %}
                  {{ item.html | safe if item.html else item.text }}
                {% if item.href %}
                  {% if item.method %}
                      </button>
                    </form>
                  {% else %}
                    </a>
                  {% endif %}
                {% endif %}
              </li>
            {% endif %}
          {% endfor %}
        </ul>
      </div>
    </div>
  {% endif %}
  <div class="ccs-header__container {{ params.containerClasses | default('govuk-width-container') }}">
    <div class="ccs-header__logo">
      <a href="{{ params.homepageUrl | default('https://www.crowncommercial.gov.uk') }}" class="ccs-header__link ccs-header__link--homepage" aria-label="Crown Commercial Service">
        {{ ccsLogo() }}
      </a>
    </div>
    {% if params.serviceName or params.navigationPrimary or params.navigationSecondary  %}
    <div class="ccs-header__content">
    {% if params.serviceName %}
      <a href="{{ params.serviceUrl }}" class="ccs-header__link ccs-header__link--service-name">
        {{ params.serviceName }}
      </a>
    {% endif %}
    {% if params.navigationPrimary or params.navigationSecondary %}
    <nav aria-label="{{ params.navigationLabel | default('Menu') }}" class="ccs-header__navigation {{ 'ccs-header__navigation--no-service-name' if not params.serviceName }} {%- if params.navigationClasses %} {{ params.navigationClasses }}{% endif %}">
      <button type="button" class="ccs-header__menu-button ccs-js-header-toggle" aria-controls="navigation" aria-label="{{ params.menuButtonLabel | default('Show or hide menu') }}" hidden>Menu</button>
      <div id="navigation" class="ccs-header__navigation-lists">
        {% if params.navigationSecondary %}
        <ul id="navigation-secondary" class="ccs-header__navigation-secondary-list {{ 'ccs-header__navigation--no-second-list' if not params.navigationPrimary }}">
          {% for item in params.navigationSecondary %}
            {% if item.text or item.html %}
              <li class="ccs-header__navigation-item{{ ' ccs-header__navigation-item--active' if item.active }}">
                {% if item.href %}
                  {% if item.method %}
                    <form class="button_to" method="post" action="{{ item.href }}">
                      {% if item.method != 'post' %}
                        <input type="hidden" name="_method" value="{{ item.method }}" autocomplete="off">
                      {% endif %}
                      <button class="ccs-header__button_as_link" type="submit"
                        {{- govukAttributes(item.attributes) }}>
                  {% else %}
                    <a class="ccs-header__link" href="{{ item.href }}"
                      {{- govukAttributes(item.attributes) }}>
                  {% endif %}
                {% endif %}
                  {{ item.html | safe if item.html else item.text }}
                {% if item.href %}
                  {% if item.method %}
                      </button>
                    </form>
                  {% else %}
                    </a>
                  {% endif %}
                {% endif %}
              </li>
            {% endif %}
          {% endfor %}
        </ul>
        {% endif %}
        {% if params.navigationPrimary %}
        <ul id="navigation-primary" class="ccs-header__navigation-primary-list {{ 'ccs-header__navigation--no-second-list' if not params.navigationSecondary }}">
          {% for item in params.navigationPrimary %}
            {% if item.text or item.html %}
              <li class="ccs-header__navigation-item{{ ' ccs-header__navigation-item--active' if item.active }}">
                {% if item.href %}
                  {% if item.method %}
                    <form class="button_to" method="post" action="{{ item.href }}">
                      {% if item.method != 'post' %}
                        <input type="hidden" name="_method" value="{{ item.method }}" autocomplete="off">
                      {% endif %}
                      <button class="ccs-header__button_as_link" type="submit"
                        {{- govukAttributes(item.attributes) }}>
                  {% else %}
                    <a class="ccs-header__link" href="{{ item.href }}"
                      {{- govukAttributes(item.attributes) }}>
                  {% endif %}
                {% endif %}
                  {{ item.html | safe if item.html else item.text }}
                {% if item.href %}
                  {% if item.method %}
                      </button>
                    </form>
                  {% else %}
                    </a>
                  {% endif %}
                {% endif %}
              </li>
            {% endif %}
          {% endfor %}
        </ul>
        {% endif %}
      </div>
    </nav>
    {% endif %}
    </div>
    {% endif %}
  </div>
</header>