{% extends "list_view.html" %}
{% load i18n %}
{% comment %}
  Overrides the outer `content` block, not page.header/page.content-wrapper:
  those sit inside page_view.html's <c-mvp.container>, a plain div that breaks
  the flex chain a filled layout needs (specs/027-table-layout-and-column-styling/research.md R5).
{% endcomment %}
{% comment %}
  page.actions skips {{ block.super }}: list_view.html's default includes
  sort, which a table view's own action set must not (FR-007) — see
  MVPTableViewMixin.actions.
{% endcomment %}
{% comment %}
  The breadcrumb trail draws in the app header, not here, so page.header has
  nothing of its own to draw — it stays declared for a project that filled it.
{% endcomment %}
{% comment %}
  app.footer is emptied: the shell's footer belongs to a page that ends, and
  this one does not — the table spends the whole viewport, so a footer under
  it either steals rows or never comes into view.
{% endcomment %}
{% block app.footer %}{% endblock app.footer %}
{% block content %}
  <c-mvp.page fill class="mvp-table-page {{ page.class }}">
    {% block page.content-wrapper %}
      {% comment %}
        gap="0" and padding on the bands, never the page: the table meets the
        shell edges, so a gap or page padding would inset the scroll region.
        Three bands stay put (anything in page.header, the toolbar, the
        footer) and the table between them is the one thing that scrolls.
      {% endcomment %}
      <c-mvp.page.content gap="0">
        {% block page.header %}
        {% endblock page.header %}
        {% block page.toolbar %}
          <c-mvp.page.table.toolbar>
            {% if refinements %}
              <c-slot name="note">
                {% blocktrans count counter=refinements|length %}{{ counter }} filter active{% plural %}{{ counter }} filters active{% endblocktrans %}
              </c-slot>
            {% endif %}
            <c-slot name="title">
              {% block page.title %}
                <h1 class="text-xl font-semibold leading-tight truncate">{{ page.title }}</h1>
                <c-mvp.page.info :text="page.info" :title="page.title" :actions="page.info_actions" />
                {% block page.summary %}
                  <c-mvp.page.list.summary class="whitespace-nowrap" />
                {% endblock page.summary %}
                {% if page.subtitle %}
                  <p class="hidden lg:block text-sm text-base-content/70 truncate min-w-0">{{ page.subtitle }}</p>
                {% endif %}
              {% endblock page.title %}
            </c-slot>
            <c-slot name="actions">
              {% block page.actions %}
              {% endblock page.actions %}
            </c-slot>
            {% block page.panel %}
              {% if is_searchable or filter or refinements or directory.create_url %}
                <div class="flex flex-wrap items-center gap-x-3 gap-y-2">
                  {% if is_searchable %}
                    <div class="w-full md:w-1/3 md:max-w-sm">
                      {% block page.search %}
                        <c-mvp.page.list.actions.search class="w-full" input_class="min-w-0" />
                      {% endblock page.search %}
                    </div>
                  {% endif %}
                  <div class="flex flex-wrap items-center gap-2 md:ms-auto">
                    {% block page.controls %}
                      <c-mvp.page.list.actions :actions="['filter','create']" />
                    {% endblock page.controls %}
                  </div>
                </div>
                {% block page.refinements %}
                  <c-mvp.page.list.refinements />
                {% endblock page.refinements %}
              {% endif %}
            {% endblock page.panel %}
          </c-mvp.page.table.toolbar>
        {% endblock page.toolbar %}
        {% block page.content %}
          <c-mvp.addons.django-table :table="table" class="flex-1 min-h-0" />
        {% endblock page.content %}
        {% block page.footer %}
          {% if page_obj %}
            <c-mvp.page.list.footer :page_obj="page_obj"
                                size="sm"
                                class="mvp-table-pager shrink-0 px-4 py-2 border-t border-base-300" />
          {% endif %}
        {% endblock page.footer %}
      </c-mvp.page.content>
    {% endblock page.content-wrapper %}
  </c-mvp.page>
{% endblock content %}