@ng-dynamic-forms/ui-ng-bootstrap/fesm2022/ui-ng-bootstrap.mjs.map

NG Bootstrap UI package for NG Dynamic Forms

{"version":3,"file":"ui-ng-bootstrap.mjs","sources":["../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/calendar/dynamic-ng-bootstrap-calendar.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/calendar/dynamic-ng-bootstrap-calendar.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox/dynamic-ng-bootstrap-checkbox.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox/dynamic-ng-bootstrap-checkbox.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/datepicker/dynamic-ng-bootstrap-datepicker.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/datepicker/dynamic-ng-bootstrap-datepicker.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/input/dynamic-ng-bootstrap-input.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/input/dynamic-ng-bootstrap-input.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/radio-group/dynamic-ng-bootstrap-radio-group.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/radio-group/dynamic-ng-bootstrap-radio-group.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/rating/dynamic-ng-bootstrap-rating.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/rating/dynamic-ng-bootstrap-rating.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/select/dynamic-ng-bootstrap-select.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/select/dynamic-ng-bootstrap-select.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/switch/dynamic-ng-bootstrap-switch.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/switch/dynamic-ng-bootstrap-switch.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/textarea/dynamic-ng-bootstrap-textarea.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/textarea/dynamic-ng-bootstrap-textarea.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/timepicker/dynamic-ng-bootstrap-timepicker.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/timepicker/dynamic-ng-bootstrap-timepicker.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-control-container.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-control-container.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-array.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form-group.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form.component.ts","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/lib/dynamic-ng-bootstrap-form.component.html","../../../../projects/ng-dynamic-forms/ui-ng-bootstrap/src/ui-ng-bootstrap.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport { NgbDatepicker, NgbDatepickerConfig, NgbDatepickerModule } from \"@ng-bootstrap/ng-bootstrap\";\nimport {\n    DynamicDatePickerModel,\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-calendar\",\n    templateUrl: \"./dynamic-ng-bootstrap-calendar.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgbDatepickerModule, NgClass]\n})\nexport class DynamicNGBootstrapCalendarComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicDatePickerModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChild(NgbDatepicker, {static: true}) ngbCalendar!: NgbDatepicker;\n\n    constructor(protected layoutService: DynamicFormLayoutService,\n                protected validationService: DynamicFormValidationService,\n                public config: NgbDatepickerConfig) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <ngb-datepicker [displayMonths]=\"model.getAdditional('displayMonths', config['displayMonths'])\"\n                    [firstDayOfWeek]=\"model.getAdditional('firstDayOfWeek', config['firstDayOfWeek'])\"\n                    [formControlName]=\"model.id\"\n                    [id]=\"id\"\n                    [maxDate]=\"model.max\"\n                    [minDate]=\"model.min\"\n                    [navigation]=\"model.getAdditional('navigation', config['navigation'])\"\n                    [ngClass]=\"getClass('element', 'control')\"\n                    [outsideDays]=\"model.getAdditional('outsideDays', config['outsideDays'])\"\n                    [showWeekNumbers]=\"model.getAdditional('showWeekNumbers', config['showWeekNumbers'])\"\n                    [weekdays]=\"model.getAdditional('showWeekdays', config['weekdays'])\"\n                    [startDate]=\"model.focusedDate\"\n                    (select)=\"onChange($event)\"></ngb-datepicker>\n\n</ng-container>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicCheckboxModel,\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-checkbox\",\n    templateUrl: \"./dynamic-ng-bootstrap-checkbox.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass]\n})\nexport class DynamicNGBootstrapCheckboxComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicCheckboxModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<div [formGroup]=\"group\" class=\"form-check\" [class.disabled]=\"model.disabled\">\n\n    <label class=\"form-check-label\">\n\n        <input type=\"checkbox\" class=\"form-check-input\"\n               [checked]=\"model.checked\"\n               [class.is-invalid]=\"showErrorMessages\"\n               [formControlName]=\"model.id\"\n               [id]=\"id\"\n               [indeterminate]=\"model.indeterminate\"\n               [name]=\"model.name\"\n               [ngClass]=\"getClass('element', 'control')\"\n               [required]=\"model.required\"\n               [tabindex]=\"model.tabIndex\"\n               [value]=\"model.value\"\n               (blur)=\"onBlur($event)\"\n               (change)=\"onChange($event)\"\n               (focus)=\"onFocus($event)\"/><span [innerHTML]=\"model.label\"\n                                                [ngClass]=\"[getClass('element', 'label'), getClass('grid', 'label')]\"></span>\n    </label>\n\n</div>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicCheckboxGroupModel,\n    DynamicCheckboxModel,\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService\n} from \"@ng-dynamic-forms/core\";\nimport { NgbButtonsModule } from \"@ng-bootstrap/ng-bootstrap\";\nimport { NgClass, NgFor } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-checkbox-group\",\n    templateUrl: \"./dynamic-ng-bootstrap-checkbox-group.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass, NgFor, NgbButtonsModule]\n})\nexport class DynamicNGBootstrapCheckboxGroupComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicCheckboxGroupModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n\n    getCheckboxId(model: DynamicCheckboxModel) {\n        return this.layoutService.getElementId(model);\n    }\n\n    onCheckboxChange($event: Event, model: DynamicCheckboxModel) {\n        this.onChange($event);\n        model.value = ($event.target as HTMLInputElement).checked;\n    }\n}\n","<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","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport { NgbDatepicker, NgbDatepickerConfig, NgbDatepickerModule } from \"@ng-bootstrap/ng-bootstrap\";\nimport {\n    DynamicDatePickerModel,\n    DynamicFormControlComponent,\n    DynamicFormControlCustomEvent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass, NgIf } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-datepicker\",\n    templateUrl: \"./dynamic-ng-bootstrap-datepicker.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgbDatepickerModule, NgClass, NgIf]\n})\nexport class DynamicNGBootstrapDatePickerComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicDatePickerModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChild(NgbDatepicker) ngbDatePicker!: NgbDatepicker;\n\n    constructor(protected layoutService: DynamicFormLayoutService,\n                protected validationService: DynamicFormValidationService,\n                public config: NgbDatepickerConfig) {\n        super(layoutService, validationService);\n    }\n}\n","<div [formGroup]=\"group\" class=\"input-group\">\n\n    <input ngbDatepicker class=\"form-control\" #datepicker=\"ngbDatepicker\"\n           [class.is-invalid]=\"showErrorMessages\"\n           [displayMonths]=\"model.getAdditional('displayMonths', config['displayMonths'])\"\n           [firstDayOfWeek]=\"model.getAdditional('firstDayOfWeek', config['firstDayOfWeek'])\"\n           [formControlName]=\"model.id\"\n           [id]=\"id\"\n           [maxDate]=\"model.max\"\n           [minDate]=\"model.min\"\n           [name]=\"model.name\"\n           [navigation]=\"model.getAdditional('navigation', config['navigation'])\"\n           [ngClass]=\"getClass('element', 'control')\"\n           [outsideDays]=\"model.getAdditional('outsideDays', config['outsideDays'])\"\n           [placeholder]=\"model.placeholder\"\n           [placement]=\"model.getAdditional('placement', 'bottom-left')\"\n           [showWeekNumbers]=\"model.getAdditional('showWeekNumbers', config['showWeekNumbers'])\"\n           [startDate]=\"model.focusedDate\"\n           [weekdays]=\"model.getAdditional('weekdays', config['weekdays'])\"\n           (blur)=\"onBlur($event)\"\n           (dateSelect)=\"onCustomEvent($event, 'dateSelect')\"\n           (closed)=\"onCustomEvent($event, 'closed')\"\n           (change)=\"onChange($event)\"\n           (focus)=\"onFocus($event)\">\n\n    <div class=\"input-group-append\">\n\n        <button class=\"btn btn-outline-secondary\" type=\"button\" (click)=\"datepicker.toggle()\">\n\n            <img *ngIf=\"model.toggleIcon\" [src]=\"model.toggleIcon\" style=\"cursor: pointer;\"/>\n            <span *ngIf=\"model.toggleLabel\">{{ model.toggleLabel }}</span>\n\n        </button>\n\n    </div>\n\n</div>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicInputModel,\n    DynamicFormsCoreModule\n} from \"@ng-dynamic-forms/core\";\nimport { NgxMaskDirective } from \"ngx-mask\";\nimport { NgIf, NgClass, NgFor, AsyncPipe } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-input\",\n    templateUrl: \"./dynamic-ng-bootstrap-input.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgIf, DynamicFormsCoreModule, NgClass, NgxMaskDirective, NgFor, AsyncPipe]\n})\nexport class DynamicNGBootstrapInputComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicInputModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<div [formGroup]=\"group\" [class.input-group]=\"model.prefix || model.suffix\">\n\n    <div *ngIf=\"model.prefix\" class=\"input-group-prepend\">\n        <span class=\"input-group-text\" [innerHTML]=\"model.prefix\"></span>\n    </div>\n\n    <input *ngIf=\"model.inputType === 'file'; else maskedInput\" class=\"form-control-file\"\n           [attr.accept]=\"model.accept\"\n           [attr.max]=\"model.max\"\n           [attr.min]=\"model.min\"\n           [attr.multiple]=\"model.multiple\"\n           [attr.step]=\"model.step\"\n           [autocomplete]=\"model.autoComplete\"\n           [autofocus]=\"model.autoFocus\"\n           [class.is-invalid]=\"showErrorMessages\"\n           [dynamicList]=\"model.listId\"\n           [formControlName]=\"model.id\"\n           [id]=\"id\"\n           [maxlength]=\"model.maxLength\"\n           [minlength]=\"model.minLength\"\n           [name]=\"model.name\"\n           [ngClass]=\"getClass('element', 'control')\"\n           [pattern]=\"model.pattern\"\n           [placeholder]=\"model.placeholder\"\n           [readonly]=\"model.readOnly\"\n           [required]=\"model.required\"\n           [spellcheck]=\"model.spellCheck\"\n           [tabindex]=\"model.tabIndex\"\n           [type]=\"model.inputType\"\n           (blur)=\"onBlur($event)\"\n           (change)=\"onChange($event)\"\n           (focus)=\"onFocus($event)\"/>\n\n    <ng-template #maskedInput>\n        <input class=\"form-control\"\n               [attr.accept]=\"model.accept\"\n               [attr.max]=\"model.max\"\n               [attr.min]=\"model.min\"\n               [attr.multiple]=\"model.multiple\"\n               [attr.step]=\"model.step\"\n               [autocomplete]=\"model.autoComplete\"\n               [autofocus]=\"model.autoFocus\"\n               [class.is-invalid]=\"showErrorMessages\"\n               [dynamicList]=\"model.listId\"\n               [formControlName]=\"model.id\"\n               [id]=\"id\"\n               [maxlength]=\"model.maxLength\"\n               [minlength]=\"model.minLength\"\n               [name]=\"model.name\"\n               [ngClass]=\"getClass('element', 'control')\"\n               [pattern]=\"model.pattern\"\n               [placeholder]=\"model.placeholder\"\n               [readonly]=\"model.readOnly\"\n               [required]=\"model.required\"\n               [spellcheck]=\"model.spellCheck\"\n               [tabindex]=\"model.tabIndex\"\n               [mask]=\"model.mask\"\n               [specialCharacters]=\"model.maskConfig?.specialCharacters\"\n               [patterns]=\"model.maskConfig?.patterns\"\n               [prefix]=\"model.maskConfig?.prefix\"\n               [suffix]=\"model.maskConfig?.suffix\"\n               [thousandSeparator]=\"model.maskConfig?.thousandSeparator\"\n               [decimalMarker]=\"model.maskConfig?.decimalMarker\"\n               [dropSpecialCharacters]=\"model.maskConfig?.dropSpecialCharacters\"\n               [hiddenInput]=\"model.maskConfig?.hiddenInput\"\n               [showMaskTyped]=\"model.maskConfig?.showMaskTyped\"\n               [placeHolderCharacter]=\"model.maskConfig?.placeHolderCharacter\"\n               [shownMaskExpression]=\"model.maskConfig?.shownMaskExpression\"\n               [showTemplate]=\"model.maskConfig?.showTemplate\"\n               [clearIfNotMatch]=\"model.maskConfig.clearIfNotMatch\"\n               [validation]=\"model.maskConfig.validation\"\n               [separatorLimit]=\"model.maskConfig.separatorLimit\"\n               [allowNegativeNumbers]=\"model.maskConfig.allowNegativeNumbers\"\n               [leadZeroDateTime]=\"model.maskConfig.leadZeroDateTime\"\n               [type]=\"model.inputType\"\n               (blur)=\"onBlur($event)\"\n               (change)=\"onChange($event)\"\n               (focus)=\"onFocus($event)\"/>\n    </ng-template>\n\n    <div *ngIf=\"model.suffix\" class=\"input-group-append\">\n        <span class=\"input-group-text\" [innerHTML]=\"model.suffix\"></span>\n    </div>\n\n    <datalist *ngIf=\"model.hasList\" [id]=\"model.listId\">\n        <option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">\n    </datalist>\n\n</div>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicRadioGroupModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass, NgIf, NgFor, AsyncPipe } from \"@angular/common\";\nimport { NgbButtonsModule } from \"@ng-bootstrap/ng-bootstrap\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-radio-group\",\n    templateUrl: \"./dynamic-ng-bootstrap-radio-group.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgbButtonsModule, NgClass, NgIf, NgFor, AsyncPipe]\n})\nexport class DynamicNGBootstrapRadioGroupComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicRadioGroupModel<string>;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <div ngbRadioGroup class=\"btn-group btn-group-toggle\" role=\"radiogroup\"\n         [formControlName]=\"model.id\"\n         [id]=\"id\"\n         [ngClass]=\"getClass('element', 'control')\"\n         [tabindex]=\"model.tabIndex\"\n         (change)=\"onChange($event)\">\n\n        <legend *ngIf=\"model.legend\" [innerHTML]=\"model.legend\"></legend>\n\n        <label *ngFor=\"let option of model.options$ | async\" ngbButtonLabel\n               [ngClass]=\"[getClass('element', 'option'), getClass('grid', 'option')]\">\n\n            <input type=\"radio\" ngbButton\n                   [disabled]=\"option.disabled\"\n                   [name]=\"model.name\"\n                   [value]=\"option.value\"\n                   (blur)=\"onBlur($event)\"\n                   (focus)=\"onFocus($event)\"/><span [innerHTML]=\"option.label\"></span>\n        </label>\n\n    </div>\n\n</ng-container>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport { NgbRating, NgbRatingConfig, NgbRatingModule } from \"@ng-bootstrap/ng-bootstrap\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlCustomEvent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicRatingModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-rating\",\n    templateUrl: \"./dynamic-ng-bootstrap-rating.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgbRatingModule, NgClass]\n})\nexport class DynamicNGBootstrapRatingComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicRatingModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChild(NgbRating, {static: true}) ngbRating!: NgbRating;\n\n    constructor(protected layoutService: DynamicFormLayoutService,\n                protected validationService: DynamicFormValidationService,\n                public config: NgbRatingConfig) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <ngb-rating [formControlName]=\"model.id\"\n                [id]=\"id\"\n                [max]=\"model.max\"\n                [ngClass]=\"getClass('element', 'control')\"\n                [resettable]=\"model.getAdditional('resettable', config['resettable'])\"\n                (hover)=\"onCustomEvent($event, 'hover')\"\n                (leave)=\"onCustomEvent($event, 'leave')\"\n                (rateChange)=\"onChange($event)\"></ngb-rating>\n\n</ng-container>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicSelectModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass, NgFor, AsyncPipe } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-select\",\n    templateUrl: \"./dynamic-ng-bootstrap-select.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass, NgFor, AsyncPipe]\n})\nexport class DynamicNGBootstrapSelectComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicSelectModel<string>;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <select class=\"form-control\"\n            [class.is-invalid]=\"showErrorMessages\"\n            [compareWith]=\"model.compareWithFn\"\n            [formControlName]=\"model.id\"\n            [id]=\"id\"\n            [name]=\"model.name\"\n            [ngClass]=\"getClass('element', 'control')\"\n            [required]=\"model.required\"\n            [tabindex]=\"model.tabIndex\"\n            (blur)=\"onBlur($event)\"\n            (change)=\"onChange($event)\"\n            (focus)=\"onFocus($event)\">\n\n        <option *ngFor=\"let option of model.options$ | async\"\n                [disabled]=\"option.disabled\"\n                [ngValue]=\"option.value\">{{ option.label }}</option>\n\n    </select>\n\n</ng-container>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicSwitchModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-switch\",\n    templateUrl: \"./dynamic-ng-bootstrap-switch.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass]\n})\nexport class DynamicNGBootstrapSwitchComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicSwitchModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<div [formGroup]=\"group\" class=\"custom-control custom-switch\">\n\n    <input type=\"checkbox\" class=\"custom-control-input\"\n           [class.is-invalid]=\"showErrorMessages\"\n           [formControlName]=\"model.id\"\n           [id]=\"id\"\n           [name]=\"model.name\"\n           [ngClass]=\"getClass('element', 'control')\"\n           [required]=\"model.required\"\n           [tabindex]=\"model.tabIndex\"\n           [value]=\"model.value\"\n           (blur)=\"onBlur($event)\"\n           (change)=\"onChange($event)\"\n           (focus)=\"onFocus($event)\">\n\n    <label class=\"custom-control-label\" [for]=\"id\" [innerHTML]=\"model.label\"></label>\n\n</div>\n\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicTextAreaModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-textarea\",\n    templateUrl: \"./dynamic-ng-bootstrap-textarea.component.html\",\n    changeDetection: ChangeDetectionStrategy.Default,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass]\n})\nexport class DynamicNGBootstrapTextAreaComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicTextAreaModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <textarea class=\"form-control\"\n              [class.is-invalid]=\"showErrorMessages\"\n              [cols]=\"model.cols\"\n              [formControlName]=\"model.id\"\n              [id]=\"id\"\n              [maxlength]=\"model.maxLength\"\n              [minlength]=\"model.minLength\"\n              [name]=\"model.name\"\n              [ngClass]=\"getClass('element', 'control')\"\n              [placeholder]=\"model.placeholder\"\n              [readonly]=\"model.readOnly\"\n              [required]=\"model.required\"\n              [rows]=\"model.rows\"\n              [spellcheck]=\"model.spellCheck\"\n              [tabindex]=\"model.tabIndex\"\n              [wrap]=\"model.wrap\"\n              (blur)=\"onBlur($event)\"\n              (change)=\"onChange($event)\"\n              (focus)=\"onFocus($event)\"></textarea>\n\n</ng-container>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport { NgbTimepicker, NgbTimepickerConfig, NgbTimepickerModule } from \"@ng-bootstrap/ng-bootstrap\";\nimport {\n    DynamicFormControlComponent,\n    DynamicFormControlLayout,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormValidationService,\n    DynamicTimePickerModel\n} from \"@ng-dynamic-forms/core\";\nimport { NgClass } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-timepicker\",\n    templateUrl: \"./dynamic-ng-bootstrap-timepicker.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgbTimepickerModule, NgClass]\n})\nexport class DynamicNGBootstrapTimePickerComponent extends DynamicFormControlComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicTimePickerModel;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChild(NgbTimepicker, {static: true}) ngbTimePicker!: NgbTimepicker;\n\n    constructor(protected layoutService: DynamicFormLayoutService,\n                protected validationService: DynamicFormValidationService,\n                public config: NgbTimepickerConfig) {\n        super(layoutService, validationService);\n    }\n}\n","<ng-container [formGroup]=\"group\">\n\n    <ngb-timepicker [id]=\"id\"\n                    [formControlName]=\"model.id\"\n                    [hourStep]=\"model.getAdditional('hourStep', config['hourStep'])\"\n                    [meridian]=\"model.meridian\"\n                    [minuteStep]=\"model.getAdditional('minuteStep', config['minuteStep'])\"\n                    [ngClass]=\"getClass('element', 'control')\"\n                    [seconds]=\"model.showSeconds\"\n                    [secondStep]=\"model.getAdditional('secondStep', config['secondStep'])\"\n                    [size]=\"model.getAdditional('size', config['size'])\"\n                    [spinners]=\"model.getAdditional('spinners', config['spinners'])\"></ngb-timepicker>\n\n</ng-container>\n","import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ComponentFactoryResolver,\n    ContentChildren,\n    EventEmitter,\n    HostBinding,\n    Input,\n    Output,\n    QueryList,\n    Type,\n    ViewChild,\n    ViewChildren,\n    ViewContainerRef\n} from \"@angular/core\";\nimport { UntypedFormGroup, ReactiveFormsModule } from \"@angular/forms\";\nimport {\n    DYNAMIC_FORM_CONTROL_TYPE_ARRAY,\n    DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,\n    DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP,\n    DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,\n    DYNAMIC_FORM_CONTROL_TYPE_GROUP,\n    DYNAMIC_FORM_CONTROL_TYPE_INPUT,\n    DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP,\n    DYNAMIC_FORM_CONTROL_TYPE_RATING,\n    DYNAMIC_FORM_CONTROL_TYPE_SELECT,\n    DYNAMIC_FORM_CONTROL_TYPE_SWITCH,\n    DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA,\n    DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER,\n    DynamicDatePickerModel,\n    DynamicFormArrayComponent,\n    DynamicFormArrayGroupModel,\n    DynamicFormArrayModel,\n    DynamicFormComponentService,\n    DynamicFormControl,\n    DynamicFormControlContainerComponent,\n    DynamicFormControlCustomEvent,\n    DynamicFormControlEvent,\n    DynamicFormControlLayout,\n    DynamicFormControlModel,\n    DynamicFormGroupComponent,\n    DynamicFormGroupModel,\n    DynamicFormLayout,\n    DynamicFormLayoutService,\n    DynamicFormRelationService,\n    DynamicFormValidationService,\n    DynamicTemplateDirective\n} from \"@ng-dynamic-forms/core\";\nimport { DynamicNGBootstrapCheckboxComponent } from \"./checkbox/dynamic-ng-bootstrap-checkbox.component\";\nimport { DynamicNGBootstrapCheckboxGroupComponent } from \"./checkbox-group/dynamic-ng-bootstrap-checkbox-group.component\";\nimport { DynamicNGBootstrapCalendarComponent } from \"./calendar/dynamic-ng-bootstrap-calendar.component\";\nimport { DynamicNGBootstrapDatePickerComponent } from \"./datepicker/dynamic-ng-bootstrap-datepicker.component\";\nimport { DynamicNGBootstrapInputComponent } from \"./input/dynamic-ng-bootstrap-input.component\";\nimport { DynamicNGBootstrapRadioGroupComponent } from \"./radio-group/dynamic-ng-bootstrap-radio-group.component\";\nimport { DynamicNGBootstrapRatingComponent } from \"./rating/dynamic-ng-bootstrap-rating.component\";\nimport { DynamicNGBootstrapSelectComponent } from \"./select/dynamic-ng-bootstrap-select.component\";\nimport { DynamicNGBootstrapSwitchComponent } from \"./switch/dynamic-ng-bootstrap-switch.component\";\nimport { DynamicNGBootstrapTextAreaComponent } from \"./textarea/dynamic-ng-bootstrap-textarea.component\";\nimport { DynamicNGBootstrapTimePickerComponent } from \"./timepicker/dynamic-ng-bootstrap-timepicker.component\";\nimport { NgClass, NgFor, NgTemplateOutlet, NgIf } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-form-control\",\n    templateUrl: \"./dynamic-ng-bootstrap-form-control-container.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass, NgIf, NgTemplateOutlet, NgFor]\n})\nexport class DynamicNGBootstrapFormControlContainerComponent extends DynamicFormControlContainerComponent {\n    @ContentChildren(DynamicTemplateDirective) contentTemplateList!: QueryList<DynamicTemplateDirective>;\n\n    @HostBinding(\"class\") klass?: string;\n\n    @Input() asBootstrapFormGroup = true;\n    @Input() context: DynamicFormArrayGroupModel | null = null;\n    @Input() group!: UntypedFormGroup;\n    @Input() hostClass?: string[];\n    // tslint:disable-next-line:no-input-rename\n    @Input(\"templates\") inputTemplateList?: QueryList<DynamicTemplateDirective>;\n    @Input() layout?: DynamicFormLayout;\n    @Input() model!: DynamicFormControlModel;\n\n    @Output() blur: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n    @Output() change: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n    @Output() focus: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n    // tslint:disable-next-line:no-output-rename\n    @Output(\"ngbEvent\") customEvent: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n\n    @ViewChild(\"componentViewContainer\", {read: ViewContainerRef, static: true}) componentViewContainerRef!: ViewContainerRef;\n\n    constructor(protected changeDetectorRef: ChangeDetectorRef,\n                protected componentFactoryResolver: ComponentFactoryResolver,\n                protected layoutService: DynamicFormLayoutService,\n                protected validationService: DynamicFormValidationService,\n                protected componentService: DynamicFormComponentService,\n                protected relationService: DynamicFormRelationService) {\n        super(changeDetectorRef, componentFactoryResolver, layoutService, validationService, componentService, relationService);\n    }\n\n    get componentType(): Type<DynamicFormControl> | null {\n        return this.componentService.getCustomComponentType(this.model) || ngBootstrapUIFormControlMapFn(this.model);\n    }\n}\n\nexport function ngBootstrapUIFormControlMapFn(model: DynamicFormControlModel): Type<DynamicFormControl> | null {\n    switch (model.type) {\n        case DYNAMIC_FORM_CONTROL_TYPE_ARRAY:\n            return DynamicNGBootstrapFormArrayComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX:\n            return DynamicNGBootstrapCheckboxComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP:\n            return DynamicNGBootstrapCheckboxGroupComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER:\n            const datePickerModel = model as DynamicDatePickerModel;\n            return datePickerModel.inline ? DynamicNGBootstrapCalendarComponent : DynamicNGBootstrapDatePickerComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_GROUP:\n            return DynamicNGBootstrapFormGroupComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_INPUT:\n            return DynamicNGBootstrapInputComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP:\n            return DynamicNGBootstrapRadioGroupComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_RATING:\n            return DynamicNGBootstrapRatingComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_SELECT:\n            return DynamicNGBootstrapSelectComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_SWITCH:\n            return DynamicNGBootstrapSwitchComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA:\n            return DynamicNGBootstrapTextAreaComponent;\n\n        case DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER:\n            return DynamicNGBootstrapTimePickerComponent;\n\n        default:\n            return null;\n    }\n}\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-form-array\",\n    templateUrl: \"./dynamic-ng-bootstrap-form-array.component.html\",\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass, NgFor, NgTemplateOutlet, DynamicNGBootstrapFormControlContainerComponent]\n})\nexport class DynamicNGBootstrapFormArrayComponent extends DynamicFormArrayComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicFormArrayModel;\n    @Input() templates?: QueryList<DynamicTemplateDirective>;\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChildren(DynamicNGBootstrapFormControlContainerComponent) components!: QueryList<DynamicNGBootstrapFormControlContainerComponent>;\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-form-group\",\n    templateUrl: \"./dynamic-ng-bootstrap-form-group.component.html\",\n    standalone: true,\n    imports: [ReactiveFormsModule, NgClass, NgFor, DynamicNGBootstrapFormControlContainerComponent]\n})\nexport class DynamicNGBootstrapFormGroupComponent extends DynamicFormGroupComponent {\n    @Input() formLayout?: DynamicFormLayout;\n    @Input() group!: UntypedFormGroup;\n    @Input() layout?: DynamicFormControlLayout;\n    @Input() model!: DynamicFormGroupModel;\n    @Input() templates?: QueryList<DynamicTemplateDirective> | DynamicTemplateDirective[];\n\n    @Output() blur: EventEmitter<any> = new EventEmitter();\n    @Output() change: EventEmitter<any> = new EventEmitter();\n    @Output() customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();\n    @Output() focus: EventEmitter<any> = new EventEmitter();\n\n    @ViewChildren(DynamicNGBootstrapFormControlContainerComponent) components!: QueryList<DynamicNGBootstrapFormControlContainerComponent>;\n\n    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {\n        super(layoutService, validationService);\n    }\n}\n","<div [class.form-group]=\"(model.type !== 'GROUP' && asBootstrapFormGroup) || getClass('element', 'container').includes('form-group')\"\n     [formGroup]=\"group\"\n     [ngClass]=\"['ng-dynamic-forms-'+model.type.toLowerCase(), getClass('element', 'container'), getClass('grid', 'container')]\">\n\n    <label *ngIf=\"!isCheckbox && hasLabel\"\n           [for]=\"id\"\n           [innerHTML]=\"model.label\"\n           [ngClass]=\"[getClass('element', 'label'), getClass('grid', 'label')]\"></label>\n\n    <ng-container *ngTemplateOutlet=\"startTemplate?.templateRef; context: model\"></ng-container>\n\n    <div [ngClass]=\"getClass('grid', 'control')\">\n\n        <ng-container #componentViewContainer></ng-container>\n\n        <small *ngIf=\"hasHint\" class=\"text-muted\" [innerHTML]=\"hint\" [ngClass]=\"getClass('element', 'hint')\"></small>\n\n        <div *ngIf=\"showErrorMessages\" [ngClass]=\"[getClass('element', 'errors'), getClass('grid', 'errors')]\">\n            <small *ngFor=\"let message of errorMessages\" class=\"invalid-feedback d-block\">{{ message }}</small>\n        </div>\n\n    </div>\n\n    <ng-container *ngTemplateOutlet=\"endTemplate?.templateRef; context: model\"></ng-container>\n\n    <ng-content></ng-content>\n\n</div>\n","<ng-container [formGroup]=\"group\">\n\n    <div [formArrayName]=\"model.id\" [id]=\"id\" [ngClass]=\"getClass('element', 'control')\">\n\n        <div *ngFor=\"let groupModel of model.groups; let idx = index\" role=\"group\"\n             [formGroupName]=\"idx\" [ngClass]=\"[getClass('element', 'group'), getClass('grid', 'group')]\">\n\n            <ng-container *ngTemplateOutlet=\"startTemplate?.templateRef; context: groupModel\"></ng-container>\n\n            <dynamic-ng-bootstrap-form-control *ngFor=\"let _model of groupModel.group\"\n                                               [context]=\"groupModel\"\n                                               [group]=\"array.at(idx)\"\n                                               [hidden]=\"_model.hidden\"\n                                               [layout]=\"formLayout\"\n                                               [model]=\"_model\"\n                                               [templates]=\"templates\"\n                                               [hostClass]=\"[getClass('element','children'), getClass('grid','children')]\"\n                                               (blur)=\"onBlur($event)\"\n                                               (change)=\"onChange($event)\"\n                                               (focus)=\"onFocus($event)\"\n                                               (ngbEvent)=\"onCustomEvent($event, null, true)\"></dynamic-ng-bootstrap-form-control>\n\n            <ng-container *ngTemplateOutlet=\"endTemplate?.templateRef; context: groupModel\"></ng-container>\n\n        </div>\n\n    </div>\n\n</ng-container>\n","<ng-container [formGroup]=\"group\">\n\n    <div role=\"group\" [formGroupName]=\"model.id\" [id]=\"id\" [ngClass]=\"getClass('element','control')\">\n\n        <dynamic-ng-bootstrap-form-control *ngFor=\"let _model of model.group\"\n                                           [asBootstrapFormGroup]=\"true\"\n                                           [group]=\"control\"\n                                           [hidden]=\"_model.hidden\"\n                                           [layout]=\"formLayout\"\n                                           [model]=\"_model\"\n                                           [templates]=\"templates\"\n                                           [hostClass]=\"[getClass('element','children'), getClass('grid','children')]\"\n                                           (blur)=\"onBlur($event)\"\n                                           (change)=\"onChange($event)\"\n                                           (focus)=\"onFocus($event)\"\n                                           (ngbEvent)=\"onCustomEvent($event, null, true)\"></dynamic-ng-bootstrap-form-control>\n    </div>\n\n</ng-container>\n","import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    EventEmitter,\n    Input,\n    Output,\n    QueryList,\n    ViewChildren\n} from \"@angular/core\";\nimport { UntypedFormGroup } from \"@angular/forms\";\nimport {\n    DynamicFormComponent,\n    DynamicFormComponentService,\n    DynamicFormControlEvent,\n    DynamicFormLayout,\n    DynamicFormModel,\n    DynamicTemplateDirective\n} from \"@ng-dynamic-forms/core\";\nimport { DynamicNGBootstrapFormControlContainerComponent } from \"./dynamic-ng-bootstrap-form-control-container.component\";\nimport { NgFor } from \"@angular/common\";\n\n@Component({\n    selector: \"dynamic-ng-bootstrap-form\",\n    templateUrl: \"./dynamic-ng-bootstrap-form.component.html\",\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [NgFor, DynamicNGBootstrapFormControlContainerComponent]\n})\nexport class DynamicNGBootstrapFormComponent extends DynamicFormComponent {\n    @Input() group!: UntypedFormGroup;\n    @Input() model!: DynamicFormModel;\n    @Input() layout?: DynamicFormLayout;\n\n    @Output() blur: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n    @Output() change: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n    @Output() focus: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n\n    @Output() ngbEvent: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();\n\n    @ContentChildren(DynamicTemplateDirective) templates!: QueryList<DynamicTemplateDirective>;\n\n    @ViewChildren(DynamicNGBootstrapFormControlContainerComponent) components!: QueryList<DynamicNGBootstrapFormControlContainerComponent>;\n\n    constructor(protected changeDetectorRef: ChangeDetectorRef, protected componentService: DynamicFormComponentService) {\n        super(changeDetectorRef, componentService);\n    }\n}\n","<dynamic-ng-bootstrap-form-control *ngFor=\"let controlModel of model; trackBy: trackByFn\"\n                                   [group]=\"group\"\n                                   [hidden]=\"controlModel.hidden\"\n                                   [layout]=\"layout\"\n                                   [model]=\"controlModel\"\n