@igo2/common 1.13.0-alpha.0 → 1.13.0-alpha.1

package/fesm2020/igo2-common.mjs

@@ -30,7 +30,7 @@ import * as i3$1 from '@angular/material/core';
 import * as i5 from '@angular/material/table';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import * as i1$4 from '@angular/forms';
-import { UntypedFormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
+import { FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import moment from 'moment';
 import * as i2$1 from '@angular/cdk/a11y';
 import * as i6 from '@angular/material/autocomplete';
@@ -2717,7 +2717,7 @@ class EntityTableComponent {
         this._defaultErrorStateMatcher = _defaultErrorStateMatcher;
         this.dateAdapter = dateAdapter;
         this.entitySortChange$ = new BehaviorSubject(false);
-        this.formGroup = new UntypedFormGroup({});
+        this.formGroup = new FormGroup({});
         /**
          * Reference to the column renderer types
          * @internal
@@ -3378,7 +3378,7 @@ class EntityTableComponent {
         return column;
     }
 }
-EntityTableComponent.ɵfac = function EntityTableComponent_Factory(t) { return new (t || EntityTableComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1$4.UntypedFormBuilder), i0.ɵɵdirectiveInject(i2$1.FocusMonitor), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1$4.NgControl, 10), i0.ɵɵdirectiveInject(i1$4.NgForm, 8), i0.ɵɵdirectiveInject(i1$4.FormControlName, 8), i0.ɵɵdirectiveInject(i3$1.ErrorStateMatcher), i0.ɵɵdirectiveInject(i3$1.DateAdapter)); };
+EntityTableComponent.ɵfac = function EntityTableComponent_Factory(t) { return new (t || EntityTableComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1$4.FormBuilder), i0.ɵɵdirectiveInject(i2$1.FocusMonitor), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1$4.NgControl, 10), i0.ɵɵdirectiveInject(i1$4.NgForm, 8), i0.ɵɵdirectiveInject(i1$4.FormControlName, 8), i0.ɵɵdirectiveInject(i3$1.ErrorStateMatcher), i0.ɵɵdirectiveInject(i3$1.DateAdapter)); };
 EntityTableComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EntityTableComponent, selectors: [["igo-entity-table"]], inputs: { store: "store", paginator: "paginator", template: "template", scrollBehavior: "scrollBehavior", sortNullsFirst: "sortNullsFirst", withPaginator: "withPaginator", paginatorOptions: "paginatorOptions" }, outputs: { entityClick: "entityClick", entitySelectChange: "entitySelectChange", entitySortChange: "entitySortChange" }, features: [i0.ɵɵProvidersFeature([{ provide: MatFormFieldControl, useExisting: EntityTableComponent }]), i0.ɵɵNgOnChangesFeature], decls: 9, vars: 8, consts: [[1, "table-container"], ["mat-table", "", "matSort", "", 3, "ngClass", "dataSource", "trackBy", "matSortChange"], ["matColumnDef", "selectionCheckbox", 1, "mat-cell-checkbox"], ["mat-header-cell", "", 4, "matHeaderCellDef"], ["mat-cell", "", 4, "matCellDef"], [3, "matColumnDef", 4, "ngFor", "ngForOf"], ["mat-header-row", "", 3, "ngClass", 4, "matHeaderRowDef", "matHeaderRowDefSticky"], ["mat-row", "", "igoEntityTableRow", "", 3, "scrollBehavior", "ngClass", "selection", "selected", "select", "click", 4, "matRowDef", "matRowDefColumns"], [3, "store", "paginatorOptions", "entitySortChange$", "paginatorChange", 4, "ngIf"], ["mat-header-cell", ""], [4, "ngIf"], [3, "checked", "indeterminate", "change"], ["mat-cell", ""], [3, "checked", "mousedown", "click", "change"], [3, "matColumnDef"], ["mat-header-cell", "", "mat-sort-header", "", 3, "matTooltip", 4, "matHeaderCellDef"], ["mat-header-cell", "", "mat-sort-header", "", 3, "matTooltip"], ["mat-header-cell", "", 3, "matTooltip", 4, "matHeaderCellDef"], ["mat-header-cell", "", 3, "matTooltip"], [4, "matCellDef"], ["mat-cell", "", "class", "mat-cell-text", 3, "ngClass", 4, "ngIf", "ngIfElse"], ["isAnUrlDefault", ""], ["mat-cell", "", 1, "mat-cell-text", 3, "ngClass"], ["target", "_blank", "rel", "noopener noreferrer", 3, "href", "click"], ["width", "50", "heigth", "auto", 3, "src", 4, "ngIf", "ngIfElse"], ["notImg", ""], ["width", "50", "heigth", "auto", 3, "src"], ["mat-cell", "", "class", "mat-cell-text", 3, "ngClass", "innerHTML", 4, "ngIf", "ngIfElse"], ["isAnUrlHTML", ""], ["mat-cell", "", 1, "mat-cell-text", 3, "ngClass", "innerHTML"], ["mat-cell", "", "class", "mat-cell-text edition", 3, "formGroup", "ngClass", 4, "ngIf", "ngIfElse"], ["isUnsanitizedHTML", ""], ["mat-cell", "", 1, "mat-cell-text", "edition", 3, "formGroup", "ngClass"], ["class", "date-picker", 4, "ngIf"], ["matInput", "", "type", "time", "step", "900", 3, "formControlName", "focus", "keypress", "blur", 4, "ngIf"], ["matInput", "", "type", "number", "class", "class_number_edition", 3, "formControlName", "step", "value", "readonly", "required", "min", "max", "input", 4, "ngIf"], ["matInput", "", "type", "text", 3, "formControlName", "value", "readonly", "required", "input", 4, "ngIf"], [3, "formControlName", "checked", "change", 4, "ngIf"], [3, "required", "formControlName", "multiple", "value", "selectionChange", 4, "ngIf"], ["matInput", "", "type", "text", 3, "formControlName", "matAutocomplete", "required", "value", 4, "ngIf"], ["panelWidth", "430px", 3, "optionSelected"], ["auto", "matAutocomplete"], [3, "value", 4, "ngFor", "ngForOf"], [1, "date-picker"], ["matSuffix", "", 3, "for"], ["matInput", "", 3, "matDatepicker", "formControlName", "value", "dateChange"], ["picker", ""], ["matInput", "", "type", "time", "step", "900", 3, "formControlName", "focus", "keypress", "blur"], ["matInput", "", "type", "number", 1, "class_number_edition", 3, "formControlName", "step", "value", "readonly", "required", "min", "max", "input"], ["matInput", "", "type", "text", 3, "formControlName", "value", "readonly", "required", "input"], [3, "formControlName", "checked", "change"], [3, "required", "formControlName", "multiple", "value", "selectionChange"], [3, "value", "disabled", 4, "ngFor", "ngForOf"], [3, "value", "disabled"], ["matInput", "", "type", "text", 3, "formControlName", "matAutocomplete", "required", "value"], [3, "value"], ["isAnUrlUnsanitizedHTML", ""], ["mat-cell", "", "class", "mat-cell-text", 3, "ngClass", 4, "matCellDef"], [3, "svgIcon", "click"], [4, "ngFor", "ngForOf"], ["igoStopPropagation", "", "mat-icon-button", "", 3, "color", "disabled", "mousedown", 4, "ngIf"], ["igoStopPropagation", "", "mat-mini-fab", "", 3, "color", "disabled", "mousedown", 4, "ngIf"], ["igoStopPropagation", "", "mat-icon-button", "", 3, "color", "disabled", "mousedown"], [3, "svgIcon"], ["igoStopPropagation", "", "mat-mini-fab", "", 3, "color", "disabled", "mousedown"], ["mat-header-row", "", 3, "ngClass"], ["mat-row", "", "igoEntityTableRow", "", 3, "scrollBehavior", "ngClass", "selection", "selected", "select", "click"], [3, "store", "paginatorOptions", "entitySortChange$", "paginatorChange"]], template: function EntityTableComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "div", 0)(1, "table", 1);
         i0.ɵɵlistener("matSortChange", function EntityTableComponent_Template_table_matSortChange_1_listener($event) { return ctx.onSort($event); });
@@ -3407,7 +3407,7 @@ EntityTableComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Entity
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EntityTableComponent, [{
         type: Component,
         args: [{ selector: 'igo-entity-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: EntityTableComponent }], template: "<div class=\"table-container\">\r\n  <table mat-table matSort [ngClass]=\"getTableClass()\" [dataSource]=\"dataSource\" [trackBy]=\"getTrackByFunction()\" (matSortChange)=\"onSort($event)\">\r\n      <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\r\n          <th mat-header-cell *matHeaderCellDef>\r\n              <ng-container *ngIf=\"selectMany\">\r\n                  <ng-container *ngIf=\"selectionState$ | async as selectionState\">\r\n                      <mat-checkbox (change)=\"onToggleRows($event.checked)\" [checked]=\"selectionState === entityTableSelectionState.All\"\r\n                      [indeterminate]=\"selectionState === entityTableSelectionState.Some\">\r\n                      </mat-checkbox>\r\n                  </ng-container>\r\n              </ng-container>\r\n          </th>\r\n          <td mat-cell *matCellDef=\"let record\">\r\n              <mat-checkbox (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\" (click)=\"$event.shiftKey ?\r\n              onShiftToggleRow(!rowIsSelected(record), record, $event) : $event.stopPropagation()\" (change)=\"onToggleRow($event.checked,record)\"\r\n              [checked]=\"rowIsSelected(record)\">\r\n              </mat-checkbox>\r\n          </td>\r\n      </ng-container>\r\n\r\n      <ng-container [matColumnDef]=\"column.name\" *ngFor=\"let column of template.columns\">\r\n          <ng-container *ngIf=\"columnIsSortable(column)\">\r\n              <th mat-header-cell *matHeaderCellDef mat-sort-header [matTooltip]=\"column.tooltip ? column.tooltip : undefined\">\r\n                  {{column.title}}\r\n              </th>\r\n          </ng-container>\r\n\r\n          <ng-container *ngIf=\"!columnIsSortable(column)\">\r\n              <th mat-header-cell *matHeaderCellDef [matTooltip]=\"column.tooltip ? column.tooltip : undefined\">\r\n                  {{column.title}}\r\n              </th>\r\n          </ng-container>\r\n\r\n          <ng-container *ngIf=\"getColumnRenderer(column) as columnRenderer\">\r\n              <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Default\">\r\n                  <ng-container *matCellDef=\"let record\">\r\n                      <td mat-cell class=\"mat-cell-text\" *ngIf=\"!isUrl(getValue(record, column));else isAnUrlDefault\" [ngClass]=\"getCellClass(record, column)\">\r\n                          {{getValue(record, column)}}\r\n                      </td>\r\n                      <ng-template #isAnUrlDefault>\r\n                          <td mat-cell class=\"mat-cell-text\" [ngClass]=\"getCellClass(record, column)\">\r\n                              <a href=\"{{getValue(record, column)}}\" target='_blank' rel=\"noopener noreferrer\" (click)=\"$event.stopPropagation()\">\r\n                                  <img *ngIf=\"isImg(getValue(record, column));else notImg\" src=\"{{(getValue(record, column) | secureImage) | async}}\" width=\"50\" heigth=\"auto\">\r\n                                  <ng-template #notImg><span>{{\r\n                    'igo.common.entity-table.targetHtmlUrl' | translate }}\r\n                  </span></ng-template>\r\n                              </a>\r\n                          </td>\r\n                      </ng-template>\r\n                  </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.HTML\">\r\n                  <ng-container *matCellDef=\"let record\">\r\n                      <td mat-cell class=\"mat-cell-text\" *ngIf=\"!isUrl(getValue(record, column));else isAnUrlHTML\" [ngClass]=\"getCellClass(record, column)\"\r\n                      [innerHTML]=\"getValue(record, column)\">\r\n                      </td>\r\n                      <ng-template #isAnUrlHTML>\r\n                          <td mat-cell class=\"mat-cell-text\" [ngClass]=\"getCellClass(record, column)\">\r\n                              <a href=\"{{getValue(record, column)}}\" target='_blank' rel=\"noopener noreferrer\" (click)=\"$event.stopPropagation()\">\r\n                                  <img *ngIf=\"isImg(getValue(record, column));else notImg\" src=\"{{(getValue(record, column) | secureImage) | async}}\" width=\"50\" heigth=\"auto\">\r\n                                  <ng-template #notImg><span>{{ 'igo.geo.targetHtmlUrl' |\r\n                    translate }} </span></ng-template>\r\n                              </a>\r\n                          </td>\r\n                      </ng-template>\r\n                  </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.UnsanitizedHTML\">\r\n                  <ng-container *matCellDef=\"let record\">\r\n                      <td mat-cell class=\"mat-cell-text edition\" [formGroup]=\"formGroup\" *ngIf=\"isEdition(record);else isUnsanitizedHTML\"\r\n                      [ngClass]=\"getCellClass(record, column)\">\r\n                          <div class=\"date-picker\" *ngIf=\"column.type === 'date'\">\r\n                              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n                              <input matInput [matDatepicker]=\"picker\" [formControlName]=\"column.name\" value=\"{{getValue(record, column)}}\"\r\n                              (dateChange)=\"onDateChange(column.name, record, $event)\">\r\n                              <mat-datepicker #picker></mat-datepicker>\r\n                          </div>\r\n                          <input matInput type=\"time\" *ngIf=\"column.type === 'time'\" [formControlName]=\"column.name\" step=\"900\" (focus)=\"column.onFocus($event)\"\r\n                          (keypress)=\"column.onChange($event)\" (blur)=\"column.onBlur($event)\">\r\n                          <input matInput type=\"number\" class=\"class_number_edition\" *ngIf=\"column.type === 'number'\" [formControlName]=\"column.name\" step=\"{{column.step}}\"\r\n                          value=\"{{getValue(record,column)}}\" (input)=\"onValueChange(column.name, record, $event)\"\r\n                          readonly=\"{{getValidationAttributeValue(column, 'readonly')}}\" required=\"{{getValidationAttributeValue(column, 'mandatory')}}\"\r\n                          min=\"{{getValidationAttributeValue(column, 'minValue')}}\" max=\"{{getValidationAttributeValue(column, 'maxValue')}}\">\r\n                          <input matInput type=\"text\" *ngIf=\"!column.type || column.type ==='string'\" [formControlName]=\"column.name\"\r\n                          value=\"{{getValue(record, column)}}\" (input)=\"onValueChange(column.name, record, $event)\"\r\n                          readonly=\"{{getValidationAttributeValue(column, 'readonly')}}\" required=\"{{getValidationAttributeValue(column, 'mandatory')}}\">\r\n                          <mat-checkbox *ngIf=\"column.type === 'boolean'\" [formControlName]=\"column.name\" [checked]=\"getValue(record,column)\"\r\n                          (change)=\"onBooleanValueChange(column.name, record,$event)\"></mat-checkbox>\r\n                          <mat-select *ngIf=\"column.type === 'list'\" required=\"{{getValidationAttributeValue(column, 'mandatory')}}\"\r\n                          [formControlName]=\"column.name\" [multiple]=\"column.multiple\" (selectionChange)=\"onSelectValueChange(column.name, record, $event)\"\r\n                          [value]=\"getValue(record, column)\">\r\n                              <mat-option *ngFor=\"let option of column.domainValues\" [value]=\"option.id\" [disabled]=\"option.disabled\">\r\n                                  {{ option.value }}\r\n                              </mat-option>\r\n                          </mat-select>\r\n                          <input matInput type=\"text\" [formControlName]=\"column.name\" *ngIf=\"column.type === 'autocomplete'\"\r\n                          [matAutocomplete]=\"auto\" required=\"{{getValidationAttributeValue(column, 'mandatory')}}\" value=\"{{getValue(record, column)}}\">\r\n                              <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onAutocompleteValueChange(column.name, record, $event)\"\r\n                              panelWidth=\"430px\">\r\n                                  <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option.id\">\r\n                                      {{ option.value }}\r\n                                  </mat-option>\r\n                              </mat-autocomplete>\r\n                      </td>\r\n                      <ng-template #isUnsanitizedHTML>\r\n                          <td mat-cell class=\"mat-cell-text\" *ngIf=\"!isUrl(getValue(record, column));else isAnUrlUnsanitizedHTML\" [ngClass]=\"getCellClass(record, column)\"\r\n                          [innerHTML]=\"getValue(record, column) | sanitizeHtml\">\r\n                          </td>\r\n                          <ng-template #isAnUrlUnsanitizedHTML>\r\n                              <td mat-cell class=\"mat-cell-text\" [ngClass]=\"getCellClass(record, column)\">\r\n                                  <a href=\"{{getValue(record, column)}}\" target='_blank' rel=\"noopener noreferrer\" (click)=\"$event.stopPropagation()\">\r\n                                      <img *ngIf=\"isImg(getValue(record, column));else notImg\" src=\"{{(getValue(record, column) | secureImage) | async}}\" width=\"50\" heigth=\"auto\">\r\n                                      <ng-template #notImg><span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span></ng-template>\r\n                                  </a>\r\n                              </td>\r\n                          </ng-template>\r\n                      </ng-template>\r\n                  </ng-container>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.Icon\">\r\n                  <td mat-cell *matCellDef=\"let record\" class=\"mat-cell-text\" [ngClass]=\"getCellClass(record, column)\">\r\n                      <mat-icon svgIcon=\"{{getValue(record, column)|| column.icon}}\" (click)=\"column.onClick($event)\"></mat-icon>\r\n                  </td>\r\n              </ng-container>\r\n              <ng-container *ngIf=\"columnRenderer === entityTableColumnRenderer.ButtonGroup\">\r\n                  <ng-container *matCellDef=\"let record\">\r\n                      <td mat-cell class=\"mat-cell-text\" [ngClass]=\"getCellClass(record, column)\">\r\n                          <span *ngFor=\"let button of getValue(record, column)\">\r\n                              <ng-container *ngIf=\"isEdition(record) === button.editMode\">\r\n                                  <button *ngIf=\"button.style === 'mat-icon-button'\" igoStopPropagation mat-icon-button\r\n                                      [color]=\"button.color\" (mousedown)=\"onButtonClick(button.click, record)\" [disabled]=\"button.disabled\">\r\n                                      <mat-icon svgIcon=\"{{button.icon}}\"></mat-icon>\r\n                                  </button>\r\n                                  <button *ngIf=\"button.style !== 'mat-icon-button'\" igoStopPropagation mat-mini-fab\r\n                                      [color]=\"button.color\" (mousedown)=\"onButtonClick(button.click, record)\" [disabled]=\"button.disabled\">\r\n                                      <mat-icon svgIcon=\"{{button.icon}}\"></mat-icon>\r\n                                  </button>\r\n                              </ng-container>\r\n                          </span>\r\n                      </td>\r\n                  </ng-container>\r\n              </ng-container>\r\n          </ng-container>\r\n      </ng-container>\r\n\r\n      <tr mat-header-row *matHeaderRowDef=\"headers; sticky: fixedHeader;\" [ngClass]=\"getHeaderClass()\">\r\n      </tr>\r\n      <tr mat-row igoEntityTableRow *matRowDef=\"let record; columns: headers;\" [scrollBehavior]=\"scrollBehavior\" [ngClass]=\"getRowClass(record)\" [selection]=\"selection\" [selected]=\"rowIsSelected(record)\" (select)=\"onRowSelect(record)\" (click)=\"onRowClick(record)\">\r\n      </tr>\r\n  </table>\r\n  <igo-entity-table-paginator *ngIf=\"withPaginator\" [store]=\"store\" [paginatorOptions]=\"paginatorOptions\" [entitySortChange$]=\"entitySortChange$\" (paginatorChange)=\"paginatorChange($event)\">\r\n  </igo-entity-table-paginator>\r\n</div>", styles: [":host{width:100%;height:100%;display:block}:host.table-compact tr.mat-header-row,:host.table-compact ::ng-deep .mat-checkbox .mat-checkbox-ripple{height:36px}:host.table-compact tr.mat-row,:host.table-compact ::ng-deep .mat-checkbox .mat-checkbox-ripple{height:28px}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}th.mat-header-cell,td.mat-cell,td.mat-footer-cell{padding:0 3px}entity-table table.igo-entity-table-with-selection tr:hover{-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_sting,.class_text,.class_number_edition{text-align:left}td.edition{background:rgba(166,166,166,.2)}input{border-bottom:1px solid darkgrey}\n"] }]
-    }], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$4.UntypedFormBuilder }, { type: i2$1.FocusMonitor }, { type: i0.ElementRef }, { type: i1$4.NgControl, decorators: [{
+    }], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$4.FormBuilder }, { type: i2$1.FocusMonitor }, { type: i0.ElementRef }, { type: i1$4.NgControl, decorators: [{
                 type: Optional
             }, {
                 type: Self
@@ -5693,14 +5693,14 @@ class FormService {
         return Validators[name](args);
     }
 }
-FormService.ɵfac = function FormService_Factory(t) { return new (t || FormService)(i0.ɵɵinject(i1$4.UntypedFormBuilder)); };
+FormService.ɵfac = function FormService_Factory(t) { return new (t || FormService)(i0.ɵɵinject(i1$4.FormBuilder)); };
 FormService.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: FormService, factory: FormService.ɵfac, providedIn: 'root' });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormService, [{
         type: Injectable,
         args: [{
                 providedIn: 'root'
             }]
-    }], function () { return [{ type: i1$4.UntypedFormBuilder }]; }, null); })();
+    }], function () { return [{ type: i1$4.FormBuilder }]; }, null); })();
 
 /**
  * Service where all available form fields are registered.
@@ -7876,10 +7876,10 @@ ListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ListComponent
         i0.ɵɵelementEnd();
     } if (rf & 2) {
         i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(1, _c0$4, ctx.selection));
-    } }, dependencies: [i1.NgClass, i2$3.MatList, ClickoutDirective], styles: ["[_nghost-%COMP%]{display:block;height:100%;overflow:auto;position:relative}mat-list[_ngcontent-%COMP%]{padding-top:0}[_nghost-%COMP%]{position:static}[_nghost-%COMP%]     .mat-list .mat-list-item .mat-list-text>*{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-with-avatar .mat-list-item-content{display:-webkit-flex;height:46px;padding:3px}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-with-avatar{height:46px}[_nghost-%COMP%]     .mat-list   igo-collapsible>.mat-list-item>.mat-list-item-content>.mat-list-text>.mat-line{font-weight:700;opacity:.9}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-with-avatar .mat-list-item-content>mat-icon{padding:8px}[_nghost-%COMP%]     [igolistitem] mat-list-item [mat-list-avatar]{height:auto;width:40px}[_nghost-%COMP%]   mat-list.selectable[_ngcontent-%COMP%]     [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}[_nghost-%COMP%]     [igolistitem]:focus{outline:none}"] });
+    } }, dependencies: [i1.NgClass, i2$3.MatList, ClickoutDirective], styles: ["[_nghost-%COMP%]{display:block;height:100%;overflow:auto;position:relative}mat-list[_ngcontent-%COMP%]{padding-top:0}[_nghost-%COMP%]{position:static}[_nghost-%COMP%]     .mat-list .mat-list-item .mat-list-text>*{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-avatar .mat-list-item-content{display:-webkit-flex;height:46px;padding:3px}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-avatar{height:46px}[_nghost-%COMP%]     .mat-list   igo-collapsible>.mat-list-item>.mat-list-item-content>.mat-list-text>.mat-line{font-weight:700;opacity:.9}[_nghost-%COMP%]     .mat-list .mat-list-item.mat-list-item-avatar .mat-list-item-content>mat-icon{padding:8px}[_nghost-%COMP%]     [igolistitem] mat-list-item [mat-list-avatar]{height:auto;width:40px}[_nghost-%COMP%]   mat-list.selectable[_ngcontent-%COMP%]     [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}[_nghost-%COMP%]     [igolistitem]:focus{outline:none}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ListComponent, [{
         type: Component,
-        args: [{ selector: 'igo-list', template: "<mat-list\r\n  igoClickout\r\n  [ngClass]=\"{'selectable': selection}\"\r\n  (clickout)=\"disableNavigation()\"\r\n  (click)=\"enableNavigation()\">\r\n  <ng-content></ng-content>\r\n</mat-list>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}mat-list{padding-top:0}:host{position:static}:host ::ng-deep .mat-list .mat-list-item .mat-list-text>*{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-with-avatar .mat-list-item-content{display:-webkit-flex;height:46px;padding:3px}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-with-avatar{height:46px}:host ::ng-deep .mat-list ::ng-deep igo-collapsible>.mat-list-item>.mat-list-item-content>.mat-list-text>.mat-line{font-weight:700;opacity:.9}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-with-avatar .mat-list-item-content>mat-icon{padding:8px}:host ::ng-deep [igolistitem] mat-list-item [mat-list-avatar]{height:auto;width:40px}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"] }]
+        args: [{ selector: 'igo-list', template: "<mat-list\r\n  igoClickout\r\n  [ngClass]=\"{'selectable': selection}\"\r\n  (clickout)=\"disableNavigation()\"\r\n  (click)=\"enableNavigation()\">\r\n  <ng-content></ng-content>\r\n</mat-list>\r\n", styles: [":host{display:block;height:100%;overflow:auto;position:relative}mat-list{padding-top:0}:host{position:static}:host ::ng-deep .mat-list .mat-list-item .mat-list-text>*{white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;max-height:36px;line-height:18px;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-avatar .mat-list-item-content{display:-webkit-flex;height:46px;padding:3px}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-avatar{height:46px}:host ::ng-deep .mat-list ::ng-deep igo-collapsible>.mat-list-item>.mat-list-item-content>.mat-list-text>.mat-line{font-weight:700;opacity:.9}:host ::ng-deep .mat-list .mat-list-item.mat-list-item-avatar .mat-list-item-content>mat-icon{padding:8px}:host ::ng-deep [igolistitem] mat-list-item [mat-list-avatar]{height:auto;width:40px}:host mat-list.selectable ::ng-deep [igolistitem]:not(.igo-list-item-disabled) mat-list-item:hover{cursor:pointer}:host ::ng-deep [igolistitem]:focus{outline:none}\n"] }]
     }], function () { return [{ type: i0.ElementRef }]; }, { navigation: [{
             type: Input
         }], selection: [{