@props([
    'searchPlaceholder' => 'Rechercher…',
    'addLabel' => null,
    'addHref' => null,
])

<div class="flex flex-col gap-3 border-b border-brand-border p-4 sm:flex-row sm:items-center sm:justify-between">
    <div class="flex flex-1 flex-col gap-2 sm:flex-row sm:items-center">
        <label class="relative flex-1 sm:max-w-xs">
            <span class="sr-only">Rechercher</span>
            <x-icon name="search" class="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-brand-muted" />
            <input type="search" placeholder="{{ $searchPlaceholder }}" class="admin-field-input pl-9">
        </label>

        {{ $slot }}
    </div>

    @if ($addLabel && $addHref)
        <a href="{{ $addHref }}" class="btn btn-primary btn-sm shrink-0">
            <x-icon name="plus" class="h-4 w-4" /> {{ $addLabel }}
        </a>
    @endif
</div>
