@smartbit4all/ng-client 4.2.129 → 4.2.131

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.
Files changed (30) hide show
  1. package/esm2022/lib/smart-form/api/api/api.mjs +1 -1
  2. package/esm2022/lib/smart-form/api/api/default.service.mjs +1 -1
  3. package/esm2022/lib/smart-form/api/api.module.mjs +1 -1
  4. package/esm2022/lib/smart-form/api/configuration.mjs +1 -1
  5. package/esm2022/lib/smart-form/api/encoder.mjs +1 -1
  6. package/esm2022/lib/smart-form/api/index.mjs +1 -1
  7. package/esm2022/lib/smart-form/api/model/fileUploaderProperties.mjs +1 -1
  8. package/esm2022/lib/smart-form/api/model/imageProperties.mjs +1 -1
  9. package/esm2022/lib/smart-form/api/model/models.mjs +1 -1
  10. package/esm2022/lib/smart-form/api/model/propertyMapping.mjs +1 -1
  11. package/esm2022/lib/smart-form/api/model/selectionDefinition.mjs +1 -1
  12. package/esm2022/lib/smart-form/api/model/smartFormInputMode.mjs +1 -1
  13. package/esm2022/lib/smart-form/api/model/smartFormWidgetDirection.mjs +1 -1
  14. package/esm2022/lib/smart-form/api/model/smartFormWidgetType.mjs +1 -1
  15. package/esm2022/lib/smart-form/api/model/smartLayoutDefinition.mjs +1 -1
  16. package/esm2022/lib/smart-form/api/model/smartMatrixModel.mjs +1 -1
  17. package/esm2022/lib/smart-form/api/model/smartWidgetDefinition.mjs +1 -1
  18. package/esm2022/lib/smart-form/api/model/smartWidgetHint.mjs +1 -1
  19. package/esm2022/lib/smart-form/api/model/sortDefinition.mjs +1 -1
  20. package/esm2022/lib/smart-form/api/model/textFieldProperties.mjs +1 -1
  21. package/esm2022/lib/smart-form/api/param.mjs +1 -1
  22. package/esm2022/lib/smart-form/api/variables.mjs +1 -1
  23. package/esm2022/lib/smart-grid/components/table-layout-definer/table-layout-definer.component.mjs +2 -2
  24. package/esm2022/lib/smart-grid/smart-grid.component.mjs +90 -54
  25. package/fesm2022/smartbit4all-ng-client.mjs +75 -41
  26. package/fesm2022/smartbit4all-ng-client.mjs.map +1 -1
  27. package/lib/smart-grid/smart-grid.component.d.ts +8 -2
  28. package/package.json +1 -1
  29. package/smartbit4all-ng-client-4.2.131.tgz +0 -0
  30. package/smartbit4all-ng-client-4.2.129.tgz +0 -0
package/fesm2022/smartbit4all-ng-client.mjs CHANGED
@@ -107,18 +107,18 @@ import { ToastModule } from 'primeng/toast';
107
107
  import { ImageModule } from 'primeng/image';
108
108
  import { OrderListModule } from 'primeng/orderlist';
109
109
  import { catchError as catchError$1, switchMap } from 'rxjs/operators';
110
- import * as i9$1 from '@angular/material/paginator';
110
+ import * as i10$1 from '@angular/material/paginator';
111
111
  import { MatPaginatorModule } from '@angular/material/paginator';
112
112
  import { FlatTreeControl, NestedTreeControl } from '@angular/cdk/tree';
113
- import * as i10$1 from '@angular/material/tree';
113
+ import * as i11$1 from '@angular/material/tree';
114
114
  import { MatTreeFlattener, MatTreeFlatDataSource, MatTreeModule, MatTreeNestedDataSource } from '@angular/material/tree';
115
115
  import * as i7 from 'primeng/accordion';
116
116
  import { AccordionModule } from 'primeng/accordion';
117
- import * as i15 from 'primeng/table';
117
+ import * as i16 from 'primeng/table';
118
118
  import { TableModule } from 'primeng/table';
119
- import * as i18$1 from 'primeng/menu';
119
+ import * as i19$1 from 'primeng/menu';
120
120
  import { MenuModule } from 'primeng/menu';
121
- import * as i19$1 from 'primeng/paginator';
121
+ import * as i20$1 from 'primeng/paginator';
122
122
  import { PaginatorModule } from 'primeng/paginator';
123
123
  import { Chart } from 'chart.js';
124
124
  import AnnotationPlugin from 'chartjs-plugin-annotation';
@@ -12808,7 +12808,7 @@ class TableLayoutDefinerComponent {
12808
12808
  removeColumn(form) {
12809
12809
  let propertyName = this.orderedColumnsAsObject[form.widgets[0].key];
12810
12810
  let index = this.view.orderedColumnNames.indexOf(propertyName);
12811
- if (index > -1) {
12811
+ if (index > -1 && propertyName != '') {
12812
12812
  this.view?.orderedColumnNames.splice(index, 1);
12813
12813
  this.mapOrderedColumnsToObject();
12814
12814
  }
@@ -13566,12 +13566,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
13566
13566
  }] } });
13567
13567
 
