@php
    $current = $current ?? null;
    $preview = $current ? media_url($current) : null;
    $required = $required ?? false;
    $wide = $wide ?? false;
@endphp

<div class="media-upload {{ $wide ? 'media-upload--wide' : '' }}" data-media-upload>
    <div class="media-upload__label">{{ $label }}</div>
    @if (! empty($hint))
        <p class="media-upload__hint">{{ $hint }}</p>
    @endif

    <label class="media-drop {{ $preview ? 'has-preview' : '' }}">
        <input type="hidden" name="{{ $pathName }}" value="{{ old($pathName, $current) }}" data-media-path>
        <input type="file" name="{{ $name }}" accept="image/*" class="media-drop__input" data-media-file {{ $required && ! $current ? 'required' : '' }}>

        <img src="{{ $preview }}" alt="" class="media-drop__preview" data-media-preview @if(! $preview) hidden @endif>

        <span class="media-drop__placeholder" data-media-placeholder @if($preview) hidden @endif>
            <i class="bi bi-cloud-arrow-up"></i>
            <strong>Görseli sürükleyin veya tıklayın</strong>
            <small>JPG, PNG veya WEBP · en fazla 5 MB</small>
        </span>

        <span class="media-drop__change">Değiştir</span>
    </label>
</div>