@if (showPrevArrow) {
  <button
    aria-hidden="true"
    aria-label="previous"
    class="carousel-nav carousel-nav-prev no-min-width position-absolute px-1"
    mat-button
    tabindex="-1"
    (click)="previous()"
  >
    <ion-icon name="chevron-back-outline" />
  </button>
}

<div #contentWrapper class="overflow-hidden" role="region">
  <div #list class="d-flex carousel-content" role="list" tabindex="0">
    <ng-content />
  </div>
</div>

@if (showNextArrow) {
  <button
    aria-hidden="true"
    aria-label="next"
    class="carousel-nav carousel-nav-next no-min-width position-absolute px-1"
    mat-button
    tabindex="-1"
    (click)="next()"
  >
    <ion-icon name="chevron-forward-outline" />
  </button>
}