table-folder in fractal

table.config.yaml

---
  status: "wip"
  handle: "table"

  context:
    tablehead:
      - item: "AutorIn"
      - item: "Titel"
      - item: "Verlag"
    rows:
      - row:
          - inlinelink: true
            value: "Raphaela Edelbauer"
          - inlinelink: true
            value: "Das flüssige Land"
          - value: "Klett-Cotta"
      - row:
          - inlinelink: true
            value: "Miku Sophie Kühmel"
          - inlinelink: true
            value: "Kintsugi"
          - value: "S. Fischer"
      - row:
          - value: "Tonio Schachinger"
          - value: "Nicht wie ihr"
          - value: "Kremayr & Scheriau"
      - row:
          - inlinelink: true
            value: "Norbert Scheuer"
          - inlinelink: true
            value: "Winterbienen"
          - value: "C. H. Beck"
      - row:
          - inlinelink: true
            value: "Saša Stanišić"
          - inlinelink: true
            value: "Herkunft"
          - value: "Luchterhand"
      - row:
          - inlinelink: true
            value: "Jackie Thomae"
          - inlinelink: true
            value: "Brüder"
          - value: "Hanser Berlin"

  variants:
    - name: "default"
      hidden: true
      label: "diese Tabelle sollte versteckt sein"

    - name: "responsive"
      label: "responsive Tabelle"
      status: "ready"

      context:
        wrapperclass: "table-responsive"

table.hbs

{{#if wrapperclass}}<div class="{{wrapperclass}}">{{/if}}
  <table class="table{{#if modifier}} {{modifier}}{{/if}}">
    <thead>
    <tr>
      {{#tablehead}}
      <th>{{item}}</th>
      {{/tablehead}}
    </tr>
    </thead>
    <tbody>
    {{#each rows as |row|}}
    <tr>
      {{#each row.row as |item|}}
      <td>
        {{#if item.inlinelink}}
          <a href="#" class="inline-link">{{item.value}}</a>
        {{else}}
          {{item.value}}
        {{/if}}
      </td>
      {{/each}}
    </tr>
    {{/each}}
    </tbody>
  </table>
{{#if wrapperclass}}</div>{{/if}}