All files / tabs si-tab-link.component.ts

66.66% Statements 6/9
0% Branches 0/1
0% Functions 0/1
62.5% Lines 5/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63                                                                                1x 2x   2x 2x   2x                                
/**
 * Copyright (c) Siemens 2016 - 2025
 * SPDX-License-Identifier: MIT
 */
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { Router, RouterLink, RouterLinkActive } from '@angular/router';
import { SiIconComponent } from '@siemens/element-ng/icon';
import { SiTranslatePipe } from '@siemens/element-translate-ng/translate';
import { startWith } from 'rxjs/operators';
 
import { SiTabBadgeComponent } from './si-tab-badge.component';
import { SiTabBaseDirective } from './si-tab-base.directive';
 
/**
 * Creates a tab that uses the Angular router.
 *
 * @example
 * ```html
 * <si-tabset>
 *   <a si-tab routerLink="/home" heading="Home"></a>
 *
 *   <router-outlet />
 * </si-tabset>
 * ```
 */
@Component({
  // eslint-disable-next-line @angular-eslint/component-selector
  selector: 'a[si-tab][routerLink]',
  imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent],
  templateUrl: './si-tab.component.html',
  styleUrl: './si-tab.component.scss',
  providers: [{ provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }],
  changeDetection: ChangeDetectionStrategy.OnPush,
  hostDirectives: [
    {
      directive: RouterLinkActive
    }
  ]
})
export class SiTabLinkComponent extends SiTabBaseDirective {
  private router = inject(Router);
  /** @internal */
  routerLink = inject(RouterLink, { self: true });
  protected routerLinkActive = inject(RouterLinkActive, { self: true });
  /** @defaultValue false */
  override readonly active = toSignal(
    this.routerLinkActive.isActiveChange.pipe(startWith(this.routerLinkActive.isActive))
  );
  /** {@inheritDoc} */
  override selectTab(retainFocus?: boolean): void {
    Iif (this.routerLink.urlTree) {
      this.router.navigateByUrl(this.routerLink.urlTree, {
        skipLocationChange: this.routerLink.skipLocationChange,
        replaceUrl: this.routerLink.replaceUrl,
        info: this.routerLink.info,
        state: this.routerLink.state
      });
    }
    super.selectTab(retainFocus);
  }
}