@natec/mef-dev-ui-kit 20.1.16 → 20.1.17
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.
- package/fesm2022/natec-mef-dev-ui-kit.mjs +71 -71
- package/fesm2022/natec-mef-dev-ui-kit.mjs.map +1 -1
- package/index.d.ts +80 -62
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/lib/styles/core.scss +1 -1
- package/src/lib/styles/pg/vendor/md-cards-grid.scss +124 -124
- package/src/lib/styles/pg/vendor/md-datatable.scss +340 -0
- package/src/lib/styles/pg/vendor/md-grid.scss +663 -0
|
@@ -14451,22 +14451,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
14451
14451
|
*
|
|
14452
14452
|
* @example
|
|
14453
14453
|
* ```html
|
|
14454
|
-
* <ng-template
|
|
14454
|
+
* <ng-template mdGridCellTemplate let-value="value" let-row="row">
|
|
14455
14455
|
* <span>{{value}}</span>
|
|
14456
14456
|
* </ng-template>
|
|
14457
14457
|
* ```
|
|
14458
14458
|
*/
|
|
14459
|
-
class
|
|
14459
|
+
class MDGridCellTemplateDirective {
|
|
14460
14460
|
static ngTemplateContextGuard(dir, ctx) {
|
|
14461
14461
|
return true;
|
|
14462
14462
|
}
|
|
14463
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14464
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type:
|
|
14463
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridCellTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
14464
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDGridCellTemplateDirective, isStandalone: true, selector: "[mdGridCellTemplate]", ngImport: i0 });
|
|
14465
14465
|
}
|
|
14466
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14466
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridCellTemplateDirective, decorators: [{
|
|
14467
14467
|
type: Directive,
|
|
14468
14468
|
args: [{
|
|
14469
|
-
selector: '[
|
|
14469
|
+
selector: '[mdGridCellTemplate]',
|
|
14470
14470
|
standalone: true,
|
|
14471
14471
|
}]
|
|
14472
14472
|
}] });
|
|
@@ -14475,22 +14475,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
14475
14475
|
*
|
|
14476
14476
|
* @example
|
|
14477
14477
|
* ```html
|
|
14478
|
-
* <ng-template
|
|
14478
|
+
* <ng-template mdGridHeaderTemplate let-column="column" let-sortFn="sortFn">
|
|
14479
14479
|
* <span (click)="sortFn()">{{column.name}}</span>
|
|
14480
14480
|
* </ng-template>
|
|
14481
14481
|
* ```
|
|
14482
14482
|
*/
|
|
14483
|
-
class
|
|
14483
|
+
class MDGridHeaderTemplateDirective {
|
|
14484
14484
|
static ngTemplateContextGuard(dir, ctx) {
|
|
14485
14485
|
return true;
|
|
14486
14486
|
}
|
|
14487
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14488
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type:
|
|
14487
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridHeaderTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
14488
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDGridHeaderTemplateDirective, isStandalone: true, selector: "[mdGridHeaderTemplate]", ngImport: i0 });
|
|
14489
14489
|
}
|
|
14490
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14490
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridHeaderTemplateDirective, decorators: [{
|
|
14491
14491
|
type: Directive,
|
|
14492
14492
|
args: [{
|
|
14493
|
-
selector: '[
|
|
14493
|
+
selector: '[mdGridHeaderTemplate]',
|
|
14494
14494
|
standalone: true,
|
|
14495
14495
|
}]
|
|
14496
14496
|
}] });
|
|
@@ -14499,41 +14499,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
14499
14499
|
*
|
|
14500
14500
|
* @example
|
|
14501
14501
|
* ```html
|
|
14502
|
-
* <ng-template
|
|
14502
|
+
* <ng-template mdGridEditTemplate let-row="row" let-saveFn="saveFn" let-cancelFn="cancelFn">
|
|
14503
14503
|
* <input [(ngModel)]="row.name" />
|
|
14504
14504
|
* </ng-template>
|
|
14505
14505
|
* ```
|
|
14506
14506
|
*/
|
|
14507
|
-
class
|
|
14507
|
+
class MDGridEditTemplateDirective {
|
|
14508
14508
|
static ngTemplateContextGuard(dir, ctx) {
|
|
14509
14509
|
return true;
|
|
14510
14510
|
}
|
|
14511
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14512
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type:
|
|
14511
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridEditTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
14512
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDGridEditTemplateDirective, isStandalone: true, selector: "[mdGridEditTemplate]", ngImport: i0 });
|
|
14513
14513
|
}
|
|
14514
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14514
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridEditTemplateDirective, decorators: [{
|
|
14515
14515
|
type: Directive,
|
|
14516
14516
|
args: [{
|
|
14517
|
-
selector: '[
|
|
14517
|
+
selector: '[mdGridEditTemplate]',
|
|
14518
14518
|
standalone: true,
|
|
14519
14519
|
}]
|
|
14520
14520
|
}] });
|
|
14521
14521
|
/**
|
|
14522
|
-
* Column definition directive for md-
|
|
14522
|
+
* Column definition directive for md-grid.
|
|
14523
14523
|
*
|
|
14524
14524
|
* @example
|
|
14525
14525
|
* ```html
|
|
14526
|
-
* <md-
|
|
14527
|
-
* <ng-template
|
|
14526
|
+
* <md-grid-column name="Name" prop="name" [sortable]="true" [width]="200">
|
|
14527
|
+
* <ng-template mdGridCellTemplate let-value="value">
|
|
14528
14528
|
* <span>{{value}}</span>
|
|
14529
14529
|
* </ng-template>
|
|
14530
|
-
* <ng-template
|
|
14530
|
+
* <ng-template mdGridEditTemplate let-row="row">
|
|
14531
14531
|
* <input [(ngModel)]="row.name" />
|
|
14532
14532
|
* </ng-template>
|
|
14533
|
-
* </md-
|
|
14533
|
+
* </md-grid-column>
|
|
14534
14534
|
* ```
|
|
14535
14535
|
*/
|
|
14536
|
-
class
|
|
14536
|
+
class MDGridColumnDirective {
|
|
14537
14537
|
/** Display name for the header */
|
|
14538
14538
|
name;
|
|
14539
14539
|
/** Property path to get value from row */
|
|
@@ -14579,13 +14579,13 @@ class MDCardsGridColumnDirective {
|
|
|
14579
14579
|
get editTemplate() {
|
|
14580
14580
|
return this._editTemplateInput || this._editTemplateQuery;
|
|
14581
14581
|
}
|
|
14582
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14583
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type:
|
|
14582
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
14583
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type: MDGridColumnDirective, isStandalone: true, selector: "md-grid-column", inputs: { name: "name", prop: "prop", width: ["width", "width", numberAttribute], minWidth: ["minWidth", "minWidth", numberAttribute], maxWidth: ["maxWidth", "maxWidth", numberAttribute], flexGrow: ["flexGrow", "flexGrow", numberAttribute], sortable: ["sortable", "sortable", booleanAttribute], resizeable: ["resizeable", "resizeable", booleanAttribute], comparator: "comparator", pipe: "pipe", headerClass: "headerClass", cellClass: "cellClass", _cellTemplateInput: ["cellTemplate", "_cellTemplateInput"], _headerTemplateInput: ["headerTemplate", "_headerTemplateInput"], _editTemplateInput: ["editTemplate", "_editTemplateInput"] }, queries: [{ propertyName: "_cellTemplateQuery", first: true, predicate: MDGridCellTemplateDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "_headerTemplateQuery", first: true, predicate: MDGridHeaderTemplateDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "_editTemplateQuery", first: true, predicate: MDGridEditTemplateDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0 });
|
|
14584
14584
|
}
|
|
14585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
14585
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridColumnDirective, decorators: [{
|
|
14586
14586
|
type: Directive,
|
|
14587
14587
|
args: [{
|
|
14588
|
-
selector: 'md-
|
|
14588
|
+
selector: 'md-grid-column',
|
|
14589
14589
|
standalone: true,
|
|
14590
14590
|
}]
|
|
14591
14591
|
}], propDecorators: { name: [{
|
|
@@ -14623,19 +14623,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
14623
14623
|
args: ['cellTemplate']
|
|
14624
14624
|
}], _cellTemplateQuery: [{
|
|
14625
14625
|
type: ContentChild,
|
|
14626
|
-
args: [
|
|
14626
|
+
args: [MDGridCellTemplateDirective, { read: TemplateRef, static: true }]
|
|
14627
14627
|
}], _headerTemplateInput: [{
|
|
14628
14628
|
type: Input,
|
|
14629
14629
|
args: ['headerTemplate']
|
|
14630
14630
|
}], _headerTemplateQuery: [{
|
|
14631
14631
|
type: ContentChild,
|
|
14632
|
-
args: [
|
|
14632
|
+
args: [MDGridHeaderTemplateDirective, { read: TemplateRef, static: true }]
|
|
14633
14633
|
}], _editTemplateInput: [{
|
|
14634
14634
|
type: Input,
|
|
14635
14635
|
args: ['editTemplate']
|
|
14636
14636
|
}], _editTemplateQuery: [{
|
|
14637
14637
|
type: ContentChild,
|
|
14638
|
-
args: [
|
|
14638
|
+
args: [MDGridEditTemplateDirective, { read: TemplateRef, static: true }]
|
|
14639
14639
|
}] } });
|
|
14640
14640
|
|
|
14641
14641
|
/**
|
|
@@ -14848,14 +14848,14 @@ function calculateColumnWidths(columns, containerWidth) {
|
|
|
14848
14848
|
}
|
|
14849
14849
|
|
|
14850
14850
|
/**
|
|
14851
|
-
* MD
|
|
14851
|
+
* MD Grid Component
|
|
14852
14852
|
*
|
|
14853
14853
|
* A horizontal cards grid with table-like header and edit mode support.
|
|
14854
14854
|
* Similar API to ngx-datatable but displays data as cards/tiles.
|
|
14855
14855
|
*
|
|
14856
14856
|
* @example
|
|
14857
14857
|
* ```html
|
|
14858
|
-
* <md-
|
|
14858
|
+
* <md-grid
|
|
14859
14859
|
* [rows]="data"
|
|
14860
14860
|
* [groupRowsBy]="'category'"
|
|
14861
14861
|
* [(editingRow)]="currentEditingRow"
|
|
@@ -14863,19 +14863,19 @@ function calculateColumnWidths(columns, containerWidth) {
|
|
|
14863
14863
|
* (sort)="onSort($event)"
|
|
14864
14864
|
* (rowEditSave)="onSave($event)">
|
|
14865
14865
|
*
|
|
14866
|
-
* <md-
|
|
14867
|
-
* <ng-template
|
|
14866
|
+
* <md-grid-column name="Name" prop="name" [sortable]="true">
|
|
14867
|
+
* <ng-template mdGridCellTemplate let-value="value">
|
|
14868
14868
|
* <span>{{value}}</span>
|
|
14869
14869
|
* </ng-template>
|
|
14870
|
-
* <ng-template
|
|
14870
|
+
* <ng-template mdGridEditTemplate let-row="row">
|
|
14871
14871
|
* <input [(ngModel)]="row.name" />
|
|
14872
14872
|
* </ng-template>
|
|
14873
|
-
* </md-
|
|
14873
|
+
* </md-grid-column>
|
|
14874
14874
|
*
|
|
14875
|
-
* </md-
|
|
14875
|
+
* </md-grid>
|
|
14876
14876
|
* ```
|
|
14877
14877
|
*/
|
|
14878
|
-
class
|
|
14878
|
+
class MDGridComponent {
|
|
14879
14879
|
_cdr = inject(ChangeDetectorRef);
|
|
14880
14880
|
_columnsSubscription;
|
|
14881
14881
|
/** Host binding for shrink mode class */
|
|
@@ -15132,10 +15132,10 @@ class MDCardsGridComponent {
|
|
|
15132
15132
|
return '';
|
|
15133
15133
|
const dir = this.getSortDir(column);
|
|
15134
15134
|
if (dir === SortDirection.asc) {
|
|
15135
|
-
return this.sortAscendingIcon || 'md-
|
|
15135
|
+
return this.sortAscendingIcon || 'md-grid-sort-asc';
|
|
15136
15136
|
}
|
|
15137
15137
|
if (dir === SortDirection.desc) {
|
|
15138
|
-
return this.sortDescendingIcon || 'md-
|
|
15138
|
+
return this.sortDescendingIcon || 'md-grid-sort-desc';
|
|
15139
15139
|
}
|
|
15140
15140
|
return ``;
|
|
15141
15141
|
}
|
|
@@ -15166,7 +15166,7 @@ class MDCardsGridComponent {
|
|
|
15166
15166
|
document.addEventListener('mousemove', this._onResizeMove);
|
|
15167
15167
|
document.addEventListener('mouseup', this._onResizeEnd);
|
|
15168
15168
|
// Add resizing class to body to prevent text selection
|
|
15169
|
-
document.body.classList.add('md-
|
|
15169
|
+
document.body.classList.add('md-grid-resizing');
|
|
15170
15170
|
}
|
|
15171
15171
|
/**
|
|
15172
15172
|
* Handle mouse move during resize
|
|
@@ -15194,7 +15194,7 @@ class MDCardsGridComponent {
|
|
|
15194
15194
|
document.removeEventListener('mousemove', this._onResizeMove);
|
|
15195
15195
|
document.removeEventListener('mouseup', this._onResizeEnd);
|
|
15196
15196
|
// Remove resizing class
|
|
15197
|
-
document.body.classList.remove('md-
|
|
15197
|
+
document.body.classList.remove('md-grid-resizing');
|
|
15198
15198
|
// Emit resize event
|
|
15199
15199
|
const prevWidth = this._resizeStartWidth;
|
|
15200
15200
|
const newWidth = this._resizingColumn.width;
|
|
@@ -15343,17 +15343,17 @@ class MDCardsGridComponent {
|
|
|
15343
15343
|
this.editingRow = null;
|
|
15344
15344
|
this.editingRowChange.emit(null);
|
|
15345
15345
|
}
|
|
15346
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15347
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDCardsGridComponent, isStandalone: true, selector: "md-cards-grid", inputs: { rows: "rows", columns: "columns", groupRowsBy: "groupRowsBy", groupHeaderTemplate: "groupHeaderTemplate", rowActionsTemplate: "rowActionsTemplate", headerHeight: ["headerHeight", "headerHeight", numberAttribute], cardHeight: "cardHeight", gap: ["gap", "gap", numberAttribute], defaultColumnWidth: ["defaultColumnWidth", "defaultColumnWidth", numberAttribute], showRowActions: ["showRowActions", "showRowActions", booleanAttribute], overflowMode: "overflowMode", enableColumnResize: ["enableColumnResize", "enableColumnResize", booleanAttribute], defaultMinColumnWidth: ["defaultMinColumnWidth", "defaultMinColumnWidth", numberAttribute], defaultMaxColumnWidth: ["defaultMaxColumnWidth", "defaultMaxColumnWidth", numberAttribute], sorts: "sorts", sortType: "sortType", externalSorting: ["externalSorting", "externalSorting", booleanAttribute], enableClearingSortState: ["enableClearingSortState", "enableClearingSortState", booleanAttribute], sortAscendingIcon: "sortAscendingIcon", sortDescendingIcon: "sortDescendingIcon", sortUnsetIcon: "sortUnsetIcon", limit: ["limit", "limit", numberAttribute], offset: ["offset", "offset", numberAttribute], count: ["count", "count", numberAttribute], externalPaging: ["externalPaging", "externalPaging", booleanAttribute], showFooter: ["showFooter", "showFooter", booleanAttribute], footerHeight: ["footerHeight", "footerHeight", numberAttribute], editingRow: "editingRow" }, outputs: { columnResize: "columnResize", sort: "sort", page: "page", editingRowChange: "editingRowChange", rowEditStart: "rowEditStart", rowEditSave: "rowEditSave", rowEditCancel: "rowEditCancel" }, host: { properties: { "class.md-cards-grid-shrink-mode": "this.isShrinkMode" }, classAttribute: "md-cards-grid" }, queries: [{ propertyName: "_columnDirectives", predicate: MDCardsGridColumnDirective }], exportAs: ["mdCardsGrid"], usesOnChanges: true, ngImport: i0, template: "<!-- Scrollable container for header and body -->\r\n<div class=\"md-cards-grid-scroll-container\">\r\n<!-- Header -->\r\n@if (headerHeight > 0) {\r\n<div\r\n class=\"md-cards-grid-header\"\r\n role=\"row\"\r\n [style.height.px]=\"headerHeight\"\r\n>\r\n <div class=\"md-cards-grid-header-inner\">\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-cards-grid-header-cell\"\r\n role=\"columnheader\"\r\n [class.sortable]=\"column.sortable\"\r\n [class.resizeable]=\"isColumnResizeable(column)\"\r\n [class.sort-active]=\"getSortDir(column)\"\r\n [class.sort-asc]=\"getSortDir(column) === 'asc'\"\r\n [class.sort-desc]=\"getSortDir(column) === 'desc'\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n [attr.title]=\"column.name\"\r\n (click)=\"onColumnSort(column)\"\r\n (keydown.enter)=\"onColumnSort(column)\"\r\n [attr.tabindex]=\"column.sortable ? 0 : -1\"\r\n >\r\n <!-- Custom header template -->\r\n @if (column.headerTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.headerTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n column: column,\r\n sortDir: getSortDir(column),\r\n sortFn: onColumnSort.bind(this, column)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default header -->\r\n <span class=\"md-cards-grid-header-cell-label\">{{ column.name }}</span>\r\n @if (column.sortable) {\r\n <span class=\"md-cards-grid-sort-icon\" [ngClass]=\"getSortClass(column)\"></span>\r\n }\r\n }\r\n\r\n <!-- Resize handle -->\r\n @if (isColumnResizeable(column)) {\r\n <span\r\n class=\"md-cards-grid-resize-handle\"\r\n (mousedown)=\"onResizeStart($event, column)\"\r\n ></span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Actions header cell -->\r\n @if (showRowActions) {\r\n <div class=\"md-cards-grid-header-cell md-cards-grid-actions-cell\">\r\n <span class=\"md-cards-grid-header-cell-label\"></span>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n}\r\n\r\n<!-- Body -->\r\n<div class=\"md-cards-grid-body\" [style.gap.px]=\"gap\">\r\n <!-- Grouped rows -->\r\n @if (_groupedRows) {\r\n @for (group of _groupedRows; track trackByGroup($index, group)) {\r\n <div class=\"md-cards-grid-group\">\r\n <!-- Group header -->\r\n <div class=\"md-cards-grid-group-header\">\r\n @if (groupHeaderTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"groupHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"{ group: group }\"\r\n />\r\n } @else {\r\n <span class=\"md-cards-grid-group-title\">{{ group.key }}</span>\r\n }\r\n </div>\r\n\r\n <!-- Group rows -->\r\n <div class=\"md-cards-grid-group-rows\" [style.gap.px]=\"gap\">\r\n @for (row of group.value; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: group.key }\"\r\n />\r\n }\r\n </div>\r\n </div>\r\n }\r\n } @else {\r\n <!-- Non-grouped rows -->\r\n @for (row of _displayRows; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: null }\"\r\n />\r\n }\r\n }\r\n</div>\r\n</div><!-- End scroll container -->\r\n\r\n<!-- Row template -->\r\n<ng-template #rowTemplate let-row=\"row\" let-rowIndex=\"rowIndex\" let-group=\"group\">\r\n <div\r\n class=\"md-cards-grid-card\"\r\n [class.md-cards-grid-card-editing]=\"isEditing(row)\"\r\n [class.md-cards-grid-card-fixed-height]=\"cardHeight !== 'auto'\"\r\n [style.height]=\"cardHeight === 'auto' ? null : cardHeight + 'px'\"\r\n role=\"row\"\r\n >\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-cards-grid-cell\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n role=\"cell\"\r\n >\r\n <!-- Edit mode -->\r\n @if (isEditing(row) && column.editTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.editTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: getTemplateRow(row),\r\n originalRow: row,\r\n value: getCellValue(getTemplateRow(row), column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n }\r\n <!-- View mode with custom template -->\r\n @else if (column.cellTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.cellTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n value: getCellValue(row, column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n group: group\r\n }\"\r\n />\r\n }\r\n <!-- Default view mode -->\r\n @else {\r\n <span class=\"md-cards-grid-cell-value\">{{ getCellValue(row, column) }}</span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Row actions -->\r\n @if (showRowActions) {\r\n <div class=\"md-cards-grid-cell md-cards-grid-actions-cell\">\r\n @if (rowActionsTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"rowActionsTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n editFn: editRow.bind(this, row),\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default actions -->\r\n @if (isEditing(row)) {\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-save\"\r\n (click)=\"saveRow()\"\r\n title=\"Save\"\r\n >\r\n <span class=\"md-cards-grid-icon-save\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-cancel\"\r\n (click)=\"cancelEdit()\"\r\n title=\"Cancel\"\r\n >\r\n <span class=\"md-cards-grid-icon-cancel\"></span>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-edit\"\r\n (click)=\"editRow(row)\"\r\n title=\"Edit\"\r\n >\r\n <span class=\"md-cards-grid-icon-edit\"></span>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<!-- Footer / Pagination -->\r\n@if (showFooter && totalPages > 1) {\r\n<div\r\n class=\"md-cards-grid-footer\"\r\n [style.height.px]=\"footerHeight\"\r\n>\r\n <div class=\"md-cards-grid-pager\">\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(0)\"\r\n title=\"First page\"\r\n >\r\n <span class=\"md-cards-grid-icon-first\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(offset - 1)\"\r\n title=\"Previous page\"\r\n >\r\n <span class=\"md-cards-grid-icon-prev\"></span>\r\n </button>\r\n\r\n <span class=\"md-cards-grid-pager-info\">\r\n {{ currentPage }} / {{ totalPages }}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(offset + 1)\"\r\n title=\"Next page\"\r\n >\r\n <span class=\"md-cards-grid-icon-next\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(totalPages - 1)\"\r\n title=\"Last page\"\r\n >\r\n <span class=\"md-cards-grid-icon-last\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n}\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-cards-grid{display:block;width:100%;font-family:Open Sans,Arial,sans-serif;font-size:13px;background:transparent;border:0;border-radius:0}.md-cards-grid *,.md-cards-grid *:before,.md-cards-grid *:after{box-sizing:border-box}.md-cards-grid-scroll-container{width:100%;overflow-x:auto;overflow-y:hidden}.md-cards-grid-scroll-container::-webkit-scrollbar{height:6px}.md-cards-grid-scroll-container::-webkit-scrollbar-track{background:#f3f3f3;border-radius:3px}.md-cards-grid-scroll-container::-webkit-scrollbar-thumb{background:#929292;border-radius:3px}.md-cards-grid-scroll-container::-webkit-scrollbar-thumb:hover{background:#4d4d4d}.md-cards-grid-shrink-mode .md-cards-grid-scroll-container{overflow-x:hidden}.md-cards-grid-shrink-mode .md-cards-grid-header-inner,.md-cards-grid-shrink-mode .md-cards-grid-card{min-width:0}.md-cards-grid-shrink-mode .md-cards-grid-header-cell,.md-cards-grid-shrink-mode .md-cards-grid-cell{flex-shrink:1}.md-cards-grid-header{display:block;background:transparent;margin:0;padding:0;border:0}.md-cards-grid-header-inner{display:flex;align-items:center;height:100%;min-width:fit-content}.md-cards-grid-header-cell{display:flex;align-items:center;flex-shrink:0;height:100%;padding:14px 16px;background:#fff;font-family:Montserrat,Arial,sans-serif;font-size:14px;font-weight:300;color:#4d4d4d;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}.md-cards-grid-header-cell:not(:first-child){border-left:2px solid #EAEAEA}.md-cards-grid-header-cell.sortable{cursor:pointer;transition:background-color .2s ease}.md-cards-grid-header-cell.sortable:hover{background:#f3f3f3}.md-cards-grid-header-cell.sortable:focus{outline:0;outline-offset:0}.md-cards-grid-header-cell.sort-active{color:#0185cf}.md-cards-grid-header-cell.resizeable{position:relative}.md-cards-grid-header-cell-label{flex:1;overflow:hidden;text-overflow:ellipsis}.md-cards-grid-sort-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:2px;color:#929292;transition:color .2s ease}.md-cards-grid-sort-icon:before{font-family:datatable;font-size:12px}.md-cards-grid-sort-icon.md-cards-grid-sort-asc,.md-cards-grid-sort-icon.md-cards-grid-sort-desc{color:#6d5cae}.md-cards-grid-sort-icon.md-cards-grid-sort-asc:after,.md-cards-grid-sort-icon.md-cards-grid-sort-desc:after{content:\"\";display:block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent}.md-cards-grid-sort-icon.md-cards-grid-sort-asc:after{border-bottom:5px solid currentColor}.md-cards-grid-sort-icon.md-cards-grid-sort-desc:after{border-top:5px solid currentColor}.md-cards-grid-resize-handle{position:absolute;top:0;right:-8px;bottom:0;width:10px;cursor:col-resize;z-index:1}.md-cards-grid-resize-handle:after{content:\"\";position:absolute;top:25%;right:2px;bottom:25%;width:3px;background:transparent;border-radius:1px;transition:background-color .2s ease}.md-cards-grid-resize-handle:hover:after{background:#6d5cae}.md-cards-grid-header-cell:last-of-type:not(.md-cards-grid-actions-cell) .md-cards-grid-resize-handle{right:0}.md-cards-grid-header-cell:has(+.md-cards-grid-actions-cell) .md-cards-grid-resize-handle{right:0}body.md-cards-grid-resizing{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}body.md-cards-grid-resizing *{cursor:col-resize!important}.md-cards-grid-body{display:flex;flex-direction:column;padding:12px 0 0;width:fit-content;min-width:fit-content;background:transparent}.md-cards-grid-group{margin-bottom:12px}.md-cards-grid-group:last-child{margin-bottom:0}.md-cards-grid-group-header{display:flex;align-items:center;padding:10px 14px;margin-bottom:12px;background:#eaeaea;border-radius:0;font-size:13px;font-weight:600;color:#000}.md-cards-grid-group-title{flex:1}.md-cards-grid-group-rows{display:flex;flex-direction:column;width:fit-content;gap:5px}.md-cards-grid-card{display:inline-flex;align-items:stretch;width:fit-content;min-width:fit-content;background:#fff;border:0;border-radius:0;box-shadow:none;transition:all .2s ease}.md-cards-grid-card:hover{background:#fbfbfb;box-shadow:0 2px 8px #0000001f;transform:translateY(-1px)}.md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a;border:0;box-shadow:none}.md-cards-grid-card.md-cards-grid-card-fixed-height,.md-cards-grid-card.md-cards-grid-card-fixed-height .md-cards-grid-cell{overflow:hidden}.md-cards-grid-card.md-cards-grid-card-fixed-height .md-cards-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-cards-grid-cell{display:flex;align-items:center;flex-shrink:0;padding:14px 16px;font-size:14px;color:#000;border:0;overflow:hidden;min-width:0}.md-cards-grid-cell:last-child{border-right:none}.md-cards-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1.4}.md-cards-grid-actions-cell{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:90px;width:auto!important;flex-grow:0!important;flex-shrink:0!important;padding:inherit;border:0}.md-cards-grid-header-cell.md-cards-grid-actions-cell{border-left:none;border-right:none}.md-cards-grid-action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:4px;background:transparent;color:#4d4d4d;cursor:pointer;transition:all .2s ease}.md-cards-grid-action-btn:hover{transform:scale(1.1)}.md-cards-grid-action-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-cards-grid-action-btn:active{transform:scale(.95)}.md-cards-grid-action-edit{color:#6d5cae}.md-cards-grid-action-edit:hover{background:#e9e7f3;color:#564790}.md-cards-grid-action-save{color:#28b446}.md-cards-grid-action-save:hover{background:#dff4e3;color:#1f8a36}.md-cards-grid-action-cancel{color:#cf0106}.md-cards-grid-action-cancel:hover{background:#f8d9da;color:#9c0105}.md-cards-grid-icon-edit,.md-cards-grid-icon-save,.md-cards-grid-icon-cancel{display:inline-block;width:18px;height:18px;position:relative}.md-cards-grid-icon-edit:before,.md-cards-grid-icon-edit:after{content:\"\";position:absolute}.md-cards-grid-icon-edit:before{width:10px;height:10px;border:2px solid currentColor;border-radius:1px;transform:rotate(45deg);top:1px;left:1px}.md-cards-grid-icon-edit:after{width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid currentColor;bottom:0;left:0;transform:rotate(-45deg)}.md-cards-grid-icon-save:before{content:\"\";position:absolute;width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);top:1px;left:5px}.md-cards-grid-icon-cancel:before,.md-cards-grid-icon-cancel:after{content:\"\";position:absolute;width:14px;height:2px;background:currentColor;top:50%;left:50%}.md-cards-grid-icon-cancel:before{transform:translate(-50%,-50%) rotate(45deg)}.md-cards-grid-icon-cancel:after{transform:translate(-50%,-50%) rotate(-45deg)}.md-cards-grid-footer{display:flex;align-items:center;justify-content:flex-end;padding:12px 0 0;background:transparent;border-top:0;font-size:12px;color:#4d4d4d}.md-cards-grid-pager{display:flex;align-items:center;gap:4px}.md-cards-grid-pager-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid #EAEAEA;border-radius:4px;background:#fff;color:#4d4d4d;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.md-cards-grid-pager-btn:hover:not(:disabled){background:#f3f3f3;border-color:#929292}.md-cards-grid-pager-btn:disabled{opacity:.4;cursor:not-allowed}.md-cards-grid-pager-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-cards-grid-pager-info{padding:0 12px;font-weight:500}.md-cards-grid-icon-first,.md-cards-grid-icon-prev,.md-cards-grid-icon-next,.md-cards-grid-icon-last{display:inline-block;width:12px;height:12px;position:relative}.md-cards-grid-icon-first:before,.md-cards-grid-icon-prev:before,.md-cards-grid-icon-next:before,.md-cards-grid-icon-last:before{content:\"\";position:absolute;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;top:50%;left:50%}.md-cards-grid-icon-prev:before{transform:translate(-25%,-50%) rotate(135deg)}.md-cards-grid-icon-next:before{transform:translate(-75%,-50%) rotate(-45deg)}.md-cards-grid-icon-first:before{transform:translate(-10%,-50%) rotate(135deg)}.md-cards-grid-icon-first:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;left:2px;transform:translateY(-50%)}.md-cards-grid-icon-last:before{transform:translate(-90%,-50%) rotate(-45deg)}.md-cards-grid-icon-last:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;right:2px;transform:translateY(-50%)}@media (max-width: 767px){.md-cards-grid{font-size:12px}.md-cards-grid-header{display:none}.md-cards-grid-body{padding:8px}.md-cards-grid-card{flex-direction:column}.md-cards-grid-cell{padding:10px 12px;border-right:none;border-bottom:1px solid #EAEAEA}.md-cards-grid-cell:last-child{border-bottom:none}.md-cards-grid-actions-cell{border-left:none;border-top:1px solid #EAEAEA;justify-content:center;background:#f3f3f3}.md-cards-grid-footer{flex-direction:column;gap:10px;padding:12px}}.md-cards-grid.grey .md-cards-grid-header-cell,.md-cards-grid.grey .md-cards-grid-card{background:#f3f3f3}.md-cards-grid.grey .md-cards-grid-card:hover{background:#efefef}.md-cards-grid.grey .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra .md-cards-grid-card:nth-child(odd){background:#fff}.md-cards-grid.zebra .md-cards-grid-card:nth-child(2n){background:#f3f3f3}.md-cards-grid.zebra .md-cards-grid-card:hover{background:#e4e4e4}.md-cards-grid.zebra .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:nth-child(odd){background:#fff}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:nth-child(2n){background:#f3f3f3}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:hover{background:#e4e4e4}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra.grey .md-cards-grid-card:nth-child(odd){background:#f3f3f3}.md-cards-grid.zebra.grey .md-cards-grid-card:nth-child(2n){background:#efefef}.md-cards-grid.zebra.grey .md-cards-grid-card:hover{background:#d6d6d6}.md-cards-grid.zebra.grey .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:nth-child(odd){background:#f3f3f3}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:nth-child(2n){background:#efefef}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:hover{background:#d6d6d6}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
15346
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15347
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDGridComponent, isStandalone: true, selector: "md-grid", inputs: { rows: "rows", columns: "columns", groupRowsBy: "groupRowsBy", groupHeaderTemplate: "groupHeaderTemplate", rowActionsTemplate: "rowActionsTemplate", headerHeight: ["headerHeight", "headerHeight", numberAttribute], cardHeight: "cardHeight", gap: ["gap", "gap", numberAttribute], defaultColumnWidth: ["defaultColumnWidth", "defaultColumnWidth", numberAttribute], showRowActions: ["showRowActions", "showRowActions", booleanAttribute], overflowMode: "overflowMode", enableColumnResize: ["enableColumnResize", "enableColumnResize", booleanAttribute], defaultMinColumnWidth: ["defaultMinColumnWidth", "defaultMinColumnWidth", numberAttribute], defaultMaxColumnWidth: ["defaultMaxColumnWidth", "defaultMaxColumnWidth", numberAttribute], sorts: "sorts", sortType: "sortType", externalSorting: ["externalSorting", "externalSorting", booleanAttribute], enableClearingSortState: ["enableClearingSortState", "enableClearingSortState", booleanAttribute], sortAscendingIcon: "sortAscendingIcon", sortDescendingIcon: "sortDescendingIcon", sortUnsetIcon: "sortUnsetIcon", limit: ["limit", "limit", numberAttribute], offset: ["offset", "offset", numberAttribute], count: ["count", "count", numberAttribute], externalPaging: ["externalPaging", "externalPaging", booleanAttribute], showFooter: ["showFooter", "showFooter", booleanAttribute], footerHeight: ["footerHeight", "footerHeight", numberAttribute], editingRow: "editingRow" }, outputs: { columnResize: "columnResize", sort: "sort", page: "page", editingRowChange: "editingRowChange", rowEditStart: "rowEditStart", rowEditSave: "rowEditSave", rowEditCancel: "rowEditCancel" }, host: { properties: { "class.md-grid-shrink-mode": "this.isShrinkMode" }, classAttribute: "md-grid" }, queries: [{ propertyName: "_columnDirectives", predicate: MDGridColumnDirective }], exportAs: ["mdGrid"], usesOnChanges: true, ngImport: i0, template: "<!-- Scrollable container for header and body -->\r\n<div class=\"md-grid-scroll-container\">\r\n<!-- Header -->\r\n@if (headerHeight > 0) {\r\n<div\r\n class=\"md-grid-header\"\r\n role=\"row\"\r\n [style.height.px]=\"headerHeight\"\r\n>\r\n <div class=\"md-grid-header-inner\">\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-grid-header-cell\"\r\n role=\"columnheader\"\r\n [class.sortable]=\"column.sortable\"\r\n [class.resizeable]=\"isColumnResizeable(column)\"\r\n [class.sort-active]=\"getSortDir(column)\"\r\n [class.sort-asc]=\"getSortDir(column) === 'asc'\"\r\n [class.sort-desc]=\"getSortDir(column) === 'desc'\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n [attr.title]=\"column.name\"\r\n (click)=\"onColumnSort(column)\"\r\n (keydown.enter)=\"onColumnSort(column)\"\r\n [attr.tabindex]=\"column.sortable ? 0 : -1\"\r\n >\r\n <!-- Custom header template -->\r\n @if (column.headerTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.headerTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n column: column,\r\n sortDir: getSortDir(column),\r\n sortFn: onColumnSort.bind(this, column)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default header -->\r\n <span class=\"md-grid-header-cell-label\">{{ column.name }}</span>\r\n @if (column.sortable) {\r\n <span class=\"md-grid-sort-icon\" [ngClass]=\"getSortClass(column)\"></span>\r\n }\r\n }\r\n\r\n <!-- Resize handle -->\r\n @if (isColumnResizeable(column)) {\r\n <span\r\n class=\"md-grid-resize-handle\"\r\n (mousedown)=\"onResizeStart($event, column)\"\r\n ></span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Actions header cell -->\r\n @if (showRowActions) {\r\n <div class=\"md-grid-header-cell md-grid-actions-cell\">\r\n <span class=\"md-grid-header-cell-label\"></span>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n}\r\n\r\n<!-- Body -->\r\n<div class=\"md-grid-body\" [style.gap.px]=\"gap\">\r\n <!-- Grouped rows -->\r\n @if (_groupedRows) {\r\n @for (group of _groupedRows; track trackByGroup($index, group)) {\r\n <div class=\"md-grid-group\">\r\n <!-- Group header -->\r\n <div class=\"md-grid-group-header\">\r\n @if (groupHeaderTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"groupHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"{ group: group }\"\r\n />\r\n } @else {\r\n <span class=\"md-grid-group-title\">{{ group.key }}</span>\r\n }\r\n </div>\r\n\r\n <!-- Group rows -->\r\n <div class=\"md-grid-group-rows\" [style.gap.px]=\"gap\">\r\n @for (row of group.value; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: group.key }\"\r\n />\r\n }\r\n </div>\r\n </div>\r\n }\r\n } @else {\r\n <!-- Non-grouped rows -->\r\n @for (row of _displayRows; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: null }\"\r\n />\r\n }\r\n }\r\n</div>\r\n</div><!-- End scroll container -->\r\n\r\n<!-- Row template -->\r\n<ng-template #rowTemplate let-row=\"row\" let-rowIndex=\"rowIndex\" let-group=\"group\">\r\n <div\r\n class=\"md-grid-card\"\r\n [class.md-grid-card-editing]=\"isEditing(row)\"\r\n [class.md-grid-card-fixed-height]=\"cardHeight !== 'auto'\"\r\n [style.height]=\"cardHeight === 'auto' ? null : cardHeight + 'px'\"\r\n role=\"row\"\r\n >\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-grid-cell\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n role=\"cell\"\r\n >\r\n <!-- Edit mode -->\r\n @if (isEditing(row) && column.editTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.editTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: getTemplateRow(row),\r\n originalRow: row,\r\n value: getCellValue(getTemplateRow(row), column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n }\r\n <!-- View mode with custom template -->\r\n @else if (column.cellTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.cellTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n value: getCellValue(row, column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n group: group\r\n }\"\r\n />\r\n }\r\n <!-- Default view mode -->\r\n @else {\r\n <span class=\"md-grid-cell-value\">{{ getCellValue(row, column) }}</span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Row actions -->\r\n @if (showRowActions) {\r\n <div class=\"md-grid-cell md-grid-actions-cell\">\r\n @if (rowActionsTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"rowActionsTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n editFn: editRow.bind(this, row),\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default actions -->\r\n @if (isEditing(row)) {\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-save\"\r\n (click)=\"saveRow()\"\r\n title=\"Save\"\r\n >\r\n <span class=\"md-grid-icon-save\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-cancel\"\r\n (click)=\"cancelEdit()\"\r\n title=\"Cancel\"\r\n >\r\n <span class=\"md-grid-icon-cancel\"></span>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-edit\"\r\n (click)=\"editRow(row)\"\r\n title=\"Edit\"\r\n >\r\n <span class=\"md-grid-icon-edit\"></span>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<!-- Footer / Pagination -->\r\n@if (showFooter && totalPages > 1) {\r\n<div\r\n class=\"md-grid-footer\"\r\n [style.height.px]=\"footerHeight\"\r\n>\r\n <div class=\"md-grid-pager\">\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(0)\"\r\n title=\"First page\"\r\n >\r\n <span class=\"md-grid-icon-first\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(offset - 1)\"\r\n title=\"Previous page\"\r\n >\r\n <span class=\"md-grid-icon-prev\"></span>\r\n </button>\r\n\r\n <span class=\"md-grid-pager-info\">\r\n {{ currentPage }} / {{ totalPages }}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(offset + 1)\"\r\n title=\"Next page\"\r\n >\r\n <span class=\"md-grid-icon-next\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(totalPages - 1)\"\r\n title=\"Last page\"\r\n >\r\n <span class=\"md-grid-icon-last\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n}\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-grid{display:block;width:100%;font-family:Open Sans,Arial,sans-serif;font-size:13px;background:transparent;border:0;border-radius:0}.md-grid *,.md-grid *:before,.md-grid *:after{box-sizing:border-box}.md-grid-scroll-container{width:100%;overflow-x:auto;overflow-y:hidden}.md-grid-scroll-container::-webkit-scrollbar{height:6px}.md-grid-scroll-container::-webkit-scrollbar-track{background:#f3f3f3;border-radius:3px}.md-grid-scroll-container::-webkit-scrollbar-thumb{background:#929292;border-radius:3px}.md-grid-scroll-container::-webkit-scrollbar-thumb:hover{background:#4d4d4d}.md-grid-shrink-mode .md-grid-scroll-container{overflow-x:hidden}.md-grid-shrink-mode .md-grid-header-inner,.md-grid-shrink-mode .md-grid-card{min-width:0}.md-grid-shrink-mode .md-grid-header-cell,.md-grid-shrink-mode .md-grid-cell{flex-shrink:1}.md-grid-header{display:block;background:transparent;margin:0;padding:0;border:0}.md-grid-header-inner{display:flex;align-items:center;height:100%;min-width:fit-content}.md-grid-header-cell{display:flex;align-items:center;flex-shrink:0;height:100%;padding:14px 16px;background:#fff;font-family:Montserrat,Arial,sans-serif;font-size:14px;font-weight:300;color:#4d4d4d;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}.md-grid-header-cell:not(:first-child){border-left:2px solid #EAEAEA}.md-grid-header-cell.sortable{cursor:pointer;transition:background-color .2s ease}.md-grid-header-cell.sortable:hover{background:#f3f3f3}.md-grid-header-cell.sortable:focus{outline:0;outline-offset:0}.md-grid-header-cell.sort-active{color:#0185cf}.md-grid-header-cell.resizeable{position:relative}.md-grid-header-cell-label{flex:1;overflow:hidden;text-overflow:ellipsis}.md-grid-sort-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:2px;color:#929292;transition:color .2s ease}.md-grid-sort-icon:before{font-family:datatable;font-size:12px}.md-grid-sort-icon.md-grid-sort-asc,.md-grid-sort-icon.md-grid-sort-desc{color:#6d5cae}.md-grid-sort-icon.md-grid-sort-asc:after,.md-grid-sort-icon.md-grid-sort-desc:after{content:\"\";display:block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent}.md-grid-sort-icon.md-grid-sort-asc:after{border-bottom:5px solid currentColor}.md-grid-sort-icon.md-grid-sort-desc:after{border-top:5px solid currentColor}.md-grid-resize-handle{position:absolute;top:0;right:-8px;bottom:0;width:10px;cursor:col-resize;z-index:1}.md-grid-resize-handle:after{content:\"\";position:absolute;top:25%;right:2px;bottom:25%;width:3px;background:transparent;border-radius:1px;transition:background-color .2s ease}.md-grid-resize-handle:hover:after{background:#6d5cae}.md-grid-header-cell:last-of-type:not(.md-grid-actions-cell) .md-grid-resize-handle{right:0}.md-grid-header-cell:has(+.md-grid-actions-cell) .md-grid-resize-handle{right:0}body.md-grid-resizing{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}body.md-grid-resizing *{cursor:col-resize!important}.md-grid-body{display:flex;flex-direction:column;padding:12px 0 0;width:fit-content;min-width:fit-content;background:transparent}.md-grid-group{margin-bottom:12px}.md-grid-group:last-child{margin-bottom:0}.md-grid-group-header{display:flex;align-items:center;padding:10px 14px;margin-bottom:12px;background:#eaeaea;border-radius:0;font-size:13px;font-weight:600;color:#000}.md-grid-group-title{flex:1}.md-grid-group-rows{display:flex;flex-direction:column;width:fit-content;gap:5px}.md-grid-card{display:inline-flex;align-items:stretch;width:fit-content;min-width:fit-content;background:#fff;border:0;border-radius:0;box-shadow:none;transition:all .2s ease}.md-grid-card:hover{background:#fbfbfb;box-shadow:0 2px 8px #0000001f;transform:translateY(-1px)}.md-grid-card.md-grid-card-editing{background:#cf01061a;border:0;box-shadow:none}.md-grid-card.md-grid-card-fixed-height,.md-grid-card.md-grid-card-fixed-height .md-grid-cell{overflow:hidden}.md-grid-card.md-grid-card-fixed-height .md-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-grid-cell{display:flex;align-items:center;flex-shrink:0;padding:14px 16px;font-size:14px;color:#000;border:0;overflow:hidden;min-width:0}.md-grid-cell:last-child{border-right:none}.md-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1.4}.md-grid-actions-cell{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:90px;width:auto!important;flex-grow:0!important;flex-shrink:0!important;padding:inherit;border:0}.md-grid-header-cell.md-grid-actions-cell{border-left:none;border-right:none}.md-grid-action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:4px;background:transparent;color:#4d4d4d;cursor:pointer;transition:all .2s ease}.md-grid-action-btn:hover{transform:scale(1.1)}.md-grid-action-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-grid-action-btn:active{transform:scale(.95)}.md-grid-action-edit{color:#6d5cae}.md-grid-action-edit:hover{background:#e9e7f3;color:#564790}.md-grid-action-save{color:#28b446}.md-grid-action-save:hover{background:#dff4e3;color:#1f8a36}.md-grid-action-cancel{color:#cf0106}.md-grid-action-cancel:hover{background:#f8d9da;color:#9c0105}.md-grid-icon-edit,.md-grid-icon-save,.md-grid-icon-cancel{display:inline-block;width:18px;height:18px;position:relative}.md-grid-icon-edit:before,.md-grid-icon-edit:after{content:\"\";position:absolute}.md-grid-icon-edit:before{width:10px;height:10px;border:2px solid currentColor;border-radius:1px;transform:rotate(45deg);top:1px;left:1px}.md-grid-icon-edit:after{width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid currentColor;bottom:0;left:0;transform:rotate(-45deg)}.md-grid-icon-save:before{content:\"\";position:absolute;width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);top:1px;left:5px}.md-grid-icon-cancel:before,.md-grid-icon-cancel:after{content:\"\";position:absolute;width:14px;height:2px;background:currentColor;top:50%;left:50%}.md-grid-icon-cancel:before{transform:translate(-50%,-50%) rotate(45deg)}.md-grid-icon-cancel:after{transform:translate(-50%,-50%) rotate(-45deg)}.md-grid-footer{display:flex;align-items:center;justify-content:flex-end;padding:12px 0 0;background:transparent;border-top:0;font-size:12px;color:#4d4d4d}.md-grid-pager{display:flex;align-items:center;gap:4px}.md-grid-pager-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid #EAEAEA;border-radius:4px;background:#fff;color:#4d4d4d;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.md-grid-pager-btn:hover:not(:disabled){background:#f3f3f3;border-color:#929292}.md-grid-pager-btn:disabled{opacity:.4;cursor:not-allowed}.md-grid-pager-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-grid-pager-info{padding:0 12px;font-weight:500}.md-grid-icon-first,.md-grid-icon-prev,.md-grid-icon-next,.md-grid-icon-last{display:inline-block;width:12px;height:12px;position:relative}.md-grid-icon-first:before,.md-grid-icon-prev:before,.md-grid-icon-next:before,.md-grid-icon-last:before{content:\"\";position:absolute;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;top:50%;left:50%}.md-grid-icon-prev:before{transform:translate(-25%,-50%) rotate(135deg)}.md-grid-icon-next:before{transform:translate(-75%,-50%) rotate(-45deg)}.md-grid-icon-first:before{transform:translate(-10%,-50%) rotate(135deg)}.md-grid-icon-first:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;left:2px;transform:translateY(-50%)}.md-grid-icon-last:before{transform:translate(-90%,-50%) rotate(-45deg)}.md-grid-icon-last:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;right:2px;transform:translateY(-50%)}@media (max-width: 767px){.md-grid{font-size:12px}.md-grid-header{display:none}.md-grid-body{padding:8px}.md-grid-card{flex-direction:column}.md-grid-cell{padding:10px 12px;border-right:none;border-bottom:1px solid #EAEAEA}.md-grid-cell:last-child{border-bottom:none}.md-grid-actions-cell{border-left:none;border-top:1px solid #EAEAEA;justify-content:center;background:#f3f3f3}.md-grid-footer{flex-direction:column;gap:10px;padding:12px}}.md-grid.grey .md-grid-header-cell,.md-grid.grey .md-grid-card{background:#f3f3f3}.md-grid.grey .md-grid-card:hover{background:#efefef}.md-grid.grey .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra .md-grid-card:nth-child(odd){background:#fff}.md-grid.zebra .md-grid-card:nth-child(2n){background:#f3f3f3}.md-grid.zebra .md-grid-card:hover{background:#e4e4e4}.md-grid.zebra .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra .md-grid-group-rows .md-grid-card:nth-child(odd){background:#fff}.md-grid.zebra .md-grid-group-rows .md-grid-card:nth-child(2n){background:#f3f3f3}.md-grid.zebra .md-grid-group-rows .md-grid-card:hover{background:#e4e4e4}.md-grid.zebra .md-grid-group-rows .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra.grey .md-grid-card:nth-child(odd){background:#f3f3f3}.md-grid.zebra.grey .md-grid-card:nth-child(2n){background:#efefef}.md-grid.zebra.grey .md-grid-card:hover{background:#d6d6d6}.md-grid.zebra.grey .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:nth-child(odd){background:#f3f3f3}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:nth-child(2n){background:#efefef}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:hover{background:#d6d6d6}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card.md-grid-card-editing{background:#cf01061a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
15348
15348
|
}
|
|
15349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridComponent, decorators: [{
|
|
15350
15350
|
type: Component,
|
|
15351
|
-
args: [{ selector: 'md-
|
|
15352
|
-
class: 'md-
|
|
15353
|
-
}, exportAs: 'mdCardsGrid', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<!-- Scrollable container for header and body -->\r\n<div class=\"md-cards-grid-scroll-container\">\r\n<!-- Header -->\r\n@if (headerHeight > 0) {\r\n<div\r\n class=\"md-cards-grid-header\"\r\n role=\"row\"\r\n [style.height.px]=\"headerHeight\"\r\n>\r\n <div class=\"md-cards-grid-header-inner\">\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-cards-grid-header-cell\"\r\n role=\"columnheader\"\r\n [class.sortable]=\"column.sortable\"\r\n [class.resizeable]=\"isColumnResizeable(column)\"\r\n [class.sort-active]=\"getSortDir(column)\"\r\n [class.sort-asc]=\"getSortDir(column) === 'asc'\"\r\n [class.sort-desc]=\"getSortDir(column) === 'desc'\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n [attr.title]=\"column.name\"\r\n (click)=\"onColumnSort(column)\"\r\n (keydown.enter)=\"onColumnSort(column)\"\r\n [attr.tabindex]=\"column.sortable ? 0 : -1\"\r\n >\r\n <!-- Custom header template -->\r\n @if (column.headerTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.headerTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n column: column,\r\n sortDir: getSortDir(column),\r\n sortFn: onColumnSort.bind(this, column)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default header -->\r\n <span class=\"md-cards-grid-header-cell-label\">{{ column.name }}</span>\r\n @if (column.sortable) {\r\n <span class=\"md-cards-grid-sort-icon\" [ngClass]=\"getSortClass(column)\"></span>\r\n }\r\n }\r\n\r\n <!-- Resize handle -->\r\n @if (isColumnResizeable(column)) {\r\n <span\r\n class=\"md-cards-grid-resize-handle\"\r\n (mousedown)=\"onResizeStart($event, column)\"\r\n ></span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Actions header cell -->\r\n @if (showRowActions) {\r\n <div class=\"md-cards-grid-header-cell md-cards-grid-actions-cell\">\r\n <span class=\"md-cards-grid-header-cell-label\"></span>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n}\r\n\r\n<!-- Body -->\r\n<div class=\"md-cards-grid-body\" [style.gap.px]=\"gap\">\r\n <!-- Grouped rows -->\r\n @if (_groupedRows) {\r\n @for (group of _groupedRows; track trackByGroup($index, group)) {\r\n <div class=\"md-cards-grid-group\">\r\n <!-- Group header -->\r\n <div class=\"md-cards-grid-group-header\">\r\n @if (groupHeaderTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"groupHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"{ group: group }\"\r\n />\r\n } @else {\r\n <span class=\"md-cards-grid-group-title\">{{ group.key }}</span>\r\n }\r\n </div>\r\n\r\n <!-- Group rows -->\r\n <div class=\"md-cards-grid-group-rows\" [style.gap.px]=\"gap\">\r\n @for (row of group.value; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: group.key }\"\r\n />\r\n }\r\n </div>\r\n </div>\r\n }\r\n } @else {\r\n <!-- Non-grouped rows -->\r\n @for (row of _displayRows; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: null }\"\r\n />\r\n }\r\n }\r\n</div>\r\n</div><!-- End scroll container -->\r\n\r\n<!-- Row template -->\r\n<ng-template #rowTemplate let-row=\"row\" let-rowIndex=\"rowIndex\" let-group=\"group\">\r\n <div\r\n class=\"md-cards-grid-card\"\r\n [class.md-cards-grid-card-editing]=\"isEditing(row)\"\r\n [class.md-cards-grid-card-fixed-height]=\"cardHeight !== 'auto'\"\r\n [style.height]=\"cardHeight === 'auto' ? null : cardHeight + 'px'\"\r\n role=\"row\"\r\n >\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-cards-grid-cell\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n role=\"cell\"\r\n >\r\n <!-- Edit mode -->\r\n @if (isEditing(row) && column.editTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.editTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: getTemplateRow(row),\r\n originalRow: row,\r\n value: getCellValue(getTemplateRow(row), column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n }\r\n <!-- View mode with custom template -->\r\n @else if (column.cellTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.cellTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n value: getCellValue(row, column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n group: group\r\n }\"\r\n />\r\n }\r\n <!-- Default view mode -->\r\n @else {\r\n <span class=\"md-cards-grid-cell-value\">{{ getCellValue(row, column) }}</span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Row actions -->\r\n @if (showRowActions) {\r\n <div class=\"md-cards-grid-cell md-cards-grid-actions-cell\">\r\n @if (rowActionsTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"rowActionsTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n editFn: editRow.bind(this, row),\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default actions -->\r\n @if (isEditing(row)) {\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-save\"\r\n (click)=\"saveRow()\"\r\n title=\"Save\"\r\n >\r\n <span class=\"md-cards-grid-icon-save\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-cancel\"\r\n (click)=\"cancelEdit()\"\r\n title=\"Cancel\"\r\n >\r\n <span class=\"md-cards-grid-icon-cancel\"></span>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-action-btn md-cards-grid-action-edit\"\r\n (click)=\"editRow(row)\"\r\n title=\"Edit\"\r\n >\r\n <span class=\"md-cards-grid-icon-edit\"></span>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<!-- Footer / Pagination -->\r\n@if (showFooter && totalPages > 1) {\r\n<div\r\n class=\"md-cards-grid-footer\"\r\n [style.height.px]=\"footerHeight\"\r\n>\r\n <div class=\"md-cards-grid-pager\">\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(0)\"\r\n title=\"First page\"\r\n >\r\n <span class=\"md-cards-grid-icon-first\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(offset - 1)\"\r\n title=\"Previous page\"\r\n >\r\n <span class=\"md-cards-grid-icon-prev\"></span>\r\n </button>\r\n\r\n <span class=\"md-cards-grid-pager-info\">\r\n {{ currentPage }} / {{ totalPages }}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(offset + 1)\"\r\n title=\"Next page\"\r\n >\r\n <span class=\"md-cards-grid-icon-next\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-cards-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(totalPages - 1)\"\r\n title=\"Last page\"\r\n >\r\n <span class=\"md-cards-grid-icon-last\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n}\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-cards-grid{display:block;width:100%;font-family:Open Sans,Arial,sans-serif;font-size:13px;background:transparent;border:0;border-radius:0}.md-cards-grid *,.md-cards-grid *:before,.md-cards-grid *:after{box-sizing:border-box}.md-cards-grid-scroll-container{width:100%;overflow-x:auto;overflow-y:hidden}.md-cards-grid-scroll-container::-webkit-scrollbar{height:6px}.md-cards-grid-scroll-container::-webkit-scrollbar-track{background:#f3f3f3;border-radius:3px}.md-cards-grid-scroll-container::-webkit-scrollbar-thumb{background:#929292;border-radius:3px}.md-cards-grid-scroll-container::-webkit-scrollbar-thumb:hover{background:#4d4d4d}.md-cards-grid-shrink-mode .md-cards-grid-scroll-container{overflow-x:hidden}.md-cards-grid-shrink-mode .md-cards-grid-header-inner,.md-cards-grid-shrink-mode .md-cards-grid-card{min-width:0}.md-cards-grid-shrink-mode .md-cards-grid-header-cell,.md-cards-grid-shrink-mode .md-cards-grid-cell{flex-shrink:1}.md-cards-grid-header{display:block;background:transparent;margin:0;padding:0;border:0}.md-cards-grid-header-inner{display:flex;align-items:center;height:100%;min-width:fit-content}.md-cards-grid-header-cell{display:flex;align-items:center;flex-shrink:0;height:100%;padding:14px 16px;background:#fff;font-family:Montserrat,Arial,sans-serif;font-size:14px;font-weight:300;color:#4d4d4d;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}.md-cards-grid-header-cell:not(:first-child){border-left:2px solid #EAEAEA}.md-cards-grid-header-cell.sortable{cursor:pointer;transition:background-color .2s ease}.md-cards-grid-header-cell.sortable:hover{background:#f3f3f3}.md-cards-grid-header-cell.sortable:focus{outline:0;outline-offset:0}.md-cards-grid-header-cell.sort-active{color:#0185cf}.md-cards-grid-header-cell.resizeable{position:relative}.md-cards-grid-header-cell-label{flex:1;overflow:hidden;text-overflow:ellipsis}.md-cards-grid-sort-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:2px;color:#929292;transition:color .2s ease}.md-cards-grid-sort-icon:before{font-family:datatable;font-size:12px}.md-cards-grid-sort-icon.md-cards-grid-sort-asc,.md-cards-grid-sort-icon.md-cards-grid-sort-desc{color:#6d5cae}.md-cards-grid-sort-icon.md-cards-grid-sort-asc:after,.md-cards-grid-sort-icon.md-cards-grid-sort-desc:after{content:\"\";display:block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent}.md-cards-grid-sort-icon.md-cards-grid-sort-asc:after{border-bottom:5px solid currentColor}.md-cards-grid-sort-icon.md-cards-grid-sort-desc:after{border-top:5px solid currentColor}.md-cards-grid-resize-handle{position:absolute;top:0;right:-8px;bottom:0;width:10px;cursor:col-resize;z-index:1}.md-cards-grid-resize-handle:after{content:\"\";position:absolute;top:25%;right:2px;bottom:25%;width:3px;background:transparent;border-radius:1px;transition:background-color .2s ease}.md-cards-grid-resize-handle:hover:after{background:#6d5cae}.md-cards-grid-header-cell:last-of-type:not(.md-cards-grid-actions-cell) .md-cards-grid-resize-handle{right:0}.md-cards-grid-header-cell:has(+.md-cards-grid-actions-cell) .md-cards-grid-resize-handle{right:0}body.md-cards-grid-resizing{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}body.md-cards-grid-resizing *{cursor:col-resize!important}.md-cards-grid-body{display:flex;flex-direction:column;padding:12px 0 0;width:fit-content;min-width:fit-content;background:transparent}.md-cards-grid-group{margin-bottom:12px}.md-cards-grid-group:last-child{margin-bottom:0}.md-cards-grid-group-header{display:flex;align-items:center;padding:10px 14px;margin-bottom:12px;background:#eaeaea;border-radius:0;font-size:13px;font-weight:600;color:#000}.md-cards-grid-group-title{flex:1}.md-cards-grid-group-rows{display:flex;flex-direction:column;width:fit-content;gap:5px}.md-cards-grid-card{display:inline-flex;align-items:stretch;width:fit-content;min-width:fit-content;background:#fff;border:0;border-radius:0;box-shadow:none;transition:all .2s ease}.md-cards-grid-card:hover{background:#fbfbfb;box-shadow:0 2px 8px #0000001f;transform:translateY(-1px)}.md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a;border:0;box-shadow:none}.md-cards-grid-card.md-cards-grid-card-fixed-height,.md-cards-grid-card.md-cards-grid-card-fixed-height .md-cards-grid-cell{overflow:hidden}.md-cards-grid-card.md-cards-grid-card-fixed-height .md-cards-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-cards-grid-cell{display:flex;align-items:center;flex-shrink:0;padding:14px 16px;font-size:14px;color:#000;border:0;overflow:hidden;min-width:0}.md-cards-grid-cell:last-child{border-right:none}.md-cards-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1.4}.md-cards-grid-actions-cell{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:90px;width:auto!important;flex-grow:0!important;flex-shrink:0!important;padding:inherit;border:0}.md-cards-grid-header-cell.md-cards-grid-actions-cell{border-left:none;border-right:none}.md-cards-grid-action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:4px;background:transparent;color:#4d4d4d;cursor:pointer;transition:all .2s ease}.md-cards-grid-action-btn:hover{transform:scale(1.1)}.md-cards-grid-action-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-cards-grid-action-btn:active{transform:scale(.95)}.md-cards-grid-action-edit{color:#6d5cae}.md-cards-grid-action-edit:hover{background:#e9e7f3;color:#564790}.md-cards-grid-action-save{color:#28b446}.md-cards-grid-action-save:hover{background:#dff4e3;color:#1f8a36}.md-cards-grid-action-cancel{color:#cf0106}.md-cards-grid-action-cancel:hover{background:#f8d9da;color:#9c0105}.md-cards-grid-icon-edit,.md-cards-grid-icon-save,.md-cards-grid-icon-cancel{display:inline-block;width:18px;height:18px;position:relative}.md-cards-grid-icon-edit:before,.md-cards-grid-icon-edit:after{content:\"\";position:absolute}.md-cards-grid-icon-edit:before{width:10px;height:10px;border:2px solid currentColor;border-radius:1px;transform:rotate(45deg);top:1px;left:1px}.md-cards-grid-icon-edit:after{width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid currentColor;bottom:0;left:0;transform:rotate(-45deg)}.md-cards-grid-icon-save:before{content:\"\";position:absolute;width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);top:1px;left:5px}.md-cards-grid-icon-cancel:before,.md-cards-grid-icon-cancel:after{content:\"\";position:absolute;width:14px;height:2px;background:currentColor;top:50%;left:50%}.md-cards-grid-icon-cancel:before{transform:translate(-50%,-50%) rotate(45deg)}.md-cards-grid-icon-cancel:after{transform:translate(-50%,-50%) rotate(-45deg)}.md-cards-grid-footer{display:flex;align-items:center;justify-content:flex-end;padding:12px 0 0;background:transparent;border-top:0;font-size:12px;color:#4d4d4d}.md-cards-grid-pager{display:flex;align-items:center;gap:4px}.md-cards-grid-pager-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid #EAEAEA;border-radius:4px;background:#fff;color:#4d4d4d;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.md-cards-grid-pager-btn:hover:not(:disabled){background:#f3f3f3;border-color:#929292}.md-cards-grid-pager-btn:disabled{opacity:.4;cursor:not-allowed}.md-cards-grid-pager-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-cards-grid-pager-info{padding:0 12px;font-weight:500}.md-cards-grid-icon-first,.md-cards-grid-icon-prev,.md-cards-grid-icon-next,.md-cards-grid-icon-last{display:inline-block;width:12px;height:12px;position:relative}.md-cards-grid-icon-first:before,.md-cards-grid-icon-prev:before,.md-cards-grid-icon-next:before,.md-cards-grid-icon-last:before{content:\"\";position:absolute;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;top:50%;left:50%}.md-cards-grid-icon-prev:before{transform:translate(-25%,-50%) rotate(135deg)}.md-cards-grid-icon-next:before{transform:translate(-75%,-50%) rotate(-45deg)}.md-cards-grid-icon-first:before{transform:translate(-10%,-50%) rotate(135deg)}.md-cards-grid-icon-first:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;left:2px;transform:translateY(-50%)}.md-cards-grid-icon-last:before{transform:translate(-90%,-50%) rotate(-45deg)}.md-cards-grid-icon-last:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;right:2px;transform:translateY(-50%)}@media (max-width: 767px){.md-cards-grid{font-size:12px}.md-cards-grid-header{display:none}.md-cards-grid-body{padding:8px}.md-cards-grid-card{flex-direction:column}.md-cards-grid-cell{padding:10px 12px;border-right:none;border-bottom:1px solid #EAEAEA}.md-cards-grid-cell:last-child{border-bottom:none}.md-cards-grid-actions-cell{border-left:none;border-top:1px solid #EAEAEA;justify-content:center;background:#f3f3f3}.md-cards-grid-footer{flex-direction:column;gap:10px;padding:12px}}.md-cards-grid.grey .md-cards-grid-header-cell,.md-cards-grid.grey .md-cards-grid-card{background:#f3f3f3}.md-cards-grid.grey .md-cards-grid-card:hover{background:#efefef}.md-cards-grid.grey .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra .md-cards-grid-card:nth-child(odd){background:#fff}.md-cards-grid.zebra .md-cards-grid-card:nth-child(2n){background:#f3f3f3}.md-cards-grid.zebra .md-cards-grid-card:hover{background:#e4e4e4}.md-cards-grid.zebra .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:nth-child(odd){background:#fff}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:nth-child(2n){background:#f3f3f3}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card:hover{background:#e4e4e4}.md-cards-grid.zebra .md-cards-grid-group-rows .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra.grey .md-cards-grid-card:nth-child(odd){background:#f3f3f3}.md-cards-grid.zebra.grey .md-cards-grid-card:nth-child(2n){background:#efefef}.md-cards-grid.zebra.grey .md-cards-grid-card:hover{background:#d6d6d6}.md-cards-grid.zebra.grey .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:nth-child(odd){background:#f3f3f3}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:nth-child(2n){background:#efefef}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card:hover{background:#d6d6d6}.md-cards-grid.zebra.grey .md-cards-grid-group-rows .md-cards-grid-card.md-cards-grid-card-editing{background:#cf01061a}\n"] }]
|
|
15351
|
+
args: [{ selector: 'md-grid', host: {
|
|
15352
|
+
class: 'md-grid',
|
|
15353
|
+
}, exportAs: 'mdGrid', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<!-- Scrollable container for header and body -->\r\n<div class=\"md-grid-scroll-container\">\r\n<!-- Header -->\r\n@if (headerHeight > 0) {\r\n<div\r\n class=\"md-grid-header\"\r\n role=\"row\"\r\n [style.height.px]=\"headerHeight\"\r\n>\r\n <div class=\"md-grid-header-inner\">\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-grid-header-cell\"\r\n role=\"columnheader\"\r\n [class.sortable]=\"column.sortable\"\r\n [class.resizeable]=\"isColumnResizeable(column)\"\r\n [class.sort-active]=\"getSortDir(column)\"\r\n [class.sort-asc]=\"getSortDir(column) === 'asc'\"\r\n [class.sort-desc]=\"getSortDir(column) === 'desc'\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n [attr.title]=\"column.name\"\r\n (click)=\"onColumnSort(column)\"\r\n (keydown.enter)=\"onColumnSort(column)\"\r\n [attr.tabindex]=\"column.sortable ? 0 : -1\"\r\n >\r\n <!-- Custom header template -->\r\n @if (column.headerTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.headerTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n column: column,\r\n sortDir: getSortDir(column),\r\n sortFn: onColumnSort.bind(this, column)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default header -->\r\n <span class=\"md-grid-header-cell-label\">{{ column.name }}</span>\r\n @if (column.sortable) {\r\n <span class=\"md-grid-sort-icon\" [ngClass]=\"getSortClass(column)\"></span>\r\n }\r\n }\r\n\r\n <!-- Resize handle -->\r\n @if (isColumnResizeable(column)) {\r\n <span\r\n class=\"md-grid-resize-handle\"\r\n (mousedown)=\"onResizeStart($event, column)\"\r\n ></span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Actions header cell -->\r\n @if (showRowActions) {\r\n <div class=\"md-grid-header-cell md-grid-actions-cell\">\r\n <span class=\"md-grid-header-cell-label\"></span>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n}\r\n\r\n<!-- Body -->\r\n<div class=\"md-grid-body\" [style.gap.px]=\"gap\">\r\n <!-- Grouped rows -->\r\n @if (_groupedRows) {\r\n @for (group of _groupedRows; track trackByGroup($index, group)) {\r\n <div class=\"md-grid-group\">\r\n <!-- Group header -->\r\n <div class=\"md-grid-group-header\">\r\n @if (groupHeaderTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"groupHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"{ group: group }\"\r\n />\r\n } @else {\r\n <span class=\"md-grid-group-title\">{{ group.key }}</span>\r\n }\r\n </div>\r\n\r\n <!-- Group rows -->\r\n <div class=\"md-grid-group-rows\" [style.gap.px]=\"gap\">\r\n @for (row of group.value; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: group.key }\"\r\n />\r\n }\r\n </div>\r\n </div>\r\n }\r\n } @else {\r\n <!-- Non-grouped rows -->\r\n @for (row of _displayRows; track trackByRow($index, row); let rowIndex = $index) {\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { row: row, rowIndex: rowIndex, group: null }\"\r\n />\r\n }\r\n }\r\n</div>\r\n</div><!-- End scroll container -->\r\n\r\n<!-- Row template -->\r\n<ng-template #rowTemplate let-row=\"row\" let-rowIndex=\"rowIndex\" let-group=\"group\">\r\n <div\r\n class=\"md-grid-card\"\r\n [class.md-grid-card-editing]=\"isEditing(row)\"\r\n [class.md-grid-card-fixed-height]=\"cardHeight !== 'auto'\"\r\n [style.height]=\"cardHeight === 'auto' ? null : cardHeight + 'px'\"\r\n role=\"row\"\r\n >\r\n @for (column of _internalColumns; track trackByColumn($index, column)) {\r\n <div\r\n class=\"md-grid-cell\"\r\n [style.width.px]=\"column.width\"\r\n [style.min-width.px]=\"column.minWidth\"\r\n [style.max-width.px]=\"column.maxWidth\"\r\n [style.flex-grow]=\"column.flexGrow\"\r\n role=\"cell\"\r\n >\r\n <!-- Edit mode -->\r\n @if (isEditing(row) && column.editTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.editTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: getTemplateRow(row),\r\n originalRow: row,\r\n value: getCellValue(getTemplateRow(row), column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n }\r\n <!-- View mode with custom template -->\r\n @else if (column.cellTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"column.cellTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n value: getCellValue(row, column),\r\n column: column,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n group: group\r\n }\"\r\n />\r\n }\r\n <!-- Default view mode -->\r\n @else {\r\n <span class=\"md-grid-cell-value\">{{ getCellValue(row, column) }}</span>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- Row actions -->\r\n @if (showRowActions) {\r\n <div class=\"md-grid-cell md-grid-actions-cell\">\r\n @if (rowActionsTemplate) {\r\n <ng-template\r\n [ngTemplateOutlet]=\"rowActionsTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n row: row,\r\n rowIndex: rowIndex,\r\n isEditing: isEditing(row),\r\n editFn: editRow.bind(this, row),\r\n saveFn: saveRow.bind(this),\r\n cancelFn: cancelEdit.bind(this)\r\n }\"\r\n />\r\n } @else {\r\n <!-- Default actions -->\r\n @if (isEditing(row)) {\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-save\"\r\n (click)=\"saveRow()\"\r\n title=\"Save\"\r\n >\r\n <span class=\"md-grid-icon-save\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-cancel\"\r\n (click)=\"cancelEdit()\"\r\n title=\"Cancel\"\r\n >\r\n <span class=\"md-grid-icon-cancel\"></span>\r\n </button>\r\n } @else {\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-action-btn md-grid-action-edit\"\r\n (click)=\"editRow(row)\"\r\n title=\"Edit\"\r\n >\r\n <span class=\"md-grid-icon-edit\"></span>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n\r\n<!-- Footer / Pagination -->\r\n@if (showFooter && totalPages > 1) {\r\n<div\r\n class=\"md-grid-footer\"\r\n [style.height.px]=\"footerHeight\"\r\n>\r\n <div class=\"md-grid-pager\">\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(0)\"\r\n title=\"First page\"\r\n >\r\n <span class=\"md-grid-icon-first\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset === 0\"\r\n (click)=\"setPage(offset - 1)\"\r\n title=\"Previous page\"\r\n >\r\n <span class=\"md-grid-icon-prev\"></span>\r\n </button>\r\n\r\n <span class=\"md-grid-pager-info\">\r\n {{ currentPage }} / {{ totalPages }}\r\n </span>\r\n\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(offset + 1)\"\r\n title=\"Next page\"\r\n >\r\n <span class=\"md-grid-icon-next\"></span>\r\n </button>\r\n <button\r\n type=\"button\"\r\n class=\"md-grid-pager-btn\"\r\n [disabled]=\"offset >= totalPages - 1\"\r\n (click)=\"setPage(totalPages - 1)\"\r\n title=\"Last page\"\r\n >\r\n <span class=\"md-grid-icon-last\"></span>\r\n </button>\r\n </div>\r\n</div>\r\n}\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-grid{display:block;width:100%;font-family:Open Sans,Arial,sans-serif;font-size:13px;background:transparent;border:0;border-radius:0}.md-grid *,.md-grid *:before,.md-grid *:after{box-sizing:border-box}.md-grid-scroll-container{width:100%;overflow-x:auto;overflow-y:hidden}.md-grid-scroll-container::-webkit-scrollbar{height:6px}.md-grid-scroll-container::-webkit-scrollbar-track{background:#f3f3f3;border-radius:3px}.md-grid-scroll-container::-webkit-scrollbar-thumb{background:#929292;border-radius:3px}.md-grid-scroll-container::-webkit-scrollbar-thumb:hover{background:#4d4d4d}.md-grid-shrink-mode .md-grid-scroll-container{overflow-x:hidden}.md-grid-shrink-mode .md-grid-header-inner,.md-grid-shrink-mode .md-grid-card{min-width:0}.md-grid-shrink-mode .md-grid-header-cell,.md-grid-shrink-mode .md-grid-cell{flex-shrink:1}.md-grid-header{display:block;background:transparent;margin:0;padding:0;border:0}.md-grid-header-inner{display:flex;align-items:center;height:100%;min-width:fit-content}.md-grid-header-cell{display:flex;align-items:center;flex-shrink:0;height:100%;padding:14px 16px;background:#fff;font-family:Montserrat,Arial,sans-serif;font-size:14px;font-weight:300;color:#4d4d4d;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}.md-grid-header-cell:not(:first-child){border-left:2px solid #EAEAEA}.md-grid-header-cell.sortable{cursor:pointer;transition:background-color .2s ease}.md-grid-header-cell.sortable:hover{background:#f3f3f3}.md-grid-header-cell.sortable:focus{outline:0;outline-offset:0}.md-grid-header-cell.sort-active{color:#0185cf}.md-grid-header-cell.resizeable{position:relative}.md-grid-header-cell-label{flex:1;overflow:hidden;text-overflow:ellipsis}.md-grid-sort-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:2px;color:#929292;transition:color .2s ease}.md-grid-sort-icon:before{font-family:datatable;font-size:12px}.md-grid-sort-icon.md-grid-sort-asc,.md-grid-sort-icon.md-grid-sort-desc{color:#6d5cae}.md-grid-sort-icon.md-grid-sort-asc:after,.md-grid-sort-icon.md-grid-sort-desc:after{content:\"\";display:block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent}.md-grid-sort-icon.md-grid-sort-asc:after{border-bottom:5px solid currentColor}.md-grid-sort-icon.md-grid-sort-desc:after{border-top:5px solid currentColor}.md-grid-resize-handle{position:absolute;top:0;right:-8px;bottom:0;width:10px;cursor:col-resize;z-index:1}.md-grid-resize-handle:after{content:\"\";position:absolute;top:25%;right:2px;bottom:25%;width:3px;background:transparent;border-radius:1px;transition:background-color .2s ease}.md-grid-resize-handle:hover:after{background:#6d5cae}.md-grid-header-cell:last-of-type:not(.md-grid-actions-cell) .md-grid-resize-handle{right:0}.md-grid-header-cell:has(+.md-grid-actions-cell) .md-grid-resize-handle{right:0}body.md-grid-resizing{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}body.md-grid-resizing *{cursor:col-resize!important}.md-grid-body{display:flex;flex-direction:column;padding:12px 0 0;width:fit-content;min-width:fit-content;background:transparent}.md-grid-group{margin-bottom:12px}.md-grid-group:last-child{margin-bottom:0}.md-grid-group-header{display:flex;align-items:center;padding:10px 14px;margin-bottom:12px;background:#eaeaea;border-radius:0;font-size:13px;font-weight:600;color:#000}.md-grid-group-title{flex:1}.md-grid-group-rows{display:flex;flex-direction:column;width:fit-content;gap:5px}.md-grid-card{display:inline-flex;align-items:stretch;width:fit-content;min-width:fit-content;background:#fff;border:0;border-radius:0;box-shadow:none;transition:all .2s ease}.md-grid-card:hover{background:#fbfbfb;box-shadow:0 2px 8px #0000001f;transform:translateY(-1px)}.md-grid-card.md-grid-card-editing{background:#cf01061a;border:0;box-shadow:none}.md-grid-card.md-grid-card-fixed-height,.md-grid-card.md-grid-card-fixed-height .md-grid-cell{overflow:hidden}.md-grid-card.md-grid-card-fixed-height .md-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-grid-cell{display:flex;align-items:center;flex-shrink:0;padding:14px 16px;font-size:14px;color:#000;border:0;overflow:hidden;min-width:0}.md-grid-cell:last-child{border-right:none}.md-grid-cell-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1.4}.md-grid-actions-cell{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:90px;width:auto!important;flex-grow:0!important;flex-shrink:0!important;padding:inherit;border:0}.md-grid-header-cell.md-grid-actions-cell{border-left:none;border-right:none}.md-grid-action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:4px;background:transparent;color:#4d4d4d;cursor:pointer;transition:all .2s ease}.md-grid-action-btn:hover{transform:scale(1.1)}.md-grid-action-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-grid-action-btn:active{transform:scale(.95)}.md-grid-action-edit{color:#6d5cae}.md-grid-action-edit:hover{background:#e9e7f3;color:#564790}.md-grid-action-save{color:#28b446}.md-grid-action-save:hover{background:#dff4e3;color:#1f8a36}.md-grid-action-cancel{color:#cf0106}.md-grid-action-cancel:hover{background:#f8d9da;color:#9c0105}.md-grid-icon-edit,.md-grid-icon-save,.md-grid-icon-cancel{display:inline-block;width:18px;height:18px;position:relative}.md-grid-icon-edit:before,.md-grid-icon-edit:after{content:\"\";position:absolute}.md-grid-icon-edit:before{width:10px;height:10px;border:2px solid currentColor;border-radius:1px;transform:rotate(45deg);top:1px;left:1px}.md-grid-icon-edit:after{width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid currentColor;bottom:0;left:0;transform:rotate(-45deg)}.md-grid-icon-save:before{content:\"\";position:absolute;width:6px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);top:1px;left:5px}.md-grid-icon-cancel:before,.md-grid-icon-cancel:after{content:\"\";position:absolute;width:14px;height:2px;background:currentColor;top:50%;left:50%}.md-grid-icon-cancel:before{transform:translate(-50%,-50%) rotate(45deg)}.md-grid-icon-cancel:after{transform:translate(-50%,-50%) rotate(-45deg)}.md-grid-footer{display:flex;align-items:center;justify-content:flex-end;padding:12px 0 0;background:transparent;border-top:0;font-size:12px;color:#4d4d4d}.md-grid-pager{display:flex;align-items:center;gap:4px}.md-grid-pager-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid #EAEAEA;border-radius:4px;background:#fff;color:#4d4d4d;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.md-grid-pager-btn:hover:not(:disabled){background:#f3f3f3;border-color:#929292}.md-grid-pager-btn:disabled{opacity:.4;cursor:not-allowed}.md-grid-pager-btn:focus{outline:2px solid #6d5cae;outline-offset:1px}.md-grid-pager-info{padding:0 12px;font-weight:500}.md-grid-icon-first,.md-grid-icon-prev,.md-grid-icon-next,.md-grid-icon-last{display:inline-block;width:12px;height:12px;position:relative}.md-grid-icon-first:before,.md-grid-icon-prev:before,.md-grid-icon-next:before,.md-grid-icon-last:before{content:\"\";position:absolute;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;top:50%;left:50%}.md-grid-icon-prev:before{transform:translate(-25%,-50%) rotate(135deg)}.md-grid-icon-next:before{transform:translate(-75%,-50%) rotate(-45deg)}.md-grid-icon-first:before{transform:translate(-10%,-50%) rotate(135deg)}.md-grid-icon-first:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;left:2px;transform:translateY(-50%)}.md-grid-icon-last:before{transform:translate(-90%,-50%) rotate(-45deg)}.md-grid-icon-last:after{content:\"\";position:absolute;width:2px;height:10px;background:currentColor;top:50%;right:2px;transform:translateY(-50%)}@media (max-width: 767px){.md-grid{font-size:12px}.md-grid-header{display:none}.md-grid-body{padding:8px}.md-grid-card{flex-direction:column}.md-grid-cell{padding:10px 12px;border-right:none;border-bottom:1px solid #EAEAEA}.md-grid-cell:last-child{border-bottom:none}.md-grid-actions-cell{border-left:none;border-top:1px solid #EAEAEA;justify-content:center;background:#f3f3f3}.md-grid-footer{flex-direction:column;gap:10px;padding:12px}}.md-grid.grey .md-grid-header-cell,.md-grid.grey .md-grid-card{background:#f3f3f3}.md-grid.grey .md-grid-card:hover{background:#efefef}.md-grid.grey .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra .md-grid-card:nth-child(odd){background:#fff}.md-grid.zebra .md-grid-card:nth-child(2n){background:#f3f3f3}.md-grid.zebra .md-grid-card:hover{background:#e4e4e4}.md-grid.zebra .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra .md-grid-group-rows .md-grid-card:nth-child(odd){background:#fff}.md-grid.zebra .md-grid-group-rows .md-grid-card:nth-child(2n){background:#f3f3f3}.md-grid.zebra .md-grid-group-rows .md-grid-card:hover{background:#e4e4e4}.md-grid.zebra .md-grid-group-rows .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra.grey .md-grid-card:nth-child(odd){background:#f3f3f3}.md-grid.zebra.grey .md-grid-card:nth-child(2n){background:#efefef}.md-grid.zebra.grey .md-grid-card:hover{background:#d6d6d6}.md-grid.zebra.grey .md-grid-card.md-grid-card-editing{background:#cf01061a}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:nth-child(odd){background:#f3f3f3}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:nth-child(2n){background:#efefef}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card:hover{background:#d6d6d6}.md-grid.zebra.grey .md-grid-group-rows .md-grid-card.md-grid-card-editing{background:#cf01061a}\n"] }]
|
|
15354
15354
|
}], propDecorators: { isShrinkMode: [{
|
|
15355
15355
|
type: HostBinding,
|
|
15356
|
-
args: ['class.md-
|
|
15356
|
+
args: ['class.md-grid-shrink-mode']
|
|
15357
15357
|
}], rows: [{
|
|
15358
15358
|
type: Input
|
|
15359
15359
|
}], columns: [{
|
|
@@ -15441,30 +15441,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
15441
15441
|
type: Output
|
|
15442
15442
|
}], _columnDirectives: [{
|
|
15443
15443
|
type: ContentChildren,
|
|
15444
|
-
args: [
|
|
15444
|
+
args: [MDGridColumnDirective]
|
|
15445
15445
|
}] } });
|
|
15446
15446
|
|
|
15447
15447
|
const DECLARATIONS = [
|
|
15448
|
-
|
|
15449
|
-
|
|
15450
|
-
|
|
15451
|
-
|
|
15452
|
-
|
|
15448
|
+
MDGridComponent,
|
|
15449
|
+
MDGridColumnDirective,
|
|
15450
|
+
MDGridCellTemplateDirective,
|
|
15451
|
+
MDGridHeaderTemplateDirective,
|
|
15452
|
+
MDGridEditTemplateDirective,
|
|
15453
15453
|
];
|
|
15454
|
-
class
|
|
15455
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15456
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15457
|
-
|
|
15458
|
-
|
|
15459
|
-
|
|
15460
|
-
|
|
15461
|
-
|
|
15462
|
-
|
|
15463
|
-
|
|
15464
|
-
|
|
15465
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15466
|
-
}
|
|
15467
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
15454
|
+
class MDGridModule {
|
|
15455
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
15456
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDGridModule, imports: [CommonModule, MDGridComponent,
|
|
15457
|
+
MDGridColumnDirective,
|
|
15458
|
+
MDGridCellTemplateDirective,
|
|
15459
|
+
MDGridHeaderTemplateDirective,
|
|
15460
|
+
MDGridEditTemplateDirective], exports: [MDGridComponent,
|
|
15461
|
+
MDGridColumnDirective,
|
|
15462
|
+
MDGridCellTemplateDirective,
|
|
15463
|
+
MDGridHeaderTemplateDirective,
|
|
15464
|
+
MDGridEditTemplateDirective] });
|
|
15465
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridModule, imports: [CommonModule, MDGridComponent] });
|
|
15466
|
+
}
|
|
15467
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDGridModule, decorators: [{
|
|
15468
15468
|
type: NgModule,
|
|
15469
15469
|
args: [{
|
|
15470
15470
|
imports: [
|
|
@@ -15481,5 +15481,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
15481
15481
|
* Generated bundle index. Do not edit.
|
|
15482
15482
|
*/
|
|
15483
15483
|
|
|
15484
|
-
export { ACCORDION, CARD_CONFIG, CardSimpleComponent, CentralPageComponent, CentralPageRowComponent, CollapseComponent, CollapseSetComponent, DIALOG_DATA, DIALOG_DEFAULT_OPTIONS, DIALOG_SCROLL_STRATEGY, DialogState, EXPANSION_PANEL_DEFAULT_OPTIONS, ErrorStateMatcher, ExpansionPanelActionRow, ExpansionPanelDescription, ExpansionPanelTitle, FillComponent, FilteredFieldContainerComponent, FilteredFieldItemComponent, FilteredFieldService, FiltredItemModel, INK_BAR_POSITIONER, INK_BAR_POSITIONER_FACTORY, InkBar, MDAccordion, MDAutocomplete, MDAutocompleteModule, MDAutocompleteOrigin, MDAutocompleteSelectedEvent, MDAutocompleteTrigger, MDCard, MDCardActions, MDCardAvatar, MDCardContent, MDCardFooter, MDCardHeader, MDCardImage, MDCardLgImage, MDCardMdImage, MDCardModule, MDCardSmImage, MDCardSubtitle, MDCardTitle, MDCardTitleGroup, MDCardXlImage,
|
|
15484
|
+
export { ACCORDION, CARD_CONFIG, CardSimpleComponent, CentralPageComponent, CentralPageRowComponent, CollapseComponent, CollapseSetComponent, DIALOG_DATA, DIALOG_DEFAULT_OPTIONS, DIALOG_SCROLL_STRATEGY, DialogState, EXPANSION_PANEL_DEFAULT_OPTIONS, ErrorStateMatcher, ExpansionPanelActionRow, ExpansionPanelDescription, ExpansionPanelTitle, FillComponent, FilteredFieldContainerComponent, FilteredFieldItemComponent, FilteredFieldService, FiltredItemModel, INK_BAR_POSITIONER, INK_BAR_POSITIONER_FACTORY, InkBar, MDAccordion, MDAutocomplete, MDAutocompleteModule, MDAutocompleteOrigin, MDAutocompleteSelectedEvent, MDAutocompleteTrigger, MDCard, MDCardActions, MDCardAvatar, MDCardContent, MDCardFooter, MDCardHeader, MDCardImage, MDCardLgImage, MDCardMdImage, MDCardModule, MDCardSmImage, MDCardSubtitle, MDCardTitle, MDCardTitleGroup, MDCardXlImage, MDCheckBox, MDCheckBoxModule, MDCheckboxChange, MDChip, MDChipAvatar, MDChipEdit, MDChipEditInput, MDChipGrid, MDChipGridChange, MDChipInput, MDChipListbox, MDChipListboxChange, MDChipOption, MDChipRemove, MDChipRow, MDChipSelectionChange, MDChipSet, MDChipTrailingIcon, MDChipsModule, MDCollapseModule, MDContextMenuTrigger, MDDialog, MDDialogActions, MDDialogClose, MDDialogContainer, MDDialogContent, MDDialogTitle, MDExpansionPanel, MDExpansionPanelContent, MDExpansionPanelHeader, MDGridCellTemplateDirective, MDGridColumnDirective, MDGridComponent, MDGridEditTemplateDirective, MDGridHeaderTemplateDirective, MDGridModule, MDHeaderCardComponent, MDHeaderCardModule, MDHeaderCardSetComponent, MDMenu, MDMenuContent, MDMenuItem, MDMenuModule, MDMenuTrigger, MDModalModule, MDOption, MDOptionGroup, MDOptionModule, MDOptionSelectionChange, MDPseudoCheckboxModule, MDRadioButton, MDRadioGroup, MDRadioModule, MDSelect, MDSelectModule, MDSelectTrigger, MDStep, MDStepContent, MDStepExecutorModule, MDStepFooter, MDStepHeader, MDStepLabel, MDStepper, MDStepperIcon, MDStepperNext, MDStepperPrevious, MDSwitch, MDSwitchModule, MDTab, MDTabBody, MDTabChangeEvent, MDTabContent, MDTabGroup, MDTabHeader, MDTabLabel, MDTabLabelWrapper, MDTabsModule, MD_AUTOCOMPLETE_DEFAULT_OPTIONS, MD_AUTOCOMPLETE_SCROLL_STRATEGY, MD_AUTOCOMPLETE_VALUE_ACCESSOR, MD_CHIP, MD_CHIPS_DEFAULT_OPTIONS, MD_CHIP_AVATAR, MD_CHIP_EDIT, MD_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR, MD_CHIP_REMOVE, MD_CHIP_TRAILING_ICON, MD_EXPANSION_PANEL, MD_MENU_CONTENT, MD_MENU_DEFAULT_OPTIONS, MD_MENU_PANEL, MD_MENU_SCROLL_STRATEGY, MD_OPTION_PARENT_COMPONENT, MD_RADIO_GROUP, MD_SELECT_TRIGGER, MD_TAB, MD_TAB_LABEL, MENU_PANEL_TOP_PADDING, ManagePageComponent, MefDevCardModule, MefDevCollapseModule, MefDevDialogConfig, MefDevDialogRef, MefDevDropDownMenuModule, MefDevFilteredFieldModule, MefDevModalModule, MefDevOptionComponent, MefDevPageLayoutsModule, MefDevProgressComponent, MefDevProgressModule, MefDevSelectComponent, MefDevSelectModule, MefDevStepExecutorModule, MefDevSwitchComponent, MefDevSwitchModule, MefDevTabBodyComponent, MefDevTabComponent, MefDevTabLabelDirective, MefDevTabSetComponent, MefDevTabsInkBarDirective, MefDevTabsModule, MefDevTabsNavComponent, MefdevDropdownMenuComponent, MefdevExecutorPageComponent, OptionPipe, OverflowMode, PaginatedTabHeader, ProgressConfig, PseudoCheckbox, RADIO_GROUP_CONTROL_VALUE_ACCESSOR, RadioChange, RightFilterComponent, STEPPER_INTL_PROVIDER, STEPPER_INTL_PROVIDER_FACTORY, SelectChange, ShowOnDirtyErrorStateMatcher, SlideRightComponent, SlideUpComponent, SortDirection, SortType, StageComponent, StepExecutorComponent, StepperErrorStateMatcher, StepperIntl, TABS_CONFIG, TAB_CONTENT, TAB_GROUP, TabBodyPortal, TabChangeEvent, TablePageComponent, TransitionCheckState, _ErrorStateTracker, _closeDialogVia, _countGroupLabelsBeforeOption, _getOptionScrollPosition, components, deepClone, getMDAutocompleteMissingPanelError, getMDSelectDynamicMultipleError, getMDSelectNonArrayValueError, getMDSelectNonFunctionValueError, groupRowsByProperty, mefDevCardComponents, mefDevCollapseModuleComponents, sortRows };
|
|
15485
15485
|
//# sourceMappingURL=natec-mef-dev-ui-kit.mjs.map
|