<button
  #tab
  [@slideIn]="animate ? 'start' : 'end'"
  (@slideIn.done)="slideAnimationDone($event)"
  [class.active]="isActive"
  (click)="onTabClick()"
  class="tab"
>
  <h2>{{ process.name }}</h2>
  <ng-container *ngIf="process.section === 'customer'">
    <button (click)="onProcessAction($event)" class="badge" *ngIf="process.type === 'cart'" [class.badge-active]="process?.data?.count > 0">
      <ui-icon icon="cart" size="18px"></ui-icon>
      <span>{{ process?.data?.count || 0 }}</span>
    </button>
    <button *ngIf="process.type === 'cart-checkout'">
      <span class="font-bold ml-2 text-lg">Bestellbestätigung</span>
    </button>
  </ng-container>
  <button *ngIf="isActive && process.closeable" (click)="checkCloseProcess()" class="close">
    <ui-icon icon="close" size="16px"></ui-icon>
  </button>
</button>
