@ng-dynamic-forms/ui-ng-bootstrap
Version:
NG Bootstrap UI package for NG Dynamic Forms
47 lines • 13.1 kB
JavaScript
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from "@angular/core";
import { ReactiveFormsModule } from "@angular/forms";
import { DynamicFormControlComponent } from "@ng-dynamic-forms/core";
import { NgbButtonsModule } from "@ng-bootstrap/ng-bootstrap";
import { NgClass, NgFor } from "@angular/common";
import * as i0 from "@angular/core";
import * as i1 from "@ng-dynamic-forms/core";
import * as i2 from "@angular/forms";
import * as i3 from "@ng-bootstrap/ng-bootstrap";
export class DynamicNGBootstrapCheckboxGroupComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.focus = new EventEmitter();
}
getCheckboxId(model) {
return this.layoutService.getElementId(model);
}
onCheckboxChange($event, model) {
this.onChange($event);
model.value = $event.target.checked;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicNGBootstrapCheckboxGroupComponent, deps: [{ token: i1.DynamicFormLayoutService }, { token: i1.DynamicFormValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicNGBootstrapCheckboxGroupComponent, isStandalone: true, selector: "dynamic-ng-bootstrap-checkbox-group", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", focus: "focus" }, usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"group\">\n\n <div class=\"btn-group btn-group-toggle\" data-toggle=\"buttons\"\n [formGroupName]=\"model.id\"\n [id]=\"id\"\n [ngClass]=\"getClass('element', 'control')\">\n\n <label *ngFor=\"let checkboxModel of model.group\" ngbButtonLabel\n [hidden]=\"checkboxModel.hidden\"\n [ngClass]=\"getClass('element', 'control', checkboxModel)\">\n\n <input type=\"checkbox\" ngbButton\n [checked]=\"checkboxModel.checked\"\n [formControlName]=\"checkboxModel.id\"\n [id]=\"getCheckboxId(checkboxModel)\"\n [name]=\"checkboxModel.name\"\n [required]=\"checkboxModel.required\"\n [tabindex]=\"checkboxModel.tabIndex\"\n [value]=\"checkboxModel.value\"\n (blur)=\"onBlur($event)\"\n (change)=\"onCheckboxChange($event, checkboxModel)\"\n (focus)=\"onFocus($event)\"/><span [ngClass]=\"getClass('element', 'label', checkboxModel)\"\n [innerHTML]=\"checkboxModel.label\"></span></label>\n </div>\n\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: NgbButtonsModule }, { kind: "directive", type: i3.NgbButtonLabel, selector: "[ngbButtonLabel]" }, { kind: "directive", type: i3.NgbCheckBox, selector: "[ngbButton][type=checkbox]", inputs: ["disabled", "valueChecked", "valueUnChecked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicNGBootstrapCheckboxGroupComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-ng-bootstrap-checkbox-group", changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ReactiveFormsModule, NgClass, NgFor, NgbButtonsModule], template: "<ng-container [formGroup]=\"group\">\n\n <div class=\"btn-group btn-group-toggle\" data-toggle=\"buttons\"\n [formGroupName]=\"model.id\"\n [id]=\"id\"\n [ngClass]=\"getClass('element', 'control')\">\n\n <label *ngFor=\"let checkboxModel of model.group\" ngbButtonLabel\n [hidden]=\"checkboxModel.hidden\"\n [ngClass]=\"getClass('element', 'control', checkboxModel)\">\n\n <input type=\"checkbox\" ngbButton\n [checked]=\"checkboxModel.checked\"\n [formControlName]=\"checkboxModel.id\"\n [id]=\"getCheckboxId(checkboxModel)\"\n [name]=\"checkboxModel.name\"\n [required]=\"checkboxModel.required\"\n [tabindex]=\"checkboxModel.tabIndex\"\n [value]=\"checkboxModel.value\"\n (blur)=\"onBlur($event)\"\n (change)=\"onCheckboxChange($event, checkboxModel)\"\n (focus)=\"onFocus($event)\"/><span [ngClass]=\"getClass('element', 'label', checkboxModel)\"\n [innerHTML]=\"checkboxModel.label\"></span></label>\n </div>\n\n</ng-container>\n" }]
}], ctorParameters: function () { return [{ type: i1.DynamicFormLayoutService }, { type: i1.DynamicFormValidationService }]; }, propDecorators: { formLayout: [{
type: Input
}], group: [{
type: Input
}], layout: [{
type: Input
}], model: [{
type: Input
}], blur: [{
type: Output
}], change: [{
type: Output
}], focus: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy1uZy1ib290c3RyYXAtY2hlY2tib3gtZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctZHluYW1pYy1mb3Jtcy91aS1uZy1ib290c3RyYXAvc3JjL2xpYi9jaGVja2JveC1ncm91cC9keW5hbWljLW5nLWJvb3RzdHJhcC1jaGVja2JveC1ncm91cC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1keW5hbWljLWZvcm1zL3VpLW5nLWJvb3RzdHJhcC9zcmMvbGliL2NoZWNrYm94LWdyb3VwL2R5bmFtaWMtbmctYm9vdHN0cmFwLWNoZWNrYm94LWdyb3VwLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDaEcsT0FBTyxFQUFvQixtQkFBbUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3ZFLE9BQU8sRUFHSCwyQkFBMkIsRUFLOUIsTUFBTSx3QkFBd0IsQ0FBQztBQUNoQyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUM5RCxPQUFPLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLGlCQUFpQixDQUFDOzs7OztBQVNqRCxNQUFNLE9BQU8sd0NBQXlDLFNBQVEsMkJBQTJCO0lBVXJGLFlBQXNCLGFBQXVDLEVBQVksaUJBQStDO1FBQ3BILEtBQUssQ0FBQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsQ0FBQztRQUR0QixrQkFBYSxHQUFiLGFBQWEsQ0FBMEI7UUFBWSxzQkFBaUIsR0FBakIsaUJBQWlCLENBQThCO1FBSjlHLFNBQUksR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUM3QyxXQUFNLEdBQXNCLElBQUksWUFBWSxFQUFFLENBQUM7UUFDL0MsVUFBSyxHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO0lBSXhELENBQUM7SUFFRCxhQUFhLENBQUMsS0FBMkI7UUFDckMsT0FBTyxJQUFJLENBQUMsYUFBYSxDQUFDLFlBQVksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNsRCxDQUFDO0lBRUQsZ0JBQWdCLENBQUMsTUFBYSxFQUFFLEtBQTJCO1FBQ3ZELElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDdEIsS0FBSyxDQUFDLEtBQUssR0FBSSxNQUFNLENBQUMsTUFBMkIsQ0FBQyxPQUFPLENBQUM7SUFDOUQsQ0FBQzs4R0FyQlEsd0NBQXdDO2tHQUF4Qyx3Q0FBd0MsMlFDckJyRCwydENBMEJBLDJDRFBjLG1CQUFtQix3akNBQUUsT0FBTyxvRkFBRSxLQUFLLGtIQUFFLGdCQUFnQjs7MkZBRXRELHdDQUF3QztrQkFQcEQsU0FBUzsrQkFDSSxxQ0FBcUMsbUJBRTlCLHVCQUF1QixDQUFDLE1BQU0sY0FDbkMsSUFBSSxXQUNQLENBQUMsbUJBQW1CLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxnQkFBZ0IsQ0FBQzswSkFHdkQsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFFSSxJQUFJO3NCQUFiLE1BQU07Z0JBQ0csTUFBTTtzQkFBZixNQUFNO2dCQUNHLEtBQUs7c0JBQWQsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBVbnR5cGVkRm9ybUdyb3VwLCBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2Zvcm1zXCI7XG5pbXBvcnQge1xuICAgIER5bmFtaWNDaGVja2JveEdyb3VwTW9kZWwsXG4gICAgRHluYW1pY0NoZWNrYm94TW9kZWwsXG4gICAgRHluYW1pY0Zvcm1Db250cm9sQ29tcG9uZW50LFxuICAgIER5bmFtaWNGb3JtQ29udHJvbExheW91dCxcbiAgICBEeW5hbWljRm9ybUxheW91dCxcbiAgICBEeW5hbWljRm9ybUxheW91dFNlcnZpY2UsXG4gICAgRHluYW1pY0Zvcm1WYWxpZGF0aW9uU2VydmljZVxufSBmcm9tIFwiQG5nLWR5bmFtaWMtZm9ybXMvY29yZVwiO1xuaW1wb3J0IHsgTmdiQnV0dG9uc01vZHVsZSB9IGZyb20gXCJAbmctYm9vdHN0cmFwL25nLWJvb3RzdHJhcFwiO1xuaW1wb3J0IHsgTmdDbGFzcywgTmdGb3IgfSBmcm9tIFwiQGFuZ3VsYXIvY29tbW9uXCI7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiBcImR5bmFtaWMtbmctYm9vdHN0cmFwLWNoZWNrYm94LWdyb3VwXCIsXG4gICAgdGVtcGxhdGVVcmw6IFwiLi9keW5hbWljLW5nLWJvb3RzdHJhcC1jaGVja2JveC1ncm91cC5jb21wb25lbnQuaHRtbFwiLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgaW1wb3J0czogW1JlYWN0aXZlRm9ybXNNb2R1bGUsIE5nQ2xhc3MsIE5nRm9yLCBOZ2JCdXR0b25zTW9kdWxlXVxufSlcbmV4cG9ydCBjbGFzcyBEeW5hbWljTkdCb290c3RyYXBDaGVja2JveEdyb3VwQ29tcG9uZW50IGV4dGVuZHMgRHluYW1pY0Zvcm1Db250cm9sQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBmb3JtTGF5b3V0PzogRHluYW1pY0Zvcm1MYXlvdXQ7XG4gICAgQElucHV0KCkgZ3JvdXAhOiBVbnR5cGVkRm9ybUdyb3VwO1xuICAgIEBJbnB1dCgpIGxheW91dD86IER5bmFtaWNGb3JtQ29udHJvbExheW91dDtcbiAgICBASW5wdXQoKSBtb2RlbCE6IER5bmFtaWNDaGVja2JveEdyb3VwTW9kZWw7XG5cbiAgICBAT3V0cHV0KCkgYmx1cjogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gICAgQE91dHB1dCgpIGNoYW5nZTogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gICAgQE91dHB1dCgpIGZvY3VzOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICAgIGNvbnN0cnVjdG9yKHByb3RlY3RlZCBsYXlvdXRTZXJ2aWNlOiBEeW5hbWljRm9ybUxheW91dFNlcnZpY2UsIHByb3RlY3RlZCB2YWxpZGF0aW9uU2VydmljZTogRHluYW1pY0Zvcm1WYWxpZGF0aW9uU2VydmljZSkge1xuICAgICAgICBzdXBlcihsYXlvdXRTZXJ2aWNlLCB2YWxpZGF0aW9uU2VydmljZSk7XG4gICAgfVxuXG4gICAgZ2V0Q2hlY2tib3hJZChtb2RlbDogRHluYW1pY0NoZWNrYm94TW9kZWwpIHtcbiAgICAgICAgcmV0dXJuIHRoaXMubGF5b3V0U2VydmljZS5nZXRFbGVtZW50SWQobW9kZWwpO1xuICAgIH1cblxuICAgIG9uQ2hlY2tib3hDaGFuZ2UoJGV2ZW50OiBFdmVudCwgbW9kZWw6IER5bmFtaWNDaGVja2JveE1vZGVsKSB7XG4gICAgICAgIHRoaXMub25DaGFuZ2UoJGV2ZW50KTtcbiAgICAgICAgbW9kZWwudmFsdWUgPSAoJGV2ZW50LnRhcmdldCBhcyBIVE1MSW5wdXRFbGVtZW50KS5jaGVja2VkO1xuICAgIH1cbn1cbiIsIjxuZy1jb250YWluZXIgW2Zvcm1Hcm91cF09XCJncm91cFwiPlxuXG4gICAgPGRpdiBjbGFzcz1cImJ0bi1ncm91cCBidG4tZ3JvdXAtdG9nZ2xlXCIgZGF0YS10b2dnbGU9XCJidXR0b25zXCJcbiAgICAgICAgIFtmb3JtR3JvdXBOYW1lXT1cIm1vZGVsLmlkXCJcbiAgICAgICAgIFtpZF09XCJpZFwiXG4gICAgICAgICBbbmdDbGFzc109XCJnZXRDbGFzcygnZWxlbWVudCcsICdjb250cm9sJylcIj5cblxuICAgICAgICA8bGFiZWwgKm5nRm9yPVwibGV0IGNoZWNrYm94TW9kZWwgb2YgbW9kZWwuZ3JvdXBcIiBuZ2JCdXR0b25MYWJlbFxuICAgICAgICAgICAgICAgW2hpZGRlbl09XCJjaGVja2JveE1vZGVsLmhpZGRlblwiXG4gICAgICAgICAgICAgICBbbmdDbGFzc109XCJnZXRDbGFzcygnZWxlbWVudCcsICdjb250cm9sJywgY2hlY2tib3hNb2RlbClcIj5cblxuICAgICAgICAgICAgPGlucHV0IHR5cGU9XCJjaGVja2JveFwiIG5nYkJ1dHRvblxuICAgICAgICAgICAgICAgICAgIFtjaGVja2VkXT1cImNoZWNrYm94TW9kZWwuY2hlY2tlZFwiXG4gICAgICAgICAgICAgICAgICAgW2Zvcm1Db250cm9sTmFtZV09XCJjaGVja2JveE1vZGVsLmlkXCJcbiAgICAgICAgICAgICAgICAgICBbaWRdPVwiZ2V0Q2hlY2tib3hJZChjaGVja2JveE1vZGVsKVwiXG4gICAgICAgICAgICAgICAgICAgW25hbWVdPVwiY2hlY2tib3hNb2RlbC5uYW1lXCJcbiAgICAgICAgICAgICAgICAgICBbcmVxdWlyZWRdPVwiY2hlY2tib3hNb2RlbC5yZXF1aXJlZFwiXG4gICAgICAgICAgICAgICAgICAgW3RhYmluZGV4XT1cImNoZWNrYm94TW9kZWwudGFiSW5kZXhcIlxuICAgICAgICAgICAgICAgICAgIFt2YWx1ZV09XCJjaGVja2JveE1vZGVsLnZhbHVlXCJcbiAgICAgICAgICAgICAgICAgICAoYmx1cik9XCJvbkJsdXIoJGV2ZW50KVwiXG4gICAgICAgICAgICAgICAgICAgKGNoYW5nZSk9XCJvbkNoZWNrYm94Q2hhbmdlKCRldmVudCwgY2hlY2tib3hNb2RlbClcIlxuICAgICAgICAgICAgICAgICAgIChmb2N1cyk9XCJvbkZvY3VzKCRldmVudClcIi8+PHNwYW4gW25nQ2xhc3NdPVwiZ2V0Q2xhc3MoJ2VsZW1lbnQnLCAnbGFiZWwnLCBjaGVja2JveE1vZGVsKVwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgW2lubmVySFRNTF09XCJjaGVja2JveE1vZGVsLmxhYmVsXCI+PC9zcGFuPjwvbGFiZWw+XG4gICAgPC9kaXY+XG5cbjwvbmctY29udGFpbmVyPlxuIl19