@if (open) {
  <div
    class="overlay"
    role="presentation"
    (click)="annuler()"
  >
    <div
      class="dialog"
      role="dialog"
      aria-modal="true"
      [attr.aria-label]="titre"
      (click)="$event.stopPropagation()"
    >
      <h2 class="dialog__titre">{{ titre }}</h2>
      <p class="dialog__message">{{ message }}</p>
      <div class="dialog__actions">
        <button type="button" class="btn-secondaire" (click)="annuler()">
          {{ libelleAnnuler }}
        </button>
        <button
          type="button"
          class="btn-confirmer"
          [class.btn-confirmer--danger]="danger"
          (click)="confirmer()"
        >
          {{ libelleConfirmer }}
        </button>
      </div>
    </div>
  </div>
}