{% import 'ohmyadmin/lib/forms.html' as forms %}

<x-modal data-modal-wrapper hx-target="this" hx-swap="outerHTML">
    <div class="modal">
        <form class="modal-dialog" method="post" hx-post="{{ request.url }}">
            <header>
                {% block header %}
                    <span>{{ modal.title }}</span>
                    <button type="button" @click="closeModal">
                        {{ tabler_icon('x') }}
                    </button>
                {% endblock %}
            </header>
            <main>
                {% block content %}
                    {% block before_form %}{% endblock %}
                    {% block form %}
                        {% for field in form %}
                            {{ forms.form_field(field) }}
                        {% endfor %}
                    {% endblock %}
                    {% block after_form %}{% endblock %}
                {% endblock %}
            </main>
            <footer>
                {% block actions %}
                    {% for action in modal.actions %}
                        {{ action.render(request) }}
                    {% endfor %}
                {% endblock %}
            </footer>
        </form>
    </div>
</x-modal>
