@props(['src'=>null])
<div {{$attributes->merge(['class'=>"shrink-0 inline-flex items-center justify-center overflow-hidden rounded-full border border-gray-200 dark:border-secondary-500 w-10 h-10 text-base"])}}>

    @if ($src)
        <img @class([ 'shrink-0 w-full h-full object-cover object-center rounded-full', ])
            src="{{ $src }}"
        />
    @else
        <img @class([ 'shrink-0 w-full h-full object-cover object-center rounded-full', ])
            src="{{ asset('default-images/default-avatar.png') }}"
            alt="avatar"
        />
    @endif
</div>