govuk-angular
Version:
Angular components port of govuk-frontend nunjucks macros.
57 lines • 10.5 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export const createValidationSummary = () => ({
hasError: false,
errors: []
});
export class GovUKErrorSummaryComponent {
constructor(el) {
this.el = el;
}
set errorSummary(value) {
this.errorSummaryValue = value;
if (value.hasError) {
setTimeout(() => this.el.nativeElement.querySelector("#errorSummary").focus(), 0);
}
}
get errorSummary() {
return this.errorSummaryValue;
}
setFocus(id, $event) {
$event.preventDefault();
if (typeof this.focus !== 'function') {
return;
}
if (!id) {
console.warn(`govuk-error-summary : Could not set focus on id, does it exist on the component?`);
return;
}
try {
this.focus(id);
}
catch (error) {
console.warn(`govuk-error-summary : Could not set focus on id: ${id}, does it exist on the component?` + error);
}
}
ngOnInit() {
if (!this.errorSummary) {
this.errorSummary = { hasError: false, errors: [] };
console.warn('govuk-error-summary : Missing errorSummary input, you need to supply the errorSummary');
}
if (typeof this.focus !== 'function') {
console.warn('govuk-error-summary : If you want to set the focus on the input with an error, then you need to supply a function');
}
}
}
GovUKErrorSummaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: GovUKErrorSummaryComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
GovUKErrorSummaryComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: GovUKErrorSummaryComponent, selector: "govuk-error-summary", inputs: { errorSummary: "errorSummary", focus: "focus" }, ngImport: i0, template: "<div *ngIf=\"errorSummary.hasError\" id=\"errorSummary\" \n class=\"govuk-error-summary\" \n aria-labelledby=\"error-summary-title\" \n role=\"alert\" tabindex=\"-1\" \n data-module=\"govuk-error-summary\" >\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\" *ngFor=\"let err of errorSummary.errors\">\n <li *ngIf=\"err.hasError\">\n <a *ngIf=\"err.id\" (click)=\"setFocus(err.id, $event)\" href=\"#{{err.id}}\" id=\"{{err.id}}ErrorLink\">{{err.fullError}}</a>\n <span *ngIf=\"!err.id\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{err.fullError}}\n </span>\n </li>\n </ul>\n </div>\n</div>\n", directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: GovUKErrorSummaryComponent, decorators: [{
type: Component,
args: [{ selector: 'govuk-error-summary', template: "<div *ngIf=\"errorSummary.hasError\" id=\"errorSummary\" \n class=\"govuk-error-summary\" \n aria-labelledby=\"error-summary-title\" \n role=\"alert\" tabindex=\"-1\" \n data-module=\"govuk-error-summary\" >\n <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n There is a problem\n </h2>\n <div class=\"govuk-error-summary__body\">\n <ul class=\"govuk-list govuk-error-summary__list\" *ngFor=\"let err of errorSummary.errors\">\n <li *ngIf=\"err.hasError\">\n <a *ngIf=\"err.id\" (click)=\"setFocus(err.id, $event)\" href=\"#{{err.id}}\" id=\"{{err.id}}ErrorLink\">{{err.fullError}}</a>\n <span *ngIf=\"!err.id\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{err.fullError}}\n </span>\n </li>\n </ul>\n </div>\n</div>\n" }]
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { errorSummary: [{
type: Input
}], focus: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXJyb3Itc3VtbWFyeS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9nb3Z1ay1hbmd1bGFyL3NyYy9saWIvZXJyb3Itc3VtbWFyeS9lcnJvci1zdW1tYXJ5LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2dvdnVrLWFuZ3VsYXIvc3JjL2xpYi9lcnJvci1zdW1tYXJ5L2Vycm9yLXN1bW1hcnkuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBZSxLQUFLLEVBQXFCLE1BQU0sZUFBZSxDQUFDOzs7QUFHakYsTUFBTSxDQUFDLE1BQU0sdUJBQXVCLEdBQUcsR0FBc0IsRUFBRSxDQUFDLENBQUM7SUFDL0QsUUFBUSxFQUFFLEtBQUs7SUFDZixNQUFNLEVBQUUsRUFBRTtDQUNYLENBQUMsQ0FBQztBQWtCSCxNQUFNLE9BQU8sMEJBQTBCO0lBbUJyQyxZQUFtQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtJQUNqQyxDQUFDO0lBaEJELElBQ1csWUFBWSxDQUFDLEtBQXdCO1FBQzlDLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxLQUFLLENBQUM7UUFDL0IsSUFBSSxLQUFLLENBQUMsUUFBUSxFQUFFO1lBQ2xCLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxhQUFhLENBQUMsZUFBZSxDQUFDLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUM7U0FDbkY7SUFDSCxDQUFDO0lBRUQsSUFBVyxZQUFZO1FBQ3JCLE9BQU8sSUFBSSxDQUFDLGlCQUFpQixDQUFDO0lBQ2hDLENBQUM7SUFRRCxRQUFRLENBQUMsRUFBRSxFQUFFLE1BQWE7UUFDeEIsTUFBTSxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBRXhCLElBQUksT0FBTyxJQUFJLENBQUMsS0FBSyxLQUFLLFVBQVUsRUFBRTtZQUNwQyxPQUFPO1NBQ1I7UUFFRCxJQUFJLENBQUMsRUFBRSxFQUFFO1lBQ1AsT0FBTyxDQUFDLElBQUksQ0FBQyxrRkFBa0YsQ0FBQyxDQUFDO1lBQ2pHLE9BQU87U0FDUjtRQUVELElBQUk7WUFDRixJQUFJLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1NBQ2hCO1FBQUMsT0FBTyxLQUFLLEVBQUU7WUFDZCxPQUFPLENBQUMsSUFBSSxDQUFDLG9EQUFvRCxFQUFFLG1DQUFtQyxHQUFHLEtBQUssQ0FBQyxDQUFDO1NBQ2pIO0lBQ0gsQ0FBQztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRTtZQUN0QixJQUFJLENBQUMsWUFBWSxHQUFHLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUM7WUFDcEQsT0FBTyxDQUFDLElBQUksQ0FBQyx1RkFBdUYsQ0FBQyxDQUFDO1NBQ3ZHO1FBRUQsSUFBSSxPQUFPLElBQUksQ0FBQyxLQUFLLEtBQUssVUFBVSxFQUFFO1lBQ3BDLE9BQU8sQ0FBQyxJQUFJLENBQUMsbUhBQW1ILENBQUMsQ0FBQztTQUNuSTtJQUVILENBQUM7O3VIQW5EVSwwQkFBMEI7MkdBQTFCLDBCQUEwQixxSEN4QnZDLG8xQkFtQkE7MkZES2EsMEJBQTBCO2tCQUp0QyxTQUFTOytCQUNFLHFCQUFxQjtpR0FRcEIsWUFBWTtzQkFEdEIsS0FBSztnQkFhRyxLQUFLO3NCQUFiLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsICBFbGVtZW50UmVmLCBJbnB1dCwgT25Jbml0LCBSZW5kZXJlcjIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuXG5leHBvcnQgY29uc3QgY3JlYXRlVmFsaWRhdGlvblN1bW1hcnkgPSAoKTogVmFsaWRhdGlvblN1bW1hcnkgPT4gKHtcbiAgaGFzRXJyb3I6IGZhbHNlLFxuICBlcnJvcnM6IFtdXG59KTtcblxuZXhwb3J0IGludGVyZmFjZSBWYWxpZGF0aW9uU3VtbWFyeSB7XG4gIGhhc0Vycm9yOiBib29sZWFuO1xuICBlcnJvcnM6IEFycmF5PFZhbGlkYXRpb25FcnJvcj47XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgVmFsaWRhdGlvbkVycm9yIHtcbiAgLyoqIGlkIG9mIGlucHV0IHdpdGggZXJyb3IgKi9cbiAgaWQ/OiBzdHJpbmc7XG4gIGhhc0Vycm9yOiBib29sZWFuO1xuICBmdWxsRXJyb3I6IHN0cmluZztcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZ292dWstZXJyb3Itc3VtbWFyeScsXG4gIHRlbXBsYXRlVXJsOiAnLi9lcnJvci1zdW1tYXJ5LmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBHb3ZVS0Vycm9yU3VtbWFyeUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIC8qKiBFcnJvclN1bW1hcnkgZGV0YWlscyAqL1xuXG4gIHByaXZhdGUgZXJyb3JTdW1tYXJ5VmFsdWU6IFZhbGlkYXRpb25TdW1tYXJ5O1xuICBASW5wdXQoKVxuICBwdWJsaWMgc2V0IGVycm9yU3VtbWFyeSh2YWx1ZTogVmFsaWRhdGlvblN1bW1hcnkpIHtcbiAgICB0aGlzLmVycm9yU3VtbWFyeVZhbHVlID0gdmFsdWU7XG4gICAgaWYgKHZhbHVlLmhhc0Vycm9yKSB7XG4gICAgICBzZXRUaW1lb3V0KCgpID0+IHRoaXMuZWwubmF0aXZlRWxlbWVudC5xdWVyeVNlbGVjdG9yKFwiI2Vycm9yU3VtbWFyeVwiKS5mb2N1cygpLCAwKTtcbiAgICB9XG4gIH1cblxuICBwdWJsaWMgZ2V0IGVycm9yU3VtbWFyeSgpIHtcbiAgICByZXR1cm4gdGhpcy5lcnJvclN1bW1hcnlWYWx1ZTtcbiAgfVxuXG4gIC8qKiBBIGZ1bmN0aW9uIHdoaWNoIHdpbGwgc2V0IHRoZSBmb2N1cyBvbiB0aGUgaW5wdXQgY29ycmVzcG9uZGluZyB0byB0aGUgY2xpY2tlZCBlcnJvciBtZXNzYWdlICovXG4gIEBJbnB1dCgpIGZvY3VzOiAoaWQ6IHN0cmluZykgPT4gdm9pZDtcblxuICBjb25zdHJ1Y3RvcihwdWJsaWMgZWw6IEVsZW1lbnRSZWYpIHtcbiAgfVxuXG4gIHNldEZvY3VzKGlkLCAkZXZlbnQ6IEV2ZW50KSB7XG4gICAgJGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG5cbiAgICBpZiAodHlwZW9mIHRoaXMuZm9jdXMgIT09ICdmdW5jdGlvbicpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBpZiAoIWlkKSB7XG4gICAgICBjb25zb2xlLndhcm4oYGdvdnVrLWVycm9yLXN1bW1hcnkgOiBDb3VsZCBub3Qgc2V0IGZvY3VzIG9uIGlkLCBkb2VzIGl0IGV4aXN0IG9uIHRoZSBjb21wb25lbnQ/YCk7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgdHJ5IHtcbiAgICAgIHRoaXMuZm9jdXMoaWQpO1xuICAgIH0gY2F0Y2ggKGVycm9yKSB7XG4gICAgICBjb25zb2xlLndhcm4oYGdvdnVrLWVycm9yLXN1bW1hcnkgOiBDb3VsZCBub3Qgc2V0IGZvY3VzIG9uIGlkOiAke2lkfSwgZG9lcyBpdCBleGlzdCBvbiB0aGUgY29tcG9uZW50P2AgKyBlcnJvcik7XG4gICAgfVxuICB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLmVycm9yU3VtbWFyeSkge1xuICAgICAgdGhpcy5lcnJvclN1bW1hcnkgPSB7IGhhc0Vycm9yOiBmYWxzZSwgZXJyb3JzOiBbXSB9O1xuICAgICAgY29uc29sZS53YXJuKCdnb3Z1ay1lcnJvci1zdW1tYXJ5IDogTWlzc2luZyBlcnJvclN1bW1hcnkgaW5wdXQsIHlvdSBuZWVkIHRvIHN1cHBseSB0aGUgZXJyb3JTdW1tYXJ5Jyk7XG4gICAgfVxuXG4gICAgaWYgKHR5cGVvZiB0aGlzLmZvY3VzICE9PSAnZnVuY3Rpb24nKSB7XG4gICAgICBjb25zb2xlLndhcm4oJ2dvdnVrLWVycm9yLXN1bW1hcnkgOiBJZiB5b3Ugd2FudCB0byBzZXQgdGhlIGZvY3VzIG9uIHRoZSBpbnB1dCB3aXRoIGFuIGVycm9yLCB0aGVuIHlvdSBuZWVkIHRvIHN1cHBseSBhIGZ1bmN0aW9uJyk7XG4gICAgfVxuXG4gIH1cblxufVxuIiwiPGRpdiAqbmdJZj1cImVycm9yU3VtbWFyeS5oYXNFcnJvclwiIGlkPVwiZXJyb3JTdW1tYXJ5XCIgXG4gICAgIGNsYXNzPVwiZ292dWstZXJyb3Itc3VtbWFyeVwiIFxuICAgICBhcmlhLWxhYmVsbGVkYnk9XCJlcnJvci1zdW1tYXJ5LXRpdGxlXCIgXG4gICAgIHJvbGU9XCJhbGVydFwiIHRhYmluZGV4PVwiLTFcIiBcbiAgICAgZGF0YS1tb2R1bGU9XCJnb3Z1ay1lcnJvci1zdW1tYXJ5XCIgPlxuICA8aDIgY2xhc3M9XCJnb3Z1ay1lcnJvci1zdW1tYXJ5X190aXRsZVwiIGlkPVwiZXJyb3Itc3VtbWFyeS10aXRsZVwiPlxuICAgIFRoZXJlIGlzIGEgcHJvYmxlbVxuICA8L2gyPlxuICA8ZGl2IGNsYXNzPVwiZ292dWstZXJyb3Itc3VtbWFyeV9fYm9keVwiPlxuICAgIDx1bCBjbGFzcz1cImdvdnVrLWxpc3QgZ292dWstZXJyb3Itc3VtbWFyeV9fbGlzdFwiICpuZ0Zvcj1cImxldCBlcnIgb2YgZXJyb3JTdW1tYXJ5LmVycm9yc1wiPlxuICAgICAgPGxpICpuZ0lmPVwiZXJyLmhhc0Vycm9yXCI+XG4gICAgICAgIDxhICpuZ0lmPVwiZXJyLmlkXCIgIChjbGljayk9XCJzZXRGb2N1cyhlcnIuaWQsICRldmVudClcIiBocmVmPVwiI3t7ZXJyLmlkfX1cIiBpZD1cInt7ZXJyLmlkfX1FcnJvckxpbmtcIj57e2Vyci5mdWxsRXJyb3J9fTwvYT5cbiAgICAgICAgPHNwYW4gKm5nSWY9XCIhZXJyLmlkXCIgY2xhc3M9XCJnb3Z1ay1lcnJvci1tZXNzYWdlXCI+XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJnb3Z1ay12aXN1YWxseS1oaWRkZW5cIj5FcnJvcjo8L3NwYW4+IHt7ZXJyLmZ1bGxFcnJvcn19XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvbGk+XG4gICAgPC91bD5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==