{% set thumbSizes = [30, 60, 100, 200] %}
{% set srcset = "" %}
{%- if asset.kind == 'image' -%}
    {%- for size in thumbSizes -%}
        {% set thumbTransform = { width: size, height: size } %}
        {% set srcset = srcset ~ ", " ~ asset.getUrl(thumbTransform) ~ " " ~ size ~ "w" %}
    {%- endfor -%}
    {% set srcset = srcset|trim(", ") %}
{%- else -%}
    {# Use getThumbUrl for non-image files like PDFs #}
    {% set srcset = craft.app.assets.thumbUrl(asset, 200, 200) %}
{%- endif -%}

<div data-editable-image=""
     data-image-width="{{ asset.width }}"
     data-image-height="{{ asset.height }}"
     class="element small hasthumb chip small"
     data-type="craft\elements\Asset"
     data-id="{{ asset.id }}"
     data-site-id="{{ asset.siteId }}"
     data-status="{{ asset.status }}"
     data-label="{{ asset.title }}"
     data-url="{{ asset.url }}"
     data-level="{{ asset.level }}"
     data-editable
>
    <div class="elementthumb thumb">
        <img sizes="30px" srcset="{{ srcset }}" alt="">
    </div>
    <div class="label chip-content">
        <a href="{{ asset.cpEditUrl }}">
            <span class="title">
                {{ asset.title }}
            </span>
        </a>
    </div>
</div>


