govuk-angular
Version:
Angular components port of govuk-frontend nunjucks macros.
72 lines • 6.37 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
export class GovUKDetailsComponent {
constructor() {
/**
* An event emitted when details is clicked, with the current status
*/
this.clicked = new EventEmitter();
/**
* An event emitted when details is opened.
*/
this.opened = new EventEmitter();
/**
* An event emitted when details is closed
*/
this.closed = new EventEmitter();
this.status = 'closed';
}
raiseEvents() {
if (this.status === 'closed') {
this.status = 'opened';
this.opened.emit();
}
else {
this.status = 'closed';
this.closed.emit();
}
this.clicked.emit({ status: this.status });
}
}
GovUKDetailsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: GovUKDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
GovUKDetailsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: GovUKDetailsComponent, selector: "govuk-details", inputs: { id: "id", name: "name", classes: "classes", summaryText: "summaryText" }, outputs: { clicked: "clicked", opened: "opened", closed: "closed" }, ngImport: i0, template: `<details id ="{{id}}" class="govuk-details {{classes}}" data-module="govuk-details">
<summary class="govuk-details__summary" (click)="raiseEvents()">
<span class="govuk-details__summary-text" id ="details-summary-{{id}}">
{{summaryText}}
</span>
</summary>
<div class="govuk-details__text" id ="details-text-{{id}}">
<ng-content></ng-content>
</div>
</details>`, isInline: true });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: GovUKDetailsComponent, decorators: [{
type: Component,
args: [{
selector: 'govuk-details',
template: `<details id ="{{id}}" class="govuk-details {{classes}}" data-module="govuk-details">
<summary class="govuk-details__summary" (click)="raiseEvents()">
<span class="govuk-details__summary-text" id ="details-summary-{{id}}">
{{summaryText}}
</span>
</summary>
<div class="govuk-details__text" id ="details-text-{{id}}">
<ng-content></ng-content>
</div>
</details>`
}]
}], ctorParameters: function () { return []; }, propDecorators: { id: [{
type: Input
}], name: [{
type: Input
}], classes: [{
type: Input
}], summaryText: [{
type: Input
}], clicked: [{
type: Output
}], opened: [{
type: Output
}], closed: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGV0YWlscy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9nb3Z1ay1hbmd1bGFyL3NyYy9saWIvZGV0YWlscy9kZXRhaWxzLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFHLFlBQVksRUFBRyxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQWV6RSxNQUFNLE9BQU8scUJBQXFCO0lBMEJoQztRQWxCQTs7V0FFRztRQUNPLFlBQU8sR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO1FBRTVDOztXQUVHO1FBQ08sV0FBTSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFFdEM7O1dBRUc7UUFDTyxXQUFNLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQU1wQyxJQUFJLENBQUMsTUFBTSxHQUFHLFFBQVEsQ0FBQztJQUN6QixDQUFDO0lBRUQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLE1BQU0sS0FBSyxRQUFRLEVBQUU7WUFDNUIsSUFBSSxDQUFDLE1BQU0sR0FBRyxRQUFRLENBQUM7WUFDdkIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsQ0FBQztTQUNwQjthQUFNO1lBQ0wsSUFBSSxDQUFDLE1BQU0sR0FBRyxRQUFRLENBQUM7WUFDdkIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsQ0FBQztTQUNwQjtRQUVELElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEVBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxNQUFNLEVBQUMsQ0FBQyxDQUFDO0lBQzNDLENBQUM7O2tIQXhDVSxxQkFBcUI7c0dBQXJCLHFCQUFxQiw4TUFYdEI7Ozs7Ozs7OzthQVNDOzJGQUVBLHFCQUFxQjtrQkFiakMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZUFBZTtvQkFDekIsUUFBUSxFQUFFOzs7Ozs7Ozs7YUFTQztpQkFDWjswRUFFVSxFQUFFO3NCQUFWLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFHRyxXQUFXO3NCQUFuQixLQUFLO2dCQUtJLE9BQU87c0JBQWhCLE1BQU07Z0JBS0csTUFBTTtzQkFBZixNQUFNO2dCQUtHLE1BQU07c0JBQWYsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgIEV2ZW50RW1pdHRlciwgIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZ292dWstZGV0YWlscycsXG4gIHRlbXBsYXRlOiBgPGRldGFpbHMgaWQgPVwie3tpZH19XCIgY2xhc3M9XCJnb3Z1ay1kZXRhaWxzIHt7Y2xhc3Nlc319XCIgZGF0YS1tb2R1bGU9XCJnb3Z1ay1kZXRhaWxzXCI+XG4gICAgPHN1bW1hcnkgY2xhc3M9XCJnb3Z1ay1kZXRhaWxzX19zdW1tYXJ5XCIgKGNsaWNrKT1cInJhaXNlRXZlbnRzKClcIj5cbiAgICA8c3BhbiBjbGFzcz1cImdvdnVrLWRldGFpbHNfX3N1bW1hcnktdGV4dFwiIGlkID1cImRldGFpbHMtc3VtbWFyeS17e2lkfX1cIj5cbiAgICAgIHt7c3VtbWFyeVRleHR9fVxuICAgIDwvc3Bhbj5cbiAgICA8L3N1bW1hcnk+XG4gICAgPGRpdiBjbGFzcz1cImdvdnVrLWRldGFpbHNfX3RleHRcIiBpZCA9XCJkZXRhaWxzLXRleHQte3tpZH19XCI+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG4gIDwvZGV0YWlscz5gXG59KVxuZXhwb3J0IGNsYXNzIEdvdlVLRGV0YWlsc0NvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGlkOiBzdHJpbmc7XG4gIEBJbnB1dCgpIG5hbWU6IHN0cmluZztcbiAgQElucHV0KCkgY2xhc3Nlczogc3RyaW5nO1xuXG5cbiAgQElucHV0KCkgc3VtbWFyeVRleHQ6IHN0cmluZztcblxuICAvKipcbiAgICogQW4gZXZlbnQgZW1pdHRlZCB3aGVuIGRldGFpbHMgaXMgY2xpY2tlZCwgd2l0aCB0aGUgY3VycmVudCBzdGF0dXNcbiAgICovXG4gIEBPdXRwdXQoKSBjbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgLyoqXG4gICAqIEFuIGV2ZW50IGVtaXR0ZWQgd2hlbiBkZXRhaWxzIGlzIG9wZW5lZC5cbiAgICovXG4gIEBPdXRwdXQoKSBvcGVuZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgLyoqXG4gICAqIEFuIGV2ZW50IGVtaXR0ZWQgd2hlbiBkZXRhaWxzIGlzIGNsb3NlZFxuICAgKi9cbiAgQE91dHB1dCgpIGNsb3NlZCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICAvLyB0cmFjayBvcGVuIGFuZCBjbG9zZSBzdGF0dXNcbiAgc3RhdHVzOiBzdHJpbmc7XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgdGhpcy5zdGF0dXMgPSAnY2xvc2VkJztcbiAgfVxuXG4gIHJhaXNlRXZlbnRzKCkge1xuICAgIGlmICh0aGlzLnN0YXR1cyA9PT0gJ2Nsb3NlZCcpIHtcbiAgICAgIHRoaXMuc3RhdHVzID0gJ29wZW5lZCc7XG4gICAgICB0aGlzLm9wZW5lZC5lbWl0KCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuc3RhdHVzID0gJ2Nsb3NlZCc7XG4gICAgICB0aGlzLmNsb3NlZC5lbWl0KCk7XG4gICAgfVxuXG4gICAgdGhpcy5jbGlja2VkLmVtaXQoe3N0YXR1czogdGhpcy5zdGF0dXN9KTtcbiAgfVxuXG59XG4iXX0=