WP Timber/Twig Example Usage - Card Component Twig Include

card.twig

{% if card %}
  <div class="c-card{{ card.classes ? ' ' ~ card.classes }}">
    {% include "@atoms/images/image/figure.twig" with {
      "figure": {
        "link": {
          "url": card.link
        },
        "image": {
          "src": card.thumbnail.src,
          "alt": card.thumbnail.alt
        },
        "classes": "c-card__image"
      }
    } %}
    <div class="c-card__content u-spacing--half">
      {% include "@atoms/text/kicker/kicker.twig" with {
        "kicker": {
          "text": card.category.name,
          "link": card.category.link,
          "classes": "c-card__kicker"
        }
      } %}
      {% include "@atoms/text/heading/heading.twig" with {
        "heading": {
          "level": card.heading.level ? card.heading.level : "2",
          "size": card.heading.size ? card.heading.size : "md",
          "text": card.title,
          "link": {
            "url": card.link,
          },
          "classes": "c-card__heading"
        }
      } %}
      {% include "@atoms/text/dek/dek.twig" with {
        "dek": {
          "text": card.preview.length(15).read_more(false),
          "classes": "c-card__dek"
        }
      } %}

      <div class="c-card__footer">
        {% include "@atoms/links/link.twig" with {
          "link": {
            "url": card.link,
            "text": "Read More",
            "classes": "c-card__link"
          }
        } %}
        {% include "@atoms/text/meta/meta.twig" with {
          "meta": {
            "date": card.date,
            "classes": "c-card__meta"
          }
        } %}
      </div>
    </div>
  </div>
{% endif %}