@wemake4u/form-player-se 1.0.1 → 1.0.2

package/fesm2022/wemake4u-form-player-se.mjs

@@ -1819,6 +1819,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     type: Host
                 }] }] });
 
+class TemplateWrapperComponent {
+    template;
+    context = {};
+    constructor() { }
+    getTemplateRef() {
+        const result = {
+            createEmbeddedView: (context) => {
+                return this.template.createEmbeddedView(this.context);
+            }
+        };
+        result.createEmbeddedViewImpl = () => {
+            return this.template.createEmbeddedView(this.context);
+        };
+        return result;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TemplateWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TemplateWrapperComponent, isStandalone: true, selector: "app-template-wrapper", inputs: { template: "template", context: "context" }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TemplateWrapperComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'app-template-wrapper',
+                    template: '',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [], propDecorators: { template: [{
+                type: Input
+            }], context: [{
+                type: Input
+            }] } });
+
 class ObjectURLRendererComponent {
     params;
     agInit(params) {
@@ -1902,6 +1933,9 @@ class SanitizeService {
     sanitizeSafeUrl(url) {
         return this.sanitizer.bypassSecurityTrustResourceUrl(url);
     }
+    toString(safeHtml) {
+        return this.sanitizer.sanitize(1, safeHtml) || '';
+    }
     sanitizeOption;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SanitizeService, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SanitizeService, providedIn: 'root' });
@@ -1913,13 +1947,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i1$3.DomSanitizer }] });
 
