{{--
    Partial: поле типа image — загрузка/замена изображения
    Переменные из родителя: $field, $prefix, $values, $imageUrl
--}}
@php
    $curVal = $values[$field['name']] ?? '';
    $curUrl = $imageUrl($curVal);
    $hasImg = $curVal !== '';
    $sizeHint = isset($field['width'], $field['height'])
        ? $field['width'] . '×' . $field['height'] . ' px, cover-кроп'
        : (isset($field['width']) ? 'макс. ' . $field['width'] . 'px по ширине' : 'макс. 1200px по ширине');
@endphp
<div class="form-group">
    <label>{{ $field['label'] }}</label>

    {{-- Скрытое поле: путь текущего файла (передаётся если нового файла нет) --}}
    <input type="hidden"
           name="{{ $prefix }}[{{ $field['name'] }}]"
           value="{{ $curVal }}"
           class="js-img-current">

    {{-- Превью текущего изображения --}}
    @if($hasImg)
        <div class="mb-2 js-img-preview-current">
            <img src="{{ $curUrl }}"
                 class="img-thumbnail d-block"
                 style="max-height:140px;max-width:220px;object-fit:cover">
            <small class="text-muted">{{ basename($curVal) }}</small>
        </div>
    @endif

    {{-- Кнопка выбора файла --}}
    <div class="custom-file">
        <input type="file"
               name="uploads[{{ $field['name'] }}]"
               class="custom-file-input js-img-upload"
               accept="image/*"
               id="upload-flat-{{ $field['name'] }}">
        <label class="custom-file-label" for="upload-flat-{{ $field['name'] }}">
            {{ $hasImg ? 'Заменить изображение' : 'Выбрать изображение' }}
        </label>
    </div>

    {{-- Превью нового файла --}}
    <div class="js-img-preview-new mt-2" style="display:none">
        <img src="" class="img-thumbnail d-block" style="max-height:140px;max-width:220px;object-fit:cover">
        <small class="js-img-new-name text-muted"></small>
    </div>

    <small class="text-muted d-block mt-1">
        <i class="fas fa-crop-alt fa-xs"></i> {{ $sizeHint }}, WebP
    </small>
</div>