mirror of
https://github.com/bitwarden/browser
synced 2025-12-17 16:53:34 +00:00
[CL-553] Migrate CL to Control Flow syntax (#12390)
This commit is contained in:
@@ -5,40 +5,41 @@
|
||||
[attr.aria-label]="label"
|
||||
(keydown)="keyManager.onKeydown($event)"
|
||||
>
|
||||
<button
|
||||
bitTabListItem
|
||||
*ngFor="let tab of tabs; let i = index"
|
||||
type="button"
|
||||
role="tab"
|
||||
[id]="getTabLabelId(i)"
|
||||
[active]="tab.isActive"
|
||||
[disabled]="tab.disabled"
|
||||
[attr.aria-selected]="selectedIndex === i"
|
||||
[attr.tabindex]="selectedIndex === i ? 0 : -1"
|
||||
(click)="selectTab(i)"
|
||||
>
|
||||
<ng-container [ngTemplateOutlet]="content"></ng-container>
|
||||
|
||||
<ng-template #content>
|
||||
<ng-template [ngIf]="tab.templateLabel" [ngIfElse]="tabTextLabel">
|
||||
<ng-container [ngTemplateOutlet]="tab.templateLabel.templateRef"></ng-container>
|
||||
@for (tab of tabs; track tab; let i = $index) {
|
||||
<button
|
||||
bitTabListItem
|
||||
type="button"
|
||||
role="tab"
|
||||
[id]="getTabLabelId(i)"
|
||||
[active]="tab.isActive"
|
||||
[disabled]="tab.disabled"
|
||||
[attr.aria-selected]="selectedIndex === i"
|
||||
[attr.tabindex]="selectedIndex === i ? 0 : -1"
|
||||
(click)="selectTab(i)"
|
||||
>
|
||||
<ng-container [ngTemplateOutlet]="content"></ng-container>
|
||||
<ng-template #content>
|
||||
@if (tab.templateLabel) {
|
||||
<ng-container [ngTemplateOutlet]="tab.templateLabel.templateRef"></ng-container>
|
||||
} @else {
|
||||
{{ tab.textLabel }}
|
||||
}
|
||||
</ng-template>
|
||||
|
||||
<ng-template #tabTextLabel>{{ tab.textLabel }}</ng-template>
|
||||
</ng-template>
|
||||
</button>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</bit-tab-header>
|
||||
<div class="tw-px-4 tw-pt-5">
|
||||
<bit-tab-body
|
||||
role="tabpanel"
|
||||
*ngFor="let tab of tabs; let i = index"
|
||||
[id]="getTabContentId(i)"
|
||||
[attr.tabindex]="tab.contentTabIndex"
|
||||
[attr.labeledby]="getTabLabelId(i)"
|
||||
[active]="tab.isActive"
|
||||
[content]="tab.content"
|
||||
[preserveContent]="preserveContent"
|
||||
>
|
||||
</bit-tab-body>
|
||||
@for (tab of tabs; track tab; let i = $index) {
|
||||
<bit-tab-body
|
||||
role="tabpanel"
|
||||
[id]="getTabContentId(i)"
|
||||
[attr.tabindex]="tab.contentTabIndex"
|
||||
[attr.labeledby]="getTabLabelId(i)"
|
||||
[active]="tab.isActive"
|
||||
[content]="tab.content"
|
||||
[preserveContent]="preserveContent"
|
||||
>
|
||||
</bit-tab-body>
|
||||
}
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
// @ts-strict-ignore
|
||||
import { FocusKeyManager } from "@angular/cdk/a11y";
|
||||
import { coerceNumberProperty } from "@angular/cdk/coercion";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { NgTemplateOutlet } from "@angular/common";
|
||||
import {
|
||||
AfterContentChecked,
|
||||
AfterContentInit,
|
||||
@@ -33,7 +33,7 @@ let nextId = 0;
|
||||
templateUrl: "./tab-group.component.html",
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
NgTemplateOutlet,
|
||||
TabHeaderComponent,
|
||||
TabListContainerDirective,
|
||||
TabListItemDirective,
|
||||
|
||||
Reference in New Issue
Block a user