@props([
    'name',
    'label',
    'hint' => null,
    'accept' => '.pdf,.jpg,.jpeg,.png',
    'current' => null,
])

<div class="field field-file {{ $errors->has($name) ? 'has-error' : '' }}">
    <label class="field-label" for="{{ $name }}">{{ $label }}</label>

    @if($current)
        <div class="current-file">
            <span class="current-file-icon"><x-icon name="check-circle" /></span>
            <span class="current-file-text">Documento cargado</span>
            <a href="{{ asset($current) }}" target="_blank" rel="noopener" class="btn btn-ghost btn-sm">
                <x-icon name="file" />
                Ver Documento
            </a>
        </div>
    @endif

    <label class="dropzone" for="{{ $name }}" data-file-drop>
        <input type="file" name="{{ $name }}" id="{{ $name }}" accept="{{ $accept }}" class="dropzone-input" data-file-input hidden>
        <span class="dropzone-icon"><x-icon name="upload" /></span>
        <span class="dropzone-text" data-file-text>{{ $current ? 'Sube uno nuevo para reemplazarlo' : 'Arrastra un archivo o haz clic para subir' }}</span>
    </label>

    @if($hint)
        <p class="field-hint">{{ $hint }}</p>
    @endif

    @error($name)
        <p class="field-error">{{ $message }}</p>
    @enderror
</div>