dsfr4drupal-1.x-dev/templates/views/views-view-table.html.twig

{% set classes = [
  'cols-' ~ header|length,
  responsive ? 'responsive-enabled',
  sticky ? 'sticky-enabled',
] %}
{% set wrapper_attributes = wrapper_attributes|default(create_attribute()) %}
{% set wrapper_clases = [
  'fr-table',
  not responsive ? 'fr-table--layout-fixed',
] %}

{# Add border between table cells. #}
{% if bordered %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--bordered') %}
{% endif %}

{# Display the caption below the table. #}
{% if caption_bottom %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--caption-bottom') %}
{% endif %}

{# Hide caption. #}
{% if caption_hide %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--no-caption') %}
{% endif %}

{# Define a caption description. #}
{% if caption_description %}
  {% set caption %}
    {% if caption %}
      {{ caption }}
    {% else %}
      {{ title }}
    {% endif %}
    <div class="fr-table__caption__desc">{{ caption_description }}</div>
  {% endset %}
{% endif %}

{# Enable multiline mode for table cells. #}
{% if multiline %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--multiline') %}
{% endif %}

{# Disable table scrolling. #}
{% if no_scroll %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--no-scroll') %}
{% endif %}

{# Manage size variant. #}
{% if variant == 'sm' or variant == 'lg' %}
  {% set wrapper_attributes = wrapper_attributes.addClass('fr-table--' ~ variant) %}
{% endif %}

<div{{ wrapper_attributes.addClass(wrapper_clases) }}>
  {% if table_header %}
    <div class="fr-table__header">
      {{ table_header }}
    </div>
  {% endif %}
  <div class="fr-table__wrapper">
    <div class="fr-table__container">
      <div class="fr-table__content">
        <table{{ attributes.addClass(classes) }}>
          {% if caption_needed %}
            <caption>
              {% if caption %}
                {{ caption }}
              {% else %}
                {{ title }}
              {% endif %}
              {% if (summary_element is not empty) %}
                {{ summary_element }}
              {% endif %}
            </caption>
          {% endif %}
          {% if header %}
            <thead>
            <tr>
              {% for key, column in header %}
                {% if column.default_classes %}
                  {% set column_classes = [
                    'views-field',
                    'views-field-' ~ fields[key],
                  ] %}
                {% endif %}
              <th{{ column.attributes.addClass(column_classes).setAttribute('scope', 'col') }}>
                {%- if column.wrapper_element -%}
                  <{{ column.wrapper_element }}>
                  {%- if column.url -%}
                    <a href="{{ column.url }}" title="{{ column.title }}" rel="nofollow">{{ column.content }}{{ column.sort_indicator }}</a>
                  {%- else -%}
                    {{ column.content }}{{ column.sort_indicator }}
                  {%- endif -%}
                  </{{ column.wrapper_element }}>
                {%- else -%}
                  {%- if column.url -%}
                    <a href="{{ column.url }}" title="{{ column.title }}" rel="nofollow">{{ column.content }}{{ column.sort_indicator }}</a>
                  {%- else -%}
                    {{- column.content }}{{ column.sort_indicator }}
                  {%- endif -%}
                {%- endif -%}
                </th>
              {% endfor %}
            </tr>
            </thead>
          {% endif %}
          <tbody>
          {% for row in rows %}
            <tr{{ row.attributes }}>
              {% for column in row.columns %}
                {% if column.default_classes %}
                  {% set column_classes = [
                    'views-field'
                  ] %}
                  {% for field in column.fields %}
                    {% set column_classes = column_classes|merge(['views-field-' ~ field]) %}
                  {% endfor %}
                {% endif %}
              <td{{ column.attributes.addClass(column_classes) }}>
                {%- if column.wrapper_element -%}
                  <{{ column.wrapper_element }}>
                  {% for content in column.content %}
                    {{ content.separator }}{{ content.field_output }}
                  {% endfor %}
                  </{{ column.wrapper_element }}>
                {%- else -%}
                  {% for content in column.content %}
                    {{- content.separator }}{{ content.field_output -}}
                  {% endfor %}
                {%- endif %}
                </td>
              {% endfor %}
            </tr>
          {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
  {% if table_footer %}
    <div class="fr-table__footer">
      {{ table_footer }}
    </div>
  {% endif %}
</div>
{{ attach_library('dsfr4drupal/component.table') }}