<button
  class="ui-selected-month-year__month-cta"
  [class.selected]="viewState.displayedView() === 'month'"
  type="button"
  (click)="viewState.displayedView.set('month')"
>
  <span>{{ monthName() }}</span>
  @if (viewState.displayedView() === 'month') {
    <ng-icon size="0.75rem" name="isaActionChevronUp"></ng-icon>
  } @else {
    <ng-icon size="0.75rem" name="isaActionChevronDown"></ng-icon>
  }
</button>

<button
  class="ui-selected-month-year__year-cta"
  [class.selected]="viewState.displayedView() === 'year'"
  type="button"
  (click)="viewState.displayedView.set('year')"
>
  <span>{{ yearNumber() }}</span>
  @if (viewState.displayedView() === 'year') {
    <ng-icon size="0.75rem" name="isaActionChevronUp"></ng-icon>
  } @else {
    <ng-icon size="0.75rem" name="isaActionChevronDown"></ng-icon>
  }
</button>
