<template>
    <resource class="resource-single-image">
        <a-link
            :title="value.data.title"
            :href="img.url"
            v-for="(img, pi) in value.data.list"
            :key="pi"
            :yas="value"
            :yas-f="index">
            <img-format
                :lazy="lazy"
                :src="img.src"
                :w="value.data.imageWidth"
                :h="value.data.imageHeight"
                :alt="img.alt">
            </img-format>
        </a-link>
    </resource>
</template>

<script>
import Resource from './resource';

export default {
    name: 'ResourceSingleImage',
    props: {
        value: Object,
        lazy: Boolean,
        index: Number
    },
    components: {Resource}
};
</script>

<style lang="scss">
.resource-single-image {
    img {
        width: 100%;
        display: block;
    }
}
</style>