Nunjucks component macro - NOTE: Had to use .twig file extension since Github Gists don't support .njk :(

hero.twig

  <div class="hero" style="background-image:url({{ background_image OR "http://placehold.it/1000x400" }})">
    <h1 class="hero__title">{{ title OR "We Are Awesome" }}</h1>
   {% block body %}
   {% endblock %}
   {% block footer %}
        <a class="hero__cta button button--primary" href="{{ cta_href OR "/some/awesome-link.html" }}>{{ cta_text OR "Find Out Why!" }}</a>
   {% endblock %}
  </div>

page.twig

{% include 'hero.twig' %}

{# something with some context #}
{% include 'hero.twig' with { title: "We're super cool at that thing we do."} %}


{# passing in an html block #}
{% embed 'hero.twig' with { title: "Three reasonse we're the best:" } %}
  {% block body %}
  <div class="grid-row">
    <div class="grid-column-4">
      <h2>Industry Leadership</h2>
    </div>
    <div class="grid-column-4">
      <h2>Marketing Buzzword</h2>
    </div>
    <div class="grid-column-4">
      <h2>Cause we said so.</h2>
    </div>
  </div>
  {% endblock %}
  
  {% block footer %}
    <a class="hero__cta button button--secondary" href="/some-other/awesome-link.html">Find Out How</a>
  {% endblock %}
{% endembed %}