1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-16 08:13:42 +00:00

[CL-707] Migrate CL codebase to signals (#15340)

This commit is contained in:
Vicki League
2025-07-16 08:39:37 -04:00
committed by GitHub
parent 97ec9a6339
commit 6811ea4c0b
124 changed files with 944 additions and 809 deletions

View File

@@ -1,5 +1,5 @@
<ng-template>
@if (icon) {
@if (icon(); as icon) {
<i class="bwi {{ icon }} !tw-me-2" aria-hidden="true"></i>
}
<ng-content></ng-content>

View File

@@ -1,7 +1,7 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { Component, EventEmitter, Input, Output, TemplateRef, ViewChild } from "@angular/core";
import { Component, EventEmitter, Output, TemplateRef, ViewChild, input } from "@angular/core";
import { QueryParamsHandling } from "@angular/router";
@Component({
@@ -9,17 +9,13 @@ import { QueryParamsHandling } from "@angular/router";
templateUrl: "./breadcrumb.component.html",
})
export class BreadcrumbComponent {
@Input()
icon?: string;
readonly icon = input<string>();
@Input()
route?: string | any[] = undefined;
readonly route = input<string | any[]>();
@Input()
queryParams?: Record<string, string> = {};
readonly queryParams = input<Record<string, string>>({});
@Input()
queryParamsHandling?: QueryParamsHandling;
readonly queryParamsHandling = input<QueryParamsHandling>();
@Output()
click = new EventEmitter();

View File

@@ -1,17 +1,16 @@
@for (breadcrumb of beforeOverflow; track breadcrumb; let last = $last) {
@if (breadcrumb.route) {
@if (breadcrumb.route(); as route) {
<a
bitLink
linkType="primary"
class="tw-my-2 tw-inline-block"
[routerLink]="breadcrumb.route"
[queryParams]="breadcrumb.queryParams"
[queryParamsHandling]="breadcrumb.queryParamsHandling"
[routerLink]="route"
[queryParams]="breadcrumb.queryParams()"
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
>
<ng-container [ngTemplateOutlet]="breadcrumb.content"></ng-container>
</a>
}
@if (!breadcrumb.route) {
} @else {
<button
type="button"
bitLink
@@ -39,18 +38,17 @@
></button>
<bit-menu #overflowMenu>
@for (breadcrumb of overflow; track breadcrumb) {
@if (breadcrumb.route) {
@if (breadcrumb.route(); as route) {
<a
bitMenuItem
linkType="primary"
[routerLink]="breadcrumb.route"
[queryParams]="breadcrumb.queryParams"
[queryParamsHandling]="breadcrumb.queryParamsHandling"
[routerLink]="route"
[queryParams]="breadcrumb.queryParams()"
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
>
<ng-container [ngTemplateOutlet]="breadcrumb.content"></ng-container>
</a>
}
@if (!breadcrumb.route) {
} @else {
<button type="button" bitMenuItem linkType="primary" (click)="breadcrumb.onClick($event)">
<ng-container [ngTemplateOutlet]="breadcrumb.content"></ng-container>
</button>
@@ -59,19 +57,18 @@
</bit-menu>
<i class="bwi bwi-angle-right tw-mx-1.5 tw-text-main"></i>
@for (breadcrumb of afterOverflow; track breadcrumb; let last = $last) {
@if (breadcrumb.route) {
@if (breadcrumb.route(); as route) {
<a
bitLink
linkType="primary"
class="tw-my-2 tw-inline-block"
[routerLink]="breadcrumb.route"
[queryParams]="breadcrumb.queryParams"
[queryParamsHandling]="breadcrumb.queryParamsHandling"
[routerLink]="route"
[queryParams]="breadcrumb.queryParams()"
[queryParamsHandling]="breadcrumb.queryParamsHandling()"
>
<ng-container [ngTemplateOutlet]="breadcrumb.content"></ng-container>
</a>
}
@if (!breadcrumb.route) {
} @else {
<button
type="button"
bitLink

View File

@@ -1,5 +1,5 @@
import { CommonModule } from "@angular/common";
import { Component, ContentChildren, Input, QueryList } from "@angular/core";
import { Component, ContentChildren, QueryList, input } from "@angular/core";
import { RouterModule } from "@angular/router";
import { IconButtonModule } from "../icon-button";
@@ -19,8 +19,7 @@ import { BreadcrumbComponent } from "./breadcrumb.component";
imports: [CommonModule, LinkModule, RouterModule, IconButtonModule, MenuModule],
})
export class BreadcrumbsComponent {
@Input()
show = 3;
readonly show = input(3);
private breadcrumbs: BreadcrumbComponent[] = [];
@@ -31,14 +30,14 @@ export class BreadcrumbsComponent {
protected get beforeOverflow() {
if (this.hasOverflow) {
return this.breadcrumbs.slice(0, this.show - 1);
return this.breadcrumbs.slice(0, this.show() - 1);
}
return this.breadcrumbs;
}
protected get overflow() {
return this.breadcrumbs.slice(this.show - 1, -1);
return this.breadcrumbs.slice(this.show() - 1, -1);
}
protected get afterOverflow() {
@@ -46,6 +45,6 @@ export class BreadcrumbsComponent {
}
protected get hasOverflow() {
return this.breadcrumbs.length > this.show;
return this.breadcrumbs.length > this.show();
}
}