<!--
  ~ Copyright (C) 2019 Robert Bosch GmbH Copyright (C) 2019 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
-->

<ng-template #icon>
  <div class="icon"><ng-content select="[fontIcon]"></ng-content></div>
</ng-template>

<ng-template #content>
  <ng-content></ng-content>
</ng-template>
<ng-container *ngIf="additionalTitle">
  <div class="dialog-additional-header">
    <div class="header-container">
      <div class="dialog-title-icon">
        <div *ngTemplateOutlet="icon"></div>
        <h2 class="dialog-additional-title" mat-dialog-title>{{ additionalTitle }}</h2>
      </div>
      <button
        *ngIf="closeIcon"
        mat-icon-button
        bciIntegratedButton
        class="close-button"
        tabindex="-1"
        [disabled]="closeIconDisabled"
        (click)="close()"
        data-test="modal-window-close-button"
      >
        <mat-icon fontIcon="bosch-ic-close"></mat-icon>
      </button>
    </div>
    <hr class="divider" />
    <mat-dialog-content>
      <div class="dialog-title" *ngIf="title">{{ title }}</div>
      <div *ngTemplateOutlet="content"></div>
    </mat-dialog-content>
  </div>
</ng-container>
<ng-container *ngIf="!additionalTitle">
  <mat-dialog-content>
    <div class="dialog-header">
      <div class="dialog-title-icon">
        <div *ngTemplateOutlet="icon"></div>
        <div class="dialog-title">{{ title }}</div>
      </div>
      <div>
        <button
          *ngIf="closeIcon"
          bciIntegratedButton
          mat-icon-button
          tabindex="-1"
          class="close-button"
          [disabled]="closeIconDisabled"
          (click)="close()"
          data-test="modal-window-close-button"
        >
          <mat-icon fontIcon="bosch-ic-close"></mat-icon>
        </button>
      </div>
    </div>
    <div *ngTemplateOutlet="content"></div>
  </mat-dialog-content>
</ng-container>

<mat-dialog-actions>
  <button
    #outerLeftBtnRaised
    bciPrimaryButton
    (click)="optional()"
    *ngIf="optionalButtonAsPrimary && optionalButtonTitle"
    [disabled]="optionalButtonDisabled"
    data-test="modal-window-optional-button"
    class="optionalButton"
  >
    {{ optionalButtonTitle }}
  </button>
  <button
    bciSecondaryButton
    (click)="optional()"
    *ngIf="!optionalButtonAsPrimary && optionalButtonTitle"
    [disabled]="optionalButtonDisabled"
    data-test="modal-window-optional-button"
    class="optionalButton"
  >
    {{ optionalButtonTitle }}
  </button>
  <ng-content select="[actions]"></ng-content>
</mat-dialog-actions>
