{% macro fancy_image(src, srcset=src, is_lazy=true, alt="", class_name=none) %}
  <span class="fancy-image {{ class_name if class_name }}">
    {{ base_image(src, srcset, is_lazy, alt) }}
  </span>
{% endmacro %}

{% macro background_image(src, srcset=src, is_lazy=true, class_name=none) %}
  <div class="fancy-image fancy-image--background {{ class_name if class_name }}">
    {{ base_image(src, srcset, is_lazy, alt="") }}
  </div>
{% endmacro %}

{% macro base_image(src, srcset=src, is_lazy=true, alt="") %}
  <picture class="fancy-image__picture">
    <img
      class="fancy-image__image"
      src="{{ src }}"
      alt="{{ alt }}"
      srcset="{{ srcset }}"
      loading="{{ 'lazy' if is_lazy else 'eager' }}"
    >
  </picture>
{% endmacro %}
