{% fragment as default_content %}
{% load randomid %}
{% for td in data %}
    {% if forloop.first %}
        <th scope="row"
            class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white min-w-30char">
            {% randomid td as th_popover_id %}
            <span data-popover-target="{{ th_popover_id }}">{{ td|truncatechars:30 }}</span>
            {% if td|length > 30 %}
                {% #popover id=th_popover_id %}
                {{ td }}
                {% /popover %}
            {% endif %}
        </th>
    {% else %}
        {% #table_td %}
        {{ td }}
        {% /table_td %}
    {% endif %}
{% endfor %}
{% endfragment %}
<tr class="odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600 border-b">
    {{ children|default:default_content }}
</tr>