-marked.use({
-    async: false,
-    gfm: true,
-    breaks: true
-});
 class MarkdownService {
-    constructor() { }
+    constructor() {
+        marked.use({
+            async: false,
+            gfm: true,
+            breaks: true
+        });
+        const renderer = new marked.Renderer();
+        renderer.link = function (args) {
+            return `<a href="${args.href}" target="_blank">${args.text}</a>`;
+        };
+        marked.setOptions({ renderer });
+    }
     toHtml(text) {
         return marked.parse(text ?? "");
     }
@@ -2124,8 +2164,11 @@ class DynamicFieldsComponent {
             : this.formGroup;
     }
     toHTML(text) {
-        let html = this.markdown.toHtml(text);
-        return this.sanitizer.sanitizeSafeHtml(html);
+        const watchKey = `:safeHtml(${text})`;
+        return this.weak.call(this.formGroup, watchKey, () => {
+            const html = this.markdown.toHtml(text);
+            return this.sanitizer.sanitizeSafeHtml(html);
+        });
     }
     ;
     sanitize(html) {
@@ -2450,7 +2493,7 @@ class DynamicFieldsComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DynamicFieldsComponent, isStandalone: true, selector: "app-dynamic-fields", inputs: { rows: "rows", formGroup: "formGroup" }, providers: [
             RegisterService,
             ProgrammabilityService
-        ], ngImport: i0, template: "<ng-container *ngFor=\"let row of rows\" [formGroup]=\"formGroup\">\r\n  <div class=\"row field-set\">\r\n    <ng-container *ngFor=\"let component of row.components\">\r\n      <ng-container [ngSwitch]=\"component.type\">\r\n        <div [formGroup]=\"formGroup\" [class]=\"getClass(component)\">\r\n          <!-- #region textfield -->\r\n          <ng-container *ngSwitchCase=\"'textfield'\">\r\n            <ngx-sirio-input type=\"text\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textfield\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textfield\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region select -->\r\n          <ng-container *ngSwitchCase=\"'select'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              dropdown\r\n                              #select\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"select\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"Texts.TypeToSearch\"></ngx-sirio-input>\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region taglist -->\r\n          <ng-container *ngSwitchCase=\"'taglist'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [isMultiple]=\"true\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              #taglist\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"taglist\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region number -->\r\n          <ng-container *ngSwitchCase=\"'number'\">\r\n            <ngx-sirio-input type=\"number\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #number\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"number\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region datetime -->\r\n          <ng-container *ngSwitchCase=\"'datetime'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region date -->\r\n              <ng-container *ngSwitchCase=\"'date'\">\r\n                <ngx-sirio-datepicker ariaLabel=\"date\"\r\n                                      [label]=\"evaluateString(component.dateLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #date\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"date\">\r\n                </ngx-sirio-datepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region time -->\r\n              <ng-container *ngSwitchCase=\"'time'\">\r\n                <ngx-sirio-timepicker ariaLabel=\"time\"\r\n                                      [label]=\"evaluateString(component.timeLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #time\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"time\">\r\n                </ngx-sirio-timepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checkbox -->\r\n          <ng-container *ngSwitchCase=\"'checkbox'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region toggle -->\r\n              <ng-container *ngSwitchCase=\"'toggle'\">\r\n                <ngx-sirio-toggle ariaLabel=\"checkbox\"\r\n                                  [textHelp]=\"evaluateString(component.description)\"\r\n                                  [textFeedback]=\"getTextFeedback(component)\"\r\n                                  [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                  [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                  [formControlName]=\"component.key\"\r\n                                  validation\r\n                                  [canValidate]=\"true\"\r\n                                  [isWarning]=\"isWarning(component)\"\r\n                                  [showWhenValid]=\"false\"\r\n                                  #toggle\r\n                                  [register]=\"component\"\r\n                                  [componentRef]=\"toggle\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-toggle>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox ariaLabel=\"checkbox\"\r\n                                    [textHelp]=\"evaluateString(component.description)\"\r\n                                    [textFeedback]=\"getTextFeedback(component)\"\r\n                                    [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                    [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                    [formControlName]=\"component.key\"\r\n                                    validation\r\n                                    [canValidate]=\"true\"\r\n                                    [isWarning]=\"isWarning(component)\"\r\n                                    [showWhenValid]=\"false\"\r\n                                    #checkbox\r\n                                    [register]=\"component\"\r\n                                    [componentRef]=\"checkbox\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-checkbox>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region radio -->\r\n          <ng-container *ngSwitchCase=\"'radio'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-radio-group ariaLabel=\"radio\"\r\n                                            [label]=\"evaluateString(component.label)\"\r\n                                            [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                            [textHelp]=\"evaluateString(component.description)\"\r\n                                            [textFeedback]=\"getTextFeedback(component)\"\r\n                                            [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                            [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                            [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                            [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                            [formControlName]=\"component.key\"\r\n                                            validation\r\n                                            [canValidate]=\"true\"\r\n                                            [isWarning]=\"isWarning(component)\"\r\n                                            [showWhenValid]=\"false\"\r\n                                            #chipradio\r\n                                            [register]=\"component\"\r\n                                            [componentRef]=\"chipradio\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"radio\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-radio-group ariaLabel=\"radio\"\r\n                                       [label]=\"evaluateString(component.label)\"\r\n                                       [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                       [textHelp]=\"evaluateString(component.description)\"\r\n                                       [textFeedback]=\"getTextFeedback(component)\"\r\n                                       [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                       [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                       [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                       [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                       [formControlName]=\"component.key\"\r\n                                       validation\r\n                                       [canValidate]=\"true\"\r\n                                       [isWarning]=\"isWarning(component)\"\r\n                                       [showWhenValid]=\"false\"\r\n                                       #radio\r\n                                       [register]=\"component\"\r\n                                       [componentRef]=\"radio\">\r\n                  <ngx-sirio-radio-button *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-radio-button>\r\n                </ngx-sirio-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checklist -->\r\n          <ng-container *ngSwitchCase=\"'checklist'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-checkbox-group ariaLabel=\"checklist\"\r\n                                               [label]=\"evaluateString(component.label)\"\r\n                                               [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                               [textHelp]=\"evaluateString(component.description)\"\r\n                                               [textFeedback]=\"getTextFeedback(component)\"\r\n                                               [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                               [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                               [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                               [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                               [formControlName]=\"component.key\"\r\n                                               validation\r\n                                               [canValidate]=\"true\"\r\n                                               [isWarning]=\"isWarning(component)\"\r\n                                               [showWhenValid]=\"false\"\r\n                                               #chipcheckbox\r\n                                               [register]=\"component\"\r\n                                               [componentRef]=\"chipcheckbox\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"checkbox\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox-group ariaLabel=\"checklist\"\r\n                                          [label]=\"evaluateString(component.label)\"\r\n                                          [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                          [textHelp]=\"evaluateString(component.description)\"\r\n                                          [textFeedback]=\"getTextFeedback(component)\"\r\n                                          [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                          [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                          [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                          [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                          [formControlName]=\"component.key\"\r\n                                          validation\r\n                                          [canValidate]=\"true\"\r\n                                          [isWarning]=\"isWarning(component)\"\r\n                                          [showWhenValid]=\"false\"\r\n                                          #checkbox\r\n                                          [register]=\"component\"\r\n                                          [componentRef]=\"checkbox\">\r\n                  <ngx-sirio-checkbox *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-checkbox>\r\n                </ngx-sirio-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region textarea -->\r\n          <ng-container *ngSwitchCase=\"'textarea'\">\r\n            <ngx-sirio-input type=\"textarea\"\r\n                             ariaLabel=\"textarea\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textarea\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textarea\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region filepicker -->\r\n          <ng-container *ngSwitchCase=\"'filepicker'\">\r\n            <ngx-sirio-file-upload ariaLabel=\"filepicker\"\r\n                                   [label]=\"evaluateString(component.label)\"\r\n                                   [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                   [accept]=\"getMimeTypes(component.accept)\"\r\n                                   [multiple]=\"evaluateBoolean(component.multiple)\"\r\n                                   (fileUploadedEvent)=\"fileUploaded($event)\"\r\n                                   [showFilelist]=\"!component.showDetails\"\r\n                                   [textHelp]=\"evaluateString(component.description)\"\r\n                                   [textFeedback]=\"getTextFeedback(component)\"\r\n                                   [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                   [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                   [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                   [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                   [formControlName]=\"component.key\"\r\n                                   validation\r\n                                   [canValidate]=\"true\"\r\n                                   [isWarning]=\"isWarning(component)\"\r\n                                   [showWhenValid]=\"false\"\r\n                                   #filepicker\r\n                                   [register]=\"component\"\r\n                                   [componentRef]=\"filepicker\">\r\n              <span class=\"fas fa-arrow-up\" aria-hidden=\"true\"></span>\r\n              {{ Texts.Upload }}\r\n            </ngx-sirio-file-upload>\r\n            <ng-container *ngIf=\"component.showDetails\">\r\n              <app-dynamic-fields [formGroup]=\"formGroup\" [rows]=\"createUploadTables(component)\"></app-dynamic-fields>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region text -->\r\n          <ng-container *ngSwitchCase=\"'text'\">\r\n            <div  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                  #text\r\n                  [register]=\"component\"\r\n                  [componentRef]=\"text\">\r\n              <div class=\"flex\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n                <button *ngIf=\"component.tooltip\"\r\n                        class=\"sirio-label-popover fas fa-info-circle\"\r\n                        sirioTooltip\r\n                        [content]=\"evaluateString(component.tooltip)\"></button>\r\n              </div>\r\n            </div>            \r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region html -->\r\n          <ng-container *ngSwitchCase=\"'html'\">\r\n            <div class=\"html-paragraph\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [innerHTML]=\"sanitize(evaluateTemplate(component.content))\"\r\n                 #html\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"html\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region image -->\r\n          <ng-container *ngSwitchCase=\"'image'\">\r\n            <img [src]=\"evaluateString(component.source)\"\r\n                 [alt]=\"evaluateString(component.alt)\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 style=\"width: 100%;height: 100%;\"\r\n                 #image\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"image\">\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region dynamiclist -->\r\n          <ng-container *ngSwitchCase=\"'dynamiclist'\">\r\n            <ng-container [formArrayName]=\"component.path\" [repeat]=\"evaluateNumber(component.repetitions)\">\r\n              <ng-container [ngSwitch]=\"component.subtype\">\r\n                <ng-container *ngIf=\"getFormArray(formGroup.get(component.path)).controls.length > 0\">\r\n                  <!-- #region tab -->\r\n                  <ng-container *ngSwitchCase=\"'tab'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclisttab\">\r\n                      <ngx-sirio-tab [leftArrowLabel]=\"Texts.ScrollLeft\"\r\n                                     [rightArrowLabel]=\"Texts.ScrollRight\"\r\n                                     [tabCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                     #dynamiclisttab>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-tab-item [label]=\"component.label + ' ' + (i + 1)\">\r\n                            <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                            <div [ngClass]=\"{\r\n            'group-top': component.verticalAlignment === 'start',\r\n            'group-center': component.verticalAlignment === 'center',\r\n            'group-bottom': component.verticalAlignment === 'end'}\">\r\n                              <div>\r\n                                <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                              </div>\r\n                              <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                <div style=\"text-align:right\">\r\n                                  <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                </div>\r\n                              </ng-container>\r\n                            </div>\r\n                          </ngx-sirio-tab-item>\r\n                        </ng-container>\r\n                      </ngx-sirio-tab>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region accordion -->\r\n                  <ng-container *ngSwitchCase=\"'accordion'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclistaccordion\">\r\n                      <ngx-sirio-accordion [accordionCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                           #dynamiclistaccordion>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-accordion-panel>\r\n                            <ngx-sirio-accordion-header>\r\n                              <span [innerText]=\"component.label + ' ' + (i + 1)\"></span>\r\n                            </ngx-sirio-accordion-header>\r\n                            <ngx-sirio-accordion-body>\r\n                              <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                              <div [ngClass]=\"{\r\n              'group-top': component.verticalAlignment === 'start',\r\n              'group-center': component.verticalAlignment === 'center',\r\n              'group-bottom': component.verticalAlignment === 'end'}\">\r\n                                <div>\r\n                                  <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                                </div>\r\n                                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                  <div style=\"text-align:right\">\r\n                                    <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                  </div>\r\n                                </ng-container>\r\n                              </div>\r\n                            </ngx-sirio-accordion-body>\r\n                          </ngx-sirio-accordion-panel>\r\n                        </ng-container>\r\n                      </ngx-sirio-accordion>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region default -->\r\n                  <ng-container *ngSwitchDefault>\r\n                    <div [ngClass]=\"{'group-outline': component.showOutline === true}\"\r\n                         #dynamiclist\r\n                         [register]=\"component\"\r\n                         [componentRef]=\"dynamiclist\">\r\n                      <label>{{ evaluateString(component.label) }}</label>\r\n                      <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                        <div [ngClass]=\"{\r\n        'group-top': component.verticalAlignment === 'start',\r\n        'group-center': component.verticalAlignment === 'center',\r\n        'group-bottom': component.verticalAlignment === 'end'}\">\r\n                          <div>\r\n                            <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                          </div>\r\n                          <ng-container *ngIf=\"component.allowAddRemove\">\r\n                            <div style=\"text-align:right\">\r\n                              <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                            </div>\r\n                          </ng-container>\r\n                        </div>\r\n                      </ng-container>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                </ng-container>\r\n                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                  <ngx-sirio-button (click)=\"addNewItem(component)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ Texts.AddItem }}</ngx-sirio-button>\r\n                </ng-container>\r\n              </ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region group -->\r\n          <ng-container *ngSwitchCase=\"'group'\">\r\n            <div [ngClass]=\"{\r\n                 'group-outline': component.showOutline === true,\r\n                 'group-top': component.verticalAlignment === 'start',\r\n                 'group-center': component.verticalAlignment === 'center',\r\n                 'group-bottom': component.verticalAlignment === 'end'}\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label>{{ evaluateString(component.label) }}</label>\r\n              <div #group\r\n                   [register]=\"component\"\r\n                   [componentRef]=\"group\">\r\n                <app-dynamic-fields [formGroup]=\"getFormGroup(getControlFromPath(component.path))\"\r\n                                    [rows]=\"component.rows\"></app-dynamic-fields>\r\n              </div>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region table -->\r\n          <ng-container *ngSwitchCase=\"'table'\">\r\n            <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [gridOptions]=\"getGridOptions(component)\"\r\n                             [rowSource]=\"(getGridData(component) | async) || []\"\r\n                             [style.height.px]=\"component.height\"\r\n                             #table\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"table\" />\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region button -->\r\n          <ng-container *ngSwitchCase=\"'button'\">\r\n            <ngx-sirio-button (clickEvent)=\"clickButton(component, $event)\"\r\n                              [color]=\"evaluateColor(component.color)\"\r\n                              [icon]=\"evaluateString(component.icon)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [disabled]=\"evaluateBoolean(component.disabled)\"\r\n                              #button\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"button\">\r\n              {{ evaluateString(component.label) }}\r\n            </ngx-sirio-button>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region separator -->\r\n          <ng-container *ngSwitchCase=\"'separator'\">\r\n            <div class=\"separator\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 #separator\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"separator\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region spacer -->\r\n          <ng-container *ngSwitchCase=\"'spacer'\">\r\n            <div style=\"width: 100%\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [style.height.px]=\"component.height\"\r\n                 #spacer\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"spacer\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region iframe -->\r\n          <ng-container *ngSwitchCase=\"'iframe'\">\r\n            <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label [for]=\"component.id\">{{ evaluateString(component.label) }}</label>\r\n              <iframe [src]=\"evaluateUrl(component.url)\"\r\n                      [title]=\"evaluateString(component.label)\"\r\n                      [style.width]=\"'100%'\"\r\n                      [style.height.px]=\"component.height\"\r\n                      [frameSecurity]=\"component.security\"\r\n                      #iframe\r\n                      [register]=\"component\"\r\n                      [componentRef]=\"iframe\">\r\n              </iframe>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region alert -->\r\n          <ng-container *ngSwitchCase=\"'alert'\">\r\n            <ngx-sirio-alert [type]=\"component.role\"\r\n                             [labelClose]=\"Texts.Close\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             #alert\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"alert\">\r\n              <ngx-sirio-alert-message>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-alert-message>\r\n            </ngx-sirio-alert>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region notice -->\r\n          <ng-container *ngSwitchCase=\"'notice'\">\r\n            <ngx-sirio-notify [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              #notice\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"notice\">\r\n              <ngx-sirio-notify-body [title]=\"evaluateString(component.title)\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-notify-body>\r\n            </ngx-sirio-notify>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region range -->\r\n          <ng-container *ngSwitchCase=\"'range'\">\r\n            <ngx-sirio-slider [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              [min]=\"evaluateNumber(component.range?.min) ?? 0\"\r\n                              [max]=\"evaluateNumber(component.range?.max) ?? 0\"\r\n                              #range\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"range\">\r\n            </ngx-sirio-slider>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region tooltip -->\r\n          <ng-container *ngSwitchCase=\"'tooltip'\">\r\n            <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                    [sirioTooltip]=\"evaluateString(component.title)\"\r\n                    [content]=\"evaluateString(component.text)\"\r\n                    #tooltip\r\n                    [register]=\"component\"\r\n                    [componentRef]=\"tooltip\"></button>\r\n          </ng-container>\r\n          <!-- #endregion -->                    \r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".flex{display:flex}.field-set{align-items:center}.field-set>div{margin-top:10px;margin-bottom:10px}.separator{border-bottom:2px solid #d9e4f7;width:100%;margin:10px 0}.group-outline{border:1px solid #d9e4f7;padding:15px;margin-top:2px;margin-bottom:2px}.group-top .row{align-items:baseline}.group-center .row{align-items:center}.group-bottom .row{align-items:end}.text-paragraph p{margin-bottom:0!important}.sirio-control.ng-invalid .sirio-form-feedback{color:#aa224f;display:inline-block}.sirio-control.ng-invalid .sirio-input-group-text{color:#aa224f;border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label{color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label:before,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label{color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:before,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:after,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:after{background-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-upload.sirio-is-invalid button{background-color:#aa224f;border-color:#aa224f}.sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.ag-cell-value button.sirio-btn.sirio-btn-icon{padding:0}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}\n"], dependencies: [{ kind: "component", type: DynamicFieldsComponent, selector: "app-dynamic-fields", inputs: ["rows", "formGroup"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i9.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i9.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i9.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: AdornerDirective, selector: "[prefixAdorner], [suffixAdorner]", inputs: ["prefixAdorner", "suffixAdorner"] }, { kind: "directive", type: DisableDirective, selector: "[disableControl], [readonly]", inputs: ["disableControl", "readonly"] }, { kind: "directive", type: DisplayDirective, selector: "[hide], [show]", inputs: ["hide", "show"] }, { kind: "directive", type: FrameSecurityDirective, selector: "[frameSecurity]", inputs: ["frameSecurity"] }, { kind: "directive", type: DropdownDirective, selector: "[dropdown]" }, { kind: "directive", type: UpdateBlurDirective, selector: "[updateBlur]" }, { kind: "directive", type: RepeatDirective, selector: "[repeat]", inputs: ["repeat"] }, { kind: "directive", type: TabDirective, selector: "[tabCount]", inputs: ["tabCount"] }, { kind: "directive", type: GridDirective, selector: "[rowSource]", inputs: ["rowSource"] }, { kind: "directive", type: RegisterDirective, selector: "[register]", inputs: ["register", "componentRef"] }, { kind: "directive", type: AccordionDirective, selector: "[accordionCount]", inputs: ["accordionCount"] }, { kind: "component", type: SirioInputComponent, selector: "ngx-sirio-input", inputs: ["disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "type", "name", "placeholder", "textHelp", "textFeedback", "rows", "cols", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "role"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "directive", type: SirioValidationDirective, selector: "[validation]", inputs: ["canValidate", "isWarning", "showWhenValid"] }, { kind: "component", type: SirioSelectComponent, selector: "ngx-sirio-select", inputs: ["placeholder", "disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "isMultiple", "textHelp", "textFeedback", "ariaLabel", "ariaInvalid", "ariaDescribedBy"], outputs: ["focusEvent", "blurEvent", "keydownEvent"] }, { kind: "component", type: SirioSelectOptionComponent, selector: "ngx-sirio-select-option", inputs: ["value"], outputs: ["optionSelected", "blurEvent"] }, { kind: "component", type: SirioSelectPanelComponent, selector: "ngx-sirio-select-panel", outputs: ["optionSelected", "panelOpened", "panelClosed"] }, { kind: "component", type: SirioCheckboxGroupComponent, selector: "ngx-sirio-checkbox-group", inputs: ["textHelp", "textFeedback", "label", "labelPopover", "ariaLabelPopoverButton", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioCheckboxComponent, selector: "ngx-sirio-checkbox", inputs: ["disabled", "name", "textHelp", "textFeedback", "value", "ariaInvalid", "ariaDescribedBy", "disabledState", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioDatepickerComponent, selector: "ngx-sirio-datepicker", inputs: ["name", "placeholder", "textHelp", "textFeedback", "label", "labelPopover", "ariaLabelPopoverButton", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "value", "disabledState"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent", "datechangeEvent"] }, { kind: "component", type: SirioTimepickerComponent, selector: "ngx-sirio-timepicker", inputs: ["name", "label", "labelPopover", "ariaLabelPopoverButton", "placeholder", "textHelp", "textFeedback", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "component", type: SirioRadioGroupComponent, selector: "ngx-sirio-radio-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioRadioButtonComponent, selector: "ngx-sirio-radio-button", inputs: ["disabledState", "label", "name", "textHelp", "textFeedback", "ariaInvalid", "ariaDescribedBy", "value", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioTabComponent, selector: "ngx-sirio-tab", inputs: ["isVertical", "isNavLine", "leftArrowLabel", "rightArrowLabel", "tabActive"], outputs: ["tabChange"] }, { kind: "component", type: SirioTabItemComponent, selector: "ngx-sirio-tab-item", inputs: ["label", "disabled", "icon"] }, { kind: "component", type: SirioAccordionComponent, selector: "ngx-sirio-accordion", inputs: ["dark"] }, { kind: "component", type: SirioAccordionPanelComponent, selector: "ngx-sirio-accordion-panel", inputs: ["active", "disabled"], outputs: ["opened", "closed"] }, { kind: "component", type: SirioAccordionHeaderComponent, selector: "ngx-sirio-accordion-header" }, { kind: "component", type: SirioAccordionBodyComponent, selector: "ngx-sirio-accordion-body" }, { kind: "component", type: SirioButtonComponent, selector: "ngx-sirio-button", inputs: ["ariaExpanded", "ariaControls", "ariaActivedescendant", "ariaHaspopup", "ariaLabel", "ariaRequired", "ariaInvalid", "ariaDescribedby", "icon", "title", "role", "color", "isFloating", "isExtended", "isLight", "isSmall", "disabled", "isDropdown", "type", "dismissType", "isBtnBlock"], outputs: ["clickEvent", "focusEvent", "blurEvent"] }, { kind: "component", type: SirioFileUploadComponent, selector: "ngx-sirio-file-upload", inputs: ["multiple", "color", "accept", "maxFiles", "showFilelist", "label", "labelPopover", "ariaLabelPopoverButton", "name", "textHelp", "textFeedback", "ariaLabel", "ariaLabelDeleteFileButton", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "fileUploadedEvent", "fileDeletedEvent", "uploadErrorEvent", "blurEvent"] }, { kind: "component", type: SirioToggleComponent, selector: "ngx-sirio-toggle", inputs: ["name", "textHelp", "textFeedback", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioChipCheckboxGroupComponent, selector: "ngx-sirio-chip-checkbox-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioChipRadioGroupComponent, selector: "ngx-sirio-chip-radio-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioInputChipComponent, selector: "ngx-sirio-input-chip", inputs: ["disabledState", "name", "textHelp", "textFeedback", "value", "ariaInvalid", "ariaDescribedBy", "type", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "ngmodule", type: SirioTableModule }, { kind: "component", type: SirioAlertComponent, selector: "ngx-sirio-alert", inputs: ["type", "labelClose", "isVisible"], outputs: ["closeEvent"] }, { kind: "component", type: SirioAlertMessageComponent, selector: "ngx-sirio-alert-message" }, { kind: "component", type: SirioSliderComponent, selector: "ngx-sirio-slider", inputs: ["disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "description", "min", "max", "ariaInvalid", "ariaDescribedBy", "textHelp", "textFeedback"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "component", type: SirioNotifyComponent, selector: "ngx-sirio-notify", inputs: ["isDark"] }, { kind: "component", type: SirioNotifyBodyComponent, selector: "ngx-sirio-notify-body", inputs: ["title"] }, { kind: "directive", type: SirioTooltipDirective, selector: "[sirioTooltip]", inputs: ["sirioTooltip", "content", "hasAction", "hasPopover", "actionLabel", "actionIconClass", "clickOutside", "position", "customTemplate"], outputs: ["clickEvent"] }, { kind: "component", type: AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }], encapsulation: i0.ViewEncapsulation.None });
+        ], ngImport: i0, template: "<ng-container *ngFor=\"let row of rows\" [formGroup]=\"formGroup\">\r\n  <div class=\"row field-set\">\r\n    <ng-container *ngFor=\"let component of row.components\">\r\n      <ng-container [ngSwitch]=\"component.type\">\r\n        <div [formGroup]=\"formGroup\" [class]=\"getClass(component)\">\r\n          <!-- #region textfield -->\r\n          <ng-container *ngSwitchCase=\"'textfield'\">\r\n            <ngx-sirio-input type=\"text\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textfield\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textfield\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region select -->\r\n          <ng-container *ngSwitchCase=\"'select'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              dropdown\r\n                              #select\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"select\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"Texts.TypeToSearch\"></ngx-sirio-input>\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region taglist -->\r\n          <ng-container *ngSwitchCase=\"'taglist'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [isMultiple]=\"true\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              #taglist\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"taglist\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region number -->\r\n          <ng-container *ngSwitchCase=\"'number'\">\r\n            <ngx-sirio-input type=\"number\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #number\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"number\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region datetime -->\r\n          <ng-container *ngSwitchCase=\"'datetime'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region date -->\r\n              <ng-container *ngSwitchCase=\"'date'\">\r\n                <ngx-sirio-datepicker ariaLabel=\"date\"\r\n                                      [label]=\"evaluateString(component.dateLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #date\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"date\">\r\n                </ngx-sirio-datepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region time -->\r\n              <ng-container *ngSwitchCase=\"'time'\">\r\n                <ngx-sirio-timepicker ariaLabel=\"time\"\r\n                                      [label]=\"evaluateString(component.timeLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #time\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"time\">\r\n                </ngx-sirio-timepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checkbox -->\r\n          <ng-container *ngSwitchCase=\"'checkbox'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region toggle -->\r\n              <ng-container *ngSwitchCase=\"'toggle'\">\r\n                <ngx-sirio-toggle ariaLabel=\"checkbox\"\r\n                                  [textHelp]=\"evaluateString(component.description)\"\r\n                                  [textFeedback]=\"getTextFeedback(component)\"\r\n                                  [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                  [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                  [formControlName]=\"component.key\"\r\n                                  validation\r\n                                  [canValidate]=\"true\"\r\n                                  [isWarning]=\"isWarning(component)\"\r\n                                  [showWhenValid]=\"false\"\r\n                                  #toggle\r\n                                  [register]=\"component\"\r\n                                  [componentRef]=\"toggle\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-toggle>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox ariaLabel=\"checkbox\"\r\n                                    [textHelp]=\"evaluateString(component.description)\"\r\n                                    [textFeedback]=\"getTextFeedback(component)\"\r\n                                    [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                    [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                    [formControlName]=\"component.key\"\r\n                                    validation\r\n                                    [canValidate]=\"true\"\r\n                                    [isWarning]=\"isWarning(component)\"\r\n                                    [showWhenValid]=\"false\"\r\n                                    #checkbox\r\n                                    [register]=\"component\"\r\n                                    [componentRef]=\"checkbox\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-checkbox>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region radio -->\r\n          <ng-container *ngSwitchCase=\"'radio'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-radio-group ariaLabel=\"radio\"\r\n                                            [label]=\"evaluateString(component.label)\"\r\n                                            [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                            [textHelp]=\"evaluateString(component.description)\"\r\n                                            [textFeedback]=\"getTextFeedback(component)\"\r\n                                            [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                            [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                            [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                            [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                            [formControlName]=\"component.key\"\r\n                                            validation\r\n                                            [canValidate]=\"true\"\r\n                                            [isWarning]=\"isWarning(component)\"\r\n                                            [showWhenValid]=\"false\"\r\n                                            #chipradio\r\n                                            [register]=\"component\"\r\n                                            [componentRef]=\"chipradio\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"radio\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-radio-group ariaLabel=\"radio\"\r\n                                       [label]=\"evaluateString(component.label)\"\r\n                                       [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                       [textHelp]=\"evaluateString(component.description)\"\r\n                                       [textFeedback]=\"getTextFeedback(component)\"\r\n                                       [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                       [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                       [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                       [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                       [formControlName]=\"component.key\"\r\n                                       validation\r\n                                       [canValidate]=\"true\"\r\n                                       [isWarning]=\"isWarning(component)\"\r\n                                       [showWhenValid]=\"false\"\r\n                                       #radio\r\n                                       [register]=\"component\"\r\n                                       [componentRef]=\"radio\">\r\n                  <ngx-sirio-radio-button *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-radio-button>\r\n                </ngx-sirio-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checklist -->\r\n          <ng-container *ngSwitchCase=\"'checklist'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-checkbox-group ariaLabel=\"checklist\"\r\n                                               [label]=\"evaluateString(component.label)\"\r\n                                               [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                               [textHelp]=\"evaluateString(component.description)\"\r\n                                               [textFeedback]=\"getTextFeedback(component)\"\r\n                                               [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                               [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                               [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                               [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                               [formControlName]=\"component.key\"\r\n                                               validation\r\n                                               [canValidate]=\"true\"\r\n                                               [isWarning]=\"isWarning(component)\"\r\n                                               [showWhenValid]=\"false\"\r\n                                               #chipcheckbox\r\n                                               [register]=\"component\"\r\n                                               [componentRef]=\"chipcheckbox\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"checkbox\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox-group ariaLabel=\"checklist\"\r\n                                          [label]=\"evaluateString(component.label)\"\r\n                                          [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                          [textHelp]=\"evaluateString(component.description)\"\r\n                                          [textFeedback]=\"getTextFeedback(component)\"\r\n                                          [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                          [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                          [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                          [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                          [formControlName]=\"component.key\"\r\n                                          validation\r\n                                          [canValidate]=\"true\"\r\n                                          [isWarning]=\"isWarning(component)\"\r\n                                          [showWhenValid]=\"false\"\r\n                                          #checkbox\r\n                                          [register]=\"component\"\r\n                                          [componentRef]=\"checkbox\">\r\n                  <ngx-sirio-checkbox *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-checkbox>\r\n                </ngx-sirio-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region textarea -->\r\n          <ng-container *ngSwitchCase=\"'textarea'\">\r\n            <ngx-sirio-input type=\"textarea\"\r\n                             ariaLabel=\"textarea\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textarea\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textarea\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region filepicker -->\r\n          <ng-container *ngSwitchCase=\"'filepicker'\">\r\n            <ngx-sirio-file-upload ariaLabel=\"filepicker\"\r\n                                   [label]=\"evaluateString(component.label)\"\r\n                                   [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                   [accept]=\"getMimeTypes(component.accept)\"\r\n                                   [multiple]=\"evaluateBoolean(component.multiple)\"\r\n                                   (fileUploadedEvent)=\"fileUploaded($event)\"\r\n                                   [showFilelist]=\"!component.showDetails\"\r\n                                   [textHelp]=\"evaluateString(component.description)\"\r\n                                   [textFeedback]=\"getTextFeedback(component)\"\r\n                                   [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                   [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                   [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                   [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                   [formControlName]=\"component.key\"\r\n                                   validation\r\n                                   [canValidate]=\"true\"\r\n                                   [isWarning]=\"isWarning(component)\"\r\n                                   [showWhenValid]=\"false\"\r\n                                   #filepicker\r\n                                   [register]=\"component\"\r\n                                   [componentRef]=\"filepicker\">\r\n              <span class=\"fas fa-arrow-up\" aria-hidden=\"true\"></span>\r\n              {{ Texts.Upload }}\r\n            </ngx-sirio-file-upload>\r\n            <ng-container *ngIf=\"component.showDetails\">\r\n              <app-dynamic-fields [formGroup]=\"formGroup\" [rows]=\"createUploadTables(component)\"></app-dynamic-fields>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region text -->\r\n          <ng-container *ngSwitchCase=\"'text'\">\r\n            <div  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                  #text\r\n                  [register]=\"component\"\r\n                  [componentRef]=\"text\">\r\n              <div class=\"flex\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n                <ng-container *ngIf=\"component.tooltip\">\r\n                  <app-template-wrapper #tooltipWrapper [template]=\"tooltipTemplate\" [context]=\"{ component: component }\"></app-template-wrapper>\r\n                  <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                          sirioTooltip\r\n                          [hasPopover]=\"true\"\r\n                          [customTemplate]=\"tooltipWrapper.getTemplateRef()\"></button>\r\n                  <ng-template #tooltipTemplate let-component=\"component\">\r\n                    <div class=\"sirio-tooltip-body\">\r\n                      <div class=\"text-paragraph\"\r\n                           [innerHTML]=\"toHTML(evaluateTemplate(component.tooltip))\">\r\n                      </div>\r\n                    </div>\r\n                  </ng-template>\r\n                </ng-container>\r\n              </div>\r\n            </div>            \r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region html -->\r\n          <ng-container *ngSwitchCase=\"'html'\">\r\n            <div class=\"html-paragraph\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [innerHTML]=\"sanitize(evaluateTemplate(component.content))\"\r\n                 #html\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"html\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region image -->\r\n          <ng-container *ngSwitchCase=\"'image'\">\r\n            <img [src]=\"evaluateString(component.source)\"\r\n                 [alt]=\"evaluateString(component.alt)\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 style=\"width: 100%;height: 100%;\"\r\n                 #image\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"image\">\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region dynamiclist -->\r\n          <ng-container *ngSwitchCase=\"'dynamiclist'\">\r\n            <ng-container [formArrayName]=\"component.path\" [repeat]=\"evaluateNumber(component.repetitions)\">\r\n              <ng-container [ngSwitch]=\"component.subtype\">\r\n                <ng-container *ngIf=\"getFormArray(formGroup.get(component.path)).controls.length > 0\">\r\n                  <!-- #region tab -->\r\n                  <ng-container *ngSwitchCase=\"'tab'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclisttab\">\r\n                      <ngx-sirio-tab [leftArrowLabel]=\"Texts.ScrollLeft\"\r\n                                     [rightArrowLabel]=\"Texts.ScrollRight\"\r\n                                     [tabCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                     #dynamiclisttab>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-tab-item [label]=\"component.label + ' ' + (i + 1)\">\r\n                            <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                            <div [ngClass]=\"{\r\n            'group-top': component.verticalAlignment === 'start',\r\n            'group-center': component.verticalAlignment === 'center',\r\n            'group-bottom': component.verticalAlignment === 'end'}\">\r\n                              <div>\r\n                                <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                              </div>\r\n                              <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                <div style=\"text-align:right\">\r\n                                  <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                </div>\r\n                              </ng-container>\r\n                            </div>\r\n                          </ngx-sirio-tab-item>\r\n                        </ng-container>\r\n                      </ngx-sirio-tab>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region accordion -->\r\n                  <ng-container *ngSwitchCase=\"'accordion'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclistaccordion\">\r\n                      <ngx-sirio-accordion [accordionCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                           #dynamiclistaccordion>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-accordion-panel>\r\n                            <ngx-sirio-accordion-header>\r\n                              <span [innerText]=\"component.label + ' ' + (i + 1)\"></span>\r\n                            </ngx-sirio-accordion-header>\r\n                            <ngx-sirio-accordion-body>\r\n                              <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                              <div [ngClass]=\"{\r\n              'group-top': component.verticalAlignment === 'start',\r\n              'group-center': component.verticalAlignment === 'center',\r\n              'group-bottom': component.verticalAlignment === 'end'}\">\r\n                                <div>\r\n                                  <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                                </div>\r\n                                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                  <div style=\"text-align:right\">\r\n                                    <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                  </div>\r\n                                </ng-container>\r\n                              </div>\r\n                            </ngx-sirio-accordion-body>\r\n                          </ngx-sirio-accordion-panel>\r\n                        </ng-container>\r\n                      </ngx-sirio-accordion>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region default -->\r\n                  <ng-container *ngSwitchDefault>\r\n                    <div [ngClass]=\"{'group-outline': component.showOutline === true}\"\r\n                         #dynamiclist\r\n                         [register]=\"component\"\r\n                         [componentRef]=\"dynamiclist\">\r\n                      <label>{{ evaluateString(component.label) }}</label>\r\n                      <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                        <div [ngClass]=\"{\r\n        'group-top': component.verticalAlignment === 'start',\r\n        'group-center': component.verticalAlignment === 'center',\r\n        'group-bottom': component.verticalAlignment === 'end'}\">\r\n                          <div>\r\n                            <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                          </div>\r\n                          <ng-container *ngIf=\"component.allowAddRemove\">\r\n                            <div style=\"text-align:right\">\r\n                              <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                            </div>\r\n                          </ng-container>\r\n                        </div>\r\n                      </ng-container>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                </ng-container>\r\n                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                  <ngx-sirio-button (click)=\"addNewItem(component)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ Texts.AddItem }}</ngx-sirio-button>\r\n                </ng-container>\r\n              </ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region group -->\r\n          <ng-container *ngSwitchCase=\"'group'\">\r\n            <div [ngClass]=\"{\r\n                 'group-outline': component.showOutline === true,\r\n                 'group-top': component.verticalAlignment === 'start',\r\n                 'group-center': component.verticalAlignment === 'center',\r\n                 'group-bottom': component.verticalAlignment === 'end'}\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label>{{ evaluateString(component.label) }}</label>\r\n              <div #group\r\n                   [register]=\"component\"\r\n                   [componentRef]=\"group\">\r\n                <app-dynamic-fields [formGroup]=\"getFormGroup(getControlFromPath(component.path))\"\r\n                                    [rows]=\"component.rows\"></app-dynamic-fields>\r\n              </div>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region table -->\r\n          <ng-container *ngSwitchCase=\"'table'\">\r\n            <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [gridOptions]=\"getGridOptions(component)\"\r\n                             [rowSource]=\"(getGridData(component) | async) || []\"\r\n                             [style.height.px]=\"component.height\"\r\n                             #table\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"table\" />\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region button -->\r\n          <ng-container *ngSwitchCase=\"'button'\">\r\n            <ngx-sirio-button (clickEvent)=\"clickButton(component, $event)\"\r\n                              [color]=\"evaluateColor(component.color)\"\r\n                              [icon]=\"evaluateString(component.icon)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [disabled]=\"evaluateBoolean(component.disabled)\"\r\n                              #button\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"button\">\r\n              {{ evaluateString(component.label) }}\r\n            </ngx-sirio-button>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region separator -->\r\n          <ng-container *ngSwitchCase=\"'separator'\">\r\n            <div class=\"separator\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 #separator\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"separator\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region spacer -->\r\n          <ng-container *ngSwitchCase=\"'spacer'\">\r\n            <div style=\"width: 100%\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [style.height.px]=\"component.height\"\r\n                 #spacer\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"spacer\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region iframe -->\r\n          <ng-container *ngSwitchCase=\"'iframe'\">\r\n            <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label [for]=\"component.id\">{{ evaluateString(component.label) }}</label>\r\n              <iframe [src]=\"evaluateUrl(component.url)\"\r\n                      [title]=\"evaluateString(component.label)\"\r\n                      [style.width]=\"'100%'\"\r\n                      [style.height.px]=\"component.height\"\r\n                      [frameSecurity]=\"component.security\"\r\n                      #iframe\r\n                      [register]=\"component\"\r\n                      [componentRef]=\"iframe\">\r\n              </iframe>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region alert -->\r\n          <ng-container *ngSwitchCase=\"'alert'\">\r\n            <ngx-sirio-alert [type]=\"component.role\"\r\n                             [labelClose]=\"Texts.Close\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             #alert\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"alert\">\r\n              <ngx-sirio-alert-message>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-alert-message>\r\n            </ngx-sirio-alert>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region notice -->\r\n          <ng-container *ngSwitchCase=\"'notice'\">\r\n            <ngx-sirio-notify [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              #notice\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"notice\">\r\n              <ngx-sirio-notify-body [title]=\"evaluateString(component.title)\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-notify-body>\r\n            </ngx-sirio-notify>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region range -->\r\n          <ng-container *ngSwitchCase=\"'range'\">\r\n            <ngx-sirio-slider [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              [min]=\"evaluateNumber(component.range?.min) ?? 0\"\r\n                              [max]=\"evaluateNumber(component.range?.max) ?? 0\"\r\n                              #range\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"range\">\r\n            </ngx-sirio-slider>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region tooltip -->\r\n          <ng-container *ngSwitchCase=\"'tooltip'\">\r\n            <app-template-wrapper #tooltipWrapper [template]=\"tooltipTemplate\" [context]=\"{ component: component }\"></app-template-wrapper>\r\n            <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                    sirioTooltip\r\n                    [hasPopover]=\"true\"\r\n                    [customTemplate]=\"tooltipWrapper.getTemplateRef()\"\r\n                    #tooltip\r\n                    [register]=\"component\"\r\n                    [componentRef]=\"tooltip\"></button>\r\n            <ng-template #tooltipTemplate let-component=\"component\">\r\n              <div class=\"sirio-tooltip-body\">\r\n                <p *ngIf=\"component.title\" class=\"sirio-tooltip-heading sirio-space-down\">\r\n                  {{ evaluateString(component.title) }}\r\n                </p>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>                \r\n              </div>\r\n            </ng-template>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".flex{display:flex}.field-set{align-items:center}.field-set>div{margin-top:10px;margin-bottom:10px}.separator{border-bottom:2px solid #d9e4f7;width:100%;margin:10px 0}.group-outline{border:1px solid #d9e4f7;padding:15px;margin-top:2px;margin-bottom:2px}.group-top .row{align-items:baseline}.group-center .row{align-items:center}.group-bottom .row{align-items:end}.text-paragraph p{margin-bottom:0!important}.sirio-control.ng-invalid .sirio-form-feedback{color:#aa224f;display:inline-block}.sirio-control.ng-invalid .sirio-input-group-text{color:#aa224f;border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label{color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label:before,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label{color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:before,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:after,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:after{background-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-upload.sirio-is-invalid button{background-color:#aa224f;border-color:#aa224f}.sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.ag-cell-value button.sirio-btn.sirio-btn-icon{padding:0}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}\n"], dependencies: [{ kind: "component", type: DynamicFieldsComponent, selector: "app-dynamic-fields", inputs: ["rows", "formGroup"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i9.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i9.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i9.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: AdornerDirective, selector: "[prefixAdorner], [suffixAdorner]", inputs: ["prefixAdorner", "suffixAdorner"] }, { kind: "directive", type: DisableDirective, selector: "[disableControl], [readonly]", inputs: ["disableControl", "readonly"] }, { kind: "directive", type: DisplayDirective, selector: "[hide], [show]", inputs: ["hide", "show"] }, { kind: "directive", type: FrameSecurityDirective, selector: "[frameSecurity]", inputs: ["frameSecurity"] }, { kind: "directive", type: DropdownDirective, selector: "[dropdown]" }, { kind: "directive", type: UpdateBlurDirective, selector: "[updateBlur]" }, { kind: "directive", type: RepeatDirective, selector: "[repeat]", inputs: ["repeat"] }, { kind: "directive", type: TabDirective, selector: "[tabCount]", inputs: ["tabCount"] }, { kind: "directive", type: GridDirective, selector: "[rowSource]", inputs: ["rowSource"] }, { kind: "directive", type: RegisterDirective, selector: "[register]", inputs: ["register", "componentRef"] }, { kind: "directive", type: AccordionDirective, selector: "[accordionCount]", inputs: ["accordionCount"] }, { kind: "component", type: SirioInputComponent, selector: "ngx-sirio-input", inputs: ["disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "type", "name", "placeholder", "textHelp", "textFeedback", "rows", "cols", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "role"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "directive", type: SirioValidationDirective, selector: "[validation]", inputs: ["canValidate", "isWarning", "showWhenValid"] }, { kind: "component", type: SirioSelectComponent, selector: "ngx-sirio-select", inputs: ["placeholder", "disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "isMultiple", "textHelp", "textFeedback", "ariaLabel", "ariaInvalid", "ariaDescribedBy"], outputs: ["focusEvent", "blurEvent", "keydownEvent"] }, { kind: "component", type: SirioSelectOptionComponent, selector: "ngx-sirio-select-option", inputs: ["value"], outputs: ["optionSelected", "blurEvent"] }, { kind: "component", type: SirioSelectPanelComponent, selector: "ngx-sirio-select-panel", outputs: ["optionSelected", "panelOpened", "panelClosed"] }, { kind: "component", type: SirioCheckboxGroupComponent, selector: "ngx-sirio-checkbox-group", inputs: ["textHelp", "textFeedback", "label", "labelPopover", "ariaLabelPopoverButton", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioCheckboxComponent, selector: "ngx-sirio-checkbox", inputs: ["disabled", "name", "textHelp", "textFeedback", "value", "ariaInvalid", "ariaDescribedBy", "disabledState", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioDatepickerComponent, selector: "ngx-sirio-datepicker", inputs: ["name", "placeholder", "textHelp", "textFeedback", "label", "labelPopover", "ariaLabelPopoverButton", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "value", "disabledState"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent", "datechangeEvent"] }, { kind: "component", type: SirioTimepickerComponent, selector: "ngx-sirio-timepicker", inputs: ["name", "label", "labelPopover", "ariaLabelPopoverButton", "placeholder", "textHelp", "textFeedback", "ariaLabel", "ariaAutocomplete", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "component", type: SirioRadioGroupComponent, selector: "ngx-sirio-radio-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioRadioButtonComponent, selector: "ngx-sirio-radio-button", inputs: ["disabledState", "label", "name", "textHelp", "textFeedback", "ariaInvalid", "ariaDescribedBy", "value", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioTabComponent, selector: "ngx-sirio-tab", inputs: ["isVertical", "isNavLine", "leftArrowLabel", "rightArrowLabel", "tabActive"], outputs: ["tabChange"] }, { kind: "component", type: SirioTabItemComponent, selector: "ngx-sirio-tab-item", inputs: ["label", "disabled", "icon"] }, { kind: "component", type: SirioAccordionComponent, selector: "ngx-sirio-accordion", inputs: ["dark"] }, { kind: "component", type: SirioAccordionPanelComponent, selector: "ngx-sirio-accordion-panel", inputs: ["active", "disabled"], outputs: ["opened", "closed"] }, { kind: "component", type: SirioAccordionHeaderComponent, selector: "ngx-sirio-accordion-header" }, { kind: "component", type: SirioAccordionBodyComponent, selector: "ngx-sirio-accordion-body" }, { kind: "component", type: SirioButtonComponent, selector: "ngx-sirio-button", inputs: ["ariaExpanded", "ariaControls", "ariaActivedescendant", "ariaHaspopup", "ariaLabel", "ariaRequired", "ariaInvalid", "ariaDescribedby", "icon", "title", "role", "color", "isFloating", "isExtended", "isLight", "isSmall", "disabled", "isDropdown", "type", "dismissType", "isBtnBlock"], outputs: ["clickEvent", "focusEvent", "blurEvent"] }, { kind: "component", type: SirioFileUploadComponent, selector: "ngx-sirio-file-upload", inputs: ["multiple", "color", "accept", "maxFiles", "showFilelist", "label", "labelPopover", "ariaLabelPopoverButton", "name", "textHelp", "textFeedback", "ariaLabel", "ariaLabelDeleteFileButton", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "fileUploadedEvent", "fileDeletedEvent", "uploadErrorEvent", "blurEvent"] }, { kind: "component", type: SirioToggleComponent, selector: "ngx-sirio-toggle", inputs: ["name", "textHelp", "textFeedback", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioChipCheckboxGroupComponent, selector: "ngx-sirio-chip-checkbox-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioChipRadioGroupComponent, selector: "ngx-sirio-chip-radio-group", inputs: ["label", "labelPopover", "ariaLabelPopoverButton", "textHelp", "textFeedback", "items", "ariaLabel", "ariaInvalid", "ariaDescribedBy", "disabledState", "value"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "component", type: SirioInputChipComponent, selector: "ngx-sirio-input-chip", inputs: ["disabledState", "name", "textHelp", "textFeedback", "value", "ariaInvalid", "ariaDescribedBy", "type", "checked"], outputs: ["focusEvent", "blurEvent", "changeEvent"] }, { kind: "ngmodule", type: SirioTableModule }, { kind: "component", type: SirioAlertComponent, selector: "ngx-sirio-alert", inputs: ["type", "labelClose", "isVisible"], outputs: ["closeEvent"] }, { kind: "component", type: SirioAlertMessageComponent, selector: "ngx-sirio-alert-message" }, { kind: "component", type: SirioSliderComponent, selector: "ngx-sirio-slider", inputs: ["disabledState", "value", "label", "labelPopover", "ariaLabelPopoverButton", "description", "min", "max", "ariaInvalid", "ariaDescribedBy", "textHelp", "textFeedback"], outputs: ["focusEvent", "inputEvent", "blurEvent", "keyupEvent", "keydownEvent"] }, { kind: "component", type: SirioNotifyComponent, selector: "ngx-sirio-notify", inputs: ["isDark"] }, { kind: "component", type: SirioNotifyBodyComponent, selector: "ngx-sirio-notify-body", inputs: ["title"] }, { kind: "directive", type: SirioTooltipDirective, selector: "[sirioTooltip]", inputs: ["sirioTooltip", "content", "hasAction", "hasPopover", "actionLabel", "actionIconClass", "clickOutside", "position", "customTemplate"], outputs: ["clickEvent"] }, { kind: "component", type: TemplateWrapperComponent, selector: "app-template-wrapper", inputs: ["template", "context"] }, { kind: "component", type: AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DynamicFieldsComponent, decorators: [{
             type: Component,
@@ -2469,10 +2512,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         SirioAlertComponent, SirioAlertMessageComponent, SirioSliderComponent,
                         SirioNotifyComponent, SirioNotifyBodyComponent, SirioNotifyActionComponent, SirioNotifyLinkComponent,
                         SirioTooltipDirective,
+                        TemplateWrapperComponent,
                         AgGridAngular], providers: [
                         RegisterService,
                         ProgrammabilityService
-                    ], encapsulation: ViewEncapsulation.None, template: "<ng-container *ngFor=\"let row of rows\" [formGroup]=\"formGroup\">\r\n  <div class=\"row field-set\">\r\n    <ng-container *ngFor=\"let component of row.components\">\r\n      <ng-container [ngSwitch]=\"component.type\">\r\n        <div [formGroup]=\"formGroup\" [class]=\"getClass(component)\">\r\n          <!-- #region textfield -->\r\n          <ng-container *ngSwitchCase=\"'textfield'\">\r\n            <ngx-sirio-input type=\"text\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textfield\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textfield\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region select -->\r\n          <ng-container *ngSwitchCase=\"'select'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              dropdown\r\n                              #select\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"select\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"Texts.TypeToSearch\"></ngx-sirio-input>\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region taglist -->\r\n          <ng-container *ngSwitchCase=\"'taglist'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [isMultiple]=\"true\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              #taglist\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"taglist\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region number -->\r\n          <ng-container *ngSwitchCase=\"'number'\">\r\n            <ngx-sirio-input type=\"number\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #number\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"number\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region datetime -->\r\n          <ng-container *ngSwitchCase=\"'datetime'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region date -->\r\n              <ng-container *ngSwitchCase=\"'date'\">\r\n                <ngx-sirio-datepicker ariaLabel=\"date\"\r\n                                      [label]=\"evaluateString(component.dateLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #date\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"date\">\r\n                </ngx-sirio-datepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region time -->\r\n              <ng-container *ngSwitchCase=\"'time'\">\r\n                <ngx-sirio-timepicker ariaLabel=\"time\"\r\n                                      [label]=\"evaluateString(component.timeLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #time\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"time\">\r\n                </ngx-sirio-timepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checkbox -->\r\n          <ng-container *ngSwitchCase=\"'checkbox'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region toggle -->\r\n              <ng-container *ngSwitchCase=\"'toggle'\">\r\n                <ngx-sirio-toggle ariaLabel=\"checkbox\"\r\n                                  [textHelp]=\"evaluateString(component.description)\"\r\n                                  [textFeedback]=\"getTextFeedback(component)\"\r\n                                  [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                  [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                  [formControlName]=\"component.key\"\r\n                                  validation\r\n                                  [canValidate]=\"true\"\r\n                                  [isWarning]=\"isWarning(component)\"\r\n                                  [showWhenValid]=\"false\"\r\n                                  #toggle\r\n                                  [register]=\"component\"\r\n                                  [componentRef]=\"toggle\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-toggle>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox ariaLabel=\"checkbox\"\r\n                                    [textHelp]=\"evaluateString(component.description)\"\r\n                                    [textFeedback]=\"getTextFeedback(component)\"\r\n                                    [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                    [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                    [formControlName]=\"component.key\"\r\n                                    validation\r\n                                    [canValidate]=\"true\"\r\n                                    [isWarning]=\"isWarning(component)\"\r\n                                    [showWhenValid]=\"false\"\r\n                                    #checkbox\r\n                                    [register]=\"component\"\r\n                                    [componentRef]=\"checkbox\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-checkbox>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region radio -->\r\n          <ng-container *ngSwitchCase=\"'radio'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-radio-group ariaLabel=\"radio\"\r\n                                            [label]=\"evaluateString(component.label)\"\r\n                                            [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                            [textHelp]=\"evaluateString(component.description)\"\r\n                                            [textFeedback]=\"getTextFeedback(component)\"\r\n                                            [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                            [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                            [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                            [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                            [formControlName]=\"component.key\"\r\n                                            validation\r\n                                            [canValidate]=\"true\"\r\n                                            [isWarning]=\"isWarning(component)\"\r\n                                            [showWhenValid]=\"false\"\r\n                                            #chipradio\r\n                                            [register]=\"component\"\r\n                                            [componentRef]=\"chipradio\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"radio\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-radio-group ariaLabel=\"radio\"\r\n                                       [label]=\"evaluateString(component.label)\"\r\n                                       [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                       [textHelp]=\"evaluateString(component.description)\"\r\n                                       [textFeedback]=\"getTextFeedback(component)\"\r\n                                       [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                       [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                       [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                       [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                       [formControlName]=\"component.key\"\r\n                                       validation\r\n                                       [canValidate]=\"true\"\r\n                                       [isWarning]=\"isWarning(component)\"\r\n                                       [showWhenValid]=\"false\"\r\n                                       #radio\r\n                                       [register]=\"component\"\r\n                                       [componentRef]=\"radio\">\r\n                  <ngx-sirio-radio-button *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-radio-button>\r\n                </ngx-sirio-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checklist -->\r\n          <ng-container *ngSwitchCase=\"'checklist'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-checkbox-group ariaLabel=\"checklist\"\r\n                                               [label]=\"evaluateString(component.label)\"\r\n                                               [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                               [textHelp]=\"evaluateString(component.description)\"\r\n                                               [textFeedback]=\"getTextFeedback(component)\"\r\n                                               [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                               [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                               [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                               [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                               [formControlName]=\"component.key\"\r\n                                               validation\r\n                                               [canValidate]=\"true\"\r\n                                               [isWarning]=\"isWarning(component)\"\r\n                                               [showWhenValid]=\"false\"\r\n                                               #chipcheckbox\r\n                                               [register]=\"component\"\r\n                                               [componentRef]=\"chipcheckbox\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"checkbox\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox-group ariaLabel=\"checklist\"\r\n                                          [label]=\"evaluateString(component.label)\"\r\n                                          [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                          [textHelp]=\"evaluateString(component.description)\"\r\n                                          [textFeedback]=\"getTextFeedback(component)\"\r\n                                          [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                          [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                          [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                          [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                          [formControlName]=\"component.key\"\r\n                                          validation\r\n                                          [canValidate]=\"true\"\r\n                                          [isWarning]=\"isWarning(component)\"\r\n                                          [showWhenValid]=\"false\"\r\n                                          #checkbox\r\n                                          [register]=\"component\"\r\n                                          [componentRef]=\"checkbox\">\r\n                  <ngx-sirio-checkbox *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-checkbox>\r\n                </ngx-sirio-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region textarea -->\r\n          <ng-container *ngSwitchCase=\"'textarea'\">\r\n            <ngx-sirio-input type=\"textarea\"\r\n                             ariaLabel=\"textarea\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textarea\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textarea\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region filepicker -->\r\n          <ng-container *ngSwitchCase=\"'filepicker'\">\r\n            <ngx-sirio-file-upload ariaLabel=\"filepicker\"\r\n                                   [label]=\"evaluateString(component.label)\"\r\n                                   [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                   [accept]=\"getMimeTypes(component.accept)\"\r\n                                   [multiple]=\"evaluateBoolean(component.multiple)\"\r\n                                   (fileUploadedEvent)=\"fileUploaded($event)\"\r\n                                   [showFilelist]=\"!component.showDetails\"\r\n                                   [textHelp]=\"evaluateString(component.description)\"\r\n                                   [textFeedback]=\"getTextFeedback(component)\"\r\n                                   [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                   [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                   [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                   [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                   [formControlName]=\"component.key\"\r\n                                   validation\r\n                                   [canValidate]=\"true\"\r\n                                   [isWarning]=\"isWarning(component)\"\r\n                                   [showWhenValid]=\"false\"\r\n                                   #filepicker\r\n                                   [register]=\"component\"\r\n                                   [componentRef]=\"filepicker\">\r\n              <span class=\"fas fa-arrow-up\" aria-hidden=\"true\"></span>\r\n              {{ Texts.Upload }}\r\n            </ngx-sirio-file-upload>\r\n            <ng-container *ngIf=\"component.showDetails\">\r\n              <app-dynamic-fields [formGroup]=\"formGroup\" [rows]=\"createUploadTables(component)\"></app-dynamic-fields>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region text -->\r\n          <ng-container *ngSwitchCase=\"'text'\">\r\n            <div  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                  #text\r\n                  [register]=\"component\"\r\n                  [componentRef]=\"text\">\r\n              <div class=\"flex\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n                <button *ngIf=\"component.tooltip\"\r\n                        class=\"sirio-label-popover fas fa-info-circle\"\r\n                        sirioTooltip\r\n                        [content]=\"evaluateString(component.tooltip)\"></button>\r\n              </div>\r\n            </div>            \r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region html -->\r\n          <ng-container *ngSwitchCase=\"'html'\">\r\n            <div class=\"html-paragraph\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [innerHTML]=\"sanitize(evaluateTemplate(component.content))\"\r\n                 #html\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"html\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region image -->\r\n          <ng-container *ngSwitchCase=\"'image'\">\r\n            <img [src]=\"evaluateString(component.source)\"\r\n                 [alt]=\"evaluateString(component.alt)\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 style=\"width: 100%;height: 100%;\"\r\n                 #image\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"image\">\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region dynamiclist -->\r\n          <ng-container *ngSwitchCase=\"'dynamiclist'\">\r\n            <ng-container [formArrayName]=\"component.path\" [repeat]=\"evaluateNumber(component.repetitions)\">\r\n              <ng-container [ngSwitch]=\"component.subtype\">\r\n                <ng-container *ngIf=\"getFormArray(formGroup.get(component.path)).controls.length > 0\">\r\n                  <!-- #region tab -->\r\n                  <ng-container *ngSwitchCase=\"'tab'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclisttab\">\r\n                      <ngx-sirio-tab [leftArrowLabel]=\"Texts.ScrollLeft\"\r\n                                     [rightArrowLabel]=\"Texts.ScrollRight\"\r\n                                     [tabCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                     #dynamiclisttab>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-tab-item [label]=\"component.label + ' ' + (i + 1)\">\r\n                            <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                            <div [ngClass]=\"{\r\n            'group-top': component.verticalAlignment === 'start',\r\n            'group-center': component.verticalAlignment === 'center',\r\n            'group-bottom': component.verticalAlignment === 'end'}\">\r\n                              <div>\r\n                                <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                              </div>\r\n                              <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                <div style=\"text-align:right\">\r\n                                  <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                </div>\r\n                              </ng-container>\r\n                            </div>\r\n                          </ngx-sirio-tab-item>\r\n                        </ng-container>\r\n                      </ngx-sirio-tab>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region accordion -->\r\n                  <ng-container *ngSwitchCase=\"'accordion'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclistaccordion\">\r\n                      <ngx-sirio-accordion [accordionCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                           #dynamiclistaccordion>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-accordion-panel>\r\n                            <ngx-sirio-accordion-header>\r\n                              <span [innerText]=\"component.label + ' ' + (i + 1)\"></span>\r\n                            </ngx-sirio-accordion-header>\r\n                            <ngx-sirio-accordion-body>\r\n                              <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                              <div [ngClass]=\"{\r\n              'group-top': component.verticalAlignment === 'start',\r\n              'group-center': component.verticalAlignment === 'center',\r\n              'group-bottom': component.verticalAlignment === 'end'}\">\r\n                                <div>\r\n                                  <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                                </div>\r\n                                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                  <div style=\"text-align:right\">\r\n                                    <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                  </div>\r\n                                </ng-container>\r\n                              </div>\r\n                            </ngx-sirio-accordion-body>\r\n                          </ngx-sirio-accordion-panel>\r\n                        </ng-container>\r\n                      </ngx-sirio-accordion>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region default -->\r\n                  <ng-container *ngSwitchDefault>\r\n                    <div [ngClass]=\"{'group-outline': component.showOutline === true}\"\r\n                         #dynamiclist\r\n                         [register]=\"component\"\r\n                         [componentRef]=\"dynamiclist\">\r\n                      <label>{{ evaluateString(component.label) }}</label>\r\n                      <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                        <div [ngClass]=\"{\r\n        'group-top': component.verticalAlignment === 'start',\r\n        'group-center': component.verticalAlignment === 'center',\r\n        'group-bottom': component.verticalAlignment === 'end'}\">\r\n                          <div>\r\n                            <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                          </div>\r\n                          <ng-container *ngIf=\"component.allowAddRemove\">\r\n                            <div style=\"text-align:right\">\r\n                              <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                            </div>\r\n                          </ng-container>\r\n                        </div>\r\n                      </ng-container>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                </ng-container>\r\n                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                  <ngx-sirio-button (click)=\"addNewItem(component)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ Texts.AddItem }}</ngx-sirio-button>\r\n                </ng-container>\r\n              </ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region group -->\r\n          <ng-container *ngSwitchCase=\"'group'\">\r\n            <div [ngClass]=\"{\r\n                 'group-outline': component.showOutline === true,\r\n                 'group-top': component.verticalAlignment === 'start',\r\n                 'group-center': component.verticalAlignment === 'center',\r\n                 'group-bottom': component.verticalAlignment === 'end'}\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label>{{ evaluateString(component.label) }}</label>\r\n              <div #group\r\n                   [register]=\"component\"\r\n                   [componentRef]=\"group\">\r\n                <app-dynamic-fields [formGroup]=\"getFormGroup(getControlFromPath(component.path))\"\r\n                                    [rows]=\"component.rows\"></app-dynamic-fields>\r\n              </div>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region table -->\r\n          <ng-container *ngSwitchCase=\"'table'\">\r\n            <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [gridOptions]=\"getGridOptions(component)\"\r\n                             [rowSource]=\"(getGridData(component) | async) || []\"\r\n                             [style.height.px]=\"component.height\"\r\n                             #table\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"table\" />\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region button -->\r\n          <ng-container *ngSwitchCase=\"'button'\">\r\n            <ngx-sirio-button (clickEvent)=\"clickButton(component, $event)\"\r\n                              [color]=\"evaluateColor(component.color)\"\r\n                              [icon]=\"evaluateString(component.icon)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [disabled]=\"evaluateBoolean(component.disabled)\"\r\n                              #button\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"button\">\r\n              {{ evaluateString(component.label) }}\r\n            </ngx-sirio-button>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region separator -->\r\n          <ng-container *ngSwitchCase=\"'separator'\">\r\n            <div class=\"separator\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 #separator\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"separator\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region spacer -->\r\n          <ng-container *ngSwitchCase=\"'spacer'\">\r\n            <div style=\"width: 100%\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [style.height.px]=\"component.height\"\r\n                 #spacer\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"spacer\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region iframe -->\r\n          <ng-container *ngSwitchCase=\"'iframe'\">\r\n            <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label [for]=\"component.id\">{{ evaluateString(component.label) }}</label>\r\n              <iframe [src]=\"evaluateUrl(component.url)\"\r\n                      [title]=\"evaluateString(component.label)\"\r\n                      [style.width]=\"'100%'\"\r\n                      [style.height.px]=\"component.height\"\r\n                      [frameSecurity]=\"component.security\"\r\n                      #iframe\r\n                      [register]=\"component\"\r\n                      [componentRef]=\"iframe\">\r\n              </iframe>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region alert -->\r\n          <ng-container *ngSwitchCase=\"'alert'\">\r\n            <ngx-sirio-alert [type]=\"component.role\"\r\n                             [labelClose]=\"Texts.Close\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             #alert\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"alert\">\r\n              <ngx-sirio-alert-message>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-alert-message>\r\n            </ngx-sirio-alert>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region notice -->\r\n          <ng-container *ngSwitchCase=\"'notice'\">\r\n            <ngx-sirio-notify [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              #notice\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"notice\">\r\n              <ngx-sirio-notify-body [title]=\"evaluateString(component.title)\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-notify-body>\r\n            </ngx-sirio-notify>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region range -->\r\n          <ng-container *ngSwitchCase=\"'range'\">\r\n            <ngx-sirio-slider [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              [min]=\"evaluateNumber(component.range?.min) ?? 0\"\r\n                              [max]=\"evaluateNumber(component.range?.max) ?? 0\"\r\n                              #range\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"range\">\r\n            </ngx-sirio-slider>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region tooltip -->\r\n          <ng-container *ngSwitchCase=\"'tooltip'\">\r\n            <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                    [sirioTooltip]=\"evaluateString(component.title)\"\r\n                    [content]=\"evaluateString(component.text)\"\r\n                    #tooltip\r\n                    [register]=\"component\"\r\n                    [componentRef]=\"tooltip\"></button>\r\n          </ng-container>\r\n          <!-- #endregion -->                    \r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".flex{display:flex}.field-set{align-items:center}.field-set>div{margin-top:10px;margin-bottom:10px}.separator{border-bottom:2px solid #d9e4f7;width:100%;margin:10px 0}.group-outline{border:1px solid #d9e4f7;padding:15px;margin-top:2px;margin-bottom:2px}.group-top .row{align-items:baseline}.group-center .row{align-items:center}.group-bottom .row{align-items:end}.text-paragraph p{margin-bottom:0!important}.sirio-control.ng-invalid .sirio-form-feedback{color:#aa224f;display:inline-block}.sirio-control.ng-invalid .sirio-input-group-text{color:#aa224f;border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label{color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label:before,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label{color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:before,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:after,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:after{background-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-upload.sirio-is-invalid button{background-color:#aa224f;border-color:#aa224f}.sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.ag-cell-value button.sirio-btn.sirio-btn-icon{padding:0}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, template: "<ng-container *ngFor=\"let row of rows\" [formGroup]=\"formGroup\">\r\n  <div class=\"row field-set\">\r\n    <ng-container *ngFor=\"let component of row.components\">\r\n      <ng-container [ngSwitch]=\"component.type\">\r\n        <div [formGroup]=\"formGroup\" [class]=\"getClass(component)\">\r\n          <!-- #region textfield -->\r\n          <ng-container *ngSwitchCase=\"'textfield'\">\r\n            <ngx-sirio-input type=\"text\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textfield\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textfield\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region select -->\r\n          <ng-container *ngSwitchCase=\"'select'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              dropdown\r\n                              #select\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"select\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"Texts.TypeToSearch\"></ngx-sirio-input>\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region taglist -->\r\n          <ng-container *ngSwitchCase=\"'taglist'\">\r\n            <ngx-sirio-select ariaLabel=\"select\"\r\n                              [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [placeholder]=\"component.placeholder || ''\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [isMultiple]=\"true\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              #taglist\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"taglist\">\r\n              <ngx-sirio-select-panel ariaLabel=\"items\">\r\n                <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ option.label }}</ngx-sirio-select-option>\r\n              </ngx-sirio-select-panel>\r\n            </ngx-sirio-select>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region number -->\r\n          <ng-container *ngSwitchCase=\"'number'\">\r\n            <ngx-sirio-input type=\"number\"\r\n                             ariaLabel=\"input\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [prefixAdorner]=\"evaluateString(component.appearance?.prefixAdorner)\"\r\n                             [suffixAdorner]=\"evaluateString(component.appearance?.suffixAdorner)\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #number\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"number\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region datetime -->\r\n          <ng-container *ngSwitchCase=\"'datetime'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region date -->\r\n              <ng-container *ngSwitchCase=\"'date'\">\r\n                <ngx-sirio-datepicker ariaLabel=\"date\"\r\n                                      [label]=\"evaluateString(component.dateLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #date\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"date\">\r\n                </ngx-sirio-datepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region time -->\r\n              <ng-container *ngSwitchCase=\"'time'\">\r\n                <ngx-sirio-timepicker ariaLabel=\"time\"\r\n                                      [label]=\"evaluateString(component.timeLabel)\"\r\n                                      [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                      [placeholder]=\"component.placeholder || ''\"\r\n                                      [textHelp]=\"evaluateString(component.description)\"\r\n                                      [textFeedback]=\"getTextFeedback(component)\"\r\n                                      [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                      [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                      [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                      [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                      [formControlName]=\"component.key\"\r\n                                      validation\r\n                                      [canValidate]=\"true\"\r\n                                      [isWarning]=\"isWarning(component)\"\r\n                                      [showWhenValid]=\"false\"\r\n                                      #time\r\n                                      [register]=\"component\"\r\n                                      [componentRef]=\"time\">\r\n                </ngx-sirio-timepicker>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checkbox -->\r\n          <ng-container *ngSwitchCase=\"'checkbox'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region toggle -->\r\n              <ng-container *ngSwitchCase=\"'toggle'\">\r\n                <ngx-sirio-toggle ariaLabel=\"checkbox\"\r\n                                  [textHelp]=\"evaluateString(component.description)\"\r\n                                  [textFeedback]=\"getTextFeedback(component)\"\r\n                                  [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                  [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                  [formControlName]=\"component.key\"\r\n                                  validation\r\n                                  [canValidate]=\"true\"\r\n                                  [isWarning]=\"isWarning(component)\"\r\n                                  [showWhenValid]=\"false\"\r\n                                  #toggle\r\n                                  [register]=\"component\"\r\n                                  [componentRef]=\"toggle\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-toggle>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox ariaLabel=\"checkbox\"\r\n                                    [textHelp]=\"evaluateString(component.description)\"\r\n                                    [textFeedback]=\"getTextFeedback(component)\"\r\n                                    [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                    [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                    [formControlName]=\"component.key\"\r\n                                    validation\r\n                                    [canValidate]=\"true\"\r\n                                    [isWarning]=\"isWarning(component)\"\r\n                                    [showWhenValid]=\"false\"\r\n                                    #checkbox\r\n                                    [register]=\"component\"\r\n                                    [componentRef]=\"checkbox\">\r\n                  {{ evaluateString(component.label) }}\r\n                </ngx-sirio-checkbox>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region radio -->\r\n          <ng-container *ngSwitchCase=\"'radio'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-radio-group ariaLabel=\"radio\"\r\n                                            [label]=\"evaluateString(component.label)\"\r\n                                            [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                            [textHelp]=\"evaluateString(component.description)\"\r\n                                            [textFeedback]=\"getTextFeedback(component)\"\r\n                                            [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                            [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                            [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                            [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                            [formControlName]=\"component.key\"\r\n                                            validation\r\n                                            [canValidate]=\"true\"\r\n                                            [isWarning]=\"isWarning(component)\"\r\n                                            [showWhenValid]=\"false\"\r\n                                            #chipradio\r\n                                            [register]=\"component\"\r\n                                            [componentRef]=\"chipradio\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"radio\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-radio-group ariaLabel=\"radio\"\r\n                                       [label]=\"evaluateString(component.label)\"\r\n                                       [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                       [textHelp]=\"evaluateString(component.description)\"\r\n                                       [textFeedback]=\"getTextFeedback(component)\"\r\n                                       [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                       [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                       [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                       [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                       [formControlName]=\"component.key\"\r\n                                       validation\r\n                                       [canValidate]=\"true\"\r\n                                       [isWarning]=\"isWarning(component)\"\r\n                                       [showWhenValid]=\"false\"\r\n                                       #radio\r\n                                       [register]=\"component\"\r\n                                       [componentRef]=\"radio\">\r\n                  <ngx-sirio-radio-button *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-radio-button>\r\n                </ngx-sirio-radio-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region checklist -->\r\n          <ng-container *ngSwitchCase=\"'checklist'\">\r\n            <ng-container [ngSwitch]=\"component.subtype\">\r\n              <!-- #region chip -->\r\n              <ng-container *ngSwitchCase=\"'chip'\">\r\n                <ngx-sirio-chip-checkbox-group ariaLabel=\"checklist\"\r\n                                               [label]=\"evaluateString(component.label)\"\r\n                                               [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                               [textHelp]=\"evaluateString(component.description)\"\r\n                                               [textFeedback]=\"getTextFeedback(component)\"\r\n                                               [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                               [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                               [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                               [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                               [formControlName]=\"component.key\"\r\n                                               validation\r\n                                               [canValidate]=\"true\"\r\n                                               [isWarning]=\"isWarning(component)\"\r\n                                               [showWhenValid]=\"false\"\r\n                                               #chipcheckbox\r\n                                               [register]=\"component\"\r\n                                               [componentRef]=\"chipcheckbox\">\r\n                  <ngx-sirio-input-chip *ngFor=\"let option of (getValues(component) | async) || []\"\r\n                                        type=\"checkbox\"\r\n                                        [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-input-chip>\r\n                </ngx-sirio-chip-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n              <!-- #region default -->\r\n              <ng-container *ngSwitchDefault>\r\n                <ngx-sirio-checkbox-group ariaLabel=\"checklist\"\r\n                                          [label]=\"evaluateString(component.label)\"\r\n                                          [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                          [textHelp]=\"evaluateString(component.description)\"\r\n                                          [textFeedback]=\"getTextFeedback(component)\"\r\n                                          [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                          [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                          [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                          [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                          [formControlName]=\"component.key\"\r\n                                          validation\r\n                                          [canValidate]=\"true\"\r\n                                          [isWarning]=\"isWarning(component)\"\r\n                                          [showWhenValid]=\"false\"\r\n                                          #checkbox\r\n                                          [register]=\"component\"\r\n                                          [componentRef]=\"checkbox\">\r\n                  <ngx-sirio-checkbox *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">\r\n                    {{ option.label }}\r\n                  </ngx-sirio-checkbox>\r\n                </ngx-sirio-checkbox-group>\r\n              </ng-container>\r\n              <!-- #endregion -->\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region textarea -->\r\n          <ng-container *ngSwitchCase=\"'textarea'\">\r\n            <ngx-sirio-input type=\"textarea\"\r\n                             ariaLabel=\"textarea\"\r\n                             [label]=\"evaluateString(component.label)\"\r\n                             [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                             [placeholder]=\"component.placeholder || ''\"\r\n                             [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                             [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [textHelp]=\"evaluateString(component.description)\"\r\n                             [textFeedback]=\"getTextFeedback(component)\"\r\n                             [formControlName]=\"component.key\"\r\n                             updateBlur\r\n                             validation\r\n                             [canValidate]=\"true\"\r\n                             [isWarning]=\"isWarning(component)\"\r\n                             [showWhenValid]=\"false\"\r\n                             #textarea\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"textarea\">\r\n            </ngx-sirio-input>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region filepicker -->\r\n          <ng-container *ngSwitchCase=\"'filepicker'\">\r\n            <ngx-sirio-file-upload ariaLabel=\"filepicker\"\r\n                                   [label]=\"evaluateString(component.label)\"\r\n                                   [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                                   [accept]=\"getMimeTypes(component.accept)\"\r\n                                   [multiple]=\"evaluateBoolean(component.multiple)\"\r\n                                   (fileUploadedEvent)=\"fileUploaded($event)\"\r\n                                   [showFilelist]=\"!component.showDetails\"\r\n                                   [textHelp]=\"evaluateString(component.description)\"\r\n                                   [textFeedback]=\"getTextFeedback(component)\"\r\n                                   [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                                   [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                                   [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                                   [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                                   [formControlName]=\"component.key\"\r\n                                   validation\r\n                                   [canValidate]=\"true\"\r\n                                   [isWarning]=\"isWarning(component)\"\r\n                                   [showWhenValid]=\"false\"\r\n                                   #filepicker\r\n                                   [register]=\"component\"\r\n                                   [componentRef]=\"filepicker\">\r\n              <span class=\"fas fa-arrow-up\" aria-hidden=\"true\"></span>\r\n              {{ Texts.Upload }}\r\n            </ngx-sirio-file-upload>\r\n            <ng-container *ngIf=\"component.showDetails\">\r\n              <app-dynamic-fields [formGroup]=\"formGroup\" [rows]=\"createUploadTables(component)\"></app-dynamic-fields>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region text -->\r\n          <ng-container *ngSwitchCase=\"'text'\">\r\n            <div  [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                  [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                  #text\r\n                  [register]=\"component\"\r\n                  [componentRef]=\"text\">\r\n              <div class=\"flex\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n                <ng-container *ngIf=\"component.tooltip\">\r\n                  <app-template-wrapper #tooltipWrapper [template]=\"tooltipTemplate\" [context]=\"{ component: component }\"></app-template-wrapper>\r\n                  <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                          sirioTooltip\r\n                          [hasPopover]=\"true\"\r\n                          [customTemplate]=\"tooltipWrapper.getTemplateRef()\"></button>\r\n                  <ng-template #tooltipTemplate let-component=\"component\">\r\n                    <div class=\"sirio-tooltip-body\">\r\n                      <div class=\"text-paragraph\"\r\n                           [innerHTML]=\"toHTML(evaluateTemplate(component.tooltip))\">\r\n                      </div>\r\n                    </div>\r\n                  </ng-template>\r\n                </ng-container>\r\n              </div>\r\n            </div>            \r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region html -->\r\n          <ng-container *ngSwitchCase=\"'html'\">\r\n            <div class=\"html-paragraph\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [innerHTML]=\"sanitize(evaluateTemplate(component.content))\"\r\n                 #html\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"html\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region image -->\r\n          <ng-container *ngSwitchCase=\"'image'\">\r\n            <img [src]=\"evaluateString(component.source)\"\r\n                 [alt]=\"evaluateString(component.alt)\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 style=\"width: 100%;height: 100%;\"\r\n                 #image\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"image\">\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region dynamiclist -->\r\n          <ng-container *ngSwitchCase=\"'dynamiclist'\">\r\n            <ng-container [formArrayName]=\"component.path\" [repeat]=\"evaluateNumber(component.repetitions)\">\r\n              <ng-container [ngSwitch]=\"component.subtype\">\r\n                <ng-container *ngIf=\"getFormArray(formGroup.get(component.path)).controls.length > 0\">\r\n                  <!-- #region tab -->\r\n                  <ng-container *ngSwitchCase=\"'tab'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclisttab\">\r\n                      <ngx-sirio-tab [leftArrowLabel]=\"Texts.ScrollLeft\"\r\n                                     [rightArrowLabel]=\"Texts.ScrollRight\"\r\n                                     [tabCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                     #dynamiclisttab>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-tab-item [label]=\"component.label + ' ' + (i + 1)\">\r\n                            <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                            <div [ngClass]=\"{\r\n            'group-top': component.verticalAlignment === 'start',\r\n            'group-center': component.verticalAlignment === 'center',\r\n            'group-bottom': component.verticalAlignment === 'end'}\">\r\n                              <div>\r\n                                <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                              </div>\r\n                              <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                <div style=\"text-align:right\">\r\n                                  <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                </div>\r\n                              </ng-container>\r\n                            </div>\r\n                          </ngx-sirio-tab-item>\r\n                        </ng-container>\r\n                      </ngx-sirio-tab>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region accordion -->\r\n                  <ng-container *ngSwitchCase=\"'accordion'\">\r\n                    <div [register]=\"component\"\r\n                         [componentRef]=\"dynamiclistaccordion\">\r\n                      <ngx-sirio-accordion [accordionCount]=\"getFormArray(formGroup.get(component.path)).controls.length\"\r\n                                           #dynamiclistaccordion>\r\n                        <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                          <ngx-sirio-accordion-panel>\r\n                            <ngx-sirio-accordion-header>\r\n                              <span [innerText]=\"component.label + ' ' + (i + 1)\"></span>\r\n                            </ngx-sirio-accordion-header>\r\n                            <ngx-sirio-accordion-body>\r\n                              <!--<ng-container *ngTemplateOutlet=\"itemTemplate; context: { item: item, index: i }\"></ng-container>-->\r\n                              <div [ngClass]=\"{\r\n              'group-top': component.verticalAlignment === 'start',\r\n              'group-center': component.verticalAlignment === 'center',\r\n              'group-bottom': component.verticalAlignment === 'end'}\">\r\n                                <div>\r\n                                  <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                                </div>\r\n                                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                                  <div style=\"text-align:right\">\r\n                                    <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                                  </div>\r\n                                </ng-container>\r\n                              </div>\r\n                            </ngx-sirio-accordion-body>\r\n                          </ngx-sirio-accordion-panel>\r\n                        </ng-container>\r\n                      </ngx-sirio-accordion>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                  <!-- #region default -->\r\n                  <ng-container *ngSwitchDefault>\r\n                    <div [ngClass]=\"{'group-outline': component.showOutline === true}\"\r\n                         #dynamiclist\r\n                         [register]=\"component\"\r\n                         [componentRef]=\"dynamiclist\">\r\n                      <label>{{ evaluateString(component.label) }}</label>\r\n                      <ng-container *ngFor=\"let item of getFormArray(formGroup.get(component.path)).controls; let i = index;\" [formGroupName]=\"i\">\r\n                        <div [ngClass]=\"{\r\n        'group-top': component.verticalAlignment === 'start',\r\n        'group-center': component.verticalAlignment === 'center',\r\n        'group-bottom': component.verticalAlignment === 'end'}\">\r\n                          <div>\r\n                            <app-dynamic-fields [formGroup]=\"getFormGroup(item)\" [rows]=\"component.rows\"></app-dynamic-fields>\r\n                          </div>\r\n                          <ng-container *ngIf=\"component.allowAddRemove\">\r\n                            <div style=\"text-align:right\">\r\n                              <ngx-sirio-button (click)=\"removeItem(component, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ Texts.RemoveItem }}</ngx-sirio-button>\r\n                            </div>\r\n                          </ng-container>\r\n                        </div>\r\n                      </ng-container>\r\n                    </div>\r\n                  </ng-container>\r\n                  <!-- #endregion -->\r\n                </ng-container>\r\n                <ng-container *ngIf=\"component.allowAddRemove\">\r\n                  <ngx-sirio-button (click)=\"addNewItem(component)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ Texts.AddItem }}</ngx-sirio-button>\r\n                </ng-container>\r\n              </ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region group -->\r\n          <ng-container *ngSwitchCase=\"'group'\">\r\n            <div [ngClass]=\"{\r\n                 'group-outline': component.showOutline === true,\r\n                 'group-top': component.verticalAlignment === 'start',\r\n                 'group-center': component.verticalAlignment === 'center',\r\n                 'group-bottom': component.verticalAlignment === 'end'}\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label>{{ evaluateString(component.label) }}</label>\r\n              <div #group\r\n                   [register]=\"component\"\r\n                   [componentRef]=\"group\">\r\n                <app-dynamic-fields [formGroup]=\"getFormGroup(getControlFromPath(component.path))\"\r\n                                    [rows]=\"component.rows\"></app-dynamic-fields>\r\n              </div>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region table -->\r\n          <ng-container *ngSwitchCase=\"'table'\">\r\n            <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             [gridOptions]=\"getGridOptions(component)\"\r\n                             [rowSource]=\"(getGridData(component) | async) || []\"\r\n                             [style.height.px]=\"component.height\"\r\n                             #table\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"table\" />\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region button -->\r\n          <ng-container *ngSwitchCase=\"'button'\">\r\n            <ngx-sirio-button (clickEvent)=\"clickButton(component, $event)\"\r\n                              [color]=\"evaluateColor(component.color)\"\r\n                              [icon]=\"evaluateString(component.icon)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [disabled]=\"evaluateBoolean(component.disabled)\"\r\n                              #button\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"button\">\r\n              {{ evaluateString(component.label) }}\r\n            </ngx-sirio-button>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region separator -->\r\n          <ng-container *ngSwitchCase=\"'separator'\">\r\n            <div class=\"separator\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 #separator\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"separator\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region spacer -->\r\n          <ng-container *ngSwitchCase=\"'spacer'\">\r\n            <div style=\"width: 100%\"\r\n                 [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                 [style.height.px]=\"component.height\"\r\n                 #spacer\r\n                 [register]=\"component\"\r\n                 [componentRef]=\"spacer\">\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region iframe -->\r\n          <ng-container *ngSwitchCase=\"'iframe'\">\r\n            <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                 [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n              <label [for]=\"component.id\">{{ evaluateString(component.label) }}</label>\r\n              <iframe [src]=\"evaluateUrl(component.url)\"\r\n                      [title]=\"evaluateString(component.label)\"\r\n                      [style.width]=\"'100%'\"\r\n                      [style.height.px]=\"component.height\"\r\n                      [frameSecurity]=\"component.security\"\r\n                      #iframe\r\n                      [register]=\"component\"\r\n                      [componentRef]=\"iframe\">\r\n              </iframe>\r\n            </div>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region alert -->\r\n          <ng-container *ngSwitchCase=\"'alert'\">\r\n            <ngx-sirio-alert [type]=\"component.role\"\r\n                             [labelClose]=\"Texts.Close\"\r\n                             [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                             [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                             #alert\r\n                             [register]=\"component\"\r\n                             [componentRef]=\"alert\">\r\n              <ngx-sirio-alert-message>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-alert-message>\r\n            </ngx-sirio-alert>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region notice -->\r\n          <ng-container *ngSwitchCase=\"'notice'\">\r\n            <ngx-sirio-notify [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              #notice\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"notice\">\r\n              <ngx-sirio-notify-body [title]=\"evaluateString(component.title)\">\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>\r\n              </ngx-sirio-notify-body>\r\n            </ngx-sirio-notify>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region range -->\r\n          <ng-container *ngSwitchCase=\"'range'\">\r\n            <ngx-sirio-slider [label]=\"evaluateString(component.label)\"\r\n                              [labelPopover]=\"evaluateString(component.tooltip)\"\r\n                              [textHelp]=\"evaluateString(component.description)\"\r\n                              [textFeedback]=\"getTextFeedback(component)\"\r\n                              [readonly]=\"evaluateBoolean(component.readonly)\"\r\n                              [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n                              [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                              [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                              [formControlName]=\"component.key\"\r\n                              validation\r\n                              [canValidate]=\"true\"\r\n                              [isWarning]=\"isWarning(component)\"\r\n                              [showWhenValid]=\"false\"\r\n                              [min]=\"evaluateNumber(component.range?.min) ?? 0\"\r\n                              [max]=\"evaluateNumber(component.range?.max) ?? 0\"\r\n                              #range\r\n                              [register]=\"component\"\r\n                              [componentRef]=\"range\">\r\n            </ngx-sirio-slider>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n          <!-- #region tooltip -->\r\n          <ng-container *ngSwitchCase=\"'tooltip'\">\r\n            <app-template-wrapper #tooltipWrapper [template]=\"tooltipTemplate\" [context]=\"{ component: component }\"></app-template-wrapper>\r\n            <button class=\"sirio-label-popover fas fa-info-circle\"\r\n                    [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n                    [show]=\"evaluateBoolean(component.conditional?.show)\"\r\n                    sirioTooltip\r\n                    [hasPopover]=\"true\"\r\n                    [customTemplate]=\"tooltipWrapper.getTemplateRef()\"\r\n                    #tooltip\r\n                    [register]=\"component\"\r\n                    [componentRef]=\"tooltip\"></button>\r\n            <ng-template #tooltipTemplate let-component=\"component\">\r\n              <div class=\"sirio-tooltip-body\">\r\n                <p *ngIf=\"component.title\" class=\"sirio-tooltip-heading sirio-space-down\">\r\n                  {{ evaluateString(component.title) }}\r\n                </p>\r\n                <div class=\"text-paragraph\"\r\n                     [innerHTML]=\"toHTML(evaluateTemplate(component.text))\">\r\n                </div>                \r\n              </div>\r\n            </ng-template>\r\n          </ng-container>\r\n          <!-- #endregion -->\r\n        </div>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".flex{display:flex}.field-set{align-items:center}.field-set>div{margin-top:10px;margin-bottom:10px}.separator{border-bottom:2px solid #d9e4f7;width:100%;margin:10px 0}.group-outline{border:1px solid #d9e4f7;padding:15px;margin-top:2px;margin-bottom:2px}.group-top .row{align-items:baseline}.group-center .row{align-items:center}.group-bottom .row{align-items:end}.text-paragraph p{margin-bottom:0!important}.sirio-control.ng-invalid .sirio-form-feedback{color:#aa224f;display:inline-block}.sirio-control.ng-invalid .sirio-input-group-text{color:#aa224f;border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label{color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]~label:before,.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-is-invalid input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label{color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:before,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:before{border-color:#aa224f}.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid~label:after,.sirio-form-check.sirio-form-toggle input[type=checkbox].sirio-is-invalid:checked~label:after{background-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=checkbox]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=checkbox]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label{color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]~label:before,.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:before{border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-form-check input[type=radio]:checked~label:after{background-image:url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3e%3cpath fill='%23AA224F' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3e%3c/svg%3e\");background-size:12px}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]+label{color:#aa224f;border-color:#aa224f}.sirio-control.sirio-is-invalid fieldset .sirio-chip-selection input[type=radio]:checked+label{color:#fff;background-color:#aa224f;border-color:#aa224f}.sirio-upload.sirio-is-invalid button{background-color:#aa224f;border-color:#aa224f}.sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.ag-cell-value button.sirio-btn.sirio-btn-icon{padding:0}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}\n"] }]
         }], ctorParameters: () => [{ type: SanitizeService }, { type: MarkdownService }, { type: MimeService }, { type: ProgrammabilityService }, { type: EventService }, { type: FormatterService }, { type: WeakService }, { type: RegisterService }, { type: i0.ElementRef }], propDecorators: { rows: [{
                 type: Input
             }], formGroup: [{