@igo2/common 1.13.2 → 1.13.3

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.
@@ -21,7 +21,7 @@ import { Media, IgoLanguageModule } from '@igo2/core';
21
21
  import { t } from 'typy';
22
22
  import { ReplaySubject, BehaviorSubject, combineLatest, of, Observable, isObservable, fromEvent, throwError, merge, Subject } from 'rxjs';
23
23
  import { map, skip, debounceTime, catchError, tap, switchMap, filter, take, distinctUntilChanged } from 'rxjs/operators';
24
- import { uuid, ObjectUtils } from '@igo2/utils';
24
+ import { uuid, ObjectUtils, userAgent } from '@igo2/utils';
25
25
  import * as i4 from '@angular/material/form-field';
26
26
  import { MatFormFieldControl, MatFormFieldModule } from '@angular/material/form-field';
27
27
  import * as i3 from '@angular/material/select';
@@ -3667,7 +3667,7 @@ EntityTableComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Entity
3667
3667
  (function () {
3668
3668
  (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EntityTableComponent, [{
3669
3669
  type: Component,
3670
- args: [{ selector: 'igo-entity-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: EntityTableComponent }], template: "<div class=\"table-container\" [ngStyle]=\"{'height': tableHeight}\">\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 igoImageError *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 igoImageError *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'\" [matAutocomplete]=\"auto\"\r\n required=\"{{getValidationAttributeValue(column, 'mandatory')}}\" value=\"{{getValue(record, column)}}\"\r\n readonly=\"{{getValidationAttributeValue(column, 'readonly')}}\">\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onAutocompleteValueChange(column, record, $event)\"\r\n panelWidth=\"430px\">\r\n <mat-option *ngFor=\"let option of filteredOptions[column.name] | async\"\r\n [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 igoImageError *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 *ngIf=\"column.onClick\" svgIcon=\"{{getValue(record, column)|| column.icon}}\" (click)=\"column.onClick($event)\"></mat-icon>\r\n <mat-icon *ngIf=\"!column.onClick\" svgIcon=\"{{getValue(record, column)|| column.icon}}\"></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 || button.editMode === undefined\">\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"] }]
3670
+ args: [{ selector: 'igo-entity-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: EntityTableComponent }], template: "<div class=\"table-container\" [ngStyle]=\"{'height': tableHeight}\">\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 igoImageError *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 igoImageError *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'\" [matAutocomplete]=\"auto\"\r\n required=\"{{getValidationAttributeValue(column, 'mandatory')}}\" value=\"{{getValue(record, column)}}\"\r\n readonly=\"{{getValidationAttributeValue(column, 'readonly')}}\">\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onAutocompleteValueChange(column, record, $event)\"\r\n panelWidth=\"430px\">\r\n <mat-option *ngFor=\"let option of filteredOptions[column.name] | async\"\r\n [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 igoImageError *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 *ngIf=\"column.onClick\" svgIcon=\"{{getValue(record, column)|| column.icon}}\" (click)=\"column.onClick($event)\"></mat-icon>\r\n <mat-icon *ngIf=\"!column.onClick\" svgIcon=\"{{getValue(record, column)|| column.icon}}\"></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 || button.editMode === undefined\">\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"] }]
3671
3671
  }], function () {
3672
3672
  return [{ type: i0.ChangeDetectorRef }, { type: i1$4.UntypedFormBuilder }, { type: i2$1.FocusMonitor }, { type: i0.ElementRef }, { type: i1$4.NgControl, decorators: [{
3673
3673
  type: Optional
@@ -5064,14 +5064,29 @@ ContextMenuDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: Contex
5064
5064
  }] });
5065
5065
  })();
5066
5066
 
5067
+ /**
5068
+ * IgoLongPress trigger longpress event after a define duration.
5069
+ * This directive exist to patch the unavailable contextmenu event on iOS.
5070
+ * @param touchDuration touch duration in ms, default value is 400ms
5071
+ * @param iOSOnly define if longpress is triggered only for iOS, default value = true
5072
+ */
5067
5073
  class LongPressDirective {
5068
5074
  constructor() {
5075
+ this.touchDuration = 400;
5076
+ this.onlyIOS = true;
5069
5077
  this.longpress = new EventEmitter();
5070
5078
  }
5071
5079
  touchstart(e) {
5072
5080
  this.touchTimeout = setTimeout(() => {
5073
- this.longpress.emit(e);
5074
- }, 400);
5081
+ if (this.onlyIOS) {
5082
+ if (userAgent.getOSName() === 'iOS') {
5083
+ this.longpress.emit(e);
5084
+ }
5085
+ }
5086
+ else {
5087
+ this.longpress.emit(e);
5088
+ }
5089
+ }, this.touchDuration);
5075
5090
  }
5076
5091
  touchend() {
5077
5092
  this.touchEnd();
@@ -5085,14 +5100,18 @@ LongPressDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: LongPres
5085
5100
  if (rf & 1) {
5086
5101
  i0.ɵɵlistener("touchstart", function LongPressDirective_touchstart_HostBindingHandler($event) { return ctx.touchstart($event); })("touchmove", function LongPressDirective_touchmove_HostBindingHandler() { return ctx.touchend(); })("touchcancel", function LongPressDirective_touchcancel_HostBindingHandler() { return ctx.touchend(); })("touchend", function LongPressDirective_touchend_HostBindingHandler() { return ctx.touchend(); });
5087
5102
  }
5088
- }, outputs: { longpress: "longpress" } });
5103
+ }, inputs: { touchDuration: "touchDuration", onlyIOS: "onlyIOS" }, outputs: { longpress: "longpress" } });
5089
5104
  (function () {
5090
5105
  (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LongPressDirective, [{
5091
5106
  type: Directive,
5092
5107
  args: [{
5093
5108
  selector: '[igoLongPress]'
5094
5109
  }]
5095
- }], function () { return []; }, { longpress: [{
5110
+ }], function () { return []; }, { touchDuration: [{
5111
+ type: Input
5112
+ }], onlyIOS: [{
5113
+ type: Input
5114
+ }], longpress: [{
5096
5115
  type: Output
5097
5116
  }], touchstart: [{
5098
5117
  type: HostListener,