@php
    $fromName = $fromName ?? 'date_from';
    $toName = $toName ?? 'date_to';
    $fromLabel = $fromLabel ?? 'From';
    $toLabel = $toLabel ?? 'To';
    $colClass = $colClass ?? 'col-6 col-md-4 col-xl-2';
    $readOnly = $readOnly ?? false;
@endphp
<div class="{{ $colClass }}">
    <label class="form-label fw-semibold">{{ $fromLabel }}</label>
    <div class="input-group axis-date-field">
        <input type="text" name="{{ $fromName }}" class="form-control axis-report-datepicker"
               value="{{ $dateFrom ?? '' }}" autocomplete="off" placeholder="dd-mm-yyyy"
               {{ $readOnly ? 'readonly' : '' }}>
        <button type="button" class="input-group-text axis-date-trigger" data-axis-date-open aria-label="Open calendar"
                {{ $readOnly ? 'disabled' : '' }}>
            <i class="bi bi-calendar3"></i>
        </button>
    </div>
</div>
<div class="{{ $colClass }}">
    <label class="form-label fw-semibold">{{ $toLabel }}</label>
    <div class="input-group axis-date-field">
        <input type="text" name="{{ $toName }}" class="form-control axis-report-datepicker"
               value="{{ $dateTo ?? '' }}" autocomplete="off" placeholder="dd-mm-yyyy"
               {{ $readOnly ? 'readonly' : '' }}>
        <button type="button" class="input-group-text axis-date-trigger" data-axis-date-open aria-label="Open calendar"
                {{ $readOnly ? 'disabled' : '' }}>
            <i class="bi bi-calendar3"></i>
        </button>
    </div>
</div>
