@wemake4u/form-player-se 1.0.21 → 1.0.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,14 +4,14 @@ import * as i11 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import * as i1$1 from '@angular/forms';
6
6
  import { FormArray, FormControl as FormControl$1, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
7
- import { isObservable, take, tap, of, takeUntil, Subject, combineLatest } from 'rxjs';
7
+ import { isObservable, take, tap, of, takeUntil, Subject, combineLatest, Observable } from 'rxjs';
8
8
  import { evaluate } from 'feelers';
9
9
  import { evaluate as evaluate$1, unaryTest, parseExpression } from 'feelin';
10
10
  import { shareReplay, map, takeUntil as takeUntil$1 } from 'rxjs/operators';
11
11
  import * as i1 from 'ngx-sirio-lib';
12
12
  import { SirioDialogElement, SirioDialogComponent, SirioDialogBodyComponent, SirioDialogHeaderComponent, SirioDialogFooterComponent, SirioButtonComponent, SirioDialogTitleComponent, SirioDialogActionDirective, SirioInputComponent, SirioCheckboxComponent, SirioCheckboxGroupComponent, SirioValidationDirective, SirioSelectComponent, SirioSelectOptionComponent, SirioSelectPanelComponent, SirioDatepickerComponent, SirioTimepickerComponent, SirioRadioGroupComponent, SirioRadioButtonComponent, SirioTabComponent, SirioTabItemComponent, SirioAccordionComponent, SirioAccordionPanelComponent, SirioAccordionHeaderComponent, SirioAccordionBodyComponent, SirioFileUploadComponent, SirioToggleComponent, SirioChipCheckboxGroupComponent, SirioChipRadioGroupComponent, SirioInputChipComponent, SirioAlertComponent, SirioAlertMessageComponent, SirioSliderComponent, SirioNotifyComponent, SirioNotifyBodyComponent, SirioTooltipDirective, SirioNotifyActionComponent, SirioNotifyLinkComponent, SirioSidenavMobileComponent, SirioSidenavComponent, SirioSidenavItemComponent, SirioStepperProgressBarComponent, SirioStepperProgressItemComponent } from 'ngx-sirio-lib';
13
13
  import { Datepicker } from 'vanillajs-datepicker';
14
- import { ClientSideRowModelModule, InfiniteRowModelModule, PaginationModule, LocaleModule, CellStyleModule, ClientSideRowModelApiModule, TextFilterModule, NumberFilterModule, DateFilterModule, ColumnAutoSizeModule, ColumnApiModule, RowSelectionModule, ValidationModule, themeQuartz, iconSetAlpine } from 'ag-grid-community';
14
+ import { ClientSideRowModelModule, InfiniteRowModelModule, PaginationModule, LocaleModule, CellStyleModule, ClientSideRowModelApiModule, TextFilterModule, NumberFilterModule, DateFilterModule, ColumnAutoSizeModule, ColumnApiModule, RowSelectionModule, RowApiModule, themeQuartz, iconSetAlpine } from 'ag-grid-community';
15
15
  import { AG_GRID_LOCALE_IT, AG_GRID_LOCALE_EN, AG_GRID_LOCALE_DE, AG_GRID_LOCALE_FR, AG_GRID_LOCALE_ES, AG_GRID_LOCALE_PT } from '@ag-grid-community/locale';
16
16
  import * as i1$2 from 'ag-grid-angular';
17
17
  import { AgGridAngular } from 'ag-grid-angular';
@@ -177,17 +177,17 @@ class ToastService {
177
177
  constructor(sirioToast) {
178
178
  this.sirioToast = sirioToast;
179
179
  }
180
- notifyInfo(message, delay = 2000) {
181
- this.notify(message, "info", delay);
180
+ notifyInfo(message, title, delay = 2000) {
181
+ this.notify("info", message, title, delay);
182
182
  }
183
- notifySuccess(message, delay = 2000) {
184
- this.notify(message, "success", delay);
183
+ notifySuccess(message, title, delay = 2000) {
184
+ this.notify("success", message, title, delay);
185
185
  }
186
- notifyWarning(message, delay = 2000) {
187
- this.notify(message, "warning", delay);
186
+ notifyWarning(message, title, delay = 2000) {
187
+ this.notify("warning", message, title, delay);
188
188
  }
189
- notifyError(message, delay = 2000) {
190
- this.notify(message, "danger", delay);
189
+ notifyError(message, title, delay = 2000) {
190
+ this.notify("danger", message, title, delay);
191
191
  }
192
192
  getContext() {
193
193
  return ToBoundArrows(this, [
@@ -197,11 +197,12 @@ class ToastService {
197
197
  "notifyError"
198
198
  ]);
199
199
  }
200
- notify(message, type, delay = 2000) {
200
+ notify(type, message, title, delay = 2000) {
201
201
  this.sirioToast.openToast({
202
202
  delay: delay,
203
203
  text: message,
204
- type: type
204
+ type: type,
205
+ title: title
205
206
  });
206
207
  }
207
208
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToastService, deps: [{ token: i1.SirioToastService }], target: i0.ɵɵFactoryTarget.Injectable });
@@ -639,6 +640,20 @@ class DialogService {
639
640
  };
640
641
  this.showDialog(formSchema, formOptions);
641
642
  }
643
+ prompt(text, defaultValue, options) {
644
+ const formSchema = this.createInputSchema(text, defaultValue);
645
+ const formOptions = {
646
+ ...options,
647
+ type: "info",
648
+ buttons: 'OKCancel',
649
+ isDrawer: false,
650
+ showNav: false,
651
+ showNavButton: false,
652
+ showProgress: false,
653
+ showFormTitle: false
654
+ };
655
+ this.showDialog(formSchema, formOptions);
656
+ }
642
657
  getContext() {
643
658
  return ToBoundArrows(this, [
644
659
  'openDialog',
@@ -678,6 +693,30 @@ class DialogService {
678
693
  ]
679
694
  };
680
695
  }
696
+ createInputSchema(label, defaultValue) {
697
+ return {
698
+ "forms": [
699
+ {
700
+ "components": [
701
+ {
702
+ "label": label,
703
+ "defaultValue": defaultValue,
704
+ "type": "textfield",
705
+ "layout": {
706
+ "row": "Row_1wxz5gd",
707
+ "columns": null
708
+ },
709
+ "id": "Field_1tau53x",
710
+ "key": "input"
711
+ }
712
+ ],
713
+ "type": "default",
714
+ "id": "Form_1ontwnx",
715
+ "schemaVersion": 18
716
+ }
717
+ ]
718
+ };
719
+ }
681
720
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DialogService, deps: [{ token: i1.SirioDialogService }], target: i0.ɵɵFactoryTarget.Injectable });
682
721
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DialogService, providedIn: 'root' });
683
722
  }
@@ -1124,10 +1163,11 @@ class ProgrammabilityService {
1124
1163
  if (!parent) {
1125
1164
  return null;
1126
1165
  }
1166
+ const self = this;
1127
1167
  return {
1128
1168
  ...parent.value,
1129
- formGroup: () => parent,
1130
- parent: () => this.getParentContext(parent)
1169
+ formGroup: () => ToProxy(parent),
1170
+ get parent() { return self.getParentContext(parent); },
1131
1171
  };
1132
1172
  }
1133
1173
  getParent(formGroup) {
@@ -1140,9 +1180,10 @@ class ProgrammabilityService {
1140
1180
  getContext(control, options = {}) {
1141
1181
  const formGroup = control;
1142
1182
  const baseContext = formGroup?.value ?? {};
1183
+ const self = this;
1143
1184
  let context = {
1144
1185
  ...baseContext,
1145
- parent: () => this.getParentContext(formGroup),
1186
+ get parent() { return self.getParentContext(formGroup); },
1146
1187
  formGroup: () => ToProxy(formGroup),
1147
1188
  _: this.scope?.getContext(),
1148
1189
  fn: this.predefinedFunctions
@@ -1706,7 +1747,8 @@ class GridService {
1706
1747
  ColumnAutoSizeModule,
1707
1748
  ColumnApiModule,
1708
1749
  RowSelectionModule,
1709
- ValidationModule
1750
+ RowApiModule
1751
+ //, ValidationModule
1710
1752
  ];
1711
1753
  }
1712
1754
  ;
@@ -1739,6 +1781,9 @@ class GridService {
1739
1781
  onGridSizeChanged: (params) => {
1740
1782
  params.api.autoSizeColumns(["actions"]);
1741
1783
  },
1784
+ onModelUpdated: (params) => {
1785
+ this.onRowSelecting(component, formGroup, params);
1786
+ }
1742
1787
  };
1743
1788
  }
1744
1789
  onSelectionChanged(component, formGroup, event) {
@@ -1953,26 +1998,24 @@ class GridService {
1953
1998
  }
1954
1999
  }
1955
2000
  getRowSelection(component, formGroup) {
2001
+ let options = undefined;
1956
2002
  if (component.selection === "singleRow") {
1957
- return { mode: "singleRow" };
2003
+ options = { mode: "singleRow" };
1958
2004
  }
1959
2005
  else if (component.selection === "multiRow") {
1960
- const options = {
2006
+ options = {
1961
2007
  mode: "multiRow",
1962
2008
  selectAll: 'filtered',
1963
2009
  hideDisabledCheckboxes: true
1964
2010
  };
1965
- if (component.isSelectable) {
1966
- return {
1967
- ...options,
1968
- isRowSelectable: (rowNode) => this.onRowSelectable(component, formGroup, rowNode.data)
1969
- };
1970
- }
1971
- else {
1972
- return options;
1973
- }
1974
2011
  }
1975
- return undefined;
2012
+ if (options && component.isSelectable) {
2013
+ options = {
2014
+ ...options,
2015
+ isRowSelectable: (rowNode) => this.onRowSelectable(component, formGroup, rowNode.data)
2016
+ };
2017
+ }
2018
+ return options;
1976
2019
  }
1977
2020
  onRowSelectable(component, formGroup, data) {
1978
2021
  if (!data)
@@ -1987,6 +2030,34 @@ class GridService {
1987
2030
  });
1988
2031
  return result === true;
1989
2032
  }
2033
+ onRowSelected(component, formGroup, data) {
2034
+ if (!data)
2035
+ return false;
2036
+ const result = this.programmability.evaluate(formGroup, component.isSelected, {
2037
+ cacheable: false,
2038
+ extendContext: () => ({
2039
+ "event": {
2040
+ data: data
2041
+ }
2042
+ })
2043
+ });
2044
+ return result === true;
2045
+ }
2046
+ onRowSelecting(component, formGroup, params) {
2047
+ if (params.newData
2048
+ && component.isSelected
2049
+ && this.hasSelection(component)) {
2050
+ params.api.forEachNode((node) => {
2051
+ if (this.onRowSelected(component, formGroup, node.data)) {
2052
+ node.setSelected(true);
2053
+ }
2054
+ });
2055
+ }
2056
+ }
2057
+ hasSelection(component) {
2058
+ return component.selection === "singleRow"
2059
+ || component.selection === "multiRow";
2060
+ }
1990
2061
  getPaginable(component) {
1991
2062
  return (typeof component.rowCount === 'number' && component.rowCount > 0);
1992
2063
  }
@@ -2926,7 +2997,8 @@ class DropdownDirective {
2926
2997
  const input = searchable.querySelector('input');
2927
2998
  this.renderer.insertBefore(dropDown, searchable, dropMenu);
2928
2999
  this.renderer.listen(input, 'blur', (event) => {
2929
- this.sirioSelect.panel.close();
3000
+ if (event.relatedTarget !== dropMenu)
3001
+ this.sirioSelect.panel.close();
2930
3002
  });
2931
3003
  this.renderer.listen(input, 'keyup', (event) => {
2932
3004
  this.onKeyUp(event, input);
@@ -3948,6 +4020,9 @@ class TextDirective {
3948
4020
  }
3949
4021
  }
3950
4022
  coerceValue(value) {
4023
+ if (typeof value !== 'string') {
4024
+ return value;
4025
+ }
3951
4026
  return this.applyMaxLength(this.applyCase(value));
3952
4027
  }
3953
4028
  applyCase(value) {
@@ -4141,10 +4216,12 @@ class CollapseDirective {
4141
4216
  this.expanded = false;
4142
4217
  this.applyStyle();
4143
4218
  const element = this.el.nativeElement;
4144
- if (element.scrollHeight > this.maxHeight) {
4145
- this.applyButton();
4146
- this.applyFocusHandler();
4147
- }
4219
+ setTimeout(() => {
4220
+ if (element.scrollHeight > this.maxHeight) {
4221
+ this.applyButton();
4222
+ this.applyFocusHandler();
4223
+ }
4224
+ }, 100);
4148
4225
  }
4149
4226
  applyStyle() {
4150
4227
  const element = this.el.nativeElement;
@@ -4184,7 +4261,7 @@ class CollapseDirective {
4184
4261
  this.timeoutFocusOut = setTimeout(() => {
4185
4262
  if (!element.contains(document.activeElement)) {
4186
4263
  element.scrollTop = 0;
4187
- console.log('NESSUN elemento interno ha più il focus');
4264
+ //console.log('NESSUN elemento interno ha più il focus');
4188
4265
  }
4189
4266
  }, 0);
4190
4267
  });
@@ -4775,7 +4852,7 @@ class DynamicFieldsComponent {
4775
4852
  ProgrammabilityService,
4776
4853
  GridService,
4777
4854
  ChartService
4778
- ], 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 [class]=\"getClass(component)\">\r\n <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n <!-- #region textfield -->\r\n <ng-container *ngSwitchCase=\"'textfield'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"text\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\r\n dropdown\r\n #select\r\n [register]=\"component\"\r\n [componentRef]=\"select\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"locale(Texts, 'TypeToSearch')\"></ngx-sirio-input>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 [refresh]=\"refreshValues(component)\"\r\n #taglist\r\n [register]=\"component\"\r\n [componentRef]=\"taglist\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"number\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n number\r\n [defaultValue]=\"evaluateNumber(component.defaultValue)\"\r\n [minimum]=\"evaluateNumber(component.minimum)\"\r\n [maximum]=\"evaluateNumber(component.maximum)\"\r\n [decimalDigits]=\"evaluateNumber(component.decimalDigits)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region date -->\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ngx-sirio-datepicker [ariaLabel]=\"evaluateString(locale(component, 'ariaDateLabel') || locale(component, 'dateLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'dateLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n isoDate\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]=\"evaluateString(locale(component, 'ariaTimeLabel') || locale(component, 'timeLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'timeLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region toggle -->\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <ngx-sirio-toggle [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"textarea\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-file-upload [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(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(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 {{ locale(Texts, 'Upload') }}\r\n </ngx-sirio-file-upload>\r\n <ng-container *ngIf=\"component.showDetails\">\r\n <app-dynamic-fields [formGroup]=\"formGroup\"\r\n [rows]=\"createUploadTables(component)\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </ng-container>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region range -->\r\n <ng-container *ngSwitchCase=\"'range'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-slider [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 dynamiclist -->\r\n <ng-container *ngSwitchCase=\"'dynamiclist'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [formArrayName]=\"component.key\"\r\n [repeat]=\"evaluateNumber(component.repetitions)\"\r\n [allowAddRemove]=\"evaluateBoolean(component.allowAddRemove)\">\r\n <p *ngIf=\"component.description\">{{ evaluateString(locale(component, 'description')) }}</p>\r\n <ng-container *ngIf=\"getFormArray(resolvePath(component.path).get(component.key)) as formArray\">\r\n <ng-container *ngIf=\"formArray.controls.length > 0\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\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]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [tabCount]=\"formArray.controls.length\"\r\n #dynamiclisttab>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\">\r\n <ng-container *ngIf=\"i === dynamiclisttab.activeIndex\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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]=\"formArray.controls.length\"\r\n #dynamiclistaccordion>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-accordion-panel #panel accordionPanel>\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\r\n <ng-container *ngIf=\"panel.panelIsOpen\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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 #dynamiclist\r\n [register]=\"component\"\r\n [componentRef]=\"dynamiclist\">\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <div [ngClass]=\"{'group-outline': component.showOutline === true, 'group-outline-repeat': true }\">\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 <label>{{ evaluateString(locale(component, 'label')) + ' ' + (i + 1) }}</label>\r\n <div>\r\n <app-dynamic-fields [formGroup]=\"getFormGroup(item)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\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>\r\n <ng-container *ngIf=\"component.allowAddRemove\">\r\n <ngx-sirio-button (click)=\"addItem(formArray)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ evaluateString(locale(component, 'addLabel') || locale(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 <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <div #group\r\n [register]=\"component\"\r\n [componentRef]=\"group\">\r\n <app-dynamic-fields [formGroup]=\"resolvePath(component.path)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region tab -->\r\n <ng-container *ngSwitchCase=\"'tab'\">\r\n <ngx-sirio-tab #tab\r\n [register]=\"component\"\r\n [componentRef]=\"tab\"\r\n [leftArrowLabel]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [isNavLine]=\"component.navigation\"\r\n [isVertical]=\"component.vertical\"\r\n tabControl>\r\n <ng-container *ngFor=\"let panel of component.panels; let i = index;\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(panel, 'label'))\"\r\n [icon]=\"evaluateString(panel.icon)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled) ?? false\"\r\n *ngIf=\"evaluateConditional(panel.conditional)\">\r\n <div *ngIf=\"i === tab.activeIndex\" [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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ngx-sirio-tab-item>\r\n </ng-container>\r\n </ngx-sirio-tab>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region accordion -->\r\n <ng-container *ngSwitchCase=\"'accordion'\">\r\n <ngx-sirio-accordion #accordion\r\n [register]=\"component\"\r\n [componentRef]=\"accordion\">\r\n <ng-container *ngFor=\"let panel of component.panels\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-accordion-panel *ngIf=\"evaluateConditional(panel.conditional)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled)\">\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(panel, 'label'))\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\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 </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region text -->\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div [collapse]=\"component.collapseTo\"\r\n [language]=\"language\"\r\n #text\r\n [register]=\"component\"\r\n [componentRef]=\"text\">\r\n <!--Reset View Context-->\r\n <div tabindex=\"0\" style=\"display:none\"></div>\r\n <div class=\"flex\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 [attr.aria-label]=\"locale(Texts, 'Information')\"\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(locale(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 [innerHTML]=\"sanitize(evaluateTemplate(locale(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(locale(component, 'alt'))\"\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 table -->\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n [gridOptions]=\"getGridOptions(component)\"\r\n (selectionChanged)=\"onGridSelectionChanged(component, $event)\"\r\n [rowSource]=\"(getRowSource(component) | async) || []\"\r\n [refresh]=\"refreshRowSource(component)\"\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 [disabled]=\"evaluateBoolean(component.disabled)\"\r\n #button\r\n [register]=\"component\"\r\n [componentRef]=\"button\">\r\n {{ evaluateString(locale(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 #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 [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 <label [for]=\"component.id\">{{ evaluateString(locale(component, 'label')) }}</label>\r\n <iframe [src]=\"evaluateUrl(component.url)\"\r\n [title]=\"evaluateString(locale(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 </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]=\"locale(Texts, 'Close')\"\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(locale(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 #notice\r\n [register]=\"component\"\r\n [componentRef]=\"notice\">\r\n <ngx-sirio-notify-body [title]=\"evaluateString(locale(component, 'title'))\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 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 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(locale(component, 'title')) }}\r\n </p>\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(component, 'text')))\">\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region chart -->\r\n <ng-container *ngSwitchCase=\"'chart'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-charts [options]=\"(getChartOptions(component) | async) ?? {}\"\r\n [observe]=\"getChartData(component)\"\r\n [callback]=\"invalidateChart(component)\"\r\n [style.height.px]=\"component.height\"\r\n #chart\r\n [register]=\"component\"\r\n [componentRef]=\"chart\" />\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\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:start}.field-set>.col-host>*{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-outline-repeat{margin-top:8px;margin-bottom:8px}.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-tab.sirio-tab-vertical .sirio-tab-body{margin-left:10px;margin-right:10px}.sirio-tab:not(.sirio-tab-vertical) .sirio-tab-body{margin-top:10px;margin-bottom:10px}.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-control.fp-disabled .sirio-input-group .sirio-input-group-text,.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{border:0px}.sirio-control.fp-readonly label:hover{color:#454d56}.sirio-control.fp-readonly input.sirio-form-control,.sirio-control.fp-readonly .sirio-dropdown .sirio-dropdown-select,.sirio-control.fp-readonly textarea.sirio-form-control{background:none!important;border:0px;padding:0}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{background:none}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text span{color:#5b6571}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text.prefix{padding-left:0}.sirio-upload.sirio-control.fp-readonly label,.sirio-upload.sirio-control.fp-disabled label{pointer-events:none}.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}.col-host .sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.col-host .sirio-accordion-body{overflow:unset!important}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-cell-value .btn-small-group{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.ag-cell-value .btn-small .sirio-btn{padding:.25rem .0625rem;margin:2px}ag-charts{display:block;height:100%;border-radius:8px;background-color:var(--chart-bg);border:1px solid var(--chart-border);overflow:hidden}\n"], dependencies: [{ kind: "component", type: DynamicFieldsComponent, selector: "app-dynamic-fields", inputs: ["rows", "formGroup", "language"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i11.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i11.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i11.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i11.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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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", "placeholder", "componentRef"] }, { 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], [allowAddRemove]", inputs: ["repeat", "allowAddRemove"] }, { kind: "directive", type: TabDirective, selector: "[tabCount]", inputs: ["tabCount"] }, { kind: "directive", type: GridDirective, selector: "[rowSource]", inputs: ["rowSource"] }, { kind: "directive", type: ChangeDirective, selector: "[observe]", inputs: ["observe", "callback"] }, { kind: "directive", type: RegisterDirective, selector: "[register]", inputs: ["register", "componentRef"] }, { kind: "directive", type: RefreshDirective, selector: "[refresh]", inputs: ["refresh", "componentRef"] }, { kind: "directive", type: AccordionDirective, selector: "[accordionCount]", inputs: ["accordionCount"] }, { kind: "directive", type: DateDirective, selector: "[isoDate]" }, { kind: "directive", type: NumberDirective, selector: "[number]", inputs: ["defaultValue", "minimum", "maximum", "decimalDigits"] }, { kind: "directive", type: TextDirective, selector: "[textcase], [maxlength]", inputs: ["textcase", "maxlength"] }, { kind: "directive", type: DisableFormDirective, selector: "[disableForm]", inputs: ["disableForm"] }, { kind: "directive", type: TabControlDirective, selector: "[tabControl]" }, { kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["collapse", "language"] }, { kind: "directive", type: AccordionPanelDirective, selector: "[accordionPanel]" }, { 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: "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"] }, { kind: "component", type: AgCharts, selector: "ag-charts", inputs: ["options"], outputs: ["onChartReady"] }], encapsulation: i0.ViewEncapsulation.None });
4855
+ ], 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 [class]=\"getClass(component)\">\r\n <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n <!-- #region textfield -->\r\n <ng-container *ngSwitchCase=\"'textfield'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"text\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\r\n dropdown\r\n #select\r\n [register]=\"component\"\r\n [componentRef]=\"select\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"locale(Texts, 'TypeToSearch')\"></ngx-sirio-input>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 [refresh]=\"refreshValues(component)\"\r\n #taglist\r\n [register]=\"component\"\r\n [componentRef]=\"taglist\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"number\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n number\r\n [defaultValue]=\"evaluateNumber(component.defaultValue)\"\r\n [minimum]=\"evaluateNumber(component.minimum)\"\r\n [maximum]=\"evaluateNumber(component.maximum)\"\r\n [decimalDigits]=\"evaluateNumber(component.decimalDigits)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region date -->\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ngx-sirio-datepicker [ariaLabel]=\"evaluateString(locale(component, 'ariaDateLabel') || locale(component, 'dateLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'dateLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n isoDate\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]=\"evaluateString(locale(component, 'ariaTimeLabel') || locale(component, 'timeLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'timeLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region toggle -->\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <ngx-sirio-toggle [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"textarea\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-file-upload [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(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(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 {{ locale(Texts, 'Upload') }}\r\n </ngx-sirio-file-upload>\r\n <ng-container *ngIf=\"component.showDetails\">\r\n <app-dynamic-fields [formGroup]=\"formGroup\"\r\n [rows]=\"createUploadTables(component)\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </ng-container>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region range -->\r\n <ng-container *ngSwitchCase=\"'range'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-slider [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 dynamiclist -->\r\n <ng-container *ngSwitchCase=\"'dynamiclist'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [formArrayName]=\"component.key\"\r\n [repeat]=\"evaluateNumber(component.repetitions)\"\r\n [allowAddRemove]=\"evaluateBoolean(component.allowAddRemove)\">\r\n <p *ngIf=\"component.description\">{{ evaluateString(locale(component, 'description')) }}</p>\r\n <ng-container *ngIf=\"getFormArray(resolvePath(component.path).get(component.key)) as formArray\">\r\n <ng-container *ngIf=\"formArray.controls.length > 0\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\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]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [tabCount]=\"formArray.controls.length\"\r\n #dynamiclisttab>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\">\r\n <ng-container *ngIf=\"i === dynamiclisttab.activeIndex\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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]=\"formArray.controls.length\"\r\n #dynamiclistaccordion>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-accordion-panel #panel accordionPanel>\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\r\n <ng-container *ngIf=\"panel.panelIsOpen\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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 #dynamiclist\r\n [register]=\"component\"\r\n [componentRef]=\"dynamiclist\">\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <div [ngClass]=\"{'group-outline': component.showOutline === true, 'group-outline-repeat': true }\">\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 <label>{{ evaluateString(locale(component, 'label')) + ' ' + (i + 1) }}</label>\r\n <div>\r\n <app-dynamic-fields [formGroup]=\"getFormGroup(item)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\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>\r\n <ng-container *ngIf=\"component.allowAddRemove\">\r\n <ngx-sirio-button (click)=\"addItem(formArray)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ evaluateString(locale(component, 'addLabel') || locale(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 <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <div #group\r\n [register]=\"component\"\r\n [componentRef]=\"group\">\r\n <app-dynamic-fields [formGroup]=\"resolvePath(component.path)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region tab -->\r\n <ng-container *ngSwitchCase=\"'tab'\">\r\n <ngx-sirio-tab #tab\r\n [register]=\"component\"\r\n [componentRef]=\"tab\"\r\n [leftArrowLabel]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [isNavLine]=\"component.navigation\"\r\n [isVertical]=\"component.vertical\"\r\n tabControl>\r\n <ng-container *ngFor=\"let panel of component.panels; let i = index;\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(panel, 'label'))\"\r\n [icon]=\"evaluateString(panel.icon)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled) ?? false\"\r\n *ngIf=\"evaluateConditional(panel.conditional)\">\r\n <div *ngIf=\"i === tab.activeIndex\" [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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ngx-sirio-tab-item>\r\n </ng-container>\r\n </ngx-sirio-tab>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region accordion -->\r\n <ng-container *ngSwitchCase=\"'accordion'\">\r\n <ngx-sirio-accordion #accordion\r\n [register]=\"component\"\r\n [componentRef]=\"accordion\">\r\n <ng-container *ngFor=\"let panel of component.panels\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-accordion-panel *ngIf=\"evaluateConditional(panel.conditional)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled)\">\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(panel, 'label'))\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\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 </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region text -->\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div [collapse]=\"component.collapseTo\"\r\n [language]=\"language\"\r\n #text\r\n [register]=\"component\"\r\n [componentRef]=\"text\">\r\n <!--Reset View Context-->\r\n <div tabindex=\"0\" style=\"display:none\"></div>\r\n <div class=\"flex\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 [attr.aria-label]=\"locale(Texts, 'Information')\"\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(locale(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 [innerHTML]=\"sanitize(evaluateTemplate(locale(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(locale(component, 'alt'))\"\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 table -->\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n [gridOptions]=\"getGridOptions(component)\"\r\n (selectionChanged)=\"onGridSelectionChanged(component, $event)\"\r\n [rowSource]=\"(getRowSource(component) | async) || []\"\r\n [refresh]=\"refreshRowSource(component)\"\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 [disabled]=\"evaluateBoolean(component.disabled)\"\r\n #button\r\n [register]=\"component\"\r\n [componentRef]=\"button\">\r\n {{ evaluateString(locale(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 #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 [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 <label [for]=\"component.id\">{{ evaluateString(locale(component, 'label')) }}</label>\r\n <iframe [src]=\"evaluateUrl(component.url)\"\r\n [title]=\"evaluateString(locale(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 </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]=\"locale(Texts, 'Close')\"\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(locale(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 #notice\r\n [register]=\"component\"\r\n [componentRef]=\"notice\">\r\n <ngx-sirio-notify-body [title]=\"evaluateString(locale(component, 'title'))\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 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 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(locale(component, 'title')) }}\r\n </p>\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(component, 'text')))\">\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region chart -->\r\n <ng-container *ngSwitchCase=\"'chart'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-charts [options]=\"(getChartOptions(component) | async) ?? {}\"\r\n [observe]=\"getChartData(component)\"\r\n [callback]=\"invalidateChart(component)\"\r\n [style.height.px]=\"component.height\"\r\n #chart\r\n [register]=\"component\"\r\n [componentRef]=\"chart\" />\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\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:start}.field-set>.col-host>*{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-outline-repeat{margin-top:8px;margin-bottom:8px}.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-tab.sirio-tab-vertical .sirio-tab-body{margin-left:10px;margin-right:10px}.sirio-tab:not(.sirio-tab-vertical) .sirio-tab-body{margin-top:10px;margin-bottom:10px}.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-control.fp-disabled .sirio-input-group .sirio-input-group-text,.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{border:0px}.sirio-control.fp-readonly label:hover{color:#454d56}.sirio-control.fp-readonly input.sirio-form-control,.sirio-control.fp-readonly .sirio-dropdown .sirio-dropdown-select,.sirio-control.fp-readonly textarea.sirio-form-control{background:none!important;border:0px;padding:0}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{background:none}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text span{color:#5b6571}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text.prefix{padding-left:0}.sirio-upload.sirio-control.fp-readonly label,.sirio-upload.sirio-control.fp-disabled label{pointer-events:none}.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}.col-host .sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.col-host .sirio-accordion-body{overflow:unset!important}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-cell-value .btn-small-group{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.ag-cell-value .btn-small .sirio-btn{padding:.25rem .0625rem;margin:2px}.ag-selection-checkbox .ag-checkbox-input-wrapper.ag-disabled{display:none}ag-charts{display:block;height:100%;border-radius:8px;background-color:var(--chart-bg);border:1px solid var(--chart-border);overflow:hidden}\n"], dependencies: [{ kind: "component", type: DynamicFieldsComponent, selector: "app-dynamic-fields", inputs: ["rows", "formGroup", "language"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i11.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i11.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i11.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i11.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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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", "placeholder", "componentRef"] }, { 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], [allowAddRemove]", inputs: ["repeat", "allowAddRemove"] }, { kind: "directive", type: TabDirective, selector: "[tabCount]", inputs: ["tabCount"] }, { kind: "directive", type: GridDirective, selector: "[rowSource]", inputs: ["rowSource"] }, { kind: "directive", type: ChangeDirective, selector: "[observe]", inputs: ["observe", "callback"] }, { kind: "directive", type: RegisterDirective, selector: "[register]", inputs: ["register", "componentRef"] }, { kind: "directive", type: RefreshDirective, selector: "[refresh]", inputs: ["refresh", "componentRef"] }, { kind: "directive", type: AccordionDirective, selector: "[accordionCount]", inputs: ["accordionCount"] }, { kind: "directive", type: DateDirective, selector: "[isoDate]" }, { kind: "directive", type: NumberDirective, selector: "[number]", inputs: ["defaultValue", "minimum", "maximum", "decimalDigits"] }, { kind: "directive", type: TextDirective, selector: "[textcase], [maxlength]", inputs: ["textcase", "maxlength"] }, { kind: "directive", type: DisableFormDirective, selector: "[disableForm]", inputs: ["disableForm"] }, { kind: "directive", type: TabControlDirective, selector: "[tabControl]" }, { kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["collapse", "language"] }, { kind: "directive", type: AccordionPanelDirective, selector: "[accordionPanel]" }, { 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: "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"] }, { kind: "component", type: AgCharts, selector: "ag-charts", inputs: ["options"], outputs: ["onChartReady"] }], encapsulation: i0.ViewEncapsulation.None });
4779
4856
  }
4780
4857
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DynamicFieldsComponent, decorators: [{
4781
4858
  type: Component,
@@ -4800,7 +4877,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
4800
4877
  ProgrammabilityService,
4801
4878
  GridService,
4802
4879
  ChartService
4803
- ], 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 [class]=\"getClass(component)\">\r\n <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n <!-- #region textfield -->\r\n <ng-container *ngSwitchCase=\"'textfield'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"text\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\r\n dropdown\r\n #select\r\n [register]=\"component\"\r\n [componentRef]=\"select\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"locale(Texts, 'TypeToSearch')\"></ngx-sirio-input>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 [refresh]=\"refreshValues(component)\"\r\n #taglist\r\n [register]=\"component\"\r\n [componentRef]=\"taglist\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"number\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n number\r\n [defaultValue]=\"evaluateNumber(component.defaultValue)\"\r\n [minimum]=\"evaluateNumber(component.minimum)\"\r\n [maximum]=\"evaluateNumber(component.maximum)\"\r\n [decimalDigits]=\"evaluateNumber(component.decimalDigits)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region date -->\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ngx-sirio-datepicker [ariaLabel]=\"evaluateString(locale(component, 'ariaDateLabel') || locale(component, 'dateLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'dateLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n isoDate\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]=\"evaluateString(locale(component, 'ariaTimeLabel') || locale(component, 'timeLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'timeLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region toggle -->\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <ngx-sirio-toggle [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"textarea\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-file-upload [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(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(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 {{ locale(Texts, 'Upload') }}\r\n </ngx-sirio-file-upload>\r\n <ng-container *ngIf=\"component.showDetails\">\r\n <app-dynamic-fields [formGroup]=\"formGroup\"\r\n [rows]=\"createUploadTables(component)\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </ng-container>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region range -->\r\n <ng-container *ngSwitchCase=\"'range'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-slider [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 dynamiclist -->\r\n <ng-container *ngSwitchCase=\"'dynamiclist'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [formArrayName]=\"component.key\"\r\n [repeat]=\"evaluateNumber(component.repetitions)\"\r\n [allowAddRemove]=\"evaluateBoolean(component.allowAddRemove)\">\r\n <p *ngIf=\"component.description\">{{ evaluateString(locale(component, 'description')) }}</p>\r\n <ng-container *ngIf=\"getFormArray(resolvePath(component.path).get(component.key)) as formArray\">\r\n <ng-container *ngIf=\"formArray.controls.length > 0\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\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]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [tabCount]=\"formArray.controls.length\"\r\n #dynamiclisttab>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\">\r\n <ng-container *ngIf=\"i === dynamiclisttab.activeIndex\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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]=\"formArray.controls.length\"\r\n #dynamiclistaccordion>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-accordion-panel #panel accordionPanel>\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\r\n <ng-container *ngIf=\"panel.panelIsOpen\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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 #dynamiclist\r\n [register]=\"component\"\r\n [componentRef]=\"dynamiclist\">\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <div [ngClass]=\"{'group-outline': component.showOutline === true, 'group-outline-repeat': true }\">\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 <label>{{ evaluateString(locale(component, 'label')) + ' ' + (i + 1) }}</label>\r\n <div>\r\n <app-dynamic-fields [formGroup]=\"getFormGroup(item)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\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>\r\n <ng-container *ngIf=\"component.allowAddRemove\">\r\n <ngx-sirio-button (click)=\"addItem(formArray)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ evaluateString(locale(component, 'addLabel') || locale(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 <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <div #group\r\n [register]=\"component\"\r\n [componentRef]=\"group\">\r\n <app-dynamic-fields [formGroup]=\"resolvePath(component.path)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region tab -->\r\n <ng-container *ngSwitchCase=\"'tab'\">\r\n <ngx-sirio-tab #tab\r\n [register]=\"component\"\r\n [componentRef]=\"tab\"\r\n [leftArrowLabel]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [isNavLine]=\"component.navigation\"\r\n [isVertical]=\"component.vertical\"\r\n tabControl>\r\n <ng-container *ngFor=\"let panel of component.panels; let i = index;\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(panel, 'label'))\"\r\n [icon]=\"evaluateString(panel.icon)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled) ?? false\"\r\n *ngIf=\"evaluateConditional(panel.conditional)\">\r\n <div *ngIf=\"i === tab.activeIndex\" [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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ngx-sirio-tab-item>\r\n </ng-container>\r\n </ngx-sirio-tab>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region accordion -->\r\n <ng-container *ngSwitchCase=\"'accordion'\">\r\n <ngx-sirio-accordion #accordion\r\n [register]=\"component\"\r\n [componentRef]=\"accordion\">\r\n <ng-container *ngFor=\"let panel of component.panels\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-accordion-panel *ngIf=\"evaluateConditional(panel.conditional)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled)\">\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(panel, 'label'))\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\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 </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region text -->\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div [collapse]=\"component.collapseTo\"\r\n [language]=\"language\"\r\n #text\r\n [register]=\"component\"\r\n [componentRef]=\"text\">\r\n <!--Reset View Context-->\r\n <div tabindex=\"0\" style=\"display:none\"></div>\r\n <div class=\"flex\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 [attr.aria-label]=\"locale(Texts, 'Information')\"\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(locale(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 [innerHTML]=\"sanitize(evaluateTemplate(locale(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(locale(component, 'alt'))\"\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 table -->\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n [gridOptions]=\"getGridOptions(component)\"\r\n (selectionChanged)=\"onGridSelectionChanged(component, $event)\"\r\n [rowSource]=\"(getRowSource(component) | async) || []\"\r\n [refresh]=\"refreshRowSource(component)\"\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 [disabled]=\"evaluateBoolean(component.disabled)\"\r\n #button\r\n [register]=\"component\"\r\n [componentRef]=\"button\">\r\n {{ evaluateString(locale(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 #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 [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 <label [for]=\"component.id\">{{ evaluateString(locale(component, 'label')) }}</label>\r\n <iframe [src]=\"evaluateUrl(component.url)\"\r\n [title]=\"evaluateString(locale(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 </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]=\"locale(Texts, 'Close')\"\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(locale(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 #notice\r\n [register]=\"component\"\r\n [componentRef]=\"notice\">\r\n <ngx-sirio-notify-body [title]=\"evaluateString(locale(component, 'title'))\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 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 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(locale(component, 'title')) }}\r\n </p>\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(component, 'text')))\">\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region chart -->\r\n <ng-container *ngSwitchCase=\"'chart'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-charts [options]=\"(getChartOptions(component) | async) ?? {}\"\r\n [observe]=\"getChartData(component)\"\r\n [callback]=\"invalidateChart(component)\"\r\n [style.height.px]=\"component.height\"\r\n #chart\r\n [register]=\"component\"\r\n [componentRef]=\"chart\" />\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\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:start}.field-set>.col-host>*{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-outline-repeat{margin-top:8px;margin-bottom:8px}.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-tab.sirio-tab-vertical .sirio-tab-body{margin-left:10px;margin-right:10px}.sirio-tab:not(.sirio-tab-vertical) .sirio-tab-body{margin-top:10px;margin-bottom:10px}.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-control.fp-disabled .sirio-input-group .sirio-input-group-text,.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{border:0px}.sirio-control.fp-readonly label:hover{color:#454d56}.sirio-control.fp-readonly input.sirio-form-control,.sirio-control.fp-readonly .sirio-dropdown .sirio-dropdown-select,.sirio-control.fp-readonly textarea.sirio-form-control{background:none!important;border:0px;padding:0}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{background:none}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text span{color:#5b6571}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text.prefix{padding-left:0}.sirio-upload.sirio-control.fp-readonly label,.sirio-upload.sirio-control.fp-disabled label{pointer-events:none}.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}.col-host .sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.col-host .sirio-accordion-body{overflow:unset!important}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-cell-value .btn-small-group{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.ag-cell-value .btn-small .sirio-btn{padding:.25rem .0625rem;margin:2px}ag-charts{display:block;height:100%;border-radius:8px;background-color:var(--chart-bg);border:1px solid var(--chart-border);overflow:hidden}\n"] }]
4880
+ ], 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 [class]=\"getClass(component)\">\r\n <div [hide]=\"evaluateBoolean(component.conditional?.hide)\"\r\n [show]=\"evaluateBoolean(component.conditional?.show)\">\r\n <!-- #region textfield -->\r\n <ng-container *ngSwitchCase=\"'textfield'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"text\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\r\n dropdown\r\n #select\r\n [register]=\"component\"\r\n [componentRef]=\"select\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-input *ngIf=\"component.searchable\" class=\"searchable\" type=\"text\" [placeholder]=\"locale(Texts, 'TypeToSearch')\"></ngx-sirio-input>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-select [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 [refresh]=\"refreshValues(component)\"\r\n #taglist\r\n [register]=\"component\"\r\n [componentRef]=\"taglist\">\r\n <ngx-sirio-select-panel>\r\n <ngx-sirio-select-option *ngFor=\"let option of (getValues(component) | async) || []\" [value]=\"option.value\">{{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"number\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(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 [formControlName]=\"component.key\"\r\n number\r\n [defaultValue]=\"evaluateNumber(component.defaultValue)\"\r\n [minimum]=\"evaluateNumber(component.minimum)\"\r\n [maximum]=\"evaluateNumber(component.maximum)\"\r\n [decimalDigits]=\"evaluateNumber(component.decimalDigits)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region date -->\r\n <ng-container *ngSwitchCase=\"'date'\">\r\n <ngx-sirio-datepicker [ariaLabel]=\"evaluateString(locale(component, 'ariaDateLabel') || locale(component, 'dateLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'dateLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n isoDate\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]=\"evaluateString(locale(component, 'ariaTimeLabel') || locale(component, 'timeLabel'))\"\r\n [label]=\"evaluateString(locale(component, 'timeLabel'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\r\n <!-- #region toggle -->\r\n <ng-container *ngSwitchCase=\"'toggle'\">\r\n <ngx-sirio-toggle [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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(locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [formControlName]=\"component.key\"\r\n validation\r\n [canValidate]=\"true\"\r\n [isWarning]=\"isWarning(component)\"\r\n [showWhenValid]=\"false\"\r\n [refresh]=\"refreshValues(component)\"\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 {{ locale(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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-input type=\"textarea\"\r\n [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [placeholder]=\"locale(component, 'placeholder') || ''\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [formControlName]=\"component.key\"\r\n [textcase]=\"component.textCase\"\r\n [maxlength]=\"evaluateNumber(component.maxLength)\"\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'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-file-upload [ariaLabel]=\"evaluateString(locale(component, 'ariaLabel') || locale(component, 'label'))\"\r\n [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(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(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 {{ locale(Texts, 'Upload') }}\r\n </ngx-sirio-file-upload>\r\n <ng-container *ngIf=\"component.showDetails\">\r\n <app-dynamic-fields [formGroup]=\"formGroup\"\r\n [rows]=\"createUploadTables(component)\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </ng-container>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region range -->\r\n <ng-container *ngSwitchCase=\"'range'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ngx-sirio-slider [label]=\"evaluateString(locale(component, 'label'))\"\r\n [labelPopover]=\"evaluateString(locale(component, 'tooltip'))\"\r\n [textHelp]=\"evaluateString(locale(component, 'description'))\"\r\n [textFeedback]=\"getTextFeedback(component)\"\r\n [readonly]=\"evaluateBoolean(component.readonly)\"\r\n [disableControl]=\"evaluateBoolean(component.disabled)\"\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 dynamiclist -->\r\n <ng-container *ngSwitchCase=\"'dynamiclist'\" [formGroup]=\"resolvePath(component.path)\">\r\n <ng-container [formArrayName]=\"component.key\"\r\n [repeat]=\"evaluateNumber(component.repetitions)\"\r\n [allowAddRemove]=\"evaluateBoolean(component.allowAddRemove)\">\r\n <p *ngIf=\"component.description\">{{ evaluateString(locale(component, 'description')) }}</p>\r\n <ng-container *ngIf=\"getFormArray(resolvePath(component.path).get(component.key)) as formArray\">\r\n <ng-container *ngIf=\"formArray.controls.length > 0\">\r\n <ng-container [ngSwitch]=\"component.subtype\">\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]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [tabCount]=\"formArray.controls.length\"\r\n #dynamiclisttab>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\">\r\n <ng-container *ngIf=\"i === dynamiclisttab.activeIndex\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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]=\"formArray.controls.length\"\r\n #dynamiclistaccordion>\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <ngx-sirio-accordion-panel #panel accordionPanel>\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(component, 'label')) + ' ' + (i + 1)\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\r\n <ng-container *ngIf=\"panel.panelIsOpen\">\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)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\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 #dynamiclist\r\n [register]=\"component\"\r\n [componentRef]=\"dynamiclist\">\r\n <ng-container *ngFor=\"let item of formArray.controls; let i = index;\" [formGroupName]=\"i\">\r\n <div [ngClass]=\"{'group-outline': component.showOutline === true, 'group-outline-repeat': true }\">\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 <label>{{ evaluateString(locale(component, 'label')) + ' ' + (i + 1) }}</label>\r\n <div>\r\n <app-dynamic-fields [formGroup]=\"getFormGroup(item)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></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(formArray, i)\" class=\"remove-item\" [color]=\"null\" icon=\"fas fa-trash\">{{ evaluateString(locale(component, 'removeLabel') || locale(Texts, 'RemoveItem')) }}</ngx-sirio-button>\r\n </div>\r\n </ng-container>\r\n </div>\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>\r\n <ng-container *ngIf=\"component.allowAddRemove\">\r\n <ngx-sirio-button (click)=\"addItem(formArray)\" class=\"add-item\" [color]=\"null\" icon=\"fas fa-plus\">{{ evaluateString(locale(component, 'addLabel') || locale(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 <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <div #group\r\n [register]=\"component\"\r\n [componentRef]=\"group\">\r\n <app-dynamic-fields [formGroup]=\"resolvePath(component.path)\"\r\n [rows]=\"component.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region tab -->\r\n <ng-container *ngSwitchCase=\"'tab'\">\r\n <ngx-sirio-tab #tab\r\n [register]=\"component\"\r\n [componentRef]=\"tab\"\r\n [leftArrowLabel]=\"locale(Texts, 'ScrollLeft')\"\r\n [rightArrowLabel]=\"locale(Texts, 'ScrollRight')\"\r\n [isNavLine]=\"component.navigation\"\r\n [isVertical]=\"component.vertical\"\r\n tabControl>\r\n <ng-container *ngFor=\"let panel of component.panels; let i = index;\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-tab-item [label]=\"evaluateString(locale(panel, 'label'))\"\r\n [icon]=\"evaluateString(panel.icon)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled) ?? false\"\r\n *ngIf=\"evaluateConditional(panel.conditional)\">\r\n <div *ngIf=\"i === tab.activeIndex\" [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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\r\n </div>\r\n </ngx-sirio-tab-item>\r\n </ng-container>\r\n </ngx-sirio-tab>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region accordion -->\r\n <ng-container *ngSwitchCase=\"'accordion'\">\r\n <ngx-sirio-accordion #accordion\r\n [register]=\"component\"\r\n [componentRef]=\"accordion\">\r\n <ng-container *ngFor=\"let panel of component.panels\">\r\n <ng-container *disableForm=\"{\r\n disabled: evaluateBoolean(panel.disabled),\r\n formGroup: formGroup,\r\n path: panel.path\r\n }\">\r\n </ng-container>\r\n <ngx-sirio-accordion-panel *ngIf=\"evaluateConditional(panel.conditional)\"\r\n [disabled]=\"evaluateBoolean(panel.disabled)\">\r\n <ngx-sirio-accordion-header>\r\n <span [innerText]=\"evaluateString(locale(panel, 'label'))\"></span>\r\n </ngx-sirio-accordion-header>\r\n <ngx-sirio-accordion-body>\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]=\"resolvePath(panel.path)\"\r\n [rows]=\"getTemplate(panel.template)?.rows\"\r\n [language]=\"language\"></app-dynamic-fields>\r\n </div>\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 </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region text -->\r\n <ng-container *ngSwitchCase=\"'text'\">\r\n <div [collapse]=\"component.collapseTo\"\r\n [language]=\"language\"\r\n #text\r\n [register]=\"component\"\r\n [componentRef]=\"text\">\r\n <!--Reset View Context-->\r\n <div tabindex=\"0\" style=\"display:none\"></div>\r\n <div class=\"flex\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 [attr.aria-label]=\"locale(Texts, 'Information')\"\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(locale(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 [innerHTML]=\"sanitize(evaluateTemplate(locale(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(locale(component, 'alt'))\"\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 table -->\r\n <ng-container *ngSwitchCase=\"'table'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-grid-angular [modules]=\"getGridModules(component)\"\r\n [gridOptions]=\"getGridOptions(component)\"\r\n (selectionChanged)=\"onGridSelectionChanged(component, $event)\"\r\n [rowSource]=\"(getRowSource(component) | async) || []\"\r\n [refresh]=\"refreshRowSource(component)\"\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 [disabled]=\"evaluateBoolean(component.disabled)\"\r\n #button\r\n [register]=\"component\"\r\n [componentRef]=\"button\">\r\n {{ evaluateString(locale(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 #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 [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 <label [for]=\"component.id\">{{ evaluateString(locale(component, 'label')) }}</label>\r\n <iframe [src]=\"evaluateUrl(component.url)\"\r\n [title]=\"evaluateString(locale(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 </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]=\"locale(Texts, 'Close')\"\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(locale(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 #notice\r\n [register]=\"component\"\r\n [componentRef]=\"notice\">\r\n <ngx-sirio-notify-body [title]=\"evaluateString(locale(component, 'title'))\">\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(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 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 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(locale(component, 'title')) }}\r\n </p>\r\n <div class=\"text-paragraph\"\r\n [innerHTML]=\"toHTML(evaluateTemplate(locale(component, 'text')))\">\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n <!-- #region chart -->\r\n <ng-container *ngSwitchCase=\"'chart'\">\r\n <label>{{ evaluateString(locale(component, 'label')) }}</label>\r\n <ag-charts [options]=\"(getChartOptions(component) | async) ?? {}\"\r\n [observe]=\"getChartData(component)\"\r\n [callback]=\"invalidateChart(component)\"\r\n [style.height.px]=\"component.height\"\r\n #chart\r\n [register]=\"component\"\r\n [componentRef]=\"chart\" />\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\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:start}.field-set>.col-host>*{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-outline-repeat{margin-top:8px;margin-bottom:8px}.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-tab.sirio-tab-vertical .sirio-tab-body{margin-left:10px;margin-right:10px}.sirio-tab:not(.sirio-tab-vertical) .sirio-tab-body{margin-top:10px;margin-bottom:10px}.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-control.fp-disabled .sirio-input-group .sirio-input-group-text,.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{border:0px}.sirio-control.fp-readonly label:hover{color:#454d56}.sirio-control.fp-readonly input.sirio-form-control,.sirio-control.fp-readonly .sirio-dropdown .sirio-dropdown-select,.sirio-control.fp-readonly textarea.sirio-form-control{background:none!important;border:0px;padding:0}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text{background:none}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text span{color:#5b6571}.sirio-control.fp-readonly .sirio-input-group .sirio-input-group-text.prefix{padding-left:0}.sirio-upload.sirio-control.fp-readonly label,.sirio-upload.sirio-control.fp-disabled label{pointer-events:none}.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}.col-host .sirio-accordion .sirio-accordion-body .sirio-accordion-content{padding:16px}.col-host .sirio-accordion-body{overflow:unset!important}.ag-header-cell.hide-filter .ag-header-cell-filter-button{display:none}.sirio-tab.sirio-tab-scroll{display:block}.sirio-dropdown .searchable{position:absolute;width:100%;display:none;left:0}.ag-cell-value .btn-small-group{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.ag-cell-value .btn-small .sirio-btn{padding:.25rem .0625rem;margin:2px}.ag-selection-checkbox .ag-checkbox-input-wrapper.ag-disabled{display:none}ag-charts{display:block;height:100%;border-radius:8px;background-color:var(--chart-bg);border:1px solid var(--chart-border);overflow:hidden}\n"] }]
4804
4881
  }], ctorParameters: () => [{ type: SanitizeService }, { type: MarkdownService }, { type: MimeService }, { type: ProgrammabilityService }, { type: EventService }, { type: WeakService }, { type: RegisterService }, { type: MetadataService }, { type: GridService }, { type: ChartService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { rows: [{
4805
4882
  type: Input
4806
4883
  }], formGroup: [{
@@ -5607,9 +5684,105 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
5607
5684
  }]
5608
5685
  }], ctorParameters: () => [{ type: i1$4.HttpClient }] });
5609
5686
 
5687
+ class DefaultConfirmationController {
5688
+ dialogService;
5689
+ constructor(dialogService) {
5690
+ this.dialogService = dialogService;
5691
+ }
5692
+ confirm(message, title) {
5693
+ return new Observable(observer => {
5694
+ const options = {
5695
+ title: title,
5696
+ type: 'info',
5697
+ onResult: result => {
5698
+ if (result.action === 'Yes') {
5699
+ observer.next(true);
5700
+ }
5701
+ else {
5702
+ observer.next(false);
5703
+ }
5704
+ observer.complete();
5705
+ }
5706
+ };
5707
+ this.dialogService.confirm(message ?? "", options);
5708
+ });
5709
+ }
5710
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultConfirmationController, deps: [{ token: DialogService }], target: i0.ɵɵFactoryTarget.Injectable });
5711
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultConfirmationController, providedIn: 'root' });
5712
+ }
5713
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultConfirmationController, decorators: [{
5714
+ type: Injectable,
5715
+ args: [{
5716
+ providedIn: 'root'
5717
+ }]
5718
+ }], ctorParameters: () => [{ type: DialogService }] });
5719
+
5720
+ class DefaultNotificationController {
5721
+ toast;
5722
+ constructor(toast) {
5723
+ this.toast = toast;
5724
+ }
5725
+ notify(type, message, title) {
5726
+ const delay = 5000;
5727
+ switch (type) {
5728
+ case 'info':
5729
+ this.toast.notifyInfo(message, title, delay);
5730
+ break;
5731
+ case 'warning':
5732
+ this.toast.notifyWarning(message, title, delay);
5733
+ break;
5734
+ case 'error':
5735
+ this.toast.notifyError(message, title, delay);
5736
+ break;
5737
+ case 'success':
5738
+ this.toast.notifySuccess(message, title, delay);
5739
+ break;
5740
+ default: break;
5741
+ }
5742
+ }
5743
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultNotificationController, deps: [{ token: ToastService }], target: i0.ɵɵFactoryTarget.Injectable });
5744
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultNotificationController, providedIn: 'root' });
5745
+ }
5746
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultNotificationController, decorators: [{
5747
+ type: Injectable,
5748
+ args: [{
5749
+ providedIn: 'root'
5750
+ }]
5751
+ }], ctorParameters: () => [{ type: ToastService }] });
5752
+
5753
+ class DefaultPromptController {
5754
+ dialogService;
5755
+ constructor(dialogService) {
5756
+ this.dialogService = dialogService;
5757
+ }
5758
+ prompt(message, defaultValue, title) {
5759
+ return new Observable(observer => {
5760
+ const options = {
5761
+ title: title,
5762
+ type: 'info',
5763
+ onResult: result => {
5764
+ if (result.action === 'OK') {
5765
+ observer.next(result.value.input);
5766
+ }
5767
+ observer.complete();
5768
+ }
5769
+ };
5770
+ this.dialogService.prompt(message ?? "Prompt", defaultValue, options);
5771
+ });
5772
+ }
5773
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultPromptController, deps: [{ token: DialogService }], target: i0.ɵɵFactoryTarget.Injectable });
5774
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultPromptController, providedIn: 'root' });
5775
+ }
5776
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultPromptController, decorators: [{
5777
+ type: Injectable,
5778
+ args: [{
5779
+ providedIn: 'root'
5780
+ }]
5781
+ }], ctorParameters: () => [{ type: DialogService }] });
5782
+
5610
5783
  /**
5611
5784
  * Generated bundle index. Do not edit.
5612
5785
  */
5613
5786
 
5614
- export { DataService, DialogService, DynamicFormComponent, FeelService, MarkdownService, SanitizeService, ScopeService, ToastService, toFormData };
5787
+ export { DataService, DefaultConfirmationController, DefaultNotificationController, DefaultPromptController, DialogService, DynamicFormComponent, FeelService, MarkdownService, SanitizeService, ScopeService, ToastService, toFormData };
5615
5788
  //# sourceMappingURL=wemake4u-form-player-se.mjs.map