@props(['id', 'name', 'label', 'value', 'placeholder', 'required'])
@php
$wire = getWireAttributes($attributes);
$inputValue = old($name, $value ?? '');
@endphp
<div class="mb-3">
    <label for="{{ $id ?? $name }}">{!! $label !!} @isset($required) <small class="text-danger">*</small> @endisset</label>
    <div class="input-group datepicker-wrap">
        <span class="input-group-text" role="button" data-toggle>
            <svg class="text-secondary" width="20" height="20" viewbox="0 0 20 20" fill="currentColor">
                <path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd" />
            </svg>
        </span>
        <input type="text" class="form-control @error($name) is-invalid @enderror" placeholder="{{ $placeholder ?? 'yyyy-mm-dd' }}" autocomplete="off" data-input value="{{ $inputValue }}" name="{{ $name }}" id="{{ $id ?? $name }}" {!! $wire !!}  data-toggle {{ !isset($required) ?: 'required' }}/>
    </div>
    @error($name)
    <div class="text-danger"> {{ $message }} </div>
    @enderror
</div>