<section data-grid-host="{{ kind }}" data-loading-states>
  <form class="ds-grid-filters"
        hx-get="{{ endpoint }}"
        hx-target="closest [data-grid-host] > [data-content-grid]"
        hx-swap="morph"
        hx-trigger="keyup changed delay:300ms from:input[name=q], change from:select[name=tag], submit"
        hx-push-url="true"
        hx-include="this"
        hx-sync="this:replace">
    <input type="search" name="q" placeholder="Search…" aria-label="Search"
           autocomplete="off" data-loading-disable>
    <select name="tag" aria-label="Filter by tag" data-loading-disable>
      <option value="">All tags</option>
    </select>
    <span class="ds-loading-indicator" data-loading aria-hidden="true">…</span>
  </form>
  {{ initial_grid_html | safe }}
</section>
