<form [formGroup]="formGroup" [bitSubmit]="submit">
  <bit-dialog dialogSize="default">
    <ng-container bitDialogTitle>
      <span>{{ title }}</span>
      <span class="tw-text-sm tw-normal-case tw-text-muted">
        <ng-container *ngIf="data.serviceAccounts.length == 1">
          {{ data.serviceAccounts[0].name }}
        </ng-container>
        <ng-container *ngIf="data.serviceAccounts.length > 1">
          {{ data.serviceAccounts.length }}
          {{ "machineAccounts" | i18n }}
        </ng-container>
      </span>
    </ng-container>

    <div bitDialogContent>
      <bit-callout type="warning" [title]="'warning' | i18n">
        {{ dialogContent }}
      </bit-callout>
      <bit-form-field>
        <bit-label>{{ dialogConfirmationLabel }}</bit-label>
        <input bitInput formControlName="confirmDelete" />
      </bit-form-field>
    </div>

    <ng-container bitDialogFooter>
      <button type="submit" bitButton buttonType="danger" bitFormButton>
        {{ title }}
      </button>
      <button type="button" bitButton buttonType="secondary" bitFormButton bitDialogClose>
        {{ "cancel" | i18n }}
      </button>
    </ng-container>
  </bit-dialog>
</form>
