{{--
    待機中予約バッジ（予約シリーズ共通）

    マスタ編集画面の「現在値の隣」に待機中の予約を「適用開始日 → 変更後の値」で表示する
    （.kiro/steering/schedule-feature-standards.md §6 規約(2)「マスタ編集画面の必須責務」）。

    予約シリーズ（営業担当変更予約／得意先単価ランク変更予約／原価予約／トラスコ支店別予約）で
    共用するため、機能固有の項目名は持たず label に整形済みの文字列を受け取る。

    - schedule    ['effective_date'=>'YYYY/MM/DD', 'label'=>'変更後の値', 'is_overdue'=>bool]。null なら非表示
    - key         予約を登録・取消するモーダルからの postMessage 識別キー
                  （モーダルは {key: キー, schedule: 上記と同じ形} を親へ post する。省略時は更新を受け取らない）
    - badgeClass  バッジの配色（種別で色を変える場合に指定する）
--}}
@props([
    'schedule' => null,
    'key' => null,
    'badgeClass' => 'bg-blue-100 text-blue-800',
])

<span {{ $attributes->merge(['class' => 'inline-flex items-center gap-2 flex-wrap']) }}
    x-data="Parts.scheduleBadge"
    x-init="def({{ json_encode($schedule) }}, {{ json_encode($key) }})"
    x-show="schedule" x-cloak>

    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium {{ $badgeClass }}">
        <i class="fa-regular fa-calendar-check fa-fw mr-1"></i>
        <span x-text="schedule ? schedule.effective_date + ' → ' + schedule.label : ''"></span>
    </span>

    <template x-if="schedule?.is_overdue">
        <span class="text-xs text-danger-800">適用日を超過しています</span>
    </template>
</span>