@props([
    'id' => null,
    'name' => 'image',
    'label' => __('admin.image_txt'),
    'info' => __('message.info.image'),
    'required' => false,
    'css' => '',
    'media_folder' => '',
    'img_width' => 120,
    'view_txt' => __('admin.view_txt'),
    'target' => '_blank',
    'remove_txt' => __('admin.remove_txt'),
    'delete_url' => null,
    'file_field_value' => '', // column value in model
    'col' => 'col-md-12',
])

<x-form.group :col="$col" :label="$label" :for="$id ?? $name" :required="$required" :info="$info">
    @if (!empty($file_field_value))
        <div class="mb-3">
            <x-link_tooltip :url="$media_folder . $file_field_value" :title="$view_txt" :target="$target" placement="right">
                <x-img :src="$media_folder . $file_field_value" :width="$img_width" class="img-thumbnail" />
            </x-link_tooltip>
        </div>

        {{-- Show delete only if NOT required --}}
        @if (!$required && $delete_url)
            <x-link class="btn btn-danger waves-effect waves-light mb-3 delLink" :url="$delete_url">
                {{ $remove_txt }}
            </x-link>
        @endif
    @endif

    <x-form.field.file :id="$id ?? $name" :name="$name" class="{{ $css }}" :required="$required" />
</x-form.group>