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

<mat-list-item bciClickableItem (trigger)="showFilterDetails()" [ngClass]="{ active: isSelected }">
  <ng-content></ng-content>
  <span *ngIf="!!filterTitle" matLine>{{ filterTitle }}</span>
  <span *ngIf="!!filterSubTitle" matLine class="list-item-sub-title">{{ filterSubTitle }}</span>
  <ng-container *ngIf="isActive">
    <mat-icon fontIcon="Bosch-Ic-checkmark"></mat-icon>
    <button
      mat-icon-button
      bciClickableItem
      (trigger)="$event.stopPropagation(); deactivateFilter()"
      [attr.aria-label]="intl.removeFilter"
    >
      <mat-icon fontIcon="Bosch-Ic-delete"></mat-icon>
    </button>
  </ng-container>
  <mat-icon *ngIf="hasSubmenu" fontIcon="Bosch-Ic-arrow-expand-right" class="list-item-submenu-arrow"></mat-icon>
</mat-list-item>
