{%- extends "page.html" %}
{# Over-ride the body to be custom search structure we want #}
{% block docs_body %}
  <div class="bd-search-container">
    <h1>{{ _("Search") }}</h1>
    <noscript>
      <div class="admonition error">
        <p class="admonition-title">{% trans %}Error{% endtrans %}</p>
        <p>{% trans %}Please activate JavaScript to enable the search functionality.{% endtrans %}</p>
      </div>
    </noscript>
    {% include "../components/search-field.html" %}
    <div id="search-results"></div>
  </div>
  <script>
    // Activate the search field on page load
    let searchInput = document.querySelector("form.bd-search input");
    if (searchInput) {
        searchInput.focus();
        searchInput.select();
        console.log("[PST]: Set focus on search field.");
    }
  </script>
{% endblock docs_body %}
{# Below sections just re-create the behavior of Sphinx default search #}
{# Page metadata #}
{%- block htmltitle -%}
  <title>{{ _("Search") }} - {{ title or docstitle }}</title>
{%- endblock htmltitle -%}
{# Manually include the search JS that Sphinx includes #}
{% block scripts -%}
  {{ super() }}
  <script src="{{ pathto('_static/searchtools.js', 1) }}"></script>
  <script src="{{ pathto('_static/language_data.js', 1) }}"></script>
  <script src="{{ pathto('searchindex.js', 1) }}"></script>
{%- endblock scripts %}