{# The box in the header, on every public screen.

   A plain GET form pointing at the search page, so it works before any
   script has loaded and keeps working if none ever does. The panel below
   it is empty until a script fills it, and stays empty, hidden and out of
   the way otherwise.

   The scope defaults to wherever the reader is standing, which the feature
   owning that URL reported. That is the whole point of putting the
   selector here: somebody reading a page of one course and typing "lab 5"
   means that course, and having to say so first is the reason nobody uses
   a site search twice. #}

{% import "search/_box.html" as box with context %}

<form class="search-box search-box--nav" method="get" role="search"
      action="{{ action }}"
      data-search-box
      data-search-endpoint="{{ endpoint }}"
      {{ box.texts(min_chars) }}>

    {{ box.field('search-nav', term, scopes, current, panel=True) }}

    <div class="search-box__panel" id="search-nav-panel" hidden data-search-panel>
        <p class="search-box__status" role="status" aria-live="polite" data-panel-status></p>
        <p class="search-box__note" data-panel-note></p>
        <div class="search-box__list" role="listbox"
             aria-label="{{ _('Search results') }}" data-panel-results></div>
        <a class="search-box__all" href="{{ action }}" hidden data-panel-all>{{ _('See all results') }}</a>
    </div>
</form>