1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-18 01:03:35 +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

@@ -14,6 +14,7 @@ import {
booleanAttribute,
inject,
signal,
input,
} from "@angular/core";
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
@@ -54,12 +55,15 @@ export class ChipSelectComponent<T = unknown> implements ControlValueAccessor, A
@ViewChild("chipSelectButton") chipSelectButton: ElementRef<HTMLButtonElement>;
/** Text to show when there is no selected option */
@Input({ required: true }) placeholderText: string;
readonly placeholderText = input.required<string>();
/** Icon to show when there is no selected option or the selected option does not have an icon */
@Input() placeholderIcon: string;
readonly placeholderIcon = input<string>();
private _options: ChipSelectOption<T>[];
// TODO: Skipped for signal migration because:
// Accessor inputs cannot be migrated as they are too complex.
/** The select options to render */
@Input({ required: true })
get options(): ChipSelectOption<T>[] {
@@ -71,10 +75,12 @@ export class ChipSelectComponent<T = unknown> implements ControlValueAccessor, A
}
/** Disables the entire chip */
// TODO: Skipped for signal migration because:
// Your application code writes to the input. This prevents migration.
@Input({ transform: booleanAttribute }) disabled = false;
/** Chip will stretch to full width of its container */
@Input({ transform: booleanAttribute }) fullWidth?: boolean;
readonly fullWidth = input<boolean, unknown>(undefined, { transform: booleanAttribute });
/**
* We have `:focus-within` and `:focus-visible` but no `:focus-visible-within`
@@ -91,7 +97,7 @@ export class ChipSelectComponent<T = unknown> implements ControlValueAccessor, A
@HostBinding("class")
get classList() {
return ["tw-inline-block", this.fullWidth ? "tw-w-full" : "tw-max-w-52"];
return ["tw-inline-block", this.fullWidth() ? "tw-w-full" : "tw-max-w-52"];
}
private destroyRef = inject(DestroyRef);
@@ -113,12 +119,12 @@ export class ChipSelectComponent<T = unknown> implements ControlValueAccessor, A
/** The label to show in the chip button */
protected get label(): string {
return this.selectedOption?.label || this.placeholderText;
return this.selectedOption?.label || this.placeholderText();
}
/** The icon to show in the chip button */
protected get icon(): string {
return this.selectedOption?.icon || this.placeholderIcon;
return this.selectedOption?.icon || this.placeholderIcon();
}
/**