{% set unique_id = h.generate_unique_element_id() %}

<table
    class="table table-bordered table-borderless table-header {% if nested %}table-sm table-inner{% endif %}"
    {% if not nested %}data-module="table-toggle-more"{% endif %}>
    <thead>
        <tr>
            <th>{{ _("Field") }}</th>
            <th {% if nested %}class="position-relative"{% endif %}>
                {{ _("Value") }}

                {% if nested %}
                    <button class="btn btn-sm position-absolute end-0" data-bs-toggle="collapse" data-bs-target="{{ '#' + unique_id }}">
                        <i class="fa-solid fa-chevron-down"></i>
                    </button>
                {% endif %}
            </th>
        </tr>
    </thead>
    <tbody {% if nested %}class="collapse" id="{{ unique_id }}"{% endif %}>
        {% for key, value in data.items() %}
            <tr {% if loop.index > 10 and not nested %} class="toggle-more" {% endif %}>
                <td><b>{{ key | capitalize }}</b></td>
                <td>
                    {% snippet 'resource_docs/view/render.html', data=value, view_type=h.detect_view_type(value), nested=1 %}
                </td>
            </tr>
        {% endfor %}
    </tbody>
</table>