{% comment %}
Renders the Dropdown Header plugin's HTML.
{% endcomment %}

{% block code %}
html: function (data) {
    let header = ''

    {% if widget.plugins.dropdown_header.show_value_field %}
        header += `
        <div class="col">
            <span class="{{ widget.plugins.dropdown_header.label_class }}" role="columnheader">{{ widget.plugins.dropdown_header.value_field_label }}</span>
        </div>
        <div class="col">
            <span class="{{ widget.plugins.dropdown_header.label_class }}" role="columnheader">{{ widget.plugins.dropdown_header.label_field_label }}</span>
        </div>
        `
    {% else %}
        header += `
        <div class="col">
            <span class="{{ widget.plugins.dropdown_header.label_class }}" role="columnheader">{{ widget.plugins.dropdown_header.label_field_label }}</span>
        </div>
        `
    {% endif %}

    {% for header in widget.plugins.dropdown_header.extra_headers %}
        header += `
        <div class="col">
            <span class="{{ widget.plugins.dropdown_header.label_class }}" role="columnheader">{{ header }}</span>
        </div>
        `
    {% endfor %}

    return `<div class="{{ widget.plugins.dropdown_header.header_class }}" title="{{ widget.plugins.dropdown_header.title }}" role="row">
                <div class="{{ widget.plugins.dropdown_header.title_row_class }}">${header}</div>
            </div>`
},
{% endblock code %}
