{{-- Fenetre d'ajout d'une entite liee, ouverte depuis le formulaire qui en a
     besoin (js/ajout-sur-place.js) : un type, une categorie ou une
     sous-categorie crees sans quitter l'ajout d'un modele.

     ⚠️ A inclure HORS du formulaire principal : deux formulaires ne
     s'imbriquent pas.

     `data-no-draft` : js/form-draft.js garde un brouillon de tout formulaire
     de creation ; celui-ci part sans recharger la page, son brouillon ne
     serait jamais oublie.

     Attendus :
       `$id`      identifiant de la fenetre (ex. ajout-type)
       `$titre`   son titre (ex. Ajouter un type)
       `$action`  adresse de creation
       `$pour`    la liste a completer (ex. #type_id)
       `$cases`   facultatif : cases a cocher [nom => libelle], cochees par
                  defaut (logiciel et vitrine d'un type) --}}
<div class="modal fade" id="{{ $id }}" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <form method="post" action="{{ $action }}" class="modal-content" data-ajout-sur-place data-pour="{{ $pour }}" data-no-draft>
            @csrf
            <div class="modal-header">
                <h5 class="modal-title">{{ $titre }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
            </div>

            <div class="modal-body">
                <div class="alert alert-danger py-2" data-ajout-erreurs hidden></div>

                <label class="form-label" for="{{ $id }}-nom">Nom <span class="text-danger">*</span></label>
                <input type="text" class="form-control" name="nom" id="{{ $id }}-nom" maxlength="191" required autocomplete="off">

                @foreach ($cases ?? [] as $nom => $libelle)
                    <input type="hidden" name="{{ $nom }}" value="0">
                    <div class="form-check form-switch mt-2">
                        <input type="checkbox" class="form-check-input" role="switch" name="{{ $nom }}" value="1"
                            id="{{ $id }}-{{ $nom }}" checked>
                        <label class="form-check-label" for="{{ $id }}-{{ $nom }}">{{ $libelle }}</label>
                    </div>
                @endforeach
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Annuler</button>
                <button type="submit" class="btn btn-primary">Ajouter</button>
            </div>
        </form>
    </div>
</div>