@props([
    'name',              // input name (예: grade, status)
    'options' => [],     // [ '값' => '라벨' ] 형태의 연관 배열
    'selected' => null,  // 현재 선택된 값 (기본은 request()에서 자동 추출)
    'width' => '130px',  // 너비 설정
    'allLabel' => '전체', // 첫 번째 '전체' 옵션의 텍스트
    'label' => null,     // 라벨 텍스트
])

@php
    $currentSelected = $selected ?? request($name);
@endphp

<div class="d-flex flex-column gap-1">
    @if($label)
        {{-- 라벨: 폰트는 작게(0.75rem), 굵기는 더 굵게(fw-bold) 적용 --}}
        <label for="{{ $name }}_select" class="form-label text-secondary mb-0 fw-bold" style="font-size: 0.75rem;">
            {{ $label }}
        </label>
    @endif

    <div style="width: {{ $width }};">
        <select name="{{ $name }}" class="form-select form-select-sm" id="{{ $name }}_select" onchange="this.form.submit()">
            <option value="">{{ $allLabel }}</option>
            @foreach($options as $value => $optionLabel)
                <option value="{{ $value }}" {{ (string)$currentSelected === (string)$value ? 'selected' : '' }}>
                    {{ $optionLabel }}
                </option>
            @endforeach
        </select>
    </div>
</div>