ngx-st-tables 17.0.99 → 17.0.101

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.
@@ -45,13 +45,12 @@ import * as i12$2 from '@angular/material/progress-spinner';
45
45
  import { MatProgressSpinner } from '@angular/material/progress-spinner';
46
46
  import * as i8 from '@angular/router';
47
47
  import { RouterModule } from '@angular/router';
48
- import * as i14 from '@angular/material/radio';
49
- import { MatRadioButton } from '@angular/material/radio';
50
- import * as i15 from 'ngx-st-date-format';
48
+ import * as i14 from 'ngx-st-date-format';
51
49
  import { StDateFormatModule } from 'ngx-st-date-format';
52
50
  import { MatExpansionModule } from '@angular/material/expansion';
53
51
  import { StQtyInputModule } from 'ngx-st-qty-input';
54
52
  import { MatSlideToggleModule } from '@angular/material/slide-toggle';
53
+ import { MatRadioButton } from '@angular/material/radio';
55
54
 
56
55
  const DEFAULT_TRANSLATIONS = {
57
56
  globalSearch: 'Search',
@@ -861,11 +860,11 @@ class MaterialTableRowCellComponent {
861
860
  this.changeDetectorRef.markForCheck();
862
861
  }
863
862
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableRowCellComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
864
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: MaterialTableRowCellComponent, selector: "st-material-table-row-cell", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: true, transformFunction: null }, rowDataCopy: { classPropertyName: "rowDataCopy", publicName: "rowDataCopy", isSignal: true, isRequired: false, transformFunction: null }, canEditRowValidator: { classPropertyName: "canEditRowValidator", publicName: "canEditRowValidator", isSignal: true, isRequired: false, transformFunction: null }, selectRowOnlyOne: { classPropertyName: "selectRowOnlyOne", publicName: "selectRowOnlyOne", isSignal: true, isRequired: false, transformFunction: null }, rowEditing: { classPropertyName: "rowEditing", publicName: "rowEditing", isSignal: false, isRequired: false, transformFunction: null }, rowIsSelected: { classPropertyName: "rowIsSelected", publicName: "rowIsSelected", isSignal: true, isRequired: false, transformFunction: null }, rowIsExpanded: { classPropertyName: "rowIsExpanded", publicName: "rowIsExpanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { saveEditRowEmitter: "saveEditRowEmitter", cancelEditRowEmitter: "cancelEditRowEmitter", editRowEmitter: "editRowEmitter", selectRowChange: "selectRowChange" }, ngImport: i0, template: "@switch (column().type || 'string') {\r\n @case ('custom-template') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"column().customTemplate!\"\r\n [ngTemplateOutletContext]=\"{ data: rowData() }\"\r\n ></ng-container>\r\n }\r\n }\r\n\r\n @case ('actions') {\r\n @if (column().actions) {\r\n @if (\r\n (!column().actionsInMenu && !mobileView) ||\r\n (mobileView && column().actions!.length <= 1)\r\n ) {\r\n <div [ngStyle]=\"{ float: column().flexRight ? 'right' : 'none' }\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </div>\r\n }\r\n @if (\r\n column().actionsInMenu || (mobileView && column().actions!.length > 1)\r\n ) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n {{ action.tooltipName }}\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button type=\"button\" mat-menu-item>\r\n {{ action.tooltipName }}\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </mat-menu>\r\n }\r\n }\r\n }\r\n\r\n @case ('string') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('number') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('boolean') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('date') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n {{ rowData()[column().field] | stDateTimeFormatPipe }}\r\n }\r\n }\r\n\r\n @case ('actions-row-editing') {\r\n <div class=\"row justify-content-end\">\r\n @if (rowEditing) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"accent\"\r\n (click)=\"saveRow()\"\r\n [matTooltip]=\"'Save row'\"\r\n >\r\n <mat-icon>done</mat-icon>\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"warn\"\r\n (click)=\"cancelRow()\"\r\n [matTooltip]=\"'Cancel row'\"\r\n >\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"primary\"\r\n (click)=\"editRow()\"\r\n [matTooltip]=\"'Edit row'\"\r\n [disabled]=\"\r\n canEditRowValidator() ? !canEditRowValidator()(rowData()) : false\r\n \"\r\n >\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n\r\n @case ('actions-row-selecting') {\r\n @if (selectRowOnlyOne()) {\r\n <mat-radio-button\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow({ checked: true })\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-radio-button>\r\n } @else {\r\n <mat-checkbox\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow($event)\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-checkbox>\r\n }\r\n }\r\n\r\n @case ('actions-row-extending') {\r\n @if (rowIsExpanded()) {\r\n <mat-icon>keyboard_arrow_up</mat-icon>\r\n } @else {\r\n <mat-icon>keyboard_arrow_down</mat-icon>\r\n }\r\n }\r\n}\r\n\r\n<ng-template #baseFieldCell let-column>\r\n @if (rowEditing && column.allowEditColumn) {\r\n @if (column.rowEditType === 'string' || column.rowEditType === 'number') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [type]=\"column.rowEditType === 'string' ? 'text' : 'number'\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'date') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [matDatepicker]=\"picker1\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n <mat-datepicker-toggle\r\n matIconSuffix\r\n [for]=\"picker1\"\r\n ></mat-datepicker-toggle>\r\n <mat-datepicker #picker1></mat-datepicker>\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'boolean') {\r\n <mat-checkbox [(ngModel)]=\"rowDataCopy()![column.field]\"></mat-checkbox>\r\n }\r\n\r\n @if (column.rowEditType === 'custom') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <mat-select [(ngModel)]=\"rowDataCopy()![column.field]\">\r\n <mat-option value=\"\"></mat-option>\r\n @for (option of column.customRowEditOptions; track option) {\r\n <mat-option [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n }\r\n } @else {\r\n <div>\r\n @if (column.translateValue) {\r\n {{ column.translateValue![rowData()[column.field]] || '' }}\r\n }\r\n @if (column.customValueDisplay) {\r\n {{ column.customValueDisplay(rowData()[column.field]) }}\r\n }\r\n @if (!column.translateValue && !column.customValueDisplay) {\r\n {{ rowData()[column.field] }}\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i6$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i12$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i14.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "pipe", type: i15.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
863
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: MaterialTableRowCellComponent, selector: "st-material-table-row-cell", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, rowData: { classPropertyName: "rowData", publicName: "rowData", isSignal: true, isRequired: true, transformFunction: null }, rowDataCopy: { classPropertyName: "rowDataCopy", publicName: "rowDataCopy", isSignal: true, isRequired: false, transformFunction: null }, canEditRowValidator: { classPropertyName: "canEditRowValidator", publicName: "canEditRowValidator", isSignal: true, isRequired: false, transformFunction: null }, selectRowOnlyOne: { classPropertyName: "selectRowOnlyOne", publicName: "selectRowOnlyOne", isSignal: true, isRequired: false, transformFunction: null }, rowEditing: { classPropertyName: "rowEditing", publicName: "rowEditing", isSignal: false, isRequired: false, transformFunction: null }, rowIsSelected: { classPropertyName: "rowIsSelected", publicName: "rowIsSelected", isSignal: true, isRequired: false, transformFunction: null }, rowIsExpanded: { classPropertyName: "rowIsExpanded", publicName: "rowIsExpanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { saveEditRowEmitter: "saveEditRowEmitter", cancelEditRowEmitter: "cancelEditRowEmitter", editRowEmitter: "editRowEmitter", selectRowChange: "selectRowChange" }, ngImport: i0, template: "@switch (column().type || 'string') {\r\n @case ('custom-template') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"column().customTemplate!\"\r\n [ngTemplateOutletContext]=\"{ data: rowData() }\"\r\n ></ng-container>\r\n }\r\n }\r\n\r\n @case ('actions') {\r\n @if (column().actions) {\r\n @if (\r\n (!column().actionsInMenu && !mobileView) ||\r\n (mobileView && column().actions!.length <= 1)\r\n ) {\r\n <div [ngStyle]=\"{ float: column().flexRight ? 'right' : 'none' }\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </div>\r\n }\r\n @if (\r\n column().actionsInMenu || (mobileView && column().actions!.length > 1)\r\n ) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n {{ action.tooltipName }}\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button type=\"button\" mat-menu-item>\r\n {{ action.tooltipName }}\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </mat-menu>\r\n }\r\n }\r\n }\r\n\r\n @case ('string') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('number') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('boolean') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('date') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n {{ rowData()[column().field] | stDateTimeFormatPipe }}\r\n }\r\n }\r\n\r\n @case ('actions-row-editing') {\r\n <div class=\"row justify-content-end\">\r\n @if (rowEditing) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"accent\"\r\n (click)=\"saveRow()\"\r\n [matTooltip]=\"'Save row'\"\r\n >\r\n <mat-icon>done</mat-icon>\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"warn\"\r\n (click)=\"cancelRow()\"\r\n [matTooltip]=\"'Cancel row'\"\r\n >\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"primary\"\r\n (click)=\"editRow()\"\r\n [matTooltip]=\"'Edit row'\"\r\n [disabled]=\"\r\n canEditRowValidator() ? !canEditRowValidator()(rowData()) : false\r\n \"\r\n >\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n\r\n @case ('actions-row-selecting') {\r\n <!-- @if (selectRowOnlyOne()) {-->\r\n <!-- <mat-radio-button-->\r\n <!-- color=\"primary\"-->\r\n <!-- (click)=\"$event.stopPropagation()\"-->\r\n <!-- (change)=\"selectRow({ checked: true })\"-->\r\n <!-- [checked]=\"rowIsSelected()\"-->\r\n <!-- ></mat-radio-button>-->\r\n <!-- } @else {-->\r\n <mat-checkbox\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow($event)\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-checkbox>\r\n <!-- }-->\r\n }\r\n\r\n @case ('actions-row-extending') {\r\n @if (rowIsExpanded()) {\r\n <mat-icon>keyboard_arrow_up</mat-icon>\r\n } @else {\r\n <mat-icon>keyboard_arrow_down</mat-icon>\r\n }\r\n }\r\n}\r\n\r\n<ng-template #baseFieldCell let-column>\r\n @if (rowEditing && column.allowEditColumn) {\r\n @if (column.rowEditType === 'string' || column.rowEditType === 'number') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [type]=\"column.rowEditType === 'string' ? 'text' : 'number'\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'date') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [matDatepicker]=\"picker1\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n <mat-datepicker-toggle\r\n matIconSuffix\r\n [for]=\"picker1\"\r\n ></mat-datepicker-toggle>\r\n <mat-datepicker #picker1></mat-datepicker>\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'boolean') {\r\n <mat-checkbox [(ngModel)]=\"rowDataCopy()![column.field]\"></mat-checkbox>\r\n }\r\n\r\n @if (column.rowEditType === 'custom') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <mat-select [(ngModel)]=\"rowDataCopy()![column.field]\">\r\n <mat-option value=\"\"></mat-option>\r\n @for (option of column.customRowEditOptions; track option) {\r\n <mat-option [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n }\r\n } @else {\r\n <div>\r\n @if (column.translateValue) {\r\n {{ column.translateValue![rowData()[column.field]] || '' }}\r\n }\r\n @if (column.customValueDisplay) {\r\n {{ column.customValueDisplay(rowData()[column.field]) }}\r\n }\r\n @if (!column.translateValue && !column.customValueDisplay) {\r\n {{ rowData()[column.field] }}\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i6$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i11.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i12$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: i14.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
865
864
  }
866
865
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaterialTableRowCellComponent, decorators: [{
867
866
  type: Component,
868
- args: [{ selector: 'st-material-table-row-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "@switch (column().type || 'string') {\r\n @case ('custom-template') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"column().customTemplate!\"\r\n [ngTemplateOutletContext]=\"{ data: rowData() }\"\r\n ></ng-container>\r\n }\r\n }\r\n\r\n @case ('actions') {\r\n @if (column().actions) {\r\n @if (\r\n (!column().actionsInMenu && !mobileView) ||\r\n (mobileView && column().actions!.length <= 1)\r\n ) {\r\n <div [ngStyle]=\"{ float: column().flexRight ? 'right' : 'none' }\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </div>\r\n }\r\n @if (\r\n column().actionsInMenu || (mobileView && column().actions!.length > 1)\r\n ) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n {{ action.tooltipName }}\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button type=\"button\" mat-menu-item>\r\n {{ action.tooltipName }}\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </mat-menu>\r\n }\r\n }\r\n }\r\n\r\n @case ('string') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('number') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('boolean') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('date') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n {{ rowData()[column().field] | stDateTimeFormatPipe }}\r\n }\r\n }\r\n\r\n @case ('actions-row-editing') {\r\n <div class=\"row justify-content-end\">\r\n @if (rowEditing) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"accent\"\r\n (click)=\"saveRow()\"\r\n [matTooltip]=\"'Save row'\"\r\n >\r\n <mat-icon>done</mat-icon>\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"warn\"\r\n (click)=\"cancelRow()\"\r\n [matTooltip]=\"'Cancel row'\"\r\n >\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"primary\"\r\n (click)=\"editRow()\"\r\n [matTooltip]=\"'Edit row'\"\r\n [disabled]=\"\r\n canEditRowValidator() ? !canEditRowValidator()(rowData()) : false\r\n \"\r\n >\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n\r\n @case ('actions-row-selecting') {\r\n @if (selectRowOnlyOne()) {\r\n <mat-radio-button\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow({ checked: true })\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-radio-button>\r\n } @else {\r\n <mat-checkbox\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow($event)\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-checkbox>\r\n }\r\n }\r\n\r\n @case ('actions-row-extending') {\r\n @if (rowIsExpanded()) {\r\n <mat-icon>keyboard_arrow_up</mat-icon>\r\n } @else {\r\n <mat-icon>keyboard_arrow_down</mat-icon>\r\n }\r\n }\r\n}\r\n\r\n<ng-template #baseFieldCell let-column>\r\n @if (rowEditing && column.allowEditColumn) {\r\n @if (column.rowEditType === 'string' || column.rowEditType === 'number') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [type]=\"column.rowEditType === 'string' ? 'text' : 'number'\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'date') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [matDatepicker]=\"picker1\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n <mat-datepicker-toggle\r\n matIconSuffix\r\n [for]=\"picker1\"\r\n ></mat-datepicker-toggle>\r\n <mat-datepicker #picker1></mat-datepicker>\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'boolean') {\r\n <mat-checkbox [(ngModel)]=\"rowDataCopy()![column.field]\"></mat-checkbox>\r\n }\r\n\r\n @if (column.rowEditType === 'custom') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <mat-select [(ngModel)]=\"rowDataCopy()![column.field]\">\r\n <mat-option value=\"\"></mat-option>\r\n @for (option of column.customRowEditOptions; track option) {\r\n <mat-option [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n }\r\n } @else {\r\n <div>\r\n @if (column.translateValue) {\r\n {{ column.translateValue![rowData()[column.field]] || '' }}\r\n }\r\n @if (column.customValueDisplay) {\r\n {{ column.customValueDisplay(rowData()[column.field]) }}\r\n }\r\n @if (!column.translateValue && !column.customValueDisplay) {\r\n {{ rowData()[column.field] }}\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n" }]
867
+ args: [{ selector: 'st-material-table-row-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "@switch (column().type || 'string') {\r\n @case ('custom-template') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"column().customTemplate!\"\r\n [ngTemplateOutletContext]=\"{ data: rowData() }\"\r\n ></ng-container>\r\n }\r\n }\r\n\r\n @case ('actions') {\r\n @if (column().actions) {\r\n @if (\r\n (!column().actionsInMenu && !mobileView) ||\r\n (mobileView && column().actions!.length <= 1)\r\n ) {\r\n <div [ngStyle]=\"{ float: column().flexRight ? 'right' : 'none' }\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button\r\n class=\"action-icon-button\"\r\n type=\"button\"\r\n mat-icon-button\r\n [color]=\"\r\n actionIconColorDef[action.iconName]\r\n ? actionIconColorDef[action.iconName]\r\n : action.iconColor\r\n \"\r\n [matTooltip]=\"action.tooltipName || ''\"\r\n [matTooltipDisabled]=\"!action.tooltipName\"\r\n >\r\n <mat-icon>{{ action.iconName }}</mat-icon>\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </div>\r\n }\r\n @if (\r\n column().actionsInMenu || (mobileView && column().actions!.length > 1)\r\n ) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n @for (action of column().actions; track action) {\r\n @if ((action.show && action.show(rowData())) || !action.show) {\r\n @if (!action.url && action.action) {\r\n <button\r\n type=\"button\"\r\n mat-menu-item\r\n (click)=\"$event.stopPropagation(); action.action!(rowData())\"\r\n >\r\n {{ action.tooltipName }}\r\n </button>\r\n }\r\n @if (action.url) {\r\n <a [routerLink]=\"action.url\">\r\n <button type=\"button\" mat-menu-item>\r\n {{ action.tooltipName }}\r\n </button>\r\n </a>\r\n }\r\n }\r\n }\r\n </mat-menu>\r\n }\r\n }\r\n }\r\n\r\n @case ('string') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('number') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('boolean') {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n }\r\n\r\n @case ('date') {\r\n @if (rowEditing && column().allowEditColumn) {\r\n <ng-container\r\n *ngTemplateOutlet=\"baseFieldCell; context: { $implicit: column() }\"\r\n ></ng-container>\r\n } @else {\r\n {{ rowData()[column().field] | stDateTimeFormatPipe }}\r\n }\r\n }\r\n\r\n @case ('actions-row-editing') {\r\n <div class=\"row justify-content-end\">\r\n @if (rowEditing) {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"accent\"\r\n (click)=\"saveRow()\"\r\n [matTooltip]=\"'Save row'\"\r\n >\r\n <mat-icon>done</mat-icon>\r\n </button>\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"warn\"\r\n (click)=\"cancelRow()\"\r\n [matTooltip]=\"'Cancel row'\"\r\n >\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n color=\"primary\"\r\n (click)=\"editRow()\"\r\n [matTooltip]=\"'Edit row'\"\r\n [disabled]=\"\r\n canEditRowValidator() ? !canEditRowValidator()(rowData()) : false\r\n \"\r\n >\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n\r\n @case ('actions-row-selecting') {\r\n <!-- @if (selectRowOnlyOne()) {-->\r\n <!-- <mat-radio-button-->\r\n <!-- color=\"primary\"-->\r\n <!-- (click)=\"$event.stopPropagation()\"-->\r\n <!-- (change)=\"selectRow({ checked: true })\"-->\r\n <!-- [checked]=\"rowIsSelected()\"-->\r\n <!-- ></mat-radio-button>-->\r\n <!-- } @else {-->\r\n <mat-checkbox\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"selectRow($event)\"\r\n [checked]=\"rowIsSelected()\"\r\n ></mat-checkbox>\r\n <!-- }-->\r\n }\r\n\r\n @case ('actions-row-extending') {\r\n @if (rowIsExpanded()) {\r\n <mat-icon>keyboard_arrow_up</mat-icon>\r\n } @else {\r\n <mat-icon>keyboard_arrow_down</mat-icon>\r\n }\r\n }\r\n}\r\n\r\n<ng-template #baseFieldCell let-column>\r\n @if (rowEditing && column.allowEditColumn) {\r\n @if (column.rowEditType === 'string' || column.rowEditType === 'number') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [type]=\"column.rowEditType === 'string' ? 'text' : 'number'\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'date') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <input\r\n matInput\r\n [matDatepicker]=\"picker1\"\r\n [(ngModel)]=\"rowDataCopy()![column.field]\"\r\n (keydown.enter)=\"saveRow()\"\r\n />\r\n <mat-datepicker-toggle\r\n matIconSuffix\r\n [for]=\"picker1\"\r\n ></mat-datepicker-toggle>\r\n <mat-datepicker #picker1></mat-datepicker>\r\n </mat-form-field>\r\n }\r\n @if (column.rowEditType === 'boolean') {\r\n <mat-checkbox [(ngModel)]=\"rowDataCopy()![column.field]\"></mat-checkbox>\r\n }\r\n\r\n @if (column.rowEditType === 'custom') {\r\n <mat-form-field\r\n appearance=\"outline\"\r\n [ngStyle]=\"{ width: column.width || 'auto' }\"\r\n >\r\n <mat-select [(ngModel)]=\"rowDataCopy()![column.field]\">\r\n <mat-option value=\"\"></mat-option>\r\n @for (option of column.customRowEditOptions; track option) {\r\n <mat-option [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n }\r\n } @else {\r\n <div>\r\n @if (column.translateValue) {\r\n {{ column.translateValue![rowData()[column.field]] || '' }}\r\n }\r\n @if (column.customValueDisplay) {\r\n {{ column.customValueDisplay(rowData()[column.field]) }}\r\n }\r\n @if (!column.translateValue && !column.customValueDisplay) {\r\n {{ rowData()[column.field] }}\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n" }]
869
868
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { rowEditing: [{
870
869
  type: Input
871
870
  }] } });
@@ -941,6 +940,7 @@ class MaterialTableComponent extends StSubscribeDestroyComponent {
941
940
  this.selection = signal([]);
942
941
  }
943
942
  ngOnInit() {
943
+ console.log('Create MaterialTableComponent');
944
944
  this.initLocalColumns.set([...this.initColumns()]);
945
945
  if (this.allowSelectRow()) {
946
946
  this.initLocalColumns().unshift({