@if (buttonStyle === 'link') {
  <a href="#" class="go-back" (click)="goBack($event)">
    <ng-container *ngTemplateOutlet="content"></ng-container>
  </a>
}

@if (buttonStyle === 'button') {
  <button itButton="primary" class="go-back" (click)="goBack($event)">
    <ng-container *ngTemplateOutlet="content"></ng-container>
  </button>
}

<ng-template #content>
  @if (showIcon) {
    <it-icon
      size="sm"
      [name]="direction === 'left' ? 'arrow-left' : 'arrow-up'"
      [color]="buttonStyle === 'link' ? 'primary' : 'white'"
      [class.me-2]="showText"></it-icon>
  }

  <span [class.visually-hidden]="!showText">
    {{ (direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate }}
  </span>
</ng-template>