@nanahoshi/mona-ui 0.8.0 → 0.9.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/fesm2022/nanahoshi-mona-ui-check-box.mjs +8 -11
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-cell.component-BbBPZj7t.mjs → nanahoshi-mona-ui-grid-grid-footer-cell.component-D05Rq7-1.mjs} +2 -2
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BkISJoqL.mjs → nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-Bad0K1Cw.mjs} +2 -2
- package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-QqUUL60F.mjs +122 -0
- package/fesm2022/{nanahoshi-mona-ui-grid-grid-toggle.component-QDo6TweF.mjs → nanahoshi-mona-ui-grid-grid-toggle.component-DvuQvc7E.mjs} +46 -5
- package/fesm2022/nanahoshi-mona-ui-grid-grid-virtual-list.component-BmahjOXq.mjs +232 -0
- package/fesm2022/{nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-DWzYyGnb.mjs → nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-RQvhjBse.mjs} +227 -48
- package/fesm2022/nanahoshi-mona-ui-grid.mjs +1 -1
- package/package.json +1 -1
- package/types/nanahoshi-mona-ui-check-box.d.ts +1 -2
- package/types/nanahoshi-mona-ui-grid.d.ts +66 -1
- package/fesm2022/nanahoshi-mona-ui-grid-grid-list.component-DReEfWfG.mjs +0 -121
- package/fesm2022/nanahoshi-mona-ui-grid-grid-virtual-list.component-BCIs_lmz.mjs +0 -231
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { C as CellEditEvent,
|
|
1
|
+
export { C as CellEditEvent, x as GridAddCommandDirective, y as GridAddEvent, z as GridCancelCommandDirective, A as GridCancelEvent, B as GridCellTemplateDirective, D as GridColumnComponent, E as GridColumnTitleTemplateDirective, F as GridCommandColumnComponent, H as GridComponent, I as GridContextMenuDirective, J as GridDetailTemplateDirective, K as GridEditCommandDirective, L as GridEditEvent, M as GridEditTemplateDirective, N as GridEditableDirective, O as GridExportDirective, P as GridFilterableDirective, Q as GridFooterTemplateDirective, R as GridGroupFooterTemplateDirective, S as GridGroupableDirective, T as GridHeaderTemplateDirective, U as GridNoDataTemplateDirective, V as GridRemoveCommandDirective, W as GridRemoveEvent, X as GridReorderableDirective, Y as GridResizableDirective, Z as GridSaveCommandDirective, _ as GridSaveEvent, $ as GridSelectableDirective, a0 as GridSortableDirective, a1 as GridStatePersistenceDirective, a2 as GridToolbarTemplateDirective, a3 as GridVirtualScrollDirective, a4 as RowEditEvent } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-RQvhjBse.mjs';
|
|
2
2
|
//# sourceMappingURL=nanahoshi-mona-ui-grid.mjs.map
|
package/package.json
CHANGED
|
@@ -103,9 +103,8 @@ declare class CheckBoxComponent implements CheckboxVariantInput, CheckmarkVarian
|
|
|
103
103
|
* @default ""
|
|
104
104
|
*/
|
|
105
105
|
readonly userClass: _angular_core.InputSignal<string>;
|
|
106
|
-
protected onCheckedChange(checked: boolean): void;
|
|
107
|
-
protected onInputChange(event: Event): void;
|
|
108
106
|
protected onInputBlur(event: FocusEvent): void;
|
|
107
|
+
protected onInputChange(event: Event): void;
|
|
109
108
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckBoxComponent, never>;
|
|
110
109
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckBoxComponent, "mona-check-box", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "labelSize": { "alias": "labelSize"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "inputBlur": "inputBlur"; "inputChange": "inputChange"; "inputFocus": "inputFocus"; "touch": "touch"; }, never, ["*"], true, never>;
|
|
111
110
|
}
|
|
@@ -202,8 +202,58 @@ interface GridRemoveEventOptions {
|
|
|
202
202
|
}
|
|
203
203
|
|
|
204
204
|
interface SelectableOptions {
|
|
205
|
+
/**
|
|
206
|
+
* Enables row selection.
|
|
207
|
+
*/
|
|
205
208
|
enabled?: boolean;
|
|
209
|
+
/**
|
|
210
|
+
* Controls whether one or multiple rows can be selected.
|
|
211
|
+
*
|
|
212
|
+
* @default "single"
|
|
213
|
+
*/
|
|
206
214
|
mode?: "single" | "multiple";
|
|
215
|
+
/**
|
|
216
|
+
* Derives the accessible label for a row's selection checkbox from its data.
|
|
217
|
+
*
|
|
218
|
+
* When omitted, the checkbox falls back to a positional label (e.g. "Select row 3").
|
|
219
|
+
*/
|
|
220
|
+
rowAriaLabel?: (rowData: Record<PropertyKey, unknown>) => string;
|
|
221
|
+
/**
|
|
222
|
+
* Determines which rows are affected by the header checkbox.
|
|
223
|
+
*
|
|
224
|
+
* - "page": rows on the current paginated page
|
|
225
|
+
* - "view": all rows in the current filtered and sorted view
|
|
226
|
+
*
|
|
227
|
+
* For virtual scrolling, "page" resolves to the complete current view
|
|
228
|
+
* because virtual scrolling does not have logical pages.
|
|
229
|
+
*
|
|
230
|
+
* @default "page"
|
|
231
|
+
*/
|
|
232
|
+
selectAllScope?: "page" | "view";
|
|
233
|
+
/**
|
|
234
|
+
* Whether clicking the row itself changes selection.
|
|
235
|
+
*
|
|
236
|
+
* Off by default so that clicking a row to interact with its content (a link, a button,
|
|
237
|
+
* an editable cell) never silently discards the current selection. Set this to true to
|
|
238
|
+
* also select rows via a plain click, in addition to checkboxes or application code.
|
|
239
|
+
*
|
|
240
|
+
* @default false
|
|
241
|
+
*/
|
|
242
|
+
selectOnRowClick?: boolean;
|
|
243
|
+
/**
|
|
244
|
+
* Displays the built-in checkbox selection column.
|
|
245
|
+
*
|
|
246
|
+
* @default false
|
|
247
|
+
*/
|
|
248
|
+
showCheckboxes?: boolean;
|
|
249
|
+
/**
|
|
250
|
+
* Displays a select-all checkbox in the selection-column header.
|
|
251
|
+
*
|
|
252
|
+
* Only applies to multiple-selection mode.
|
|
253
|
+
*
|
|
254
|
+
* @default true
|
|
255
|
+
*/
|
|
256
|
+
showSelectAll?: boolean;
|
|
207
257
|
}
|
|
208
258
|
|
|
209
259
|
interface GroupDescriptor {
|
|
@@ -777,6 +827,7 @@ declare class GridService {
|
|
|
777
827
|
readonly addRowData: _angular_core.Signal<Record<PropertyKey, unknown> | null>;
|
|
778
828
|
readonly addRowVisible: _angular_core.Signal<boolean>;
|
|
779
829
|
readonly add$: Subject<GridAddEvent>;
|
|
830
|
+
readonly allBulkSelectionRowsSelected: _angular_core.Signal<boolean>;
|
|
780
831
|
readonly aggregateColumns: _angular_core.Signal<ImmutableList<Column>>;
|
|
781
832
|
readonly aggregateMap: _angular_core.Signal<ImmutableDictionary<string, GridAggregateBucket>>;
|
|
782
833
|
readonly aggregateRows: _angular_core.Signal<Record<PropertyKey, unknown>[]>;
|
|
@@ -785,6 +836,7 @@ declare class GridService {
|
|
|
785
836
|
readonly appliedSorts: _angular_core.WritableSignal<ImmutableDictionary<string, ColumnSortState>>;
|
|
786
837
|
readonly bodyScrollElement: _angular_core.WritableSignal<HTMLElement | null>;
|
|
787
838
|
readonly bodyTableElement: _angular_core.WritableSignal<HTMLTableElement | null>;
|
|
839
|
+
readonly bulkSelectionRows: _angular_core.Signal<ImmutableSet<Row>>;
|
|
788
840
|
readonly cellEdit$: Subject<CellEditEvent>;
|
|
789
841
|
readonly cancel$: Subject<GridCancelEvent>;
|
|
790
842
|
/** Set of currently collapsed group keys (global, shared by both paginated and virtual list). */
|
|
@@ -795,6 +847,7 @@ declare class GridService {
|
|
|
795
847
|
readonly columns: _angular_core.WritableSignal<ImmutableList<Column>>;
|
|
796
848
|
readonly contextMenuItems: _angular_core.WritableSignal<ImmutableSet<PopupMenuItem>>;
|
|
797
849
|
readonly detailColumnWidth = 36;
|
|
850
|
+
readonly detailStructuralWidth: _angular_core.Signal<0 | 36>;
|
|
798
851
|
readonly editBaseDict: _angular_core.Signal<ImmutableDictionary<string, RowEditDataItem>>;
|
|
799
852
|
readonly editContext: _angular_core.Signal<GridEditContext | null>;
|
|
800
853
|
readonly edit$: Subject<GridEditEvent>;
|
|
@@ -811,6 +864,7 @@ declare class GridService {
|
|
|
811
864
|
readonly groupAggregateMap: _angular_core.Signal<ImmutableDictionary<string, GridGroupAggregate>>;
|
|
812
865
|
readonly groupColumnWidth = 36;
|
|
813
866
|
readonly groupColumns: _angular_core.Signal<ImmutableList<Column>>;
|
|
867
|
+
readonly groupStructuralWidth: _angular_core.Signal<number>;
|
|
814
868
|
readonly groupableOptions: _angular_core.WritableSignal<GroupableOptions>;
|
|
815
869
|
readonly hasLeftLockedColumns: _angular_core.Signal<boolean>;
|
|
816
870
|
readonly hasFooter: _angular_core.Signal<boolean>;
|
|
@@ -820,6 +874,9 @@ declare class GridService {
|
|
|
820
874
|
readonly isInEditMode: _angular_core.Signal<boolean>;
|
|
821
875
|
readonly leftLockedStructuralWidth: _angular_core.Signal<number>;
|
|
822
876
|
readonly lockedColumnStates: _angular_core.Signal<ReadonlyMap<string, GridLockedColumnState>>;
|
|
877
|
+
readonly leadingStructuralWidth: _angular_core.Signal<number>;
|
|
878
|
+
readonly leadingStructuralColumnCount: _angular_core.Signal<number>;
|
|
879
|
+
readonly leadingLogicalColumnCount: _angular_core.Signal<number>;
|
|
823
880
|
readonly masterDetailEmptyCellWidth: _angular_core.Signal<number>;
|
|
824
881
|
readonly masterDetailRowWidth: _angular_core.Signal<number>;
|
|
825
882
|
readonly masterDetailTemplate: _angular_core.WritableSignal<TemplateRef<unknown> | null>;
|
|
@@ -840,6 +897,11 @@ declare class GridService {
|
|
|
840
897
|
readonly selectedKeysChange$: rxjs.Observable<ImmutableSet<unknown>>;
|
|
841
898
|
readonly selectedKeysLoad$: BehaviorSubject<ImmutableSet<unknown>>;
|
|
842
899
|
readonly selectedRows: _angular_core.Signal<ImmutableSet<Row>>;
|
|
900
|
+
readonly selectionColumnWidth = 40;
|
|
901
|
+
readonly selectionColumnVisible: _angular_core.Signal<boolean>;
|
|
902
|
+
readonly selectionColumnOffset: _angular_core.Signal<number>;
|
|
903
|
+
readonly selectionStructuralWidth: _angular_core.Signal<0 | 40>;
|
|
904
|
+
readonly someBulkSelectionRowsSelected: _angular_core.Signal<boolean>;
|
|
843
905
|
readonly sortableOptions: _angular_core.WritableSignal<SortableOptions>;
|
|
844
906
|
readonly tableWidth: _angular_core.Signal<number | null>;
|
|
845
907
|
readonly viewPageRows: _angular_core.Signal<ImmutableSet<Row>>;
|
|
@@ -859,6 +921,7 @@ declare class GridService {
|
|
|
859
921
|
clearColumnGrouping(column: Column): void;
|
|
860
922
|
commitRowEdit(originalEvent?: Event): boolean;
|
|
861
923
|
deselectAllRows(): void;
|
|
924
|
+
deselectRow(row: Row): void;
|
|
862
925
|
findTextWidthOfColumn(column: Column, element: HTMLTableCellElement): number;
|
|
863
926
|
getColumnStateId(column: Column): string | null;
|
|
864
927
|
getColumnWidth(column: Column): number;
|
|
@@ -869,7 +932,6 @@ declare class GridService {
|
|
|
869
932
|
isGroupCollapsed(groupKey: string): boolean;
|
|
870
933
|
isRowExpanded(row: Row): boolean;
|
|
871
934
|
isRowSelected(row: Row): boolean;
|
|
872
|
-
isSelectableGrid(): boolean;
|
|
873
935
|
loadFilters(filters: CompositeFilterDescriptor[]): void;
|
|
874
936
|
loadGroupColumns(descriptors: Iterable<GroupDescriptor>): void;
|
|
875
937
|
loadSelectedKeys(selectedKeys: Iterable<unknown>): void;
|
|
@@ -882,6 +944,7 @@ declare class GridService {
|
|
|
882
944
|
resolveAggregateValue(bucket: GridAggregateBucket | null, aggregateFunction: AggregateFunction | null): unknown;
|
|
883
945
|
saveAddRow(originalEvent?: Event): boolean;
|
|
884
946
|
selectRow(row: Row): void;
|
|
947
|
+
setBulkSelection(selected: boolean): void;
|
|
885
948
|
setCalculatedWidth(columnId: string, value: number | null): void;
|
|
886
949
|
setCalculatedWidths(widthByColumnId: ReadonlyMap<string, number | null>): void;
|
|
887
950
|
setColumnDefinitions(configs: readonly ColumnConfig[]): void;
|
|
@@ -902,6 +965,7 @@ declare class GridService {
|
|
|
902
965
|
setRowExpanded(row: Row, expanded: boolean): void;
|
|
903
966
|
setRows(value: Iterable<Record<PropertyKey, unknown>>, rowKey?: GridKeySelector<unknown> | null): void;
|
|
904
967
|
setSelectableOptions(options: SelectableOptions): void;
|
|
968
|
+
setRowSelected(row: Row, selected: boolean): void;
|
|
905
969
|
setSortableOptions(options: Partial<SortableOptions>): void;
|
|
906
970
|
setScrollEndThreshold(threshold: number): void;
|
|
907
971
|
setVirtualScrollOptions(options: VirtualScrollOptions): void;
|
|
@@ -933,6 +997,7 @@ declare class GridService {
|
|
|
933
997
|
private measureFallbackScrollbarGutter;
|
|
934
998
|
private orderColumnsByLockBucket;
|
|
935
999
|
private reconcileColumn;
|
|
1000
|
+
private selectRowRange;
|
|
936
1001
|
private clearEditSession;
|
|
937
1002
|
private createEditSession;
|
|
938
1003
|
private patchSessionField;
|
|
@@ -1,121 +0,0 @@
|
|
|
1
|
-
import { NgTemplateOutlet } from '@angular/common';
|
|
2
|
-
import * as i0 from '@angular/core';
|
|
3
|
-
import { inject, DestroyRef, ElementRef, viewChild, computed, input, afterNextRender, Component } from '@angular/core';
|
|
4
|
-
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
5
|
-
import { ImmutableList, ImmutableSet, span } from '@mirei/ts-collections';
|
|
6
|
-
import { SlicePipe } from '@nanahoshi/mona-ui/common';
|
|
7
|
-
import { ContextMenuComponent } from '@nanahoshi/mona-ui/contextmenu';
|
|
8
|
-
import { fromEvent } from 'rxjs';
|
|
9
|
-
import { G as GridAddRowComponent, a as GridCellComponent, b as GridRowDirective, c as GridCellDirective, d as GridDetailRowDirective, e as GridDetailIndentCellDirective, f as GridDetailContentCellDirective, g as GridToggleComponent } from './nanahoshi-mona-ui-grid-grid-toggle.component-QDo6TweF.mjs';
|
|
10
|
-
import { GridFooterTableCellDirective } from './nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BkISJoqL.mjs';
|
|
11
|
-
import { G as GridNavigationService, a as GridRowFlattenerService, g as gridListBaseThemeVariants, b as gridFooterTableRowThemeVariants, c as GridService, d as gridGroupRowThemeVariants, e as gridListTableThemeVariants, f as GridLogicalCellDirective, h as GridLockedCellDirective } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-DWzYyGnb.mjs';
|
|
12
|
-
import { GridFooterCellComponent } from './nanahoshi-mona-ui-grid-grid-footer-cell.component-BbBPZj7t.mjs';
|
|
13
|
-
|
|
14
|
-
class GridListComponent {
|
|
15
|
-
#destroyRef;
|
|
16
|
-
#gridNavigationService;
|
|
17
|
-
#hostElementRef;
|
|
18
|
-
#rowFlattener;
|
|
19
|
-
constructor() {
|
|
20
|
-
this.#destroyRef = inject(DestroyRef);
|
|
21
|
-
this.#gridNavigationService = inject(GridNavigationService);
|
|
22
|
-
this.#hostElementRef = inject((ElementRef));
|
|
23
|
-
this.#rowFlattener = inject(GridRowFlattenerService);
|
|
24
|
-
this.bodyTableElementRef = viewChild.required("bodyTable", /* @ts-ignore */
|
|
25
|
-
...(ngDevMode ? [{ debugName: "bodyTableElementRef" }] : /* istanbul ignore next */ []));
|
|
26
|
-
this.baseClass = computed(() => {
|
|
27
|
-
return gridListBaseThemeVariants({ virtual: false });
|
|
28
|
-
}, /* @ts-ignore */
|
|
29
|
-
...(ngDevMode ? [{ debugName: "baseClass" }] : /* istanbul ignore next */ []));
|
|
30
|
-
this.flattenedGroupedRows = computed(() => {
|
|
31
|
-
const groupColumns = this.gridService.groupColumns();
|
|
32
|
-
if (groupColumns.length === 0) {
|
|
33
|
-
return [];
|
|
34
|
-
}
|
|
35
|
-
const collapsedKeys = new Set(this.gridService.collapsedGroupKeys());
|
|
36
|
-
const groupAggregateDict = this.gridService.groupAggregateMap().toDictionary(e => e.key, e => e.value);
|
|
37
|
-
const showFooter = this.gridService.groupableOptions().showFooter;
|
|
38
|
-
return this.#rowFlattener.flatten(this.data(), groupColumns, collapsedKeys, showFooter, groupAggregateDict);
|
|
39
|
-
}, /* @ts-ignore */
|
|
40
|
-
...(ngDevMode ? [{ debugName: "flattenedGroupedRows" }] : /* istanbul ignore next */ []));
|
|
41
|
-
this.footerTableRowClass = computed(() => {
|
|
42
|
-
return gridFooterTableRowThemeVariants();
|
|
43
|
-
}, /* @ts-ignore */
|
|
44
|
-
...(ngDevMode ? [{ debugName: "footerTableRowClass" }] : /* istanbul ignore next */ []));
|
|
45
|
-
this.gridService = inject(GridService);
|
|
46
|
-
this.groupRowClass = computed(() => {
|
|
47
|
-
return gridGroupRowThemeVariants();
|
|
48
|
-
}, /* @ts-ignore */
|
|
49
|
-
...(ngDevMode ? [{ debugName: "groupRowClass" }] : /* istanbul ignore next */ []));
|
|
50
|
-
this.tableClass = computed(() => {
|
|
51
|
-
return gridListTableThemeVariants();
|
|
52
|
-
}, /* @ts-ignore */
|
|
53
|
-
...(ngDevMode ? [{ debugName: "tableClass" }] : /* istanbul ignore next */ []));
|
|
54
|
-
this.columns = input(ImmutableList.create(), /* @ts-ignore */
|
|
55
|
-
...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
|
|
56
|
-
this.data = input(ImmutableSet.create(), /* @ts-ignore */
|
|
57
|
-
...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
|
|
58
|
-
this.span = span;
|
|
59
|
-
afterNextRender({
|
|
60
|
-
read: () => {
|
|
61
|
-
const bodyTableElement = this.bodyTableElementRef().nativeElement;
|
|
62
|
-
const bodyScrollElement = this.#hostElementRef.nativeElement;
|
|
63
|
-
this.gridService.bodyTableElement.set(bodyTableElement);
|
|
64
|
-
this.gridService.bodyScrollElement.set(bodyScrollElement);
|
|
65
|
-
this.setSubscriptions();
|
|
66
|
-
this.#destroyRef.onDestroy(() => {
|
|
67
|
-
if (this.gridService.bodyTableElement() === bodyTableElement) {
|
|
68
|
-
this.gridService.bodyTableElement.set(null);
|
|
69
|
-
}
|
|
70
|
-
if (this.gridService.bodyScrollElement() === bodyScrollElement) {
|
|
71
|
-
this.gridService.bodyScrollElement.set(null);
|
|
72
|
-
}
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
onGridRowClick(event, row) {
|
|
78
|
-
this.gridService.handleRowClick(event, row);
|
|
79
|
-
}
|
|
80
|
-
onGroupExpandChange(groupKey) {
|
|
81
|
-
this.gridService.toggleGroupCollapse(groupKey);
|
|
82
|
-
}
|
|
83
|
-
onToggleDetailClick(row) {
|
|
84
|
-
const expanded = this.gridService.isRowExpanded(row);
|
|
85
|
-
this.gridService.setRowExpanded(row, !expanded);
|
|
86
|
-
}
|
|
87
|
-
setSubscriptions() {
|
|
88
|
-
fromEvent(this.#hostElementRef.nativeElement, "focus")
|
|
89
|
-
.pipe(takeUntilDestroyed(this.#destroyRef))
|
|
90
|
-
.subscribe(() => {
|
|
91
|
-
this.#gridNavigationService.focusActiveCellOrFirstHeader();
|
|
92
|
-
});
|
|
93
|
-
}
|
|
94
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: GridListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
95
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: GridListComponent, isStandalone: true, selector: "mona-grid-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "baseClass()" } }, viewQueries: [{ propertyName: "bodyTableElementRef", first: true, predicate: ["bodyTable"], descendants: true, isSignal: true }], ngImport: i0, template: "<table #bodyTable [class]=\"tableClass()\" [style.width.px]=\"gridService.tableWidth()\">\n <colgroup>\n @for (_ of gridService.groupColumns(); track $index) {\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\n }\n @if (gridService.masterDetailTemplate()) {\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\n }\n @for (col of columns(); track $index) {\n <col [style.width.px]=\"col.calculatedWidth\" />\n }\n </colgroup>\n <tbody role=\"rowgroup\">\n @if (gridService.addRowVisible()) {\n <tr monaGridAddRow [columns]=\"columns()\"></tr>\n }\n @if (gridService.groupColumns().length === 0) {\n @for (row of data(); track row.uid) {\n @let rowIndex = $index;\n <tr\n (click)=\"onGridRowClick($event, row)\"\n monaGridRow\n [index]=\"rowIndex\"\n [row]=\"row\"\n #gridRow=\"monaGridRow\"\n #rowElement>\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"0\"\n [masterDetailToggle]=\"true\"\n monaGridLogicalCell\n [cellKind]=\"'detail'\"\n [colIndex]=\"0\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"row.uid\"\n [section]=\"'body'\"\n [style.width.px]=\"gridService.detailColumnWidth\"\n [attr.colspan]=\"1\">\n <span class=\"flex h-full w-full items-stretch justify-center\">\n <mona-grid-toggle\n [expanded]=\"gridRow.expanded()\"\n [type]=\"'detail'\"\n [width]=\"gridService.detailColumnWidth\"\n (expandedChange)=\"onToggleDetailClick(row)\"></mona-grid-toggle>\n </span>\n </td>\n }\n @for (column of columns(); track $index) {\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\n <td\n monaGridCell\n monaGridLockedCell\n [column]=\"column\"\n [dataCell]=\"true\"\n monaGridLogicalCell\n [cellKind]=\"column.kind\"\n [colIndex]=\"colIndex\"\n [columnId]=\"column.id\"\n [editable]=\"\n gridService.editableOptions().enabled === true &&\n gridService.editableOptions().mode === 'cell' &&\n column.kind === 'data' &&\n column.editable === true\n \"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"row.uid\"\n [section]=\"'body'\"\n [firstInRow]=\"colIndex === 0\"\n [lastInRow]=\"colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"column.calculatedWidth\"\n [style.min-width.px]=\"column.minWidth\"\n (edit)=\"gridCell.handleLogicalCellEnter()\">\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"row\"></mona-grid-cell>\n </td>\n }\n @if (gridService.contextMenuItems().length !== 0) {\n <ng-container\n [ngTemplateOutlet]=\"contextMenuTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: row.data, element: rowElement, index: $index }\">\n </ng-container>\n }\n </tr>\n @if (gridRow.expanded()) {\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\n <td\n monaGridCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"0\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\n <td monaGridCell [masterDetailContent]=\"true\" [attr.colspan]=\"columns().length\">\n <ng-container\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: row.data }\"></ng-container>\n </td>\n </tr>\n }\n }\n } @else {\n @for (viewRow of flattenedGroupedRows(); track $index) {\n @let rowIndex = $index;\n @if (viewRow.type === \"group\") {\n @let isCollapsed = gridService.isGroupCollapsed(viewRow.groupKey);\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\n\n <tr\n [class]=\"groupRowClass()\"\n role=\"row\"\n [attr.aria-level]=\"viewRow.depth + 1\"\n [attr.aria-expanded]=\"!isCollapsed\">\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth; track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n @let colspan =\n columns().length +\n gridService.groupColumns().length +\n (gridService.masterDetailTemplate() ? 1 : 0) -\n viewRow.depth +\n 1;\n\n <td\n monaGridCell\n monaGridLogicalCell\n [cellKind]=\"'group'\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"0\"\n [section]=\"'body'\"\n [grouped]=\"true\"\n [groupHeader]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [groupKey]=\"viewRow.groupKey\"\n (toggle)=\"onGroupExpandChange(viewRow.groupKey)\"\n [attr.colspan]=\"colspan\">\n <p class=\"flex h-full items-center text-sm whitespace-nowrap\">\n <mona-grid-toggle\n [expanded]=\"!isCollapsed\"\n [width]=\"gridService.groupColumnWidth\"\n [type]=\"'group'\"\n (expandedChange)=\"onGroupExpandChange(viewRow.groupKey)\"></mona-grid-toggle>\n <span class=\"font-bold\">{{ viewRow.title }}: {{ viewRow.groupValue }}</span>\n </p>\n </td>\n </tr>\n } @else if (viewRow.type === \"groupFooter\") {\n <tr role=\"row\" [class]=\"footerTableRowClass()\">\n @for (_ of gridService.groupColumns(); track $index) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [footerCellWidth]=\"gridService.groupColumnWidth\"></td>\n }\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"\n gridService.groupColumns().length * gridService.groupColumnWidth\n \"\n [footerCellWidth]=\"gridService.detailColumnWidth\"></td>\n }\n @for (column of columns(); track $index) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [column]=\"column\"\n [lockedCellHeader]=\"true\"\n [footerColumn]=\"column\">\n <mona-grid-footer-cell\n [column]=\"column\"\n [columnIndex]=\"$index\"\n [groupKey]=\"viewRow.groupAggregate.groupKey\"></mona-grid-footer-cell>\n </td>\n }\n </tr>\n } @else {\n @let nextRow = flattenedGroupedRows()[rowIndex + 1];\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\n <tr\n (click)=\"onGridRowClick($event, viewRow.row)\"\n monaGridRow\n [index]=\"rowIndex\"\n [row]=\"viewRow.row\"\n #gridRow=\"monaGridRow\"\n #rowElement>\n @for (_ of gridService.groupColumns(); track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridCell\n monaGridLogicalCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"\n gridService.groupColumns().length * gridService.groupColumnWidth\n \"\n [grouped]=\"true\"\n [masterDetailToggle]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [nextRowType]=\"nextRow?.type\"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"viewRow.row.uid\"\n [section]=\"'body'\"\n [cellKind]=\"'detail'\"\n [colIndex]=\"0\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [style.width.px]=\"gridService.detailColumnWidth\">\n <span class=\"flex h-full w-full items-stretch justify-center\">\n <mona-grid-toggle\n [expanded]=\"gridRow.expanded()\"\n [type]=\"'detail'\"\n [width]=\"gridService.detailColumnWidth\"\n (expandedChange)=\"onToggleDetailClick(viewRow.row)\"></mona-grid-toggle>\n </span>\n </td>\n }\n @for (column of columns(); track $index) {\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\n <td\n monaGridCell\n monaGridLockedCell\n [column]=\"column\"\n [grouped]=\"true\"\n [dataCell]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [nextRowType]=\"nextRow?.type\"\n monaGridLogicalCell\n [cellKind]=\"column.kind\"\n [colIndex]=\"colIndex\"\n [columnId]=\"column.id\"\n [editable]=\"\n gridService.editableOptions().enabled === true &&\n gridService.editableOptions().mode === 'cell' &&\n column.kind === 'data' &&\n column.editable === true\n \"\n [firstInRow]=\"colIndex === 0\"\n [lastInRow]=\"\n colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\n \"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"viewRow.row.uid\"\n [section]=\"'body'\"\n [style.width.px]=\"column.calculatedWidth\"\n [style.min-width.px]=\"column.minWidth\"\n (edit)=\"gridCell.handleLogicalCellEnter()\">\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"viewRow.row\"></mona-grid-cell>\n </td>\n }\n @if (gridService.contextMenuItems().length !== 0) {\n <ng-container\n [ngTemplateOutlet]=\"contextMenuTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: viewRow.row.data,\n element: rowElement,\n index: rowIndex\n }\">\n </ng-container>\n }\n </tr>\n @if (gridRow.expanded()) {\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth + 1; track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n @let colspan = columns().length + gridService.groupColumns().length - 1;\n <td\n monaGridDetailIndentCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"(viewRow.depth + 1) * gridService.groupColumnWidth\"\n [nextRowType]=\"nextRow?.type\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\n <td monaGridDetailContentCell [nextRowType]=\"nextRow?.type\" [attr.colspan]=\"colspan\">\n <ng-container\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: viewRow.row.data }\"></ng-container>\n </td>\n </tr>\n }\n }\n }\n }\n </tbody>\n</table>\n\n<ng-template let-rowData let-element=\"element\" let-rowIndex=\"index\" #contextMenuTemplate>\n <mona-contextmenu [target]=\"element\" [items]=\"gridService.contextMenuItems()\"></mona-contextmenu>\n <!-- [context]=\"{rowData, element, rowIndex}\"-->\n</ng-template>\n", dependencies: [{ kind: "component", type: GridAddRowComponent, selector: "tr[monaGridAddRow]", inputs: ["columns"] }, { kind: "component", type: GridCellComponent, selector: "mona-grid-cell", inputs: ["column", "row"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ContextMenuComponent, selector: "mona-contextmenu", inputs: ["ariaLabel", "items", "minWidth", "rounded", "size", "target", "width"], outputs: ["menuClick"] }, { kind: "directive", type: GridRowDirective, selector: "tr[monaGridRow]", inputs: ["index", "row"], exportAs: ["monaGridRow"] }, { kind: "directive", type: GridCellDirective, selector: "td[monaGridCell]", inputs: ["dataCell", "groupHeader", "groupToggle", "grouped", "indentCell", "lastInRow", "masterDetailContent", "masterDetailToggle", "nextRowType", "prevRowType"] }, { kind: "directive", type: GridDetailRowDirective, selector: "tr[monaGridDetailRow]" }, { kind: "directive", type: GridDetailIndentCellDirective, selector: "td[monaGridDetailIndentCell]", inputs: ["nextRowType"] }, { kind: "directive", type: GridDetailContentCellDirective, selector: "td[monaGridDetailContentCell]", inputs: ["nextRowType"] }, { kind: "component", type: GridToggleComponent, selector: "mona-grid-toggle", inputs: ["expanded", "type", "width"], outputs: ["expandedChange"] }, { kind: "directive", type: GridFooterTableCellDirective, selector: "td[monaGridFooterTableCell]", inputs: ["footerCellMinWidth", "footerCellWidth", "footerColumn"] }, { kind: "directive", type: GridLogicalCellDirective, selector: "td[monaGridLogicalCell], th[monaGridLogicalCell]", inputs: ["cellKind", "colIndex", "columnId", "editable", "firstInRow", "groupHeader", "groupKey", "lastInRow", "rowIndex", "rowUid", "section"], outputs: ["edit", "toggle"] }, { kind: "directive", type: GridLockedCellDirective, selector: "td[monaGridLockedCell], th[monaGridLockedCell]", inputs: ["column", "lockedCellHeader", "lockedStructuralOffset"] }, { kind: "component", type: GridFooterCellComponent, selector: "mona-grid-footer-cell", inputs: ["column", "columnIndex", "groupKey"] }, { kind: "pipe", type: SlicePipe, name: "monaSlice" }] }); }
|
|
96
|
-
}
|
|
97
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: GridListComponent, decorators: [{
|
|
98
|
-
type: Component,
|
|
99
|
-
args: [{ selector: "mona-grid-list", imports: [
|
|
100
|
-
GridAddRowComponent,
|
|
101
|
-
GridCellComponent,
|
|
102
|
-
NgTemplateOutlet,
|
|
103
|
-
ContextMenuComponent,
|
|
104
|
-
GridRowDirective,
|
|
105
|
-
GridCellDirective,
|
|
106
|
-
GridDetailRowDirective,
|
|
107
|
-
GridDetailIndentCellDirective,
|
|
108
|
-
GridDetailContentCellDirective,
|
|
109
|
-
SlicePipe,
|
|
110
|
-
GridToggleComponent,
|
|
111
|
-
GridFooterTableCellDirective,
|
|
112
|
-
GridLogicalCellDirective,
|
|
113
|
-
GridLockedCellDirective,
|
|
114
|
-
GridFooterCellComponent
|
|
115
|
-
], host: {
|
|
116
|
-
"[class]": "baseClass()"
|
|
117
|
-
}, template: "<table #bodyTable [class]=\"tableClass()\" [style.width.px]=\"gridService.tableWidth()\">\n <colgroup>\n @for (_ of gridService.groupColumns(); track $index) {\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\n }\n @if (gridService.masterDetailTemplate()) {\n <col [style.width.px]=\"gridService.groupColumnWidth\" />\n }\n @for (col of columns(); track $index) {\n <col [style.width.px]=\"col.calculatedWidth\" />\n }\n </colgroup>\n <tbody role=\"rowgroup\">\n @if (gridService.addRowVisible()) {\n <tr monaGridAddRow [columns]=\"columns()\"></tr>\n }\n @if (gridService.groupColumns().length === 0) {\n @for (row of data(); track row.uid) {\n @let rowIndex = $index;\n <tr\n (click)=\"onGridRowClick($event, row)\"\n monaGridRow\n [index]=\"rowIndex\"\n [row]=\"row\"\n #gridRow=\"monaGridRow\"\n #rowElement>\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"0\"\n [masterDetailToggle]=\"true\"\n monaGridLogicalCell\n [cellKind]=\"'detail'\"\n [colIndex]=\"0\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"row.uid\"\n [section]=\"'body'\"\n [style.width.px]=\"gridService.detailColumnWidth\"\n [attr.colspan]=\"1\">\n <span class=\"flex h-full w-full items-stretch justify-center\">\n <mona-grid-toggle\n [expanded]=\"gridRow.expanded()\"\n [type]=\"'detail'\"\n [width]=\"gridService.detailColumnWidth\"\n (expandedChange)=\"onToggleDetailClick(row)\"></mona-grid-toggle>\n </span>\n </td>\n }\n @for (column of columns(); track $index) {\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\n <td\n monaGridCell\n monaGridLockedCell\n [column]=\"column\"\n [dataCell]=\"true\"\n monaGridLogicalCell\n [cellKind]=\"column.kind\"\n [colIndex]=\"colIndex\"\n [columnId]=\"column.id\"\n [editable]=\"\n gridService.editableOptions().enabled === true &&\n gridService.editableOptions().mode === 'cell' &&\n column.kind === 'data' &&\n column.editable === true\n \"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"row.uid\"\n [section]=\"'body'\"\n [firstInRow]=\"colIndex === 0\"\n [lastInRow]=\"colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"column.calculatedWidth\"\n [style.min-width.px]=\"column.minWidth\"\n (edit)=\"gridCell.handleLogicalCellEnter()\">\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"row\"></mona-grid-cell>\n </td>\n }\n @if (gridService.contextMenuItems().length !== 0) {\n <ng-container\n [ngTemplateOutlet]=\"contextMenuTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: row.data, element: rowElement, index: $index }\">\n </ng-container>\n }\n </tr>\n @if (gridRow.expanded()) {\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\n <td\n monaGridCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"0\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\n <td monaGridCell [masterDetailContent]=\"true\" [attr.colspan]=\"columns().length\">\n <ng-container\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: row.data }\"></ng-container>\n </td>\n </tr>\n }\n }\n } @else {\n @for (viewRow of flattenedGroupedRows(); track $index) {\n @let rowIndex = $index;\n @if (viewRow.type === \"group\") {\n @let isCollapsed = gridService.isGroupCollapsed(viewRow.groupKey);\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\n\n <tr\n [class]=\"groupRowClass()\"\n role=\"row\"\n [attr.aria-level]=\"viewRow.depth + 1\"\n [attr.aria-expanded]=\"!isCollapsed\">\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth; track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n @let colspan =\n columns().length +\n gridService.groupColumns().length +\n (gridService.masterDetailTemplate() ? 1 : 0) -\n viewRow.depth +\n 1;\n\n <td\n monaGridCell\n monaGridLogicalCell\n [cellKind]=\"'group'\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"0\"\n [section]=\"'body'\"\n [grouped]=\"true\"\n [groupHeader]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [groupKey]=\"viewRow.groupKey\"\n (toggle)=\"onGroupExpandChange(viewRow.groupKey)\"\n [attr.colspan]=\"colspan\">\n <p class=\"flex h-full items-center text-sm whitespace-nowrap\">\n <mona-grid-toggle\n [expanded]=\"!isCollapsed\"\n [width]=\"gridService.groupColumnWidth\"\n [type]=\"'group'\"\n (expandedChange)=\"onGroupExpandChange(viewRow.groupKey)\"></mona-grid-toggle>\n <span class=\"font-bold\">{{ viewRow.title }}: {{ viewRow.groupValue }}</span>\n </p>\n </td>\n </tr>\n } @else if (viewRow.type === \"groupFooter\") {\n <tr role=\"row\" [class]=\"footerTableRowClass()\">\n @for (_ of gridService.groupColumns(); track $index) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [footerCellWidth]=\"gridService.groupColumnWidth\"></td>\n }\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"\n gridService.groupColumns().length * gridService.groupColumnWidth\n \"\n [footerCellWidth]=\"gridService.detailColumnWidth\"></td>\n }\n @for (column of columns(); track $index) {\n <td\n monaGridFooterTableCell\n monaGridLockedCell\n [column]=\"column\"\n [lockedCellHeader]=\"true\"\n [footerColumn]=\"column\">\n <mona-grid-footer-cell\n [column]=\"column\"\n [columnIndex]=\"$index\"\n [groupKey]=\"viewRow.groupAggregate.groupKey\"></mona-grid-footer-cell>\n </td>\n }\n </tr>\n } @else {\n @let nextRow = flattenedGroupedRows()[rowIndex + 1];\n @let prevRow = flattenedGroupedRows()[rowIndex - 1];\n <tr\n (click)=\"onGridRowClick($event, viewRow.row)\"\n monaGridRow\n [index]=\"rowIndex\"\n [row]=\"viewRow.row\"\n #gridRow=\"monaGridRow\"\n #rowElement>\n @for (_ of gridService.groupColumns(); track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n\n @if (gridService.masterDetailTemplate()) {\n <td\n monaGridCell\n monaGridLogicalCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"\n gridService.groupColumns().length * gridService.groupColumnWidth\n \"\n [grouped]=\"true\"\n [masterDetailToggle]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [nextRowType]=\"nextRow?.type\"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"viewRow.row.uid\"\n [section]=\"'body'\"\n [cellKind]=\"'detail'\"\n [colIndex]=\"0\"\n [firstInRow]=\"true\"\n [lastInRow]=\"columns().length === 0\"\n [style.width.px]=\"gridService.detailColumnWidth\">\n <span class=\"flex h-full w-full items-stretch justify-center\">\n <mona-grid-toggle\n [expanded]=\"gridRow.expanded()\"\n [type]=\"'detail'\"\n [width]=\"gridService.detailColumnWidth\"\n (expandedChange)=\"onToggleDetailClick(viewRow.row)\"></mona-grid-toggle>\n </span>\n </td>\n }\n @for (column of columns(); track $index) {\n @let colIndex = gridService.masterDetailTemplate() ? $index + 1 : $index;\n <td\n monaGridCell\n monaGridLockedCell\n [column]=\"column\"\n [grouped]=\"true\"\n [dataCell]=\"true\"\n [prevRowType]=\"prevRow?.type\"\n [nextRowType]=\"nextRow?.type\"\n monaGridLogicalCell\n [cellKind]=\"column.kind\"\n [colIndex]=\"colIndex\"\n [columnId]=\"column.id\"\n [editable]=\"\n gridService.editableOptions().enabled === true &&\n gridService.editableOptions().mode === 'cell' &&\n column.kind === 'data' &&\n column.editable === true\n \"\n [firstInRow]=\"colIndex === 0\"\n [lastInRow]=\"\n colIndex === columns().length - (gridService.masterDetailTemplate() ? 0 : 1)\n \"\n [rowIndex]=\"rowIndex\"\n [rowUid]=\"viewRow.row.uid\"\n [section]=\"'body'\"\n [style.width.px]=\"column.calculatedWidth\"\n [style.min-width.px]=\"column.minWidth\"\n (edit)=\"gridCell.handleLogicalCellEnter()\">\n <mona-grid-cell #gridCell [column]=\"column\" [row]=\"viewRow.row\"></mona-grid-cell>\n </td>\n }\n @if (gridService.contextMenuItems().length !== 0) {\n <ng-container\n [ngTemplateOutlet]=\"contextMenuTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: viewRow.row.data,\n element: rowElement,\n index: rowIndex\n }\">\n </ng-container>\n }\n </tr>\n @if (gridRow.expanded()) {\n <tr monaGridDetailRow [style.width.px]=\"gridService.masterDetailRowWidth()\">\n @for (_ of gridService.groupColumns() | monaSlice: 0 : viewRow.depth + 1; track $index) {\n <td\n monaGridCell\n monaGridLockedCell\n [lockedCellHeader]=\"true\"\n [lockedStructuralOffset]=\"$index * gridService.groupColumnWidth\"\n [grouped]=\"true\"\n [indentCell]=\"true\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.groupColumnWidth\"></td>\n }\n @let colspan = columns().length + gridService.groupColumns().length - 1;\n <td\n monaGridDetailIndentCell\n monaGridLockedCell\n [lockedStructuralOffset]=\"(viewRow.depth + 1) * gridService.groupColumnWidth\"\n [nextRowType]=\"nextRow?.type\"\n [attr.colspan]=\"1\"\n [style.width.px]=\"gridService.masterDetailEmptyCellWidth()\"></td>\n <td monaGridDetailContentCell [nextRowType]=\"nextRow?.type\" [attr.colspan]=\"colspan\">\n <ng-container\n [ngTemplateOutlet]=\"gridService.masterDetailTemplate()\"\n [ngTemplateOutletContext]=\"{ $implicit: viewRow.row.data }\"></ng-container>\n </td>\n </tr>\n }\n }\n }\n }\n </tbody>\n</table>\n\n<ng-template let-rowData let-element=\"element\" let-rowIndex=\"index\" #contextMenuTemplate>\n <mona-contextmenu [target]=\"element\" [items]=\"gridService.contextMenuItems()\"></mona-contextmenu>\n <!-- [context]=\"{rowData, element, rowIndex}\"-->\n</ng-template>\n" }]
|
|
118
|
-
}], ctorParameters: () => [], propDecorators: { bodyTableElementRef: [{ type: i0.ViewChild, args: ["bodyTable", { isSignal: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }] } });
|
|
119
|
-
|
|
120
|
-
export { GridListComponent };
|
|
121
|
-
//# sourceMappingURL=nanahoshi-mona-ui-grid-grid-list.component-DReEfWfG.mjs.map
|