govuk-angular
Version:
Angular components port of govuk-frontend nunjucks macros.
71 lines (70 loc) • 2.82 kB
TypeScript
import { ElementRef, EventEmitter } from '@angular/core';
import { CheckOptionItem } from './check-option-Item';
import { Fieldset, Legend } from '../fieldset/fieldset';
import { GovUKDataCapture } from '../data-capture.component';
import { Hint } from '../hint/hint';
import { ErrorMessage } from '../error/error-message.model';
import * as i0 from "@angular/core";
/**
* Checkbox component based on the nunjucks template version
* https://design-system.service.gov.uk/components/checkboxes/
*
* ```javascript
* <govuk-checkboxes
* [id]="'waste'"
* [fieldset]="{ text: 'Which types of waste do you transport?', classes : 'govuk-fieldset__legend--l'}"
* [hint]="{text: 'Select all that apply'}"
* [model]="model.wasteOptions" >
* </govuk-checkboxes>
*
* checkOptions: CheckOptionItem[] = [
* { text: "Waste from animal carcasses", value: "animal", checked: false},
* { text: "Waste from mines or quarries", value: "quarries", checked: false},
* { text: "Farm or agricultural waste", value: "farm", checked: false },
* ];
*
* ```
*/
export declare class GovUKCheckBoxesComponent implements GovUKDataCapture<CheckOptionItem[]> {
el: ElementRef;
id: string;
name: string;
classes: string;
describeBy?: string;
radioMode: boolean;
hint: Hint;
/** { text: string; classes: string; } */
errorMessage: ErrorMessage;
/**
* ```javascript
*
* interface CheckOptionItem {
* text: string;
* value: any;
* checked?: boolean;
* hint?: string | Hint;
* textDivider?: string;
* }
*
* wasteOptions: CheckOptionItem[] = [
* { text: "Waste from animal carcasses", value: "animal", checked: false},
* { text: "Waste from mines or quarries", value: "quarries", checked: false},
* { text: "Farm or agricultural waste", value: "farm", checked: false },
* ];
* ```
*/
model: CheckOptionItem[];
modelChange: EventEmitter<any>;
fieldset: Fieldset;
legend: Legend;
constructor(el: ElementRef);
/**
* Experimental mode :
* Radio mode will change the way that the checkboxes work.
* They will act more like a radio group where only one option
* can be selected from the list, with the extra option to check none
*/
onModelChange(id: any, index: any, choice: CheckOptionItem): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GovUKCheckBoxesComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<GovUKCheckBoxesComponent, "govuk-checkboxes", never, { "id": "id"; "name": "name"; "classes": "classes"; "describeBy": "describeBy"; "radioMode": "radioMode"; "hint": "hint"; "errorMessage": "errorMessage"; "model": "model"; "fieldset": "fieldset"; "legend": "legend"; }, { "modelChange": "modelChange"; }, never, never>;
}