@ng-dynamic-forms/ui-material
Version:
Material UI package for NG Dynamic Forms
309 lines (303 loc) • 108 kB
JavaScript
import * as i1 from '@ng-dynamic-forms/core';
import { DynamicFormControlComponent, DynamicFormControlContainerComponent, DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER, DYNAMIC_FORM_CONTROL_TYPE_INPUT, DYNAMIC_FORM_CONTROL_TYPE_SELECT, DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA, DynamicFormValueControlModel, DynamicTemplateDirective, DYNAMIC_FORM_CONTROL_TYPE_SWITCH, DYNAMIC_FORM_CONTROL_TYPE_SLIDER, DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP, DYNAMIC_FORM_CONTROL_TYPE_GROUP, DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP, DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX, DYNAMIC_FORM_CONTROL_TYPE_ARRAY, DynamicFormArrayComponent, DynamicFormGroupComponent, DynamicFormComponent } from '@ng-dynamic-forms/core';
import * as i0 from '@angular/core';
import { EventEmitter, Component, Inject, Optional, Input, Output, ViewChild, ViewContainerRef, ChangeDetectionStrategy, ContentChildren, HostBinding, ViewChildren } from '@angular/core';
import * as i3 from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import * as i3$1 from '@angular/material/checkbox';
import { MatCheckboxModule } from '@angular/material/checkbox';
import * as i6 from '@angular/material/core';
import { MAT_RIPPLE_GLOBAL_OPTIONS, MatOptionModule, ErrorStateMatcher } from '@angular/material/core';
import { NgClass, NgFor, AsyncPipe, NgIf, NgTemplateOutlet } from '@angular/common';
import * as i7 from '@angular/material/autocomplete';
import { MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, MatAutocompleteModule } from '@angular/material/autocomplete';
import * as i4 from '@angular/material/chips';
import { MAT_CHIPS_DEFAULT_OPTIONS, MatChipsModule } from '@angular/material/chips';
import * as i2 from '@angular/material/form-field';
import { MAT_FORM_FIELD_DEFAULT_OPTIONS, MatFormFieldModule } from '@angular/material/form-field';
import * as i4$1 from '@angular/material/input';
import { MatInput, MatInputModule } from '@angular/material/input';
import * as i5 from '@angular/material/icon';
import { MatIconModule } from '@angular/material/icon';
import * as i5$1 from '@angular/material/datepicker';
import { MatDatepickerModule } from '@angular/material/datepicker';
import * as i3$2 from '@angular/material/radio';
import { MatRadioModule } from '@angular/material/radio';
import * as i4$2 from '@angular/material/select';
import { MatSelectModule } from '@angular/material/select';
import * as i3$3 from '@angular/material/slide-toggle';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import * as i3$4 from '@angular/material/slider';
import { MatSliderModule } from '@angular/material/slider';
import * as i5$2 from '@angular/cdk/text-field';
import { TextFieldModule } from '@angular/cdk/text-field';
class DynamicMaterialFormInputControlComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
}
get characterCount() {
return this.matInput ? this.matInput.value.length : null;
}
get characterHint() {
return `${this.characterCount} / ${this.model.maxLength}`;
}
get showCharacterHint() {
return !!(this.model.maxLength && this.characterCount);
}
}
class DynamicMaterialCheckboxComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService, RIPPLE_OPTIONS) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.RIPPLE_OPTIONS = RIPPLE_OPTIONS;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.customEvent = new EventEmitter();
this.focus = new EventEmitter();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialCheckboxComponent, deps: [{ token: i1.DynamicFormLayoutService }, { token: i1.DynamicFormValidationService }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicMaterialCheckboxComponent, isStandalone: true, selector: "dynamic-material-checkbox", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", customEvent: "customEvent", focus: "focus" }, viewQueries: [{ propertyName: "matCheckbox", first: true, predicate: ["matCheckbox"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"group\">\n\n <mat-checkbox #matCheckbox\n [checked]=\"model.checked\"\n [color]=\"model.getAdditional('color', 'accent')\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [indeterminate]=\"model.indeterminate\"\n [labelPosition]=\"model.labelPosition || 'after'\"\n [name]=\"model.name\"\n [ngClass]=\"[getClass('element', 'control'), getClass('grid', 'control')]\"\n (blur)=\"onBlur($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (indeterminateChange)=\"onCustomEvent($event, 'indeterminateChange')\">\n\n <span [ngClass]=\"getClass('element', 'label')\" [innerHTML]=\"model.label\"></span>\n\n </mat-checkbox>\n\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialCheckboxComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-material-checkbox", standalone: true, imports: [ReactiveFormsModule, MatCheckboxModule, NgClass], template: "<ng-container [formGroup]=\"group\">\n\n <mat-checkbox #matCheckbox\n [checked]=\"model.checked\"\n [color]=\"model.getAdditional('color', 'accent')\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [indeterminate]=\"model.indeterminate\"\n [labelPosition]=\"model.labelPosition || 'after'\"\n [name]=\"model.name\"\n [ngClass]=\"[getClass('element', 'control'), getClass('grid', 'control')]\"\n (blur)=\"onBlur($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (indeterminateChange)=\"onCustomEvent($event, 'indeterminateChange')\">\n\n <span [ngClass]=\"getClass('element', 'label')\" [innerHTML]=\"model.label\"></span>\n\n </mat-checkbox>\n\n</ng-container>\n" }]
}], ctorParameters: function () { return [{ type: i1.DynamicFormLayoutService }, { type: i1.DynamicFormValidationService }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_RIPPLE_GLOBAL_OPTIONS]
}, {
type: Optional
}] }]; }, propDecorators: { formLayout: [{
type: Input
}], group: [{
type: Input
}], layout: [{
type: Input
}], model: [{
type: Input
}], blur: [{
type: Output
}], change: [{
type: Output
}], customEvent: [{
type: Output
}], focus: [{
type: Output
}], matCheckbox: [{
type: ViewChild,
args: ["matCheckbox", { static: true }]
}] } });
class DynamicMaterialChipsComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService, AUTOCOMPLETE_OPTIONS, CHIPS_OPTIONS, FORM_FIELD_OPTIONS, RIPPLE_OPTIONS) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.AUTOCOMPLETE_OPTIONS = AUTOCOMPLETE_OPTIONS;
this.CHIPS_OPTIONS = CHIPS_OPTIONS;
this.FORM_FIELD_OPTIONS = FORM_FIELD_OPTIONS;
this.RIPPLE_OPTIONS = RIPPLE_OPTIONS;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.customEvent = new EventEmitter();
this.focus = new EventEmitter();
}
get chips() {
return Array.isArray(this.model.value) ? this.model.value : [];
}
onChipInputTokenEnd($event) {
const inputElement = $event.chipInput?.inputElement;
const inputValue = $event.value.trim();
if (inputValue.length > 0) {
this.control.patchValue([...this.chips, inputValue]);
this.onChange($event);
}
if (inputElement instanceof HTMLInputElement) {
inputElement.value = "";
}
}
onChipSelected($event) {
const selectedChip = $event.option.value;
const chips = this.chips;
if (!chips.includes(selectedChip)) {
this.control.patchValue([...this.chips, selectedChip]);
}
}
onChipRemoved(chip, index) {
const chips = this.chips;
if (chips[index] === chip) {
chips.splice(index, 1);
this.control.patchValue([...chips]);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialChipsComponent, deps: [{ token: i1.DynamicFormLayoutService }, { token: i1.DynamicFormValidationService }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS }, { token: MAT_CHIPS_DEFAULT_OPTIONS }, { token: MAT_FORM_FIELD_DEFAULT_OPTIONS, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicMaterialChipsComponent, isStandalone: true, selector: "dynamic-material-chips", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", customEvent: "customEvent", focus: "focus" }, viewQueries: [{ propertyName: "matAutocomplete", first: true, predicate: ["matAutocomplete"], descendants: true, static: true }, { propertyName: "matChipGrid", first: true, predicate: ["matChipGrid"], descendants: true, static: true }, { propertyName: "matInput", first: true, predicate: MatInput, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid', 'control')\">\n\n <mat-chip-grid #matChipGrid [formControlName]=\"model.id\" [id]=\"id\">\n\n <mat-chip-row *ngFor=\"let chip of chips; let index = index\"\n (removed)=\"onChipRemoved(chip, index)\">\n\n <span>{{ chip }}</span>\n\n <mat-icon matChipRemove>cancel</mat-icon>\n\n </mat-chip-row>\n\n <input matInput\n [matAutocomplete]=\"matAutocomplete\"\n [matChipInputAddOnBlur]=\"model.getAdditional('matChipInputAddOnBlur', true)\"\n [matChipInputFor]=\"matChipGrid\"\n [matChipInputSeparatorKeyCodes]=\"model.getAdditional('matChipInputSeparatorKeyCodes', CHIPS_OPTIONS['separatorKeyCodes'])\"\n [placeholder]=\"model.placeholder\"\n (matChipInputTokenEnd)=\"onChipInputTokenEnd($event)\"\n (blur)=\"onBlur($event)\"\n (focus)=\"onFocus($event)\"/>\n\n <mat-autocomplete #matAutocomplete\n [autoActiveFirstOption]=\"model.getAdditional('autoActiveFirstOption', AUTOCOMPLETE_OPTIONS['autoActiveFirstOption'])\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [displayWith]=\"model.getAdditional('displayWith', null)\"\n (optionSelected)=\"onChipSelected($event)\">\n\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">{{ option }}</mat-option>\n\n </mat-autocomplete>\n\n </mat-chip-grid>\n\n</mat-form-field>\n", dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4.MatChipGrid, selector: "mat-chip-grid", inputs: ["tabIndex", "disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "editable"], outputs: ["edited"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialChipsComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-material-chips", standalone: true, imports: [MatFormFieldModule, ReactiveFormsModule, NgClass, MatChipsModule, NgFor, MatIconModule, MatInputModule, MatAutocompleteModule,
MatOptionModule, AsyncPipe], template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid', 'control')\">\n\n <mat-chip-grid #matChipGrid [formControlName]=\"model.id\" [id]=\"id\">\n\n <mat-chip-row *ngFor=\"let chip of chips; let index = index\"\n (removed)=\"onChipRemoved(chip, index)\">\n\n <span>{{ chip }}</span>\n\n <mat-icon matChipRemove>cancel</mat-icon>\n\n </mat-chip-row>\n\n <input matInput\n [matAutocomplete]=\"matAutocomplete\"\n [matChipInputAddOnBlur]=\"model.getAdditional('matChipInputAddOnBlur', true)\"\n [matChipInputFor]=\"matChipGrid\"\n [matChipInputSeparatorKeyCodes]=\"model.getAdditional('matChipInputSeparatorKeyCodes', CHIPS_OPTIONS['separatorKeyCodes'])\"\n [placeholder]=\"model.placeholder\"\n (matChipInputTokenEnd)=\"onChipInputTokenEnd($event)\"\n (blur)=\"onBlur($event)\"\n (focus)=\"onFocus($event)\"/>\n\n <mat-autocomplete #matAutocomplete\n [autoActiveFirstOption]=\"model.getAdditional('autoActiveFirstOption', AUTOCOMPLETE_OPTIONS['autoActiveFirstOption'])\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [displayWith]=\"model.getAdditional('displayWith', null)\"\n (optionSelected)=\"onChipSelected($event)\">\n\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">{{ option }}</mat-option>\n\n </mat-autocomplete>\n\n </mat-chip-grid>\n\n</mat-form-field>\n" }]
}], ctorParameters: function () { return [{ type: i1.DynamicFormLayoutService }, { type: i1.DynamicFormValidationService }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_AUTOCOMPLETE_DEFAULT_OPTIONS]
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_CHIPS_DEFAULT_OPTIONS]
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_FORM_FIELD_DEFAULT_OPTIONS]
}, {
type: Optional
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_RIPPLE_GLOBAL_OPTIONS]
}, {
type: Optional
}] }]; }, propDecorators: { formLayout: [{
type: Input
}], group: [{
type: Input
}], layout: [{
type: Input
}], model: [{
type: Input
}], blur: [{
type: Output
}], change: [{
type: Output
}], customEvent: [{
type: Output
}], focus: [{
type: Output
}], matAutocomplete: [{
type: ViewChild,
args: ["matAutocomplete", { static: true }]
}], matChipGrid: [{
type: ViewChild,
args: ["matChipGrid", { static: true }]
}], matInput: [{
type: ViewChild,
args: [MatInput, { static: true }]
}] } });
class DynamicMaterialDatePickerComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService, FORM_FIELD_OPTIONS) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.FORM_FIELD_OPTIONS = FORM_FIELD_OPTIONS;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.customEvent = new EventEmitter();
this.focus = new EventEmitter();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialDatePickerComponent, deps: [{ token: i1.DynamicFormLayoutService }, { token: i1.DynamicFormValidationService }, { token: MAT_FORM_FIELD_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicMaterialDatePickerComponent, isStandalone: true, selector: "dynamic-material-datepicker", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", customEvent: "customEvent", focus: "focus" }, viewQueries: [{ propertyName: "matDatePicker", first: true, predicate: ["matDatepicker"], descendants: true, static: true }, { propertyName: "matInput", first: true, predicate: MatInput, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid', 'control')\">\n\n <ng-container *ngIf=\"model.label\" ngProjectAs=\"mat-label\">\n\n <mat-label [innerHTML]=\"model.label\"></mat-label>\n\n </ng-container>\n\n <span *ngIf=\"model.prefix\" matPrefix [innerHTML]=\"model.prefix\"></span>\n\n <input matInput\n [autofocus]=\"model.autoFocus\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [max]=\"model.max\"\n [matDatepicker]=\"matDatepicker\"\n [min]=\"model.min\"\n [name]=\"model.name\"\n [ngClass]=\"getClass('element', 'control')\"\n [placeholder]=\"model.placeholder || ''\"\n [readonly]=\"model.readOnly\"\n [required]=\"model.required\"\n (blur)=\"onBlur($event)\"\n (dateChange)=\"onChange($event)\"\n (dateInput)=\"onCustomEvent($event, 'dateInput')\"\n (focus)=\"onFocus($event)\"/>\n\n <span *ngIf=\"model.suffix\" matSuffix [innerHTML]=\"model.suffix\"></span>\n\n <mat-hint *ngIf=\"model.hint !== null\" align=\"start\" [innerHTML]=\"model.hint\"></mat-hint>\n\n\n <mat-datepicker-toggle matSuffix [for]=\"matDatepicker\"></mat-datepicker-toggle>\n\n <mat-datepicker #matDatepicker\n [opened]=\"model.getAdditional('opened', false)\"\n [startAt]=\"model.focusedDate\"\n [startView]=\"model.getAdditional('startView', 'month')\"\n [touchUi]=\"model.getAdditional('touchUi', false)\"\n (closed)=\"onCustomEvent($event, 'closed')\"\n (monthSelected)=\"onCustomEvent($event, 'monthSelected')\"\n (opened)=\"onCustomEvent($event, 'opened')\"\n (yearSelected)=\"onCustomEvent($event, 'yearSelected')\"></mat-datepicker>\n\n <mat-error *ngFor=\"let message of errorMessages\">{{ message }}</mat-error>\n\n</mat-form-field>\n", dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialDatePickerComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-material-datepicker", standalone: true, imports: [MatFormFieldModule, ReactiveFormsModule, NgClass, NgIf, MatInputModule, MatDatepickerModule, NgFor], template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid', 'control')\">\n\n <ng-container *ngIf=\"model.label\" ngProjectAs=\"mat-label\">\n\n <mat-label [innerHTML]=\"model.label\"></mat-label>\n\n </ng-container>\n\n <span *ngIf=\"model.prefix\" matPrefix [innerHTML]=\"model.prefix\"></span>\n\n <input matInput\n [autofocus]=\"model.autoFocus\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [max]=\"model.max\"\n [matDatepicker]=\"matDatepicker\"\n [min]=\"model.min\"\n [name]=\"model.name\"\n [ngClass]=\"getClass('element', 'control')\"\n [placeholder]=\"model.placeholder || ''\"\n [readonly]=\"model.readOnly\"\n [required]=\"model.required\"\n (blur)=\"onBlur($event)\"\n (dateChange)=\"onChange($event)\"\n (dateInput)=\"onCustomEvent($event, 'dateInput')\"\n (focus)=\"onFocus($event)\"/>\n\n <span *ngIf=\"model.suffix\" matSuffix [innerHTML]=\"model.suffix\"></span>\n\n <mat-hint *ngIf=\"model.hint !== null\" align=\"start\" [innerHTML]=\"model.hint\"></mat-hint>\n\n\n <mat-datepicker-toggle matSuffix [for]=\"matDatepicker\"></mat-datepicker-toggle>\n\n <mat-datepicker #matDatepicker\n [opened]=\"model.getAdditional('opened', false)\"\n [startAt]=\"model.focusedDate\"\n [startView]=\"model.getAdditional('startView', 'month')\"\n [touchUi]=\"model.getAdditional('touchUi', false)\"\n (closed)=\"onCustomEvent($event, 'closed')\"\n (monthSelected)=\"onCustomEvent($event, 'monthSelected')\"\n (opened)=\"onCustomEvent($event, 'opened')\"\n (yearSelected)=\"onCustomEvent($event, 'yearSelected')\"></mat-datepicker>\n\n <mat-error *ngFor=\"let message of errorMessages\">{{ message }}</mat-error>\n\n</mat-form-field>\n" }]
}], ctorParameters: function () { return [{ type: i1.DynamicFormLayoutService }, { type: i1.DynamicFormValidationService }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_FORM_FIELD_DEFAULT_OPTIONS]
}, {
type: Optional
}] }]; }, propDecorators: { formLayout: [{
type: Input
}], group: [{
type: Input
}], layout: [{
type: Input
}], model: [{
type: Input
}], blur: [{
type: Output
}], change: [{
type: Output
}], customEvent: [{
type: Output
}], focus: [{
type: Output
}], matDatePicker: [{
type: ViewChild,
args: ["matDatepicker", { static: true }]
}], matInput: [{
type: ViewChild,
args: [MatInput, { static: true }]
}] } });
class DynamicMaterialInputComponent extends DynamicMaterialFormInputControlComponent {
constructor(layoutService, validationService, errorStateMatcher, AUTOCOMPLETE_OPTIONS, FORM_FIELD_OPTIONS, RIPPLE_OPTIONS) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.errorStateMatcher = errorStateMatcher;
this.AUTOCOMPLETE_OPTIONS = AUTOCOMPLETE_OPTIONS;
this.FORM_FIELD_OPTIONS = FORM_FIELD_OPTIONS;
this.RIPPLE_OPTIONS = RIPPLE_OPTIONS;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.customEvent = new EventEmitter();
this.focus = new EventEmitter();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialInputComponent, deps: [{ token: i1.DynamicFormLayoutService }, { token: i1.DynamicFormValidationService }, { token: ErrorStateMatcher }, { token: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS }, { token: MAT_FORM_FIELD_DEFAULT_OPTIONS, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicMaterialInputComponent, isStandalone: true, selector: "dynamic-material-input", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", customEvent: "customEvent", focus: "focus" }, viewQueries: [{ propertyName: "matAutocomplete", first: true, predicate: ["matAutocomplete"], descendants: true, static: true }, { propertyName: "matInput", first: true, predicate: MatInput, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid','control')\">\n\n <ng-container *ngIf=\"model.label\" ngProjectAs=\"mat-label\">\n\n <mat-label [innerHTML]=\"model.label\"></mat-label>\n\n </ng-container>\n\n <span *ngIf=\"model.prefix\" matPrefix [innerHTML]=\"model.prefix\"></span>\n\n <input matInput\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 [errorStateMatcher]=\"model.getAdditional('errorStateMatcher', errorStateMatcher)\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [maxlength]=\"model.maxLength\"\n [matAutocomplete]=\"matAutocomplete\"\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 <span *ngIf=\"model.suffix\" matSuffix [innerHTML]=\"model.suffix\"></span>\n\n <mat-hint *ngIf=\"model.hint !== null\" align=\"start\" [innerHTML]=\"model.hint\"></mat-hint>\n\n <mat-hint *ngIf=\"showCharacterHint\" align=\"end\">{{ characterHint }}</mat-hint>\n\n <mat-error *ngFor=\"let message of errorMessages\">{{ message }}</mat-error>\n\n</mat-form-field>\n\n<mat-autocomplete #matAutocomplete=\"matAutocomplete\"\n [autoActiveFirstOption]=\"model.getAdditional('autoActiveFirstOption', AUTOCOMPLETE_OPTIONS['autoActiveFirstOption'])\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [displayWith]=\"model.getAdditional('displayWith', null)\"\n (optionSelected)=\"onChange($event)\">\n\n <ng-container *ngIf=\"model.getAdditional('matAutocomplete', null) === null; else displayWith\">\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">{{ option }}</mat-option>\n </ng-container>\n <ng-template #displayWith>\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">\n {{ option[model.getAdditional('optionLabel', 'label')] }}\n </mat-option>\n </ng-template>\n\n</mat-autocomplete>\n", dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i6.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialInputComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-material-input", standalone: true, imports: [MatFormFieldModule, ReactiveFormsModule, NgClass, NgIf, MatInputModule, MatAutocompleteModule, NgFor, MatOptionModule,
AsyncPipe], template: "<mat-form-field [appearance]=\"model.getAdditional('appearance', 'fill')\"\n [color]=\"model.getAdditional('color', 'primary')\"\n [floatLabel]=\"model.getAdditional('floatLabel', FORM_FIELD_OPTIONS && FORM_FIELD_OPTIONS['floatLabel'] || 'auto')\"\n [formGroup]=\"group\"\n [hideRequiredMarker]=\"model.getAdditional('hideRequiredMarker', false)\"\n [ngClass]=\"getClass('grid','control')\">\n\n <ng-container *ngIf=\"model.label\" ngProjectAs=\"mat-label\">\n\n <mat-label [innerHTML]=\"model.label\"></mat-label>\n\n </ng-container>\n\n <span *ngIf=\"model.prefix\" matPrefix [innerHTML]=\"model.prefix\"></span>\n\n <input matInput\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 [errorStateMatcher]=\"model.getAdditional('errorStateMatcher', errorStateMatcher)\"\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [maxlength]=\"model.maxLength\"\n [matAutocomplete]=\"matAutocomplete\"\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 <span *ngIf=\"model.suffix\" matSuffix [innerHTML]=\"model.suffix\"></span>\n\n <mat-hint *ngIf=\"model.hint !== null\" align=\"start\" [innerHTML]=\"model.hint\"></mat-hint>\n\n <mat-hint *ngIf=\"showCharacterHint\" align=\"end\">{{ characterHint }}</mat-hint>\n\n <mat-error *ngFor=\"let message of errorMessages\">{{ message }}</mat-error>\n\n</mat-form-field>\n\n<mat-autocomplete #matAutocomplete=\"matAutocomplete\"\n [autoActiveFirstOption]=\"model.getAdditional('autoActiveFirstOption', AUTOCOMPLETE_OPTIONS['autoActiveFirstOption'])\"\n [disableRipple]=\"model.getAdditional('disableRipple', RIPPLE_OPTIONS && RIPPLE_OPTIONS['disabled'] || false)\"\n [displayWith]=\"model.getAdditional('displayWith', null)\"\n (optionSelected)=\"onChange($event)\">\n\n <ng-container *ngIf=\"model.getAdditional('matAutocomplete', null) === null; else displayWith\">\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">{{ option }}</mat-option>\n </ng-container>\n <ng-template #displayWith>\n <mat-option *ngFor=\"let option of model.list$ | async\" [value]=\"option\">\n {{ option[model.getAdditional('optionLabel', 'label')] }}\n </mat-option>\n </ng-template>\n\n</mat-autocomplete>\n" }]
}], ctorParameters: function () { return [{ type: i1.DynamicFormLayoutService }, { type: i1.DynamicFormValidationService }, { type: i6.ErrorStateMatcher, decorators: [{
type: Inject,
args: [ErrorStateMatcher]
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_AUTOCOMPLETE_DEFAULT_OPTIONS]
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_FORM_FIELD_DEFAULT_OPTIONS]
}, {
type: Optional
}] }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_RIPPLE_GLOBAL_OPTIONS]
}, {
type: Optional
}] }]; }, propDecorators: { formLayout: [{
type: Input
}], group: [{
type: Input
}], layout: [{
type: Input
}], model: [{
type: Input
}], blur: [{
type: Output
}], change: [{
type: Output
}], customEvent: [{
type: Output
}], focus: [{
type: Output
}], matAutocomplete: [{
type: ViewChild,
args: ["matAutocomplete", { static: true }]
}], matInput: [{
type: ViewChild,
args: [MatInput, { static: true }]
}] } });
class DynamicMaterialRadioGroupComponent extends DynamicFormControlComponent {
constructor(layoutService, validationService) {
super(layoutService, validationService);
this.layoutService = layoutService;
this.validationService = validationService;
this.blur = new EventEmitter();
this.change = new EventEmitter();
this.customEvent = new EventEmitter();
this.focus = new EventEmitter();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialRadioGroupComponent, 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: DynamicMaterialRadioGroupComponent, isStandalone: true, selector: "dynamic-material-radio-group", inputs: { formLayout: "formLayout", group: "group", layout: "layout", model: "model" }, outputs: { blur: "blur", change: "change", customEvent: "customEvent", focus: "focus" }, viewQueries: [{ propertyName: "matRadioGroup", first: true, predicate: ["matRadioGroup"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"group\">\n\n <mat-radio-group #matRadioGroup\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [labelPosition]=\"model.getAdditional('labelPosition', 'after')\"\n [name]=\"model.name\"\n [ngClass]=\"[getClass('element', 'control'), getClass('grid', 'control')]\"\n [required]=\"model.required\"\n (blur)=\"onBlur($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\">\n\n <mat-radio-button *ngFor=\"let option of model.options$ | async\"\n [name]=\"model.name\"\n [ngClass]=\"getClass('element', 'option')\"\n [value]=\"option.value\"><span [innerHTML]=\"option.label\"></span></mat-radio-button>\n\n </mat-radio-group>\n\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i3$2.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$2.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicMaterialRadioGroupComponent, decorators: [{
type: Component,
args: [{ selector: "dynamic-material-radio-group", standalone: true, imports: [ReactiveFormsModule, MatRadioModule, NgClass, NgFor, AsyncPipe], template: "<ng-container [formGroup]=\"group\">\n\n <mat-radio-group #matRadioGroup\n [formControlName]=\"model.id\"\n [id]=\"id\"\n [labelPosition]=\"model.getAdditional('labelPosition', 'after')\"\n [name]=\"model.name\"\n