@firestitch/list 12.4.0 → 12.5.0
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/app/interfaces/listconfig.interface.d.ts +1 -2
- package/app/models/row/group-footer-row.d.ts +1 -1
- package/app/models/row/group-row.d.ts +1 -0
- package/app/models/row.d.ts +1 -1
- package/bundles/firestitch-list.umd.js +41 -34
- package/bundles/firestitch-list.umd.js.map +1 -1
- package/esm2015/app/classes/data-controller.js +14 -16
- package/esm2015/app/components/body/row/cell/cell.component.js +16 -4
- package/esm2015/app/components/body/row/row.component.js +4 -4
- package/esm2015/app/interfaces/listconfig.interface.js +1 -1
- package/esm2015/app/models/row/child-row.js +1 -1
- package/esm2015/app/models/row/group-footer-row.js +2 -2
- package/esm2015/app/models/row/group-row.js +5 -1
- package/esm2015/app/models/row.js +2 -2
- package/fesm2015/firestitch-list.js +37 -23
- package/fesm2015/firestitch-list.js.map +1 -1
- package/package.json +1 -1
|
@@ -710,6 +710,10 @@ class GroupRow extends BaseRow {
|
|
|
710
710
|
this._expanded.next(initialExpand);
|
|
711
711
|
}
|
|
712
712
|
}
|
|
713
|
+
get childrenData() {
|
|
714
|
+
return this.children
|
|
715
|
+
.map((child) => child.data);
|
|
716
|
+
}
|
|
713
717
|
get isGroup() {
|
|
714
718
|
return true;
|
|
715
719
|
}
|
|
@@ -786,7 +790,7 @@ class GroupFooterRow extends BaseRow {
|
|
|
786
790
|
get parent() {
|
|
787
791
|
return this._parent;
|
|
788
792
|
}
|
|
789
|
-
get
|
|
793
|
+
get isGroupFooter() {
|
|
790
794
|
return true;
|
|
791
795
|
}
|
|
792
796
|
destroy() { }
|
|
@@ -839,7 +843,7 @@ class Row {
|
|
|
839
843
|
get isChild() {
|
|
840
844
|
return this._row instanceof ChildRow;
|
|
841
845
|
}
|
|
842
|
-
get
|
|
846
|
+
get isGroupFooter() {
|
|
843
847
|
return this._row instanceof GroupFooterRow;
|
|
844
848
|
}
|
|
845
849
|
get parent() {
|
|
@@ -1105,7 +1109,7 @@ class DataController {
|
|
|
1105
1109
|
_updateVisibleRows() {
|
|
1106
1110
|
this.visibleRows = this._rowsStack
|
|
1107
1111
|
.filter((row) => {
|
|
1108
|
-
return (!row.isChild && !row.
|
|
1112
|
+
return (!row.isChild && !row.isGroupFooter) || row.visible;
|
|
1109
1113
|
});
|
|
1110
1114
|
}
|
|
1111
1115
|
updateRow(targetRow, trackBy) {
|
|
@@ -1149,20 +1153,15 @@ class DataController {
|
|
|
1149
1153
|
if (!this._groupByFn || !this._compareByFn) {
|
|
1150
1154
|
return rows;
|
|
1151
1155
|
}
|
|
1152
|
-
let
|
|
1156
|
+
let groupRows = [];
|
|
1153
1157
|
const footerRows = new Map();
|
|
1154
1158
|
rows.forEach((row) => {
|
|
1155
1159
|
const mainGroup = this._groupByFn(row);
|
|
1156
|
-
const isFooterRow = this._footerRowFn(row);
|
|
1157
1160
|
const mainGroupKey = this._compareByFn(mainGroup);
|
|
1158
|
-
if (isFooterRow) {
|
|
1159
|
-
footerRows.set(mainGroupKey, row);
|
|
1160
|
-
return;
|
|
1161
|
-
}
|
|
1162
1161
|
if (!this._store.has(mainGroupKey)) {
|
|
1163
1162
|
const group = new GroupRow(mainGroup, this._initialExpand);
|
|
1164
|
-
group.index =
|
|
1165
|
-
|
|
1163
|
+
group.index = groupRows.length;
|
|
1164
|
+
groupRows.push(group);
|
|
1166
1165
|
const childRow = new ChildRow(row, group);
|
|
1167
1166
|
this._store.set(mainGroupKey, group);
|
|
1168
1167
|
group.children.push(childRow);
|
|
@@ -1173,13 +1172,16 @@ class DataController {
|
|
|
1173
1172
|
group.children.push(childRow);
|
|
1174
1173
|
}
|
|
1175
1174
|
});
|
|
1176
|
-
|
|
1177
|
-
const
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1175
|
+
groupRows.forEach((groupRow) => {
|
|
1176
|
+
const footerIndex = groupRow.children
|
|
1177
|
+
.findIndex((row) => {
|
|
1178
|
+
return this._footerRowFn(row.data, Object.assign(Object.assign({}, groupRow.data), { children: groupRow.childrenData }));
|
|
1179
|
+
});
|
|
1180
|
+
if (footerIndex !== -1) {
|
|
1181
|
+
const footerRow = groupRow.children.slice(footerIndex, footerIndex + 1)[0];
|
|
1182
|
+
groupRow.children.push(new GroupFooterRow(footerRow.data, groupRow));
|
|
1181
1183
|
}
|
|
1182
|
-
}
|
|
1184
|
+
});
|
|
1183
1185
|
return Array.from(this._store.values())
|
|
1184
1186
|
.reduce((acc, item) => {
|
|
1185
1187
|
if (item.isGroup) {
|
|
@@ -3862,9 +3864,21 @@ class FsCellComponent {
|
|
|
3862
3864
|
if (this.row.isGroup) {
|
|
3863
3865
|
this.cellContext.groupIndex = this.row.index;
|
|
3864
3866
|
}
|
|
3865
|
-
else if (this.row.isChild || this.row.
|
|
3866
|
-
this.cellContext.
|
|
3867
|
+
else if (this.row.isChild || this.row.isGroupFooter) {
|
|
3868
|
+
this.cellContext.groupIndex = this.row.index;
|
|
3867
3869
|
this.cellContext.groupRow = this.row.parent.data;
|
|
3870
|
+
this.cellContext.group = this.row.parent.data;
|
|
3871
|
+
}
|
|
3872
|
+
if (this.row.isGroup) {
|
|
3873
|
+
this.cellContext.group = this.row.data;
|
|
3874
|
+
this.cellContext.groupChildren = this.row.children
|
|
3875
|
+
.map((child) => child.data);
|
|
3876
|
+
}
|
|
3877
|
+
else if (this.row.isGroupFooter) {
|
|
3878
|
+
this.cellContext.group = this.row.parent.data;
|
|
3879
|
+
this.cellContext.groupIndex = this.row.index;
|
|
3880
|
+
this.cellContext.groupChildren = this.row.parent.children
|
|
3881
|
+
.map((child) => child.data);
|
|
3868
3882
|
}
|
|
3869
3883
|
}
|
|
3870
3884
|
this.cellContext.column = this.column;
|
|
@@ -3880,7 +3894,7 @@ class FsCellComponent {
|
|
|
3880
3894
|
if ((_a = this.row) === null || _a === void 0 ? void 0 : _a.isGroup) {
|
|
3881
3895
|
this.cellTemplate = this.column.groupHeaderTemplate || this.column.cellTemplate;
|
|
3882
3896
|
}
|
|
3883
|
-
else if ((_b = this.row) === null || _b === void 0 ? void 0 : _b.
|
|
3897
|
+
else if ((_b = this.row) === null || _b === void 0 ? void 0 : _b.isGroupFooter) {
|
|
3884
3898
|
this.cellTemplate = this.column.groupFooterTemplate || this.column.cellTemplate;
|
|
3885
3899
|
}
|
|
3886
3900
|
else {
|
|
@@ -4453,7 +4467,7 @@ class FsRowComponent {
|
|
|
4453
4467
|
return this.row.isChild;
|
|
4454
4468
|
}
|
|
4455
4469
|
get isGroupFooterRow() {
|
|
4456
|
-
return this.row.
|
|
4470
|
+
return this.row.isGroupFooter;
|
|
4457
4471
|
}
|
|
4458
4472
|
get rowCssClass() {
|
|
4459
4473
|
let cls = 'fs-list-row';
|
|
@@ -4471,7 +4485,7 @@ class FsRowComponent {
|
|
|
4471
4485
|
options.groupIndex = this.row.index;
|
|
4472
4486
|
}
|
|
4473
4487
|
else if (this.row.isChild) {
|
|
4474
|
-
options.
|
|
4488
|
+
options.groupIndex = this.row.index;
|
|
4475
4489
|
}
|
|
4476
4490
|
const resultClass = this.rowClass(this.row.data, options);
|
|
4477
4491
|
if (typeof resultClass === 'string') {
|
|
@@ -4618,7 +4632,7 @@ class FsRowComponent {
|
|
|
4618
4632
|
}
|
|
4619
4633
|
}
|
|
4620
4634
|
FsRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsRowComponent, deps: [{ token: i0.ElementRef }, { token: ReorderController }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: FsListDraggableListDirective }], target: i0.ɵɵFactoryTarget.Component });
|
|
4621
|
-
FsRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowComponent, selector: "[fs-list-row]", inputs: { row: "row", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", hasRowActions: "hasRowActions", rowEvents: "rowEvents", rowClass: "rowClass", restoreMode: "restoreMode", rowIndex: "rowIndex", columns: "columns", selection: "selection", rowRemoved: "rowRemoved" }, host: { properties: { "attr.role": "this.role", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0, template: "<!-- Drag -->\n<ng-container *ngIf=\"reorderController.leftReorderActivated$ | async\">\n <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection\">\n <td class=\"fs-list-col fs-list-col-selection\">\n <ng-container *ngIf=\"!row.
|
|
4635
|
+
FsRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowComponent, selector: "[fs-list-row]", inputs: { row: "row", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", hasRowActions: "hasRowActions", rowEvents: "rowEvents", rowClass: "rowClass", restoreMode: "restoreMode", rowIndex: "rowIndex", columns: "columns", selection: "selection", rowRemoved: "rowRemoved" }, host: { properties: { "attr.role": "this.role", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0, template: "<!-- Drag -->\n<ng-container *ngIf=\"reorderController.leftReorderActivated$ | async\">\n <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection\">\n <td class=\"fs-list-col fs-list-col-selection\">\n <ng-container *ngIf=\"!row.isGroupFooter\">\n <mat-checkbox (change)=\"selectRow($event)\"\n [checked]=\"selected\"\n [indeterminate]=\"indeterminateSelected\">\n </mat-checkbox>\n </ng-container>\n </td>\n</ng-container>\n\n<!-- Content -->\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn; let isFirst = first\">\n <td fs-cell\n *ngIf=\"(isGroupRow && !column.groupHeaderColspanned)\n || (isGroupFooterRow && !column.groupFooterColspanned)\n || (!isGroupRow && !isGroupFooterRow && !column.cellColspanned)\"\n [column]=\"column\"\n [row]=\"row\"\n [rowIndex]=\"rowIndex\"\n [class]=\"(isGroupRow && column.groupHeaderConfigs.classesString)\n || (isGroupFooterRow && column.groupFooterConfigs.classesString)\n || (!isGroupFooterRow && column.cellConfigs.classesString)\"\n [ngClass]=\"{ 'primary-col': isFirst }\"\n [attr.colspan]=\"(isGroupRow && column.groupHeaderConfigs.colspan)\n || (isGroupFooterRow && column.groupFooterConfigs.colspan)\n || column.cellConfigs.colspan\"\n [attr.width]=\"column.width\"\n >\n </td>\n</ng-container>\n\n<!-- Drag -->\n<ng-container *ngIf=\"reorderController.rightReorderActivated$ | async\">\n <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderController.manualReorderActivated$ | async)\" class=\"fs-list-col row-actions\">\n <ng-container *ngIf=\"!isGroupFooterRow\">\n <fs-list-row-actions [row]=\"row\"\n [index]=\"rowIndex\"\n [rowActions]=\"rowActions\"\n [menuRowActions]=\"menuRowActions\"\n [inlineRowActions]=\"inlineRowActions\"\n [restoreAction]=\"restoreAction\"\n [restoreMode]=\"restoreMode\"\n [rowRemoved]=\"rowRemoved\"\n ></fs-list-row-actions>\n </ng-container>\n</td>\n\n<ng-template #dragCell>\n <ng-container *ngIf=\"dragCellVisible && !isGroupFooterRow; else emptyCell\">\n <td class=\"fs-list-col drag-col\"\n (mousedown)=\"dragStart($event)\"\n (touchstart)=\"dragStart($event)\"\n >\n <mat-icon>drag_handle</mat-icon>\n </td>\n </ng-container>\n <ng-template #emptyCell>\n <td class=\"fs-list-col drag-col\"></td>\n </ng-template>\n</ng-template>\n", components: [{ type: i2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: FsCellComponent, selector: "[fs-cell]", inputs: ["column", "row", "rowIndex"] }, { type: FsRowActionsComponent, selector: "fs-list-row-actions", inputs: ["row", "index", "restoreMode", "rowActions", "rowRemoved", "menuRowActions", "inlineRowActions", "restoreAction"] }, { type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], pipes: { "async": i3$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4622
4636
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsRowComponent, decorators: [{
|
|
4623
4637
|
type: Component,
|
|
4624
4638
|
args: [{
|