{% load i18n wagtailadmin_tags %}

{% fragment as id %}inline_child_{{ child.form.prefix }}{% endfragment %}
{% fragment as panel_id %}{{ id }}-panel{% endfragment %}
<div data-inline-panel-child id="{{ id }}" data-contentpath-disabled>
    {% fragment as header_controls %}
        {% if can_order %}
            <button type="button" class="button button--icon text-replace white" data-inline-panel-child-move-up title="{% trans 'Move up' %}">{% icon name="arrow-up" %}</button>
            <button type="button" class="button button--icon text-replace white" data-inline-panel-child-move-down title="{% trans 'Move down' %}">{% icon name="arrow-down" %}</button>
            <button type="button" class="button button--icon text-replace white" data-inline-panel-child-drag title="{% trans 'Drag' %}">{% icon name="grip" %}</button>
        {% endif %}
        <button type="button" class="button button--icon text-replace white" id="{{ child.form.DELETE.id_for_label }}-button" title="{% trans 'Delete' %}">{% icon name="bin" %}</button>
    {% endfragment %}
    {% fragment as heading %}
        {{ self.label }}<span data-inline-panel-child-count></span>
    {% endfragment %}
    {% panel id=panel_id heading=heading heading_size="label" heading_level="3" header_controls=header_controls %}
        {% if child.form.non_field_errors %}
            <ul>
                {% for error in child.form.non_field_errors %}
                    <li class="error-message">
                        <span>{{ error|escape }}</span>
                    </li>
                {% endfor %}
            </ul>
        {% endif %}
        {{ child.render_form_content }}
    {% endpanel %}
</div>