<div {{ attributes }} class="h-full w-full">
  {% if path ends with '.svg' or local %}
    <img
      {{ attributes.nested('img') }}
      class="object-cover"
      src="{{ path }}"
      alt="{{ alt }}"
      width="{{ imageWidth }}"
      height=""
      {{ imageHeight }} >
  {% else %}
    {% if responsive %}
      <picture
        {{ attributes.nested('picture') }}
        class="h-full w-full">
        {% if pathPortrait is not null %}
          {{ _self.source(pathLandscape,lazy,fm,fit,quality,bgAlpha,imageWidth,imageHeight,alt,mapping,this.generateSizes(ratioLandscape),true) }}
          {{ _self.source(pathPortrait,lazy,fm,fit,quality,bgAlpha,imageWidth,imageHeight,alt,mapping,this.generateSizes(ratioPortrait),false) }}
          <img
            {% if attributes.nested('img').render('class') %}
              {% if lazy %}
                {{ attributes.nested('img').defaults({class: 'opacity-0 transition-opacity duration-300 delay-75'}) }}
              {% endif %}
            {% endif %}
            {{ attributes.nested('img') }}
            class="h-full w-full"
            {% if lazy %}
              data-lazy
            {% endif %}
            src=""
            alt="{{ alt }}"
            width="{{ imageWidth }}"
            height=""
            {{ imageHeight }}>
        {% else %}
          {{ _self.imageSource(attributes,path,lazy,fm,fit,quality,bgAlpha,imageWidth,imageHeight,alt,mapping,this.generateSizes(ratioLandscape)) }}
        {% endif %}
      </picture>
    {% else %}
      {{ _self.imageSingle(attributes,path,lazy,fm,fit,quality,bgAlpha,imageWidth,imageHeight,alt,mapping) }}
    {% endif %}
  {% endif %}
</div>
{% macro imageSingle(attributes,path,lazy,fm,fit,quality,bgAlpha,imageWidth,imageHeight,alt,mapping) %}
{%
  set glideSrc = asset_glide(path, mapping, {
  fm: fm,
  fit: fit,
  q: quality,
  bg: bgAlpha,
  w: imageWidth,
  h: imageHeight
  })
%}

{% set imgAttributes = attributes.nested('img') %}
{% if lazy %}
  {% set imgAttributes = imgAttributes.defaults({ class: 'opacity-0 transition-opacity duration-300 delay-75' }) %}
{% endif %}

<img
  {{ imgAttributes }}
  class="h-full w-full"
  {% if lazy %}
    data-lazy
    data-src="{{ glideSrc }}"
    src=""
  {% else %}
    src="{{ glideSrc }}"
  {% endif %}
  alt="{{ alt }}"
  width="{{ imageWidth }}"
  height="{{ imageHeight }}">
{% endmacro %}

{% macro imageSource(attributes, path, lazy, fm, fit, quality, bgAlpha, imageWidth, imageHeight, alt, mapping, sizes) %}
{# Construction du srcset et des dimensions finales #}
{% set srcset = '' %}
{% for size in sizes %}
  {% set width = size.width %}
  {% set height = size.height %}
  {%
    set url = asset_glide(path, mapping, {
    fm: fm,
    fit: fit,
    q: quality,
    bg: bgAlpha,
    w: width,
    h: height
    })
  %}
  {% set srcset = srcset ~ url ~ ' ' ~ width ~ 'w ' ~ height ~ 'h' %}
  {% if not loop.last %}
    {% set srcset = srcset ~ ', ' %}
  {% else %}
    {% set imageWidth = width %}
    {% set imageHeight = height %}
  {% endif %}
{% endfor %}

{% set imgAttributes = attributes.nested('img') %}
{% if lazy %}
  {% set imgAttributes = imgAttributes.defaults({ class: 'opacity-0 transition-opacity duration-300 delay-75' }) %}
{% endif %}

<img
  {{ imgAttributes }}
  class="h-full w-full"
  sizes="100%"
  {% if lazy %}
    data-lazy
    data-srcset="{{ srcset }}"
    src=""
  {% else %}
    srcset="{{ srcset }}"
    src="
      {{ asset_glide(path, mapping, {
          fm: fm,
          fit: fit,
          q: quality,
          bg: bgAlpha,
          w: imageWidth,
          h: imageHeight
      }) }}
    "
  {% endif %}
  width="{{ imageWidth }}"
  height="{{ imageHeight }}"
  alt="{{ alt }}">
{% endmacro %}

{% macro source(path, lazy, fm, fit, quality, bgAlpha, imageWidth, imageHeight, alt,mapping, sizes, landscape) %}
{# Génération du srcset complet en amont #}
{% set srcset = '' %}
{% for size in sizes %}
  {%
    set url = asset_glide(path, mapping, {
    fm: fm,
    fit: fit,
    q: quality,
    bg: bgAlpha,
    w: size.width,
    h: size.height
    })
  %}
  {% set srcset = srcset ~ url ~ ' ' ~ size.width ~ 'w ' ~ size.height ~ 'h' %}
  {% if not loop.last %}
    {% set srcset = srcset ~ ', ' %}
  {% endif %}
{% endfor %}

<source
  {% if lazy %}
    data-srcset="{{ srcset }}"
  {% else %}
    srcset="{{ srcset }}"
  {% endif %}
  sizes="100%"
  media="(orientation: {{ landscape ? 'landscape' : 'portrait' }})"
  type="image/{{ fm }}">
{% endmacro %}
