{# Inline related records -- see docs/inlines.md. One entry in the
   `inlines` context list per ModelAdmin.inlines declaration;
   render_inline_section dispatches on .mode and .layout. #}
{% from "admin/components/ui/field.html" import render_form_input with context %}
{% from "admin/components/field.html" import render_field_value with context %}
{% from "admin/components/icons.html" import icon %}
{% from "admin/components/ui/combobox.html" import combobox %}
{% from "admin/components/ui/select.html" import select %}
{% from "admin/components/ui/multi-select.html" import multi_select %}
{% from "admin/components/ui/delete-preview.html" import delete_refusal %}

{% macro render_inline_section(inline) %}
<div id="inline-{{ inline.slug }}" class="mt-8">
  {# Set only by the inline delete route, when the child's delete_preview
     refused; undefined (and so falsy) everywhere else. #}
  {% if refusal %}<div class="mb-3">{{ delete_refusal(refusal) }}</div>{% endif %}
  <h3 class="{{ ui('text', 'heading') }}">{{ _(inline.label) }}</h3>
  {% if inline.mode == "placeholder" %}
  <div class="{{ ui('panel', 'dashed') }}">
    {{ _("Save to add %(label)s.", label=_(inline.label)) }}
  </div>
  {% elif inline.mode == "readonly" %}
    {% if inline.layout == "tabular" %}{{ render_inline_readonly_table(inline) }}
    {% else %}{{ render_inline_readonly_stacked(inline) }}{% endif %}
  {% else %}
    {% if inline.layout == "tabular" %}{{ render_inline_editable_table(inline) }}
    {% else %}{{ render_inline_editable_stacked(inline) }}{% endif %}
  {% endif %}
</div>
{% endmacro %}

{# -- stacked, editable ---------------------------------------------- #}
{% macro render_inline_editable_stacked(inline) %}
{% for row in inline.rows %}
<form class="{{ ui('panel') }}"
      hx-post="{{ row.update_url }}" hx-target="#inline-{{ inline.slug }}" hx-swap="outerHTML">
  {% for name in inline.field_names %}
  {% set field = inline.child_admin.get_field(name) %}
  {% set value = row.data.get(name) if row.data is not none else field.get_value(row.obj) %}
  {{ render_form_input(field, value, row.errors.get(name), row.relation_options.get(name), key=inline.slug ~ "-" ~ row.pk) }}
  {% endfor %}
  <div class="flex gap-2">
    {% if inline.can_change %}
    <button type="submit"
            class="{{ ui('button', 'size-xs') }}">
      {{ icon("check", "w-3.5 h-3.5") }} {{ _("Save") }}
    </button>
    {% endif %}
    {% if inline.can_delete %}
    <button type="button" hx-delete="{{ row.delete_url }}" hx-target="#inline-{{ inline.slug }}"
            hx-swap="outerHTML swap:0.2s" hx-confirm="{{ _('Remove this %(label)s?', label=_(inline.label)) }}"
            class="{{ ui('button', 'ghost-destructive', 'size-xs') }}">
      {{ icon("delete", "w-3.5 h-3.5") }} {{ _("Remove") }}
    </button>
    {% endif %}
  </div>
</form>
{% endfor %}
{% if inline.add_row %}
<form class="{{ ui('panel', 'dashed') }}"
      hx-post="{{ inline.add_row.create_url }}" hx-target="#inline-{{ inline.slug }}" hx-swap="outerHTML">
  {% for name in inline.field_names %}
  {% set field = inline.child_admin.get_field(name) %}
  {% set value = inline.add_row.data.get(name) if inline.add_row.data is not none else none %}
  {{ render_form_input(field, value, inline.add_row.errors.get(name), inline.add_row.relation_options.get(name), key=inline.slug ~ "-new") }}
  {% endfor %}
  <button type="submit"
          class="{{ ui('button', 'outline', 'size-xs') }}">
    {{ icon("plus", "w-3.5 h-3.5") }} {{ _("Add") }}
  </button>
</form>
{% endif %}
{% if not inline.rows and not inline.add_row %}
<p class="text-sm text-muted-foreground">{{ _("No %(label)s.", label=_(inline.label)) }}</p>
{% endif %}
{% endmacro %}

{# No <form> element: HTML forbids one as a table row or cell
   descendant. Save uses hx-post plus hx-include="closest tr", since
   there is no enclosing <form> to submit. #}
{% macro render_inline_table_cell_input(field, value, errors, relation, key="") %}
{# Called, not quoted. This was a string literal containing Jinja
   delimiters -- Jinja never re-renders a value, so the raw text landed
   in the class attribute and every control in an inline edit row
   rendered unstyled: white on white in dark mode. #}
{% set field_classes = ui('input', 'size-sm') %}
{% set select_classes = ui('select', 'cell') %}
{% if field.field_type == "boolean" %}
<input type="checkbox" name="{{ field.name }}" value="true" autocomplete="off" {% if value %}checked{% endif %}
       class="{{ ui('checkbox') }}">
{% elif field.field_type in ("foreignkey", "onetoone") and relation and relation.autocomplete %}
{# An autocomplete relation loads no options into the page, so the plain
   select below would be empty. Same combobox the full form uses. #}
{{ combobox(name=field.name,
            id="combobox-results-" ~ key ~ "-" ~ field.name,
            selected_pk=relation.selected_pk,
            selected_label=relation.selected_label,
            lookup_url=base_path ~ "/" ~ relation.lookup_target ~ "/lookup",
            placeholder=_('Search…')) }}
{% elif field.field_type in ("foreignkey", "onetoone") %}
{{ select(field.name, [(none, "—")] + (relation.options|list if relation else []),
          selected=(relation.selected_pk if relation else none), placeholder="—", compact=true) }}
{% elif field.field_type == "manytomany" %}
{# The same shadcn control the full form uses: a trigger with chips and
   a portalled popover, so a row stays one line tall however many options
   there are -- the native <select multiple> it replaces had to be capped
   and scrolled internally to avoid 195px rows. #}
{% set m2m = namespace(pairs=[]) %}
{% for pk, label in (relation.options if relation else []) %}
{% set m2m.pairs = m2m.pairs + [(pk, label, relation and pk in relation.selected_pks)] %}
{% endfor %}
{{ multi_select(field.name, m2m.pairs, placeholder=_("Select…"), compact=true) }}
{% elif field.field_type == "enum" %}
<select name="{{ field.name }}" autocomplete="off" class="{{ select_classes }}">
  {% for choice in field.choices %}
  <option value="{{ choice }}" {% if choice == value %}selected{% endif %}>{{ choice }}</option>
  {% endfor %}
</select>
{% else %}
<input type="text" name="{{ field.name }}" value="{{ value|form_value(field.field_type) }}" autocomplete="off" class="{{ field_classes }}">
{% endif %}
{% for error in errors or [] %}
<p class="{{ ui('text', 'error') }}">{{ error }}</p>
{% endfor %}
{% endmacro %}

{% macro render_inline_editable_table(inline) %}
<div class="{{ ui('table', 'wrapper') }}">
{# The wrapper is overflow-hidden (it owns the rounded border), so
   without this the table is clipped at the card's edge and the row's own
   actions become unreachable. #}
<div class="{{ ui('table', 'scroll') }}">
<table class="min-w-full divide-y divide-border">
  <thead class="bg-muted/50"><tr>
    {% for name in inline.field_names %}
    <th class="{{ ui('table', 'th-compact') }}">{{ _(inline.child_admin.get_field(name).label) }}</th>
    {% endfor %}
    <th></th>
  </tr></thead>
  <tbody class="divide-y divide-border">
    {% for row in inline.rows %}
    <tr>
      {% for name in inline.field_names %}
      {% set field = inline.child_admin.get_field(name) %}
      {% set value = row.data.get(name) if row.data is not none else field.get_value(row.obj) %}
      <td class="px-3 py-2">{{ render_inline_table_cell_input(field, value, row.errors.get(name), row.relation_options.get(name), inline.slug ~ "-" ~ row.pk) }}</td>
      {% endfor %}
      <td class="px-3 py-2 text-right whitespace-nowrap">
        {% if inline.can_change %}
        <button type="button" hx-post="{{ row.update_url }}" hx-include="closest tr"
                hx-target="#inline-{{ inline.slug }}" hx-swap="outerHTML"
                class="{{ ui('button', 'ghost-muted', 'size-icon-sm') }}">
          {{ icon("check", "w-4 h-4") }}<span class="sr-only">{{ _("Save") }}</span>
        </button>
        {% endif %}
        {% if inline.can_delete %}
        <button type="button" hx-delete="{{ row.delete_url }}" hx-target="#inline-{{ inline.slug }}"
                hx-swap="outerHTML swap:0.2s" hx-confirm="{{ _('Remove this %(label)s?', label=_(inline.label)) }}"
                class="{{ ui('button', 'ghost-destructive', 'size-icon-sm') }}">
          {{ icon("delete", "w-4 h-4") }}<span class="sr-only">{{ _("Remove") }}</span>
        </button>
        {% endif %}
      </td>
    </tr>
    {% endfor %}
    {% if inline.add_row %}
    <tr>
      {% for name in inline.field_names %}
      {% set field = inline.child_admin.get_field(name) %}
      {% set value = inline.add_row.data.get(name) if inline.add_row.data is not none else none %}
      <td class="px-3 py-2">{{ render_inline_table_cell_input(field, value, inline.add_row.errors.get(name), inline.add_row.relation_options.get(name), inline.slug ~ "-new") }}</td>
      {% endfor %}
      <td class="px-3 py-2 text-right">
        <button type="button" hx-post="{{ inline.add_row.create_url }}" hx-include="closest tr"
                hx-target="#inline-{{ inline.slug }}" hx-swap="outerHTML"
                class="{{ ui('button', 'ghost-muted', 'size-icon-sm') }}">
          {{ icon("plus", "w-4 h-4") }}<span class="sr-only">{{ _("Add") }}</span>
        </button>
      </td>
    </tr>
    {% endif %}
  </tbody>
</table>
</div>
{# The empty state sits outside the scroller: there is nothing to
   scroll, and a centred message inside a scrolling box drifts. #}
{% if not inline.rows and not inline.add_row %}
<p class="{{ ui('table', 'empty') }}">{{ _("No %(label)s.", label=_(inline.label)) }}</p>
{% endif %}
</div>
{% endmacro %}

{# -- read-only (detail page) ------------------------------------------ #}
{% macro render_inline_readonly_stacked(inline) %}
{% for row in inline.rows %}
<div class="{{ ui('panel') }}">
  <a href="{{ row.detail_url }}" class="{{ ui('text', 'link') }}">{{ row.pk }}</a>
  <dl class="mt-2 divide-y divide-border">
    {% for name in inline.detail_field_names %}
    {% set field = inline.child_admin.get_field(name) %}
    <div class="flex justify-between gap-4 py-1 text-sm">
      <dt class="text-muted-foreground">{{ _(field.label) }}</dt>
      <dd class="text-right">{{ render_field_value(field, field.get_value(row.obj), inline.empty_value) }}</dd>
    </div>
    {% endfor %}
  </dl>
</div>
{% endfor %}
{% if not inline.rows %}<p class="text-sm text-muted-foreground">{{ _("No %(label)s.", label=_(inline.label)) }}</p>{% endif %}
{% endmacro %}

{% macro render_inline_readonly_table(inline) %}
<div class="{{ ui('table', 'wrapper') }}">
{# The wrapper is overflow-hidden (it owns the rounded border), so
   without this the table is clipped at the card's edge and the row's own
   actions become unreachable. #}
<div class="{{ ui('table', 'scroll') }}">
<table class="min-w-full divide-y divide-border">
  <thead class="bg-muted/50"><tr>
    {% for name in inline.detail_field_names %}
    <th class="{{ ui('table', 'th-compact') }}">{{ _(inline.child_admin.get_field(name).label) }}</th>
    {% endfor %}
  </tr></thead>
  <tbody class="divide-y divide-border">
    {% for row in inline.rows %}
    <tr>
      {% for name in inline.detail_field_names %}
      {% set field = inline.child_admin.get_field(name) %}
      <td class="px-3 py-2 text-sm">
        {# A relation with several targets renders as a comma-joined run
           of links, and in a table cell that wraps: one record with
           three of them made the row three lines tall and widened the
           column enough to push the row's own actions off the card. #}
        {% if field.field_type == "manytomany" %}<span class="{{ ui('scroll-area', 'x') }}">{{ render_field_value(field, field.get_value(row.obj), inline.empty_value) }}</span>
        {% elif name == inline.link_field %}
        {# The primary key's cell opens the record, so the row needs no
           column of its own for a View link. Never a relation cell,
           which is already a link -- nesting one in another is invalid
           HTML that browsers silently restructure. #}
        <a href="{{ row.detail_url }}" class="{{ ui('text', 'link') }}">{{ render_field_value(field, field.get_value(row.obj), inline.empty_value) }}</a>
        {% else %}{{ render_field_value(field, field.get_value(row.obj), inline.empty_value) }}{% endif %}
      </td>
      {% endfor %}
    </tr>
    {% endfor %}
  </tbody>
</table>
</div>
{% if not inline.rows %}<p class="{{ ui('table', 'empty') }}">{{ _("No %(label)s.", label=_(inline.label)) }}</p>{% endif %}
</div>
{% endmacro %}