{{--
    Global slide-over shell — see ApercuPanel.php for the "why" (content-
    agnostic, dynamic component mounting). Only the shell (expand button +
    close button, both provided/positioned by Filament's own modal
    component) lives here; whatever $component is set to renders its own
    content below.
--}}
<x-filament::modal
    id="apercu-panel"
    slide-over
    width="2xl"
    close-button
    :close-by-clicking-away="true"
    :close-by-escaping="true"
>
    <x-slot name="header">
        <a
            @if ($expandUrl)
                href="{{ $expandUrl }}"
                class="flex h-9 w-9 items-center justify-center rounded-lg text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-800 dark:text-gray-400 dark:hover:bg-white/5 dark:hover:text-gray-200"
            @else
                aria-disabled="true"
                class="flex h-9 w-9 cursor-not-allowed items-center justify-center rounded-lg text-gray-300 dark:text-gray-700"
            @endif
        >
            <x-filament::icon icon="heroicon-o-arrows-pointing-out" class="h-4 w-4" />
        </a>
    </x-slot>

    @if ($contentComponent)
        {{-- $openCount (not just $contentComponent+$params) is part of the key —
             see the property's docblock in ApercuPanel.php for why reopening
             identical content needs a genuinely fresh child component. --}}
        @livewire($contentComponent, $params, key($contentComponent.':'.$openCount))
    @endif
</x-filament::modal>