1
0
mirror of https://github.com/bitwarden/browser synced 2026-02-25 09:03:28 +00:00

radio button improvements

This commit is contained in:
Vicki League
2025-06-25 16:40:53 -04:00
parent 5d974fe5e2
commit 2697d87d36
4 changed files with 12 additions and 12 deletions

View File

@@ -21,7 +21,7 @@ export class RadioButtonComponent {
return [this.block ? "tw-block" : "tw-inline-block", "tw-mb-1", "[&_bit-hint]:tw-mt-0"];
}
readonly value = input<unknown>(undefined);
readonly value = input<unknown>();
readonly disabled = input(false);
constructor(private groupComponent: RadioGroupComponent) {}

View File

@@ -177,15 +177,15 @@ export const Disabled: Story = {
<bit-radio-group formControlName="radio" aria-label="Example radio group">
<bit-label>Group of radio buttons</bit-label>
<bit-radio-button id="radio-first" [value]="0" [disabled]="true">
<bit-radio-button [value]="0" [disabled]="true">
<bit-label>First</bit-label>
</bit-radio-button>
<bit-radio-button id="radio-second" [value]="1" [disabled]="true">
<bit-radio-button [value]="1" [disabled]="true">
<bit-label>Second</bit-label>
</bit-radio-button>
<bit-radio-button id="radio-third" [value]="2" [disabled]="true">
<bit-radio-button [value]="2" [disabled]="true">
<bit-label>Third</bit-label>
</bit-radio-button>
</bit-radio-group>

View File

@@ -1,7 +1,7 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { NgTemplateOutlet } from "@angular/common";
import { Component, ContentChild, HostBinding, Input, Optional, Self, input } from "@angular/core";
import { Component, ContentChild, HostBinding, Optional, Self, input } from "@angular/core";
import { ControlValueAccessor, NgControl, Validators } from "@angular/forms";
import { I18nPipe } from "@bitwarden/ui-common";
@@ -14,6 +14,9 @@ let nextId = 0;
selector: "bit-radio-group",
templateUrl: "radio-group.component.html",
imports: [NgTemplateOutlet, I18nPipe],
host: {
"[id]": "id()",
},
})
export class RadioGroupComponent implements ControlValueAccessor {
selected: unknown;
@@ -26,10 +29,7 @@ export class RadioGroupComponent implements ControlValueAccessor {
readonly block = input(false);
@HostBinding("attr.role") role = "radiogroup";
// TODO: Skipped for migration because:
// This input is used in combination with `@HostBinding` and migrating would
// break.
@HostBinding("attr.id") @Input() id = `bit-radio-group-${nextId++}`;
readonly id = input(`bit-radio-group-${nextId++}`);
@HostBinding("class") classList = ["tw-block", "tw-mb-4"];
@ContentChild(BitLabel) protected label: BitLabel;

View File

@@ -16,7 +16,7 @@ let nextId = 0;
},
})
export class RadioInputComponent implements BitFormControlAbstraction {
id = input(`bit-radio-input-${nextId++}`);
readonly id = input(`bit-radio-input-${nextId++}`);
@HostBinding("class")
protected inputClasses = [
@@ -77,7 +77,7 @@ export class RadioInputComponent implements BitFormControlAbstraction {
constructor(@Optional() @Self() private ngControl?: NgControl) {}
// TODO: Skipped for migration because:
// TODO: Skipped for signal migration because:
// Accessor inputs cannot be migrated as they are too complex.
@HostBinding()
@Input()
@@ -89,7 +89,7 @@ export class RadioInputComponent implements BitFormControlAbstraction {
}
private _disabled: boolean;
// TODO: Skipped for migration because:
// TODO: Skipped for signal migration because:
// Accessor inputs cannot be migrated as they are too complex.
@Input()
get required() {