@props([
    'id',
    'title' => 'Are you sure?',
    'message' => 'This action cannot be undone.',
    'confirmLabel' => 'Confirm',
    'cancelLabel' => 'Cancel',
    'confirmVariant' => 'danger',
    'form' => null,
    'method' => 'POST',
])

<x-ui.modal :id="$id" :title="$title" size="sm">
    <p class="mb-0">{{ $message }}</p>
    <x-slot:footer>
        <button type="button" class="btn btn-ghost" data-bs-dismiss="modal">{{ $cancelLabel }}</button>
        @if($form)
            <form action="{{ $form }}" method="POST" class="d-inline">
                @csrf
                @if(strtoupper($method) !== 'POST')
                    @method($method)
                @endif
                <button type="submit" class="btn btn-{{ $confirmVariant }}">{{ $confirmLabel }}</button>
            </form>
        @else
            <button type="button" class="btn btn-{{ $confirmVariant }}" data-confirm-target="{{ $id }}">{{ $confirmLabel }}</button>
        @endif
    </x-slot:footer>
</x-ui.modal>