jfu-1.0.x-dev/templates/components/jfu_table.html.twig

<div class="jfu-table-wrapper{{ classes }}">
  <div class="jfu-table-item {{ json_array.options.full_width ? 'container-full-width' : 'container' }}">
    <div class="jfu-table--title-container">
      <h3 class="jfu-table--title">{{ json_array.title }}</h3>
    </div>
    <div class="jfu-table--content">
      {% if json_array.subtitle %}
        <h4 class="jfu-table-info--subtitle">{{ json_array.subtitle }}</h4>
      {% endif %}
        {% if json_array.body.value is not empty  %}
          {% include '@jfu/components/jfu_' ~ json_array.body.type ~ '.html.twig' with {'json_array': json_array.body } %}
        {% endif %}
      <div class="jfu-table">
        <table>
          {% if json_array.thead.items %}
            <thead>
              <tr>
                {% for thead_item  in json_array.thead.items %}
                  <th {{ thead_item.class ? 'class='  ~ thead_item.class }} scope="col">
                    {% include '@jfu/components/jfu_' ~ thead_item.type ~ '.html.twig' with {'json_array': thead_item } %}
                  </th>
                {% endfor %}
              </tr>
            </thead>
          {% endif %}
          {% if json_array.tbody.items %}
            <tbody>
              {% for row in json_array.tbody.items %}
                <tr {{ row.class ? 'class='  ~ row.class }}>
                  {% for key, cell in row.cells %}
                    <td {{ cell.class ? 'class='  ~ cell.class }} data-label="{{ json_array.thead.items[loop.index0].value }}">
                      {% if cell.value is not empty %}
                        {% include '@jfu/components/jfu_' ~ cell.type ~ '.html.twig' with {'json_array': cell } %}
                      {% endif %}
                    </td>
                  {% endfor %}
                </tr>
              {% endfor %}
            </tbody>
          {% endif %}
        </table>
      </div>
    </div>
  </div>
</div>