13568
13568
  class SmartGridComponent {
13569
- constructor(service, cfService, dialog, injector, uiActionDescriptorService, compLib, gridMenuIcon) {
13569
+ constructor(service, cfService, dialog, injector, uiActionDescriptorService, smartDatePipe, smartDateTimePipe, smartTimePipe, compLib, gridMenuIcon) {
13570
13570
  this.service = service;
13571
13571
  this.cfService = cfService;
13572
13572
  this.dialog = dialog;
13573
13573
  this.injector = injector;
13574
13574
  this.uiActionDescriptorService = uiActionDescriptorService;
13575
+ this.smartDatePipe = smartDatePipe;
13576
+ this.smartDateTimePipe = smartDateTimePipe;
13577
+ this.smartTimePipe = smartTimePipe;
13575
13578
  this.compLib = compLib;
13576
13579
  this.gridMenuIcon = gridMenuIcon;
13577
13580
  // private readonly defaultPageSize: number = 10;
@@ -13721,6 +13724,12 @@ class SmartGridComponent {
13721
13724
  if (gridModel?.view?.descriptor?.showEditColumns) {
13722
13725
  this.smartGrid.showEditColumns = gridModel?.view?.descriptor?.showEditColumns;
13723
13726
  }
13727
+ if (gridModel?.view?.descriptor?.columns) {
13728
+ this.columnMetaByName = new Map(gridModel?.view?.descriptor?.columns.map((col) => [col.propertyName, col]));
13729
+ }
13730
+ else {
13731
+ this.columnMetaByName = undefined;
13732
+ }
13724
13733
  let kind = gridModel?.view?.descriptor?.kind;
13725
13734
  if (kind) {
13726
13735
  let layoutDef;
@@ -14158,33 +14167,7 @@ class SmartGridComponent {
14158
14167
  }
14159
14168
  let properties = customTableHeader?.properties;
14160
14169
  if (!properties) {
14161
- if (descColumn.typeClass === 'java.time.OffsetDateTime' ||
14162
- descColumn.typeClass === 'java.time.LocalDateTime') {
14163
- let dateFormat = descColumn.typeFormat ?? 'yyyy.MM.dd H:mm';
14164
- properties = {
14165
- type: SmartTableHeaderPropertyType.DATETIME,
14166
- dateFormat,
14167
- };
14168
- }
14169
- else if (descColumn.typeClass === 'java.time.LocalDate') {
14170
- let dateFormat = descColumn.typeFormat ?? 'yyyy.MM.dd';
14171
- properties = {
14172
- type: SmartTableHeaderPropertyType.DATE,
14173
- dateFormat,
14174
- };
14175
- }
14176
- else if (descColumn.typeClass === 'java.time.LocalTime') {
14177
- let dateFormat = descColumn.typeFormat ?? 'H:mm';
14178
- properties = {
14179
- type: SmartTableHeaderPropertyType.TIME,
14180
- dateFormat,
14181
- };
14182
- }
14183
- else if (descColumn.typeClass === 'java.lang.Boolean') {
14184
- properties = {
14185
- type: SmartTableHeaderPropertyType.CHECKBOX,
14186
- };
14187
- }
14170
+ properties = this.getSmartTableProperty(descColumn);
14188
14171
  }
14189
14172
  return {
14190
14173
  ...customTableHeader,
@@ -14246,6 +14229,36 @@ class SmartGridComponent {
14246
14229
  }
14247
14230
  return header;
14248
14231
  }
14232
+ getSmartTableProperty(descColumn) {
14233
+ if (descColumn.typeClass === 'java.time.OffsetDateTime' ||
14234
+ descColumn.typeClass === 'java.time.LocalDateTime') {
14235
+ let dateFormat = descColumn.typeFormat ?? 'yyyy.MM.dd H:mm';
14236
+ return {
14237
+ type: SmartTableHeaderPropertyType.DATETIME,
14238
+ dateFormat,
14239
+ };
14240
+ }
14241
+ else if (descColumn.typeClass === 'java.time.LocalDate') {
14242
+ let dateFormat = descColumn.typeFormat ?? 'yyyy.MM.dd';
14243
+ return {
14244
+ type: SmartTableHeaderPropertyType.DATE,
14245
+ dateFormat,
14246
+ };
14247
+ }
14248
+ else if (descColumn.typeClass === 'java.time.LocalTime') {
14249
+ let dateFormat = descColumn.typeFormat ?? 'H:mm';
14250
+ return {
14251
+ type: SmartTableHeaderPropertyType.TIME,
14252
+ dateFormat,
14253
+ };
14254
+ }
14255
+ else if (descColumn.typeClass === 'java.lang.Boolean') {
14256
+ return {
14257
+ type: SmartTableHeaderPropertyType.CHECKBOX,
14258
+ };
14259
+ }
14260
+ return undefined;
14261
+ }
14249
14262
  async onChangePage(event) {
14250
14263
  let offset = event.pageSize * event.pageIndex;
14251
14264
  let limit = event.pageSize;
@@ -14459,6 +14472,7 @@ class SmartGridComponent {
14459
14472
  if (row.icons[col]) {
14460
14473
  return;
14461
14474
  }
14475
+ let retValue = '';
14462
14476
  if (col.includes('.')) {
14463
14477
  let pathArray = col.split('.');
14464
14478
  let colValue = row.data;
@@ -14471,9 +14485,29 @@ class SmartGridComponent {
14471
14485
  colValue = colValue[path];
14472
14486
  }
14473
14487
  });
14474
- return colValue;
14488
+ retValue = colValue;
14489
+ }
14490
+ else {
14491
+ retValue = row.data[col];
14492
+ }
14493
+ if (this.columnMetaByName) {
14494
+ let columnMeta = this.columnMetaByName.get(col);
14495
+ if (columnMeta) {
14496
+ let property = this.getSmartTableProperty(columnMeta);
14497
+ switch (property?.type) {
14498
+ case SmartTableHeaderPropertyType.DATE:
14499
+ retValue = this.smartDatePipe.transform(retValue, property.dateFormat);
14500
+ break;
14501
+ case SmartTableHeaderPropertyType.DATETIME:
14502
+ retValue = this.smartDateTimePipe.transform(retValue, property.dateFormat);
14503
+ break;
14504
+ case SmartTableHeaderPropertyType.TIME:
14505
+ retValue = this.smartTimePipe.transform(retValue, property.dateFormat);
14506
+ break;
14507
+ }
14508
+ }
14475
14509
  }
14476
- return row.data[col];
14510
+ return retValue;
14477
14511
  }
14478
14512
  getImageResourceIcons(row, header) {
14479
14513
  if (row?.icons) {
@@ -14505,13 +14539,13 @@ class SmartGridComponent {
14505
14539
  rowTrackByFn(index, row) {
14506
14540
  return row.id;
14507
14541
  }
14508
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartGridComponent, deps: [{ token: SmartGridService }, { token: ComponentFactoryService }, { token: i1$3.MatDialog }, { token: i0.Injector }, { token: UiActionDescriptorService }, { token: COMPONENT_LIBRARY }, { token: 'gridMenuIcon' }], target: i0.ɵɵFactoryTarget.Component }); }
14509
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartGridComponent, selector: "smart-grid", inputs: { smartGrid: "smartGrid", uuid: "uuid", dev: "dev" }, providers: [SmartGridService], viewQueries: [{ propertyName: "vcRefTable", first: true, predicate: ["table"], descendants: true, read: ViewContainerRef }, { propertyName: "toolbar", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "_headerToolbar", first: true, predicate: ["headerToolbar"], descendants: true }, { propertyName: "menu", first: true, predicate: ["menu"], descendants: true }, { propertyName: "expandedRowsComps", predicate: ExpandedRowRendererComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if(compLib === componentLibrary.PRIMENG) {\r\n\r\n<div *ngIf=\"smartGrid\" class=\"primeSmartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n </div>\r\n <p-table\r\n *ngIf=\"!smartGrid.layoutDef || smartGrid.layoutDef === layoutDef().TABLE\"\r\n #pTable\r\n [value]=\"smartGrid.gridModel.page.rows!\"\r\n (onSort)=\"gridSort($event)\"\r\n [customSort]=\"true\"\r\n [sortMode]=\"'multiple'\"\r\n [lazy]=\"true\"\r\n (onLazyLoad)=\"lazyLoad($event)\"\r\n [reorderableColumns]=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\"\r\n [columns]=\"columns\"\r\n (onColReorder)=\"onColOrder($event)\"\r\n (onRowSelect)=\"onRowSelect($event)\"\r\n (onRowUnselect)=\"onRowUnselect($event)\"\r\n [selection]=\"selectedRows\"\r\n (onHeaderCheckboxToggle)=\"onSelectAllRow($event)\"\r\n dataKey=\"id\"\r\n [expandedRowKeys]=\"expandedRows\"\r\n [rowExpandMode]=\"'multiple'\"\r\n [rowTrackBy]=\"rowTrackByFn\"\r\n >\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"tableCaption\">\r\n <div *ngIf=\"smartGrid.gridModel.title\" class=\"captionTitle\">\r\n {{ smartGrid.gridModel.title }}\r\n </div>\r\n <div *ngIf=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\">\r\n <p-multiSelect\r\n display=\"chip\"\r\n [options]=\"smartGrid.gridModel.view?.descriptor?.columns\"\r\n optionLabel=\"label\"\r\n [(ngModel)]=\"columns\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ 'min-width': '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n (onChange)=\"headerChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n @if (smartGrid.gridModel.view?.descriptor?.showEditColumns) {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\" pReorderableColumn>\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n } @else {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\">\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n }\r\n\r\n <th>\r\n <smart-ui-action-toolbar\r\n class=\"headerToolbar\"\r\n #headerToolbar\r\n [id]=\"'header_not_initialized'\"\r\n ></smart-ui-action-toolbar>\r\n </th>\r\n <th *ngIf=\"smartGrid.expandable\"> </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-row let-expanded=\"expanded\">\r\n <tr\r\n [ngClass]=\"getStyle(row)\"\r\n [class.rowExpanded]=\"expanded\"\r\n (dblclick)=\"onDoubleClick(row)\"\r\n *ngIf=\"row && row.data\"\r\n >\r\n <td *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableCheckbox *ngIf=\"row.selectable != false\" [value]=\"row\" />\r\n </td>\r\n <td *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableRadioButton [value]=\"row\" />\r\n </td>\r\n <td *ngFor=\"let col of smartGrid?.gridModel?.view?.orderedColumnNames\">\r\n <div *ngIf=\"row.icons[col]\">\r\n <div class=\"smart-table-icon-container\">\r\n <div *ngFor=\"let ir of getImageResourceIcons(row, col)\">\r\n <smart-icon [imageResource]=\"ir\"> </smart-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showCellToolbar(row, col)\">\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, col)\"\r\n ></smart-ui-action-toolbar>\r\n </ng-container>\r\n\r\n <div *ngIf=\"!row.icons[col]\" [innerHtml]=\"getColValue(col, row)\"> </div>\r\n </td>\r\n <td>\r\n <div class=\"menu-button\">\r\n @if(showCellToolbar(row, defaultActionToolbarId)){\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, defaultActionToolbarId)\"\r\n ></smart-ui-action-toolbar>\r\n }\r\n <p-button\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n *ngIf=\"shouldShowOptionsButton(row)\"\r\n (onClick)=\"onOptionsClick($event, row)\"\r\n >\r\n <smart-icon icon=\"ellipsis-v\"></smart-icon>\r\n </p-button>\r\n </div>\r\n </td>\r\n <td *ngIf=\"smartGrid.expandable\">\r\n <p-button\r\n type=\"button\"\r\n pRipple\r\n [pRowToggler]=\"row\"\r\n [text]=\"true\"\r\n severity=\"secondary\"\r\n [rounded]=\"true\"\r\n [icon]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n />\r\n </td>\r\n </tr>\r\n </ng-template>\r\n @if(smartGrid.expandable){\r\n <ng-template pTemplate=\"rowexpansion\" let-row>\r\n <tr>\r\n <td colspan=\"100%\">\r\n <lib-expanded-row-renderer-component\r\n [rowId]=\"row.id\"\r\n [rowExpander]=\"this\"\r\n [expandedComponent]=\"smartGrid.expandedComponent\"\r\n [smartGrid]=\"this.smartGrid\"\r\n ></lib-expanded-row-renderer-component>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n }\r\n </p-table>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <p-paginator\r\n *ngIf=\"smartGrid.paginator\"\r\n [first]=\"pageIndex!\"\r\n [totalRecords]=\"length!\"\r\n [rows]=\"pageSize\"\r\n [rowsPerPageOptions]=\"pageSizeOptions\"\r\n currentPageReportTemplate=\"{first} - {last} / {totalRecords}\"\r\n (onPageChange)=\"onPrimeChangePage($event)\"\r\n [showCurrentPageReport]=\"true\"\r\n dropdownAppendTo=\"body\"\r\n />\r\n <p-menu #menu [model]=\"menuButtons\" [popup]=\"true\" appendTo=\"body\"> </p-menu>\r\n</div>\r\n}@else {\r\n<div *ngIf=\"smartGrid\" class=\"smartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n <button\r\n (click)=\"editColumns()\"\r\n mat-mini-fab\r\n color=\"text-primary\"\r\n *ngIf=\"smartGrid.showEditColumns\"\r\n >\r\n <mat-icon aria-hidden=\"false\" aria-label=\"Columns\" class=\"smart-grid-edit-icon\"\r\n >view_columns</mat-icon\r\n >\r\n </button>\r\n </div>\r\n <!-- <div [ngClass]=\"isBlocked ? 'blocked' : ''\"></div> -->\r\n <div class=\"smartGridContent\">\r\n <div>\r\n <div *ngIf=\"smartGrid.showResultCount\">\r\n <div class=\"smartGrid-data-number\">\r\n {{ smartGrid.gridModel.totalRowCount }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"smart-grid-table-container\">\r\n <ng-template #table></ng-template>\r\n </div>\r\n\r\n <div *ngIf=\"smartGrid.layoutDef === layoutDef().EXPANDABLE\">\r\n <smart-expandable-section\r\n #gridExpandableSection\r\n *ngFor=\"let expandableSection of expandableSections\"\r\n [data]=\"expandableSection\"\r\n ></smart-expandable-section>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().TREE && treeControl\"\r\n class=\"tree-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <mat-tree [dataSource]=\"treeDataSource!\" [treeControl]=\"treeControl!\">\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node\"\r\n matTreeNodeToggle\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button mat-icon-button disabled class=\"tree-button\"></button>\r\n <mat-checkbox\r\n class=\"checklist-leaf-node\"\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button\r\n mat-icon-button\r\n matTreeNodeToggle\r\n class=\"tree-button\"\r\n [attr.aria-label]=\"'Toggle ' + node.item\"\r\n >\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{ treeControl!.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n </div>\r\n\r\n <mat-paginator\r\n *ngIf=\"smartGrid.paginator && !treeControl\"\r\n #paginator\r\n [length]=\"length\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onChangePage($event)\"\r\n ></mat-paginator>\r\n</div>\r\n}\r\n", styles: [".smartGrid-container{position:relative;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.primeSmartGrid-container{display:flex;flex-direction:column;gap:1rem}.smartGrid-data-number{padding-bottom:1rem}.smart-table-icon-container{display:flex;flex-direction:row;justify-content:space-between;white-space:initial}.cards-container{display:grid;gap:1rem;padding:1rem}.smartGrid-card-container{height:auto;border:1px solid black;border-radius:8px}.smartGrid-container ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-underline{bottom:0}.smartGridContent{width:100%;flex:1;overflow:auto}.blocked{position:absolute;width:calc(100% - 3rem);height:calc(100% - 3rem);z-index:110;background-color:#0003}.smart-grid-table-container{display:flex;flex-direction:column;gap:1rem}.smart-grid-toolbar{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.smart-grid-toolbar smart-ui-action-toolbar{width:100%}.smart-grid-edit-icon{color:var(--light-gray)}.tree-button{width:24px!important;height:24px!important}.menu-button{display:flex;flex-direction:row;justify-content:flex-end;text-align:-webkit-right;align-items:center}.headerToolbar ::ng-deep .uiActionButtonsContainer{justify-content:flex-end}.tableCaption{display:flex;flex-direction:row;justify-content:space-between}.tableCaption:has(*){padding:.5rem;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}.captionTitle{font-size:1.5rem;align-content:center}:host ::ng-deep .p-datatable-header:has(.tableCaption){padding:0;border:unset}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "component", type: i9$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i10$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i10$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i10$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i10$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i10$1.MatTreeNode, selector: "mat-tree-node", inputs: ["disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { kind: "component", type: i4$2.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: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap"] }, { kind: "directive", type: ComparableMultiselectDirective, selector: "p-multiSelect", inputs: ["compareWith"] }, { kind: "component", type: i15.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i15.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i15.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "directive", type: i15.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i15.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i15.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i15.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i15.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i18$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i19$1.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "directive", type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i10.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: SmartGridCardComponent, selector: "app-smart-grid-card", inputs: ["item", "smartGrid", "onSelect"] }, { kind: "component", type: ExpandedRowRendererComponent, selector: "lib-expanded-row-renderer-component", inputs: ["rowId", "rowExpander", "expandedComponent", "smartGrid"] }] }); }
14542
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartGridComponent, deps: [{ token: SmartGridService }, { token: ComponentFactoryService }, { token: i1$3.MatDialog }, { token: i0.Injector }, { token: UiActionDescriptorService }, { token: SmartDatePipe }, { token: SmartDateTimePipe }, { token: SmartTimePipe }, { token: COMPONENT_LIBRARY }, { token: 'gridMenuIcon' }], target: i0.ɵɵFactoryTarget.Component }); }
14543
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartGridComponent, selector: "smart-grid", inputs: { smartGrid: "smartGrid", uuid: "uuid", dev: "dev" }, providers: [SmartGridService, SmartDatePipe, SmartDateTimePipe, SmartTimePipe], viewQueries: [{ propertyName: "vcRefTable", first: true, predicate: ["table"], descendants: true, read: ViewContainerRef }, { propertyName: "toolbar", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "_headerToolbar", first: true, predicate: ["headerToolbar"], descendants: true }, { propertyName: "menu", first: true, predicate: ["menu"], descendants: true }, { propertyName: "expandedRowsComps", predicate: ExpandedRowRendererComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if(compLib === componentLibrary.PRIMENG) {\r\n\r\n<div *ngIf=\"smartGrid\" class=\"primeSmartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n </div>\r\n <p-table\r\n *ngIf=\"!smartGrid.layoutDef || smartGrid.layoutDef === layoutDef().TABLE\"\r\n #pTable\r\n [value]=\"smartGrid.gridModel.page.rows!\"\r\n (onSort)=\"gridSort($event)\"\r\n [customSort]=\"true\"\r\n [sortMode]=\"'multiple'\"\r\n [lazy]=\"true\"\r\n (onLazyLoad)=\"lazyLoad($event)\"\r\n [reorderableColumns]=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\"\r\n [columns]=\"columns\"\r\n (onColReorder)=\"onColOrder($event)\"\r\n (onRowSelect)=\"onRowSelect($event)\"\r\n (onRowUnselect)=\"onRowUnselect($event)\"\r\n [selection]=\"selectedRows\"\r\n (onHeaderCheckboxToggle)=\"onSelectAllRow($event)\"\r\n dataKey=\"id\"\r\n [expandedRowKeys]=\"expandedRows\"\r\n [rowExpandMode]=\"'multiple'\"\r\n [rowTrackBy]=\"rowTrackByFn\"\r\n >\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"tableCaption\">\r\n <div *ngIf=\"smartGrid.gridModel.title\" class=\"captionTitle\">\r\n {{ smartGrid.gridModel.title }}\r\n </div>\r\n <div *ngIf=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\">\r\n <p-multiSelect\r\n display=\"chip\"\r\n [options]=\"smartGrid.gridModel.view?.descriptor?.columns\"\r\n optionLabel=\"label\"\r\n [(ngModel)]=\"columns\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ 'min-width': '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n (onChange)=\"headerChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n @if (smartGrid.gridModel.view?.descriptor?.showEditColumns) {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\" pReorderableColumn>\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n } @else {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\">\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n }\r\n\r\n <th>\r\n <smart-ui-action-toolbar\r\n class=\"headerToolbar\"\r\n #headerToolbar\r\n [id]=\"'header_not_initialized'\"\r\n ></smart-ui-action-toolbar>\r\n </th>\r\n <th *ngIf=\"smartGrid.expandable\"> </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-row let-expanded=\"expanded\">\r\n <tr\r\n [ngClass]=\"getStyle(row)\"\r\n [class.rowExpanded]=\"expanded\"\r\n (dblclick)=\"onDoubleClick(row)\"\r\n *ngIf=\"row && row.data\"\r\n >\r\n <td *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableCheckbox *ngIf=\"row.selectable != false\" [value]=\"row\" />\r\n </td>\r\n <td *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableRadioButton [value]=\"row\" />\r\n </td>\r\n <td *ngFor=\"let col of smartGrid?.gridModel?.view?.orderedColumnNames\">\r\n <div *ngIf=\"row.icons[col]\">\r\n <div class=\"smart-table-icon-container\">\r\n <div *ngFor=\"let ir of getImageResourceIcons(row, col)\">\r\n <smart-icon [imageResource]=\"ir\"> </smart-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showCellToolbar(row, col)\">\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, col)\"\r\n ></smart-ui-action-toolbar>\r\n </ng-container>\r\n\r\n <div *ngIf=\"!row.icons[col]\" [innerHtml]=\"getColValue(col, row)\"> </div>\r\n </td>\r\n <td>\r\n <div class=\"menu-button\">\r\n @if(showCellToolbar(row, defaultActionToolbarId)){\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, defaultActionToolbarId)\"\r\n ></smart-ui-action-toolbar>\r\n }\r\n <p-button\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n *ngIf=\"shouldShowOptionsButton(row)\"\r\n (onClick)=\"onOptionsClick($event, row)\"\r\n >\r\n <smart-icon icon=\"ellipsis-v\"></smart-icon>\r\n </p-button>\r\n </div>\r\n </td>\r\n <td *ngIf=\"smartGrid.expandable\">\r\n <p-button\r\n type=\"button\"\r\n pRipple\r\n [pRowToggler]=\"row\"\r\n [text]=\"true\"\r\n severity=\"secondary\"\r\n [rounded]=\"true\"\r\n [icon]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n />\r\n </td>\r\n </tr>\r\n </ng-template>\r\n @if(smartGrid.expandable){\r\n <ng-template pTemplate=\"rowexpansion\" let-row>\r\n <tr>\r\n <td colspan=\"100%\">\r\n <lib-expanded-row-renderer-component\r\n [rowId]=\"row.id\"\r\n [rowExpander]=\"this\"\r\n [expandedComponent]=\"smartGrid.expandedComponent\"\r\n [smartGrid]=\"this.smartGrid\"\r\n ></lib-expanded-row-renderer-component>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n }\r\n </p-table>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <p-paginator\r\n *ngIf=\"smartGrid.paginator\"\r\n [first]=\"pageIndex!\"\r\n [totalRecords]=\"length!\"\r\n [rows]=\"pageSize\"\r\n [rowsPerPageOptions]=\"pageSizeOptions\"\r\n currentPageReportTemplate=\"{first} - {last} / {totalRecords}\"\r\n (onPageChange)=\"onPrimeChangePage($event)\"\r\n [showCurrentPageReport]=\"true\"\r\n dropdownAppendTo=\"body\"\r\n />\r\n <p-menu #menu [model]=\"menuButtons\" [popup]=\"true\" appendTo=\"body\"> </p-menu>\r\n</div>\r\n}@else {\r\n<div *ngIf=\"smartGrid\" class=\"smartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n <button\r\n (click)=\"editColumns()\"\r\n mat-mini-fab\r\n color=\"text-primary\"\r\n *ngIf=\"smartGrid.showEditColumns\"\r\n >\r\n <mat-icon aria-hidden=\"false\" aria-label=\"Columns\" class=\"smart-grid-edit-icon\"\r\n >view_columns</mat-icon\r\n >\r\n </button>\r\n </div>\r\n <!-- <div [ngClass]=\"isBlocked ? 'blocked' : ''\"></div> -->\r\n <div class=\"smartGridContent\">\r\n <div>\r\n <div *ngIf=\"smartGrid.showResultCount\">\r\n <div class=\"smartGrid-data-number\">\r\n {{ smartGrid.gridModel.totalRowCount }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"smart-grid-table-container\">\r\n <ng-template #table></ng-template>\r\n </div>\r\n\r\n <div *ngIf=\"smartGrid.layoutDef === layoutDef().EXPANDABLE\">\r\n <smart-expandable-section\r\n #gridExpandableSection\r\n *ngFor=\"let expandableSection of expandableSections\"\r\n [data]=\"expandableSection\"\r\n ></smart-expandable-section>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().TREE && treeControl\"\r\n class=\"tree-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <mat-tree [dataSource]=\"treeDataSource!\" [treeControl]=\"treeControl!\">\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node\"\r\n matTreeNodeToggle\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button mat-icon-button disabled class=\"tree-button\"></button>\r\n <mat-checkbox\r\n class=\"checklist-leaf-node\"\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button\r\n mat-icon-button\r\n matTreeNodeToggle\r\n class=\"tree-button\"\r\n [attr.aria-label]=\"'Toggle ' + node.item\"\r\n >\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{ treeControl!.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n </div>\r\n\r\n <mat-paginator\r\n *ngIf=\"smartGrid.paginator && !treeControl\"\r\n #paginator\r\n [length]=\"length\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onChangePage($event)\"\r\n ></mat-paginator>\r\n</div>\r\n}\r\n", styles: [".smartGrid-container{position:relative;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.primeSmartGrid-container{display:flex;flex-direction:column;gap:1rem}.smartGrid-data-number{padding-bottom:1rem}.smart-table-icon-container{display:flex;flex-direction:row;justify-content:space-between;white-space:initial}.cards-container{display:grid;gap:1rem;padding:1rem}.smartGrid-card-container{height:auto;border:1px solid black;border-radius:8px}.smartGrid-container ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-underline{bottom:0}.smartGridContent{width:100%;flex:1;overflow:auto}.blocked{position:absolute;width:calc(100% - 3rem);height:calc(100% - 3rem);z-index:110;background-color:#0003}.smart-grid-table-container{display:flex;flex-direction:column;gap:1rem}.smart-grid-toolbar{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.smart-grid-toolbar smart-ui-action-toolbar{width:100%}.smart-grid-edit-icon{color:var(--light-gray)}.tree-button{width:24px!important;height:24px!important}.menu-button{display:flex;flex-direction:row;justify-content:flex-end;text-align:-webkit-right;align-items:center}.headerToolbar ::ng-deep .uiActionButtonsContainer{justify-content:flex-end}.tableCaption{display:flex;flex-direction:row;justify-content:space-between}.tableCaption:has(*){padding:.5rem;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}.captionTitle{font-size:1.5rem;align-content:center}:host ::ng-deep .p-datatable-header:has(.tableCaption){padding:0;border:unset}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "component", type: i10$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i11$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i11$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i11$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i11$1.MatTreeNode, selector: "mat-tree-node", inputs: ["disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { kind: "component", type: i4$2.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: ExpandableSectionComponent, selector: "smart-expandable-section", inputs: ["data", "index"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap"] }, { kind: "directive", type: ComparableMultiselectDirective, selector: "p-multiSelect", inputs: ["compareWith"] }, { kind: "component", type: i16.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i16.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i16.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "directive", type: i16.ReorderableColumn, selector: "[pReorderableColumn]", inputs: ["pReorderableColumnDisabled"] }, { kind: "component", type: i16.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i16.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i16.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i16.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i19$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i20$1.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "directive", type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i10.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$6.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: SmartGridCardComponent, selector: "app-smart-grid-card", inputs: ["item", "smartGrid", "onSelect"] }, { kind: "component", type: ExpandedRowRendererComponent, selector: "lib-expanded-row-renderer-component", inputs: ["rowId", "rowExpander", "expandedComponent", "smartGrid"] }] }); }
14510
14544
  }
14511
14545
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartGridComponent, decorators: [{
14512
14546
  type: Component,
14513
- args: [{ selector: 'smart-grid', providers: [SmartGridService], template: "@if(compLib === componentLibrary.PRIMENG) {\r\n\r\n<div *ngIf=\"smartGrid\" class=\"primeSmartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n </div>\r\n <p-table\r\n *ngIf=\"!smartGrid.layoutDef || smartGrid.layoutDef === layoutDef().TABLE\"\r\n #pTable\r\n [value]=\"smartGrid.gridModel.page.rows!\"\r\n (onSort)=\"gridSort($event)\"\r\n [customSort]=\"true\"\r\n [sortMode]=\"'multiple'\"\r\n [lazy]=\"true\"\r\n (onLazyLoad)=\"lazyLoad($event)\"\r\n [reorderableColumns]=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\"\r\n [columns]=\"columns\"\r\n (onColReorder)=\"onColOrder($event)\"\r\n (onRowSelect)=\"onRowSelect($event)\"\r\n (onRowUnselect)=\"onRowUnselect($event)\"\r\n [selection]=\"selectedRows\"\r\n (onHeaderCheckboxToggle)=\"onSelectAllRow($event)\"\r\n dataKey=\"id\"\r\n [expandedRowKeys]=\"expandedRows\"\r\n [rowExpandMode]=\"'multiple'\"\r\n [rowTrackBy]=\"rowTrackByFn\"\r\n >\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"tableCaption\">\r\n <div *ngIf=\"smartGrid.gridModel.title\" class=\"captionTitle\">\r\n {{ smartGrid.gridModel.title }}\r\n </div>\r\n <div *ngIf=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\">\r\n <p-multiSelect\r\n display=\"chip\"\r\n [options]=\"smartGrid.gridModel.view?.descriptor?.columns\"\r\n optionLabel=\"label\"\r\n [(ngModel)]=\"columns\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ 'min-width': '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n (onChange)=\"headerChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n @if (smartGrid.gridModel.view?.descriptor?.showEditColumns) {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\" pReorderableColumn>\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n } @else {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\">\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n }\r\n\r\n <th>\r\n <smart-ui-action-toolbar\r\n class=\"headerToolbar\"\r\n #headerToolbar\r\n [id]=\"'header_not_initialized'\"\r\n ></smart-ui-action-toolbar>\r\n </th>\r\n <th *ngIf=\"smartGrid.expandable\"> </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-row let-expanded=\"expanded\">\r\n <tr\r\n [ngClass]=\"getStyle(row)\"\r\n [class.rowExpanded]=\"expanded\"\r\n (dblclick)=\"onDoubleClick(row)\"\r\n *ngIf=\"row && row.data\"\r\n >\r\n <td *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableCheckbox *ngIf=\"row.selectable != false\" [value]=\"row\" />\r\n </td>\r\n <td *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableRadioButton [value]=\"row\" />\r\n </td>\r\n <td *ngFor=\"let col of smartGrid?.gridModel?.view?.orderedColumnNames\">\r\n <div *ngIf=\"row.icons[col]\">\r\n <div class=\"smart-table-icon-container\">\r\n <div *ngFor=\"let ir of getImageResourceIcons(row, col)\">\r\n <smart-icon [imageResource]=\"ir\"> </smart-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showCellToolbar(row, col)\">\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, col)\"\r\n ></smart-ui-action-toolbar>\r\n </ng-container>\r\n\r\n <div *ngIf=\"!row.icons[col]\" [innerHtml]=\"getColValue(col, row)\"> </div>\r\n </td>\r\n <td>\r\n <div class=\"menu-button\">\r\n @if(showCellToolbar(row, defaultActionToolbarId)){\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, defaultActionToolbarId)\"\r\n ></smart-ui-action-toolbar>\r\n }\r\n <p-button\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n *ngIf=\"shouldShowOptionsButton(row)\"\r\n (onClick)=\"onOptionsClick($event, row)\"\r\n >\r\n <smart-icon icon=\"ellipsis-v\"></smart-icon>\r\n </p-button>\r\n </div>\r\n </td>\r\n <td *ngIf=\"smartGrid.expandable\">\r\n <p-button\r\n type=\"button\"\r\n pRipple\r\n [pRowToggler]=\"row\"\r\n [text]=\"true\"\r\n severity=\"secondary\"\r\n [rounded]=\"true\"\r\n [icon]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n />\r\n </td>\r\n </tr>\r\n </ng-template>\r\n @if(smartGrid.expandable){\r\n <ng-template pTemplate=\"rowexpansion\" let-row>\r\n <tr>\r\n <td colspan=\"100%\">\r\n <lib-expanded-row-renderer-component\r\n [rowId]=\"row.id\"\r\n [rowExpander]=\"this\"\r\n [expandedComponent]=\"smartGrid.expandedComponent\"\r\n [smartGrid]=\"this.smartGrid\"\r\n ></lib-expanded-row-renderer-component>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n }\r\n </p-table>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <p-paginator\r\n *ngIf=\"smartGrid.paginator\"\r\n [first]=\"pageIndex!\"\r\n [totalRecords]=\"length!\"\r\n [rows]=\"pageSize\"\r\n [rowsPerPageOptions]=\"pageSizeOptions\"\r\n currentPageReportTemplate=\"{first} - {last} / {totalRecords}\"\r\n (onPageChange)=\"onPrimeChangePage($event)\"\r\n [showCurrentPageReport]=\"true\"\r\n dropdownAppendTo=\"body\"\r\n />\r\n <p-menu #menu [model]=\"menuButtons\" [popup]=\"true\" appendTo=\"body\"> </p-menu>\r\n</div>\r\n}@else {\r\n<div *ngIf=\"smartGrid\" class=\"smartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n <button\r\n (click)=\"editColumns()\"\r\n mat-mini-fab\r\n color=\"text-primary\"\r\n *ngIf=\"smartGrid.showEditColumns\"\r\n >\r\n <mat-icon aria-hidden=\"false\" aria-label=\"Columns\" class=\"smart-grid-edit-icon\"\r\n >view_columns</mat-icon\r\n >\r\n </button>\r\n </div>\r\n <!-- <div [ngClass]=\"isBlocked ? 'blocked' : ''\"></div> -->\r\n <div class=\"smartGridContent\">\r\n <div>\r\n <div *ngIf=\"smartGrid.showResultCount\">\r\n <div class=\"smartGrid-data-number\">\r\n {{ smartGrid.gridModel.totalRowCount }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"smart-grid-table-container\">\r\n <ng-template #table></ng-template>\r\n </div>\r\n\r\n <div *ngIf=\"smartGrid.layoutDef === layoutDef().EXPANDABLE\">\r\n <smart-expandable-section\r\n #gridExpandableSection\r\n *ngFor=\"let expandableSection of expandableSections\"\r\n [data]=\"expandableSection\"\r\n ></smart-expandable-section>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().TREE && treeControl\"\r\n class=\"tree-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <mat-tree [dataSource]=\"treeDataSource!\" [treeControl]=\"treeControl!\">\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node\"\r\n matTreeNodeToggle\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button mat-icon-button disabled class=\"tree-button\"></button>\r\n <mat-checkbox\r\n class=\"checklist-leaf-node\"\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button\r\n mat-icon-button\r\n matTreeNodeToggle\r\n class=\"tree-button\"\r\n [attr.aria-label]=\"'Toggle ' + node.item\"\r\n >\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{ treeControl!.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n </div>\r\n\r\n <mat-paginator\r\n *ngIf=\"smartGrid.paginator && !treeControl\"\r\n #paginator\r\n [length]=\"length\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onChangePage($event)\"\r\n ></mat-paginator>\r\n</div>\r\n}\r\n", styles: [".smartGrid-container{position:relative;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.primeSmartGrid-container{display:flex;flex-direction:column;gap:1rem}.smartGrid-data-number{padding-bottom:1rem}.smart-table-icon-container{display:flex;flex-direction:row;justify-content:space-between;white-space:initial}.cards-container{display:grid;gap:1rem;padding:1rem}.smartGrid-card-container{height:auto;border:1px solid black;border-radius:8px}.smartGrid-container ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-underline{bottom:0}.smartGridContent{width:100%;flex:1;overflow:auto}.blocked{position:absolute;width:calc(100% - 3rem);height:calc(100% - 3rem);z-index:110;background-color:#0003}.smart-grid-table-container{display:flex;flex-direction:column;gap:1rem}.smart-grid-toolbar{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.smart-grid-toolbar smart-ui-action-toolbar{width:100%}.smart-grid-edit-icon{color:var(--light-gray)}.tree-button{width:24px!important;height:24px!important}.menu-button{display:flex;flex-direction:row;justify-content:flex-end;text-align:-webkit-right;align-items:center}.headerToolbar ::ng-deep .uiActionButtonsContainer{justify-content:flex-end}.tableCaption{display:flex;flex-direction:row;justify-content:space-between}.tableCaption:has(*){padding:.5rem;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}.captionTitle{font-size:1.5rem;align-content:center}:host ::ng-deep .p-datatable-header:has(.tableCaption){padding:0;border:unset}\n"] }]
14514
- }], ctorParameters: () => [{ type: SmartGridService }, { type: ComponentFactoryService }, { type: i1$3.MatDialog }, { type: i0.Injector }, { type: UiActionDescriptorService }, { type: ComponentLibrary, decorators: [{
14547
+ args: [{ selector: 'smart-grid', providers: [SmartGridService, SmartDatePipe, SmartDateTimePipe, SmartTimePipe], template: "@if(compLib === componentLibrary.PRIMENG) {\r\n\r\n<div *ngIf=\"smartGrid\" class=\"primeSmartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n </div>\r\n <p-table\r\n *ngIf=\"!smartGrid.layoutDef || smartGrid.layoutDef === layoutDef().TABLE\"\r\n #pTable\r\n [value]=\"smartGrid.gridModel.page.rows!\"\r\n (onSort)=\"gridSort($event)\"\r\n [customSort]=\"true\"\r\n [sortMode]=\"'multiple'\"\r\n [lazy]=\"true\"\r\n (onLazyLoad)=\"lazyLoad($event)\"\r\n [reorderableColumns]=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\"\r\n [columns]=\"columns\"\r\n (onColReorder)=\"onColOrder($event)\"\r\n (onRowSelect)=\"onRowSelect($event)\"\r\n (onRowUnselect)=\"onRowUnselect($event)\"\r\n [selection]=\"selectedRows\"\r\n (onHeaderCheckboxToggle)=\"onSelectAllRow($event)\"\r\n dataKey=\"id\"\r\n [expandedRowKeys]=\"expandedRows\"\r\n [rowExpandMode]=\"'multiple'\"\r\n [rowTrackBy]=\"rowTrackByFn\"\r\n >\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"tableCaption\">\r\n <div *ngIf=\"smartGrid.gridModel.title\" class=\"captionTitle\">\r\n {{ smartGrid.gridModel.title }}\r\n </div>\r\n <div *ngIf=\"smartGrid.gridModel.view?.descriptor?.showEditColumns\">\r\n <p-multiSelect\r\n display=\"chip\"\r\n [options]=\"smartGrid.gridModel.view?.descriptor?.columns\"\r\n optionLabel=\"label\"\r\n [(ngModel)]=\"columns\"\r\n selectedItemsLabel=\"{0} columns selected\"\r\n [style]=\"{ 'min-width': '200px' }\"\r\n placeholder=\"Choose Columns\"\r\n (onChange)=\"headerChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n @if (smartGrid.gridModel.view?.descriptor?.showEditColumns) {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\" pReorderableColumn>\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n } @else {\r\n <th\r\n *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n >\r\n <p-tableHeaderCheckbox />\r\n </th>\r\n <th\r\n *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\"\r\n style=\"width: 4rem\"\r\n ></th>\r\n <th [pSortableColumn]=\"col.propertyName\" *ngFor=\"let col of columns\">\r\n <p-sortIcon [field]=\"col.propertyName\" />\r\n {{ col.label }}\r\n </th>\r\n }\r\n\r\n <th>\r\n <smart-ui-action-toolbar\r\n class=\"headerToolbar\"\r\n #headerToolbar\r\n [id]=\"'header_not_initialized'\"\r\n ></smart-ui-action-toolbar>\r\n </th>\r\n <th *ngIf=\"smartGrid.expandable\"> </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-row let-expanded=\"expanded\">\r\n <tr\r\n [ngClass]=\"getStyle(row)\"\r\n [class.rowExpanded]=\"expanded\"\r\n (dblclick)=\"onDoubleClick(row)\"\r\n *ngIf=\"row && row.data\"\r\n >\r\n <td *ngIf=\"isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableCheckbox *ngIf=\"row.selectable != false\" [value]=\"row\" />\r\n </td>\r\n <td *ngIf=\"!isMultiple && (tableType === 'checkbox' || tableType === 'CheckBox')\">\r\n <p-tableRadioButton [value]=\"row\" />\r\n </td>\r\n <td *ngFor=\"let col of smartGrid?.gridModel?.view?.orderedColumnNames\">\r\n <div *ngIf=\"row.icons[col]\">\r\n <div class=\"smart-table-icon-container\">\r\n <div *ngFor=\"let ir of getImageResourceIcons(row, col)\">\r\n <smart-icon [imageResource]=\"ir\"> </smart-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"showCellToolbar(row, col)\">\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, col)\"\r\n ></smart-ui-action-toolbar>\r\n </ng-container>\r\n\r\n <div *ngIf=\"!row.icons[col]\" [innerHtml]=\"getColValue(col, row)\"> </div>\r\n </td>\r\n <td>\r\n <div class=\"menu-button\">\r\n @if(showCellToolbar(row, defaultActionToolbarId)){\r\n <smart-ui-action-toolbar\r\n [uiActionModels]=\"getRowColumnAction(row, defaultActionToolbarId)\"\r\n ></smart-ui-action-toolbar>\r\n }\r\n <p-button\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n *ngIf=\"shouldShowOptionsButton(row)\"\r\n (onClick)=\"onOptionsClick($event, row)\"\r\n >\r\n <smart-icon icon=\"ellipsis-v\"></smart-icon>\r\n </p-button>\r\n </div>\r\n </td>\r\n <td *ngIf=\"smartGrid.expandable\">\r\n <p-button\r\n type=\"button\"\r\n pRipple\r\n [pRowToggler]=\"row\"\r\n [text]=\"true\"\r\n severity=\"secondary\"\r\n [rounded]=\"true\"\r\n [icon]=\"expanded ? 'pi pi-chevron-up' : 'pi pi-chevron-down'\"\r\n />\r\n </td>\r\n </tr>\r\n </ng-template>\r\n @if(smartGrid.expandable){\r\n <ng-template pTemplate=\"rowexpansion\" let-row>\r\n <tr>\r\n <td colspan=\"100%\">\r\n <lib-expanded-row-renderer-component\r\n [rowId]=\"row.id\"\r\n [rowExpander]=\"this\"\r\n [expandedComponent]=\"smartGrid.expandedComponent\"\r\n [smartGrid]=\"this.smartGrid\"\r\n ></lib-expanded-row-renderer-component>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n }\r\n </p-table>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <p-paginator\r\n *ngIf=\"smartGrid.paginator\"\r\n [first]=\"pageIndex!\"\r\n [totalRecords]=\"length!\"\r\n [rows]=\"pageSize\"\r\n [rowsPerPageOptions]=\"pageSizeOptions\"\r\n currentPageReportTemplate=\"{first} - {last} / {totalRecords}\"\r\n (onPageChange)=\"onPrimeChangePage($event)\"\r\n [showCurrentPageReport]=\"true\"\r\n dropdownAppendTo=\"body\"\r\n />\r\n <p-menu #menu [model]=\"menuButtons\" [popup]=\"true\" appendTo=\"body\"> </p-menu>\r\n</div>\r\n}@else {\r\n<div *ngIf=\"smartGrid\" class=\"smartGrid-container\">\r\n <div class=\"smart-grid-toolbar\">\r\n <smart-ui-action-toolbar #toolbar [id]=\"'grid_not_initialized'\"></smart-ui-action-toolbar>\r\n <button\r\n (click)=\"editColumns()\"\r\n mat-mini-fab\r\n color=\"text-primary\"\r\n *ngIf=\"smartGrid.showEditColumns\"\r\n >\r\n <mat-icon aria-hidden=\"false\" aria-label=\"Columns\" class=\"smart-grid-edit-icon\"\r\n >view_columns</mat-icon\r\n >\r\n </button>\r\n </div>\r\n <!-- <div [ngClass]=\"isBlocked ? 'blocked' : ''\"></div> -->\r\n <div class=\"smartGridContent\">\r\n <div>\r\n <div *ngIf=\"smartGrid.showResultCount\">\r\n <div class=\"smartGrid-data-number\">\r\n {{ smartGrid.gridModel.totalRowCount }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"smart-grid-table-container\">\r\n <ng-template #table></ng-template>\r\n </div>\r\n\r\n <div *ngIf=\"smartGrid.layoutDef === layoutDef().EXPANDABLE\">\r\n <smart-expandable-section\r\n #gridExpandableSection\r\n *ngFor=\"let expandableSection of expandableSections\"\r\n [data]=\"expandableSection\"\r\n ></smart-expandable-section>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().CARD && smartGrid.dataLayoutDef\"\r\n class=\"cards-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <app-smart-grid-card\r\n class=\"smartGrid-card-container\"\r\n *ngFor=\"let task of smartGrid.gridModel.page.rows\"\r\n [item]=\"task\"\r\n [smartGrid]=\"smartGrid\"\r\n [onSelect]=\"onSelect.bind(this)\"\r\n ></app-smart-grid-card>\r\n </div>\r\n <div\r\n *ngIf=\"smartGrid.layoutDef === layoutDef().TREE && treeControl\"\r\n class=\"tree-container\"\r\n [ngStyle]=\"{\r\n 'grid-template-columns':\r\n smartGrid.numberOfColumn !== undefined\r\n ? 'repeat(' + smartGrid.numberOfColumn + ', 1fr)'\r\n : ''\r\n }\"\r\n >\r\n <mat-tree [dataSource]=\"treeDataSource!\" [treeControl]=\"treeControl!\">\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node\"\r\n matTreeNodeToggle\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button mat-icon-button disabled class=\"tree-button\"></button>\r\n <mat-checkbox\r\n class=\"checklist-leaf-node\"\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n\r\n <mat-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodePadding\r\n matTreeNodePaddingIndent=\"24\"\r\n >\r\n <button\r\n mat-icon-button\r\n matTreeNodeToggle\r\n class=\"tree-button\"\r\n [attr.aria-label]=\"'Toggle ' + node.item\"\r\n >\r\n <mat-icon class=\"mat-icon-rtl-mirror\">\r\n {{ treeControl!.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </mat-icon>\r\n </button>\r\n <mat-checkbox\r\n [checked]=\"treeChecklistSelection?.isSelected(node)\"\r\n [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n (change)=\"treeNodeSelectionToggle(node)\"\r\n >{{ getTreeItem(node) }}</mat-checkbox\r\n >\r\n </mat-tree-node>\r\n </mat-tree>\r\n </div>\r\n </div>\r\n\r\n <mat-paginator\r\n *ngIf=\"smartGrid.paginator && !treeControl\"\r\n #paginator\r\n [length]=\"length\"\r\n [pageIndex]=\"pageIndex\"\r\n [pageSize]=\"pageSize\"\r\n [pageSizeOptions]=\"pageSizeOptions\"\r\n (page)=\"onChangePage($event)\"\r\n ></mat-paginator>\r\n</div>\r\n}\r\n", styles: [".smartGrid-container{position:relative;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.primeSmartGrid-container{display:flex;flex-direction:column;gap:1rem}.smartGrid-data-number{padding-bottom:1rem}.smart-table-icon-container{display:flex;flex-direction:row;justify-content:space-between;white-space:initial}.cards-container{display:grid;gap:1rem;padding:1rem}.smartGrid-card-container{height:auto;border:1px solid black;border-radius:8px}.smartGrid-container ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-underline{bottom:0}.smartGridContent{width:100%;flex:1;overflow:auto}.blocked{position:absolute;width:calc(100% - 3rem);height:calc(100% - 3rem);z-index:110;background-color:#0003}.smart-grid-table-container{display:flex;flex-direction:column;gap:1rem}.smart-grid-toolbar{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.smart-grid-toolbar smart-ui-action-toolbar{width:100%}.smart-grid-edit-icon{color:var(--light-gray)}.tree-button{width:24px!important;height:24px!important}.menu-button{display:flex;flex-direction:row;justify-content:flex-end;text-align:-webkit-right;align-items:center}.headerToolbar ::ng-deep .uiActionButtonsContainer{justify-content:flex-end}.tableCaption{display:flex;flex-direction:row;justify-content:space-between}.tableCaption:has(*){padding:.5rem;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}.captionTitle{font-size:1.5rem;align-content:center}:host ::ng-deep .p-datatable-header:has(.tableCaption){padding:0;border:unset}\n"] }]
14548
+ }], ctorParameters: () => [{ type: SmartGridService }, { type: ComponentFactoryService }, { type: i1$3.MatDialog }, { type: i0.Injector }, { type: UiActionDescriptorService }, { type: SmartDatePipe }, { type: SmartDateTimePipe }, { type: SmartTimePipe }, { type: ComponentLibrary, decorators: [{
14515
14549
  type: Inject,
14516
14550
  args: [COMPONENT_LIBRARY]
14517
14551
  }] }, { type: undefined, decorators: [{
@@ -16455,7 +16489,7 @@ class SmartTreeComponent {
16455
16489
  return `${cssClass}-${plusProperty}`;
16456
16490
  }
16457
16491
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartTreeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
16458
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartTreeComponent, selector: "smart-tree", inputs: { treeStyle: "treeStyle", treeService: "treeService" }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true }, { propertyName: "trigger", predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<div class=\"smartTreeContainer\">\r\n <smart-ui-action-toolbar\r\n *ngIf=\"uiActionModels.length\"\r\n [uiActionModels]=\"uiActionModels\"\r\n ></smart-ui-action-toolbar>\r\n <mat-tree\r\n #tree\r\n *ngIf=\"treeData\"\r\n [dataSource]=\"dataSource\"\r\n [treeControl]=\"treeControl\"\r\n class=\"sm-tree\"\r\n >\r\n <mat-nested-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n [ngClass]=\"getClassesForTreeNode(node)\"\r\n [ngStyle]=\"getNodeStyle(node)\"\r\n >\r\n <div\r\n [ngStyle]=\"getNodePadding(node)\"\r\n [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n class=\"mat-tree-node sm-tree-node\"\r\n (click)=\"onNodeClick($event, node)\"\r\n >\r\n <button mat-icon-button [attr.aria-label]=\"'Toggle ' + node.name\">\r\n <mat-icon\r\n class=\"mat-icon-rtl-mirror\"\r\n matTreeNodeToggle\r\n (click)=\"onOpenNode($event, node)\"\r\n >\r\n <div *ngIf=\"hasChild(node.level, node)\">\r\n {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </div>\r\n </mat-icon>\r\n </button>\r\n <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n <div class=\"sm-tree-row-caption\">\r\n {{ node.caption }}\r\n </div>\r\n <div class=\"sm-shortDescription-spacer\"></div>\r\n <div class=\"sm-tree-row-shortDescription\">\r\n {{ node.shortDescription }}\r\n </div>\r\n <div class=\"sm-shortDescription-button-spacer\"></div>\r\n <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n <button\r\n (click)=\"customButtonClicked($event, node.button)\"\r\n *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n mat-icon-button\r\n >\r\n <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n </button>\r\n <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n <button\r\n mat-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"customButtonClicked($event, node.button, true)\"\r\n >\r\n <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n >{{ node.button.label }}\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <button\r\n *ngFor=\"let button of node.button.menuItemButtons\"\r\n (click)=\"customButtonClicked($event, button, true)\"\r\n mat-menu-item\r\n >\r\n <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n >{{ button.label }}\r\n </button>\r\n </mat-menu>\r\n </div>\r\n <button\r\n (click)=\"customButtonClicked($event, node.button)\"\r\n *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n mat-raised-button\r\n >\r\n <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n {{ node.button.icon }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n role=\"group\"\r\n >\r\n <ng-container matTreeNodeOutlet></ng-container>\r\n </div>\r\n </mat-nested-tree-node>\r\n </mat-tree>\r\n <div *ngIf=\"!treeData\">\r\n <h3>\r\n {{ errorMessage }}\r\n </h3>\r\n </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i10$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i10$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i10$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i10$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i10$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "component", type: i5$2.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: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap"] }] }); }
16492
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartTreeComponent, selector: "smart-tree", inputs: { treeStyle: "treeStyle", treeService: "treeService" }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true }, { propertyName: "trigger", predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<div class=\"smartTreeContainer\">\r\n <smart-ui-action-toolbar\r\n *ngIf=\"uiActionModels.length\"\r\n [uiActionModels]=\"uiActionModels\"\r\n ></smart-ui-action-toolbar>\r\n <mat-tree\r\n #tree\r\n *ngIf=\"treeData\"\r\n [dataSource]=\"dataSource\"\r\n [treeControl]=\"treeControl\"\r\n class=\"sm-tree\"\r\n >\r\n <mat-nested-tree-node\r\n *matTreeNodeDef=\"let node; when: hasChild\"\r\n matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n [ngClass]=\"getClassesForTreeNode(node)\"\r\n [ngStyle]=\"getNodeStyle(node)\"\r\n >\r\n <div\r\n [ngStyle]=\"getNodePadding(node)\"\r\n [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n class=\"mat-tree-node sm-tree-node\"\r\n (click)=\"onNodeClick($event, node)\"\r\n >\r\n <button mat-icon-button [attr.aria-label]=\"'Toggle ' + node.name\">\r\n <mat-icon\r\n class=\"mat-icon-rtl-mirror\"\r\n matTreeNodeToggle\r\n (click)=\"onOpenNode($event, node)\"\r\n >\r\n <div *ngIf=\"hasChild(node.level, node)\">\r\n {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n </div>\r\n </mat-icon>\r\n </button>\r\n <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n <div class=\"sm-tree-row-caption\">\r\n {{ node.caption }}\r\n </div>\r\n <div class=\"sm-shortDescription-spacer\"></div>\r\n <div class=\"sm-tree-row-shortDescription\">\r\n {{ node.shortDescription }}\r\n </div>\r\n <div class=\"sm-shortDescription-button-spacer\"></div>\r\n <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n <button\r\n (click)=\"customButtonClicked($event, node.button)\"\r\n *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n mat-icon-button\r\n >\r\n <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n </button>\r\n <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n <button\r\n mat-button\r\n [matMenuTriggerFor]=\"menu\"\r\n (click)=\"customButtonClicked($event, node.button, true)\"\r\n >\r\n <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n >{{ node.button.label }}\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <button\r\n *ngFor=\"let button of node.button.menuItemButtons\"\r\n (click)=\"customButtonClicked($event, button, true)\"\r\n mat-menu-item\r\n >\r\n <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n >{{ button.label }}\r\n </button>\r\n </mat-menu>\r\n </div>\r\n <button\r\n (click)=\"customButtonClicked($event, node.button)\"\r\n *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n mat-raised-button\r\n >\r\n <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n {{ node.button.icon }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n role=\"group\"\r\n >\r\n <ng-container matTreeNodeOutlet></ng-container>\r\n </div>\r\n </mat-nested-tree-node>\r\n </mat-tree>\r\n <div *ngIf=\"!treeData\">\r\n <h3>\r\n {{ errorMessage }}\r\n </h3>\r\n </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i11$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i11$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i11$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "component", type: i5$2.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: i5$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$2.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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap"] }] }); }
16459
16493
  }
16460
16494
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartTreeComponent, decorators: [{
16461
16495
  type: Component,