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

<bci-modal-component
  cdkTrapFocus
  class="loading-screen"
  [additionalTitle]="title"
  [closeIcon]="closeable"
  [closeOnBackdropClick]="closeable"
>
  <div class="content">
    <h2 class="value-percent-label" *ngIf="!indeterminate">{{ valuePercent }}%</h2>

    <mat-progress-bar
      class="loading-screen-progress-bar"
      [value]="valuePercent"
      [mode]="indeterminate ? 'indeterminate' : 'determinate'"
    >
    </mat-progress-bar>

    <div class="status-text" *ngIf="statusText">{{ statusText }}...</div>
  </div>

  <div actions *ngIf="closeable">
    <button bciSecondaryButton type="button" (click)="close()">
      {{ intl.cancel }}
    </button>
  </div>
</bci-modal-component>
