@props([
    'deleteAction' => false
])

<div {{ $attributes->merge(['class' => 'modal-dialog']) }} role="document">
    <div class="modal-content {{ $modalContentClass ?? '' }}">
        @if(isset($content))
            {{ $content }}
        @else
            @if(isset($header))
                {{ $header }}
            @else
            <div class="modal-header">
                <h5 class="modal-title overflow-hidden">{{ $modalTitle?? '' }}</h5>
                <button class="close" data-bs-dismiss="modal" aria-label="Close">
                    <em class="icon ni ni-cross"></em>
                </button>
            </div>
            @endif

            {{ $preBody?? '' }}

            <div class="modal-body {{ $modalBodyClass ?? 'modal-body-sm' }}">
                {{ $slot }}
            </div><!-- .modal-body -->
            @if(isset($footer))
                {{ $footer }}
            @else
            <div class="modal-footer">
                <div class="modal-footer-between">
                    <div class="g">
                        @if($deleteAction)
                            <button @click("delete") @confirm("supprimer cet élément") class="btn btn-light bg-white shadow-0 text-muted">@lang('Delete')</button>
                        @endif
                    </div>
                    <div class="g">
                        <ul class="btn-toolbar g-3">
                            <li><button type="button" data-bs-dismiss="modal" class="btn btn-outline-light btn-white">Annuler</button></li>
                            <li><button @click("submit") class="btn btn-primary btn-dim">Enregistrer</button></li>
                        </ul>
                    </div>
                </div>
            </div>
            @endif
        @endif
    </div><!-- .modal-content -->
</div><!-- .modal-dialog -->