mirror of
https://github.com/bitwarden/browser
synced 2025-12-14 15:23:33 +00:00
d17d188534
* [CL-50] feat: scaffold checkbox component * [CL-50] feat: implement control value accessor for checbox * [CL-50] feat: add form-field support to checkbox * [CL-50] feat: implement non-selected checkbox styling * [CL-50] feat: implement checkbox checked styles * [CL-50] feat: improve checkbox form-field compat * [CL-50] fix: checkbox border hover wrong color * [CL-50] feat: use svg instead of bwi font * [CL-50] feat: scaffold radio button * [EC-50] feat: implement radio logic * [CL-50] feat: add radio group tests * [CL-50] feat: add radio-button tests * [CL-50] feat: implement radio button styles * [CL-50] fix: checkbox style tweaks * [CL-50] feat: smooth radio button selection transition * [CL-50] chore: various fixes and cleanups * [CL-50] feat: add form field support * [EC-50] feat-wip: simplify checkbox styling * [EC-50] feat: extract checkbox into separate component * [CL-50] feat: add standalone form control component * [CL-50] feat: remove unnecessary checkbox-control It wasn't really doing anything, might as well use form control directly * [CL-50] chore: create separate folder with form examples * [CL-50] feat: switch to common bit-label * [CL-50] feat: let radio group act as form control * [CL-50] chore: restore form-field component * [CL-50] feat: add support for hint and error * [CL-50] fix: storybook build issue * [CL-50] fix: radio group label wrong text color * [CL-50] fix: translation * [CL-50] fix: put hint and errors outside label * [CL-50] feat: * [CL-50] feat: add custom checkbox example story * [CL-50] chore: remove 1 from full example name * [CL-50] chore: clean up unused icon * [CL-50] chore: clean up unused tailwind plugin * [CL-50] fix: ring offset color in custom example * [CL-50] chore: clean up unused icon * [CL-50] chore: add design link * [CL-50] chore: remove unused import * [CL-50] fix: pr review comments * [CL-50] fix: improve id handling
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import {
|
|
AfterContentChecked,
|
|
Component,
|
|
ContentChild,
|
|
ContentChildren,
|
|
QueryList,
|
|
ViewChild,
|
|
} from "@angular/core";
|
|
|
|
import { BitHintComponent } from "../form-control/hint.component";
|
|
|
|
import { BitErrorComponent } from "./error.component";
|
|
import { BitFormFieldControl } from "./form-field-control";
|
|
import { BitPrefixDirective } from "./prefix.directive";
|
|
import { BitSuffixDirective } from "./suffix.directive";
|
|
|
|
@Component({
|
|
selector: "bit-form-field",
|
|
templateUrl: "./form-field.component.html",
|
|
host: {
|
|
class: "tw-mb-6 tw-block",
|
|
},
|
|
})
|
|
export class BitFormFieldComponent implements AfterContentChecked {
|
|
@ContentChild(BitFormFieldControl) input: BitFormFieldControl;
|
|
@ContentChild(BitHintComponent) hint: BitHintComponent;
|
|
|
|
@ViewChild(BitErrorComponent) error: BitErrorComponent;
|
|
|
|
@ContentChildren(BitPrefixDirective) prefixChildren: QueryList<BitPrefixDirective>;
|
|
@ContentChildren(BitSuffixDirective) suffixChildren: QueryList<BitSuffixDirective>;
|
|
|
|
ngAfterContentChecked(): void {
|
|
if (this.error) {
|
|
this.input.ariaDescribedBy = this.error.id;
|
|
} else if (this.hint) {
|
|
this.input.ariaDescribedBy = this.hint.id;
|
|
} else {
|
|
this.input.ariaDescribedBy = undefined;
|
|
}
|
|
}
|
|
}
|