{# The operation table of step 2, and the line that counts it (spec §7.1).

   Returned on its own as the answer to a filter or a bulk button, which is why
   it is a template rather than a macro and why it starts at the element htmx
   replaces. Its context is ``picker``, ``picker_id`` and ``picker_target``,
   which is what ``routes_ui._picker_context`` exists to build.

   The filter controls are deliberately *outside* this region. Swapping an input
   the operator is typing in would move the caret out from under them; swapping
   only what the filter decides leaves the controls where they were put.

   A filtered-out row is hidden, not dropped. Its checkbox is still in the form
   and still carries what was ticked, so narrowing the table can never quietly
   unselect anything. #}
{% from "partials/status_badge.html" import status_badge %}
<div id="{{ picker_id }}">
  {# The sentence, and the sentence with its count still a slot. The header box
     below moves ticks in the page and posts nothing, so ``table.js`` rewrites
     this line from the second one rather than from a wording of its own. #}
  <p
    class="picker__summary"
    role="status"
    data-summary="{{ picker.summary_template }}"
  >{{ picker.summary }}</p>
  <table class="table table--editable">
    <thead>
      <tr>
        <th scope="col" class="pick">
          {# Ticks the rows the filter is showing, and only those. Ships hidden
             and is unhidden by ``table.js``: it moves ticks in the page and
             writes nothing itself, so with no script it would be a box that
             does nothing. Nothing is lost — the two bulk buttons are rendered
             in that case, and rows are still ticked one at a time
             (task 115). #}
          <input
            type="checkbox"
            id="tick-all"
            data-tick-all
            hidden
          />
          <label class="visually-hidden" for="tick-all">
            Expose every operation the filter is showing
          </label>
        </th>
        <th scope="col">Method</th>
        <th scope="col">Path</th>
        {# No Summary column. The cell beside it is a box now, and a column of
           prose next to a control makes the control the narrowest thing on the
           row — which is why the detail page lost its Description column at
           task 116. The sentence did not go: it is under the path, where that
           table already puts one (task 118). #}
        <th scope="col">Name</th>
      </tr>
    </thead>
    <tbody>
      {% for row in picker.rows %}
      {#- One line of attributes, written so an untouched row renders exactly as
          it always has: a class of nothing at all would be markup nobody asked
          for on two hundred rows. #}
      <tr
        {%- if not row.shown %} hidden{% endif %}
        {%- if row.error %} class="row--invalid"{% endif %}>
        <td class="pick">
          <input
            type="checkbox"
            id="op-{{ loop.index }}"
            name="op"
            value="{{ row.op_key }}"
            {% if row.selected %}checked{% endif %}
          />
          <label class="visually-hidden" for="op-{{ loop.index }}">
            Expose {{ row.op_key }} as a tool
          </label>
        </td>
        <td><code>{{ row.method }}</code></td>
        <td>
          <code>{{ row.path }}</code>
          {% for tag in row.tags %}
          <span class="badge badge--tag">{{ tag }}</span>
          {% endfor %}
          {# What the document says this endpoint does, where the detail page
             puts the same sentence. No fallback to the ``operationId``: the box
             in the next cell is showing it, since sanitising only takes out
             what a tool name may not contain (task 118). #}
          {% if row.summary %}
          <span class="cell-note">{{ row.summary }}</span>
          {% endif %}
        </td>
        <td>
          {# The prefix as the slot it is rather than as it stood when this page
             last rendered: the box above is typed in without posting, and a
             name that claimed a prefix nobody has any more would be worse than
             one that says where the prefix goes. This is the one thing this
             cell does differently from the same cell on the detail page, where
             the prefix is saved before the table is rendered against it. Shown
             whole where a slot would not be true — a cleared prefix, or a name
             that had to be cut down (tasks 115 and 118). #}
          <span class="name-box">
            {% if row.stem is not none %}
            <code class="name-lead"><var class="name-slot">&lt;prefix&gt;</var>__</code>
            {% endif %}
            <input
              class="field__input"
              type="text"
              name="{{ row.name_field }}"
              value="{{ row.typed }}"
              {# The generated name, shown the way the box shows one, so that
                 clearing the box shows what clearing it means before the
                 operator does it. #}
              placeholder="{{ row.default_stem }}"
              aria-label="{{ row.name_label }}"
              autocomplete="off"
              spellcheck="false"
            />
          </span>
          {% if row.conflict %}
          {{ status_badge("error", label="Name taken", title=row.conflict) }}
          {% endif %}
          {% if row.error %}
          <span class="field__error" role="alert">{{ row.error }}</span>
          {% endif %}
        </td>
      </tr>
      {% endfor %}
      {% if not picker.shown %}
      <tr>
        <td colspan="4">Nothing here matches the filter. Everything ticked is still ticked.</td>
      </tr>
      {% endif %}
    </tbody>
  </table>
</div>