@props([
    'event' => [],
])

@php
    $row = (int) ($event['all_day_row'] ?? 1);
    $end = $row + 1;
    $isMore = (bool) ($event['all_day_more'] ?? false);
    $isOverflow = (bool) ($event['all_day_overflow'] ?? false);
@endphp

<li class="event-wrapper{{ $isMore ? ' event-wrapper--more' : '' }}{{ $isOverflow ? ' event-wrapper--overflow' : '' }}"
    data-event-id="{{ $event['occurrence_id'] ?? $event['id'] }}"
    data-calendar-id="{{ $event['calendar_slug'] ?? '' }}"
    data-more-count="{{ $event['all_day_more_count'] ?? '' }}"
    style="
        --event-col: {{ $event['start_col'] ?? 1 }};
        --event-row: {{ $row }};
        --event-end: {{ $end }};
        --event-bg: {{ $event['color'] ?? 'var(--color-gray-100)' }};
        --event-fg: {{ $event['color_fg'] ?? 'var(--color-primary)' }};">
    @if($isMore)
        @php
            $moreId = 'more-col-'.$event['start_col'];
        @endphp
        <label class="event event--more" for="{{ $moreId }}" tabindex="0">
            <input id="{{ $moreId }}" type="checkbox" class="more-checkbox" />
            <span>{{ __('calendar.event.show_more', ['count' => $event['all_day_more_count'] ?? 0]) }}</span>
        </label>
    @else
        @php
            $showParams = [$event['calendar_slug'], $event['id']];
            if (!empty($event['occurrence'])) {
                $showParams['occurrence'] = $event['occurrence'];
            }
        @endphp
        <a class="event{{ $event['visible'] ? '' : ' hidden' }}"
           href="{{ route('calendar.event.show', $showParams) }}"
           hx-get="{{ route('calendar.event.show', $showParams) }}"
           hx-target="#modal"
           hx-push-url="true"
           hx-swap="innerHTML"
           data-calendar="{{ $event['calendar_slug'] }}">
            <span>{{ $event['title'] }}</span>
        </a>
    @endif
</li>