@gp-grid/angular 0.13.2 → 0.15.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/dist/styles.css
CHANGED
|
@@ -1098,6 +1098,7 @@ const GP_GRID_TEMPLATE = `
|
|
|
1098
1098
|
style="width: 100%; height: 100%; display: flex; flex-direction: column; position: relative; outline: none;"
|
|
1099
1099
|
tabindex="0"
|
|
1100
1100
|
(keydown)="onKeyDown($event)"
|
|
1101
|
+
(paste)="onPaste($event)"
|
|
1101
1102
|
(wheel)="onWheel($event)"
|
|
1102
1103
|
>
|
|
1103
1104
|
<gp-grid-header
|
|
@@ -1207,6 +1208,7 @@ class GpGridViewModel {
|
|
|
1207
1208
|
contentHeight = signal(0, ...(ngDevMode ? [{ debugName: "contentHeight" }] : /* istanbul ignore next */ []));
|
|
1208
1209
|
rowsWrapperOffset = signal(0, ...(ngDevMode ? [{ debugName: "rowsWrapperOffset" }] : /* istanbul ignore next */ []));
|
|
1209
1210
|
slots = signal(new Map(), ...(ngDevMode ? [{ debugName: "slots" }] : /* istanbul ignore next */ []));
|
|
1211
|
+
totalRows = signal(0, ...(ngDevMode ? [{ debugName: "totalRows" }] : /* istanbul ignore next */ []));
|
|
1210
1212
|
effectiveColumns;
|
|
1211
1213
|
visibleColumnWithIndices;
|
|
1212
1214
|
columnPositions;
|
|
@@ -1214,7 +1216,6 @@ class GpGridViewModel {
|
|
|
1214
1216
|
totalWidth;
|
|
1215
1217
|
fillHandlePosition;
|
|
1216
1218
|
slotsArray;
|
|
1217
|
-
totalRows;
|
|
1218
1219
|
batchSetters;
|
|
1219
1220
|
filterAnchorEl = null;
|
|
1220
1221
|
constructor(deps) {
|
|
@@ -1237,13 +1238,13 @@ class GpGridViewModel {
|
|
|
1237
1238
|
rowHeight: deps.getRowHeight(),
|
|
1238
1239
|
}), ...(ngDevMode ? [{ debugName: "fillHandlePosition" }] : /* istanbul ignore next */ []));
|
|
1239
1240
|
this.slotsArray = computed(() => [...this.slots().values()], ...(ngDevMode ? [{ debugName: "slotsArray" }] : /* istanbul ignore next */ []));
|
|
1240
|
-
this.totalRows = computed(() => deps.getRows().length, ...(ngDevMode ? [{ debugName: "totalRows" }] : /* istanbul ignore next */ []));
|
|
1241
1241
|
this.batchSetters = {
|
|
1242
1242
|
setContentWidth: (v) => this.contentWidth.set(v),
|
|
1243
1243
|
setContentHeight: (v) => this.contentHeight.set(v),
|
|
1244
1244
|
setRowsWrapperOffset: (v) => this.rowsWrapperOffset.set(v),
|
|
1245
1245
|
setIsLoading: (v) => this.isLoading.set(v),
|
|
1246
1246
|
setErrorMessage: (v) => this.errorMessage.set(v),
|
|
1247
|
+
setTotalRows: (v) => this.totalRows.set(v),
|
|
1247
1248
|
setPendingScrollTop: (v) => this.pendingScrollTop.set(v),
|
|
1248
1249
|
setActiveCell: (v) => this.activeCell.set(v),
|
|
1249
1250
|
setSelectionRange: (v) => this.selectionRange.set(v),
|
|
@@ -1390,6 +1391,7 @@ const buildGridCore = (inputs, emitters) => {
|
|
|
1390
1391
|
rowHeight: inputs.rowHeight,
|
|
1391
1392
|
headerHeight: inputs.headerHeight,
|
|
1392
1393
|
overscan: inputs.overscan,
|
|
1394
|
+
rowLoading: inputs.rowLoading,
|
|
1393
1395
|
sortingEnabled: inputs.sortingEnabled,
|
|
1394
1396
|
highlighting: inputs.highlighting,
|
|
1395
1397
|
getRowId: inputs.getRowId,
|
|
@@ -1421,6 +1423,7 @@ class GpGridComponent {
|
|
|
1421
1423
|
highlighting = input(null, ...(ngDevMode ? [{ debugName: "highlighting" }] : /* istanbul ignore next */ []));
|
|
1422
1424
|
rowDragEntireRow = input(false, ...(ngDevMode ? [{ debugName: "rowDragEntireRow" }] : /* istanbul ignore next */ []));
|
|
1423
1425
|
overscan = input(3, ...(ngDevMode ? [{ debugName: "overscan" }] : /* istanbul ignore next */ []));
|
|
1426
|
+
rowLoading = input(null, ...(ngDevMode ? [{ debugName: "rowLoading" }] : /* istanbul ignore next */ []));
|
|
1424
1427
|
sortingEnabled = input(true, ...(ngDevMode ? [{ debugName: "sortingEnabled" }] : /* istanbul ignore next */ []));
|
|
1425
1428
|
wheelDampening = input(0.1, ...(ngDevMode ? [{ debugName: "wheelDampening" }] : /* istanbul ignore next */ []));
|
|
1426
1429
|
onRowDragEnd = output();
|
|
@@ -1453,6 +1456,7 @@ class GpGridComponent {
|
|
|
1453
1456
|
rowHeight: this.rowHeight(),
|
|
1454
1457
|
headerHeight: this.headerHeight(),
|
|
1455
1458
|
overscan: this.overscan(),
|
|
1459
|
+
rowLoading: this.rowLoading() ?? undefined,
|
|
1456
1460
|
sortingEnabled: this.sortingEnabled(),
|
|
1457
1461
|
highlighting: (this.highlighting() ?? undefined),
|
|
1458
1462
|
getRowId: this.getRowId() ?? undefined,
|
|
@@ -1560,6 +1564,12 @@ class GpGridComponent {
|
|
|
1560
1564
|
if (result.scrollToCell)
|
|
1561
1565
|
this.bindings.scrollToRow(result.scrollToCell.row);
|
|
1562
1566
|
}
|
|
1567
|
+
onPaste(event) {
|
|
1568
|
+
const editing = this.vm.editingCell();
|
|
1569
|
+
const handled = this.bindings.input.pasteText(event.clipboardData?.getData('text/plain') ?? '', editing === null ? null : { row: editing.row, col: editing.col }, this.vm.filterPopup() !== null);
|
|
1570
|
+
if (handled)
|
|
1571
|
+
event.preventDefault();
|
|
1572
|
+
}
|
|
1563
1573
|
onResizePointerDown(evt) {
|
|
1564
1574
|
if (this.bindings.input.resizePointerDown(evt.colIndex, evt.colWidth, evt.event)) {
|
|
1565
1575
|
evt.event.preventDefault();
|
|
@@ -1583,7 +1593,7 @@ class GpGridComponent {
|
|
|
1583
1593
|
this.bindings.pendingRowDrag.releaseLocks();
|
|
1584
1594
|
};
|
|
1585
1595
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: GpGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1586
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.7", type: GpGridComponent, isStandalone: true, selector: "gp-grid", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, getRowId: { classPropertyName: "getRowId", publicName: "getRowId", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, headerHeight: { classPropertyName: "headerHeight", publicName: "headerHeight", isSignal: true, isRequired: false, transformFunction: null }, darkMode: { classPropertyName: "darkMode", publicName: "darkMode", isSignal: true, isRequired: false, transformFunction: null }, cellRenderers: { classPropertyName: "cellRenderers", publicName: "cellRenderers", isSignal: true, isRequired: false, transformFunction: null }, headerRenderers: { classPropertyName: "headerRenderers", publicName: "headerRenderers", isSignal: true, isRequired: false, transformFunction: null }, editRenderers: { classPropertyName: "editRenderers", publicName: "editRenderers", isSignal: true, isRequired: false, transformFunction: null }, cellRenderer: { classPropertyName: "cellRenderer", publicName: "cellRenderer", isSignal: true, isRequired: false, transformFunction: null }, headerRenderer: { classPropertyName: "headerRenderer", publicName: "headerRenderer", isSignal: true, isRequired: false, transformFunction: null }, editRenderer: { classPropertyName: "editRenderer", publicName: "editRenderer", isSignal: true, isRequired: false, transformFunction: null }, highlighting: { classPropertyName: "highlighting", publicName: "highlighting", isSignal: true, isRequired: false, transformFunction: null }, rowDragEntireRow: { classPropertyName: "rowDragEntireRow", publicName: "rowDragEntireRow", isSignal: true, isRequired: false, transformFunction: null }, overscan: { classPropertyName: "overscan", publicName: "overscan", isSignal: true, isRequired: false, transformFunction: null }, sortingEnabled: { classPropertyName: "sortingEnabled", publicName: "sortingEnabled", isSignal: true, isRequired: false, transformFunction: null }, wheelDampening: { classPropertyName: "wheelDampening", publicName: "wheelDampening", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onRowDragEnd: "onRowDragEnd", onCellValueChanged: "onCellValueChanged", onColumnResized: "onColumnResized", onColumnMoved: "onColumnMoved" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "body", first: true, predicate: GridBodyComponent, descendants: true }], ngImport: i0, template: "\n <div #container\n [class]=\"'gp-grid-container' + (darkMode() ? ' gp-grid-container--dark' : '')\"\n style=\"width: 100%; height: 100%; display: flex; flex-direction: column; position: relative; outline: none;\"\n tabindex=\"0\"\n (keydown)=\"onKeyDown($event)\"\n (wheel)=\"onWheel($event)\"\n >\n <gp-grid-header\n [headerHeight]=\"headerHeight()\"\n [scrollLeft]=\"vm.scrollLeft()\"\n [contentWidth]=\"vm.contentWidth()\"\n [totalWidth]=\"vm.totalWidth()\"\n [isLoading]=\"vm.isLoading()\"\n [visibleColumnsWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [columnWidths]=\"vm.columnWidths()\"\n [headers]=\"vm.headerState()\"\n [sortingEnabled]=\"sortingEnabled()\"\n [headerRenderers]=\"headerRenderers()\"\n [globalHeaderRenderer]=\"headerRenderer()\"\n (headerPointerDown)=\"onHeaderPointerDown($event)\"\n (filterPointerDown)=\"onFilterPointerDown($event)\"\n (resizePointerDown)=\"onResizePointerDown($event)\"\n (headerSort)=\"onHeaderSort($event)\"\n />\n <gp-grid-body\n [rowHeight]=\"rowHeight()\"\n [totalHeaderHeight]=\"headerHeight()\"\n [contentWidth]=\"vm.contentWidth()\"\n [contentHeight]=\"vm.contentHeight()\"\n [totalWidth]=\"vm.totalWidth()\"\n [rowsWrapperOffset]=\"vm.rowsWrapperOffset()\"\n [slotsArray]=\"vm.slotsArray()\"\n [visibleColumnWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [columnWidths]=\"vm.columnWidths()\"\n [totalRows]=\"vm.totalRows()\"\n [activeCell]=\"vm.activeCell()\"\n [selectionRange]=\"vm.selectionRange()\"\n [editingCell]=\"vm.editingCell()\"\n [cellRenderers]=\"cellRenderers()\"\n [globalCellRenderer]=\"cellRenderer()\"\n [editRenderers]=\"editRenderers()\"\n [globalEditRenderer]=\"editRenderer()\"\n [hoverPosition]=\"vm.hoverPosition()\"\n [computeRowClasses]=\"computeRowClassesFn\"\n [computeCellClasses]=\"computeCellClassesFn\"\n [fillHandlePosition]=\"vm.fillHandlePosition()\"\n [dragState]=\"vm.dragState()\"\n (scrolled)=\"onBodyScroll($event)\"\n (cellPointerDown)=\"onCellPointerDown($event)\"\n (cellPointerEnter)=\"onCellPointerEnter($event)\"\n (cellPointerLeave)=\"onCellPointerLeave()\"\n (cellDoubleClick)=\"onCellDoubleClick($event)\"\n (editValueChange)=\"onEditValueChange($event)\"\n (editCommit)=\"onEditCommit()\"\n (editCancel)=\"onEditCancel()\"\n (fillHandlePointerDown)=\"onFillHandlePointerDown($event)\"\n />\n <gp-grid-overlays\n [filterPopup]=\"vm.filterPopup()\"\n [isLoading]=\"vm.isLoading()\"\n [errorMessage]=\"vm.errorMessage()\"\n [headerHeight]=\"headerHeight()\"\n [rowHeight]=\"rowHeight()\"\n [dragState]=\"vm.dragState()\"\n [visibleColumnWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [scrollLeft]=\"vm.scrollLeft()\"\n [effectiveColumns]=\"vm.effectiveColumns()\"\n [totalWidth]=\"vm.totalWidth()\"\n (filterApply)=\"onFilterApply($event)\"\n (filterClose)=\"onFilterClose()\"\n />\n </div>\n ", isInline: true, styles: [":host{display:block;height:100%;min-height:0}\n"], dependencies: [{ kind: "component", type: GridHeaderComponent, selector: "gp-grid-header", inputs: ["headerHeight", "scrollLeft", "contentWidth", "totalWidth", "isLoading", "visibleColumnsWithIndices", "columnPositions", "columnWidths", "headers", "sortingEnabled", "headerRenderers", "globalHeaderRenderer"], outputs: ["headerPointerDown", "filterPointerDown", "resizePointerDown", "headerSort", "headerFilterOpen"] }, { kind: "component", type: GridBodyComponent, selector: "gp-grid-body", inputs: ["rowHeight", "totalHeaderHeight", "contentWidth", "contentHeight", "rowsWrapperOffset", "slotsArray", "visibleColumnWithIndices", "totalWidth", "columnPositions", "columnWidths", "totalRows", "activeCell", "selectionRange", "editingCell", "cellRenderers", "globalCellRenderer", "editRenderers", "globalEditRenderer", "hoverPosition", "computeRowClasses", "computeCellClasses", "fillHandlePosition", "dragState"], outputs: ["scrolled", "cellPointerDown", "cellPointerEnter", "cellPointerLeave", "cellDoubleClick", "editValueChange", "editCommit", "editCancel", "fillHandlePointerDown"] }, { kind: "component", type: GridOverlaysComponent, selector: "gp-grid-overlays", inputs: ["filterPopup", "isLoading", "errorMessage", "headerHeight", "rowHeight", "dragState", "visibleColumnWithIndices", "columnPositions", "scrollLeft", "effectiveColumns", "totalWidth"], outputs: ["filterApply", "filterClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1596
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.7", type: GpGridComponent, isStandalone: true, selector: "gp-grid", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, getRowId: { classPropertyName: "getRowId", publicName: "getRowId", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, headerHeight: { classPropertyName: "headerHeight", publicName: "headerHeight", isSignal: true, isRequired: false, transformFunction: null }, darkMode: { classPropertyName: "darkMode", publicName: "darkMode", isSignal: true, isRequired: false, transformFunction: null }, cellRenderers: { classPropertyName: "cellRenderers", publicName: "cellRenderers", isSignal: true, isRequired: false, transformFunction: null }, headerRenderers: { classPropertyName: "headerRenderers", publicName: "headerRenderers", isSignal: true, isRequired: false, transformFunction: null }, editRenderers: { classPropertyName: "editRenderers", publicName: "editRenderers", isSignal: true, isRequired: false, transformFunction: null }, cellRenderer: { classPropertyName: "cellRenderer", publicName: "cellRenderer", isSignal: true, isRequired: false, transformFunction: null }, headerRenderer: { classPropertyName: "headerRenderer", publicName: "headerRenderer", isSignal: true, isRequired: false, transformFunction: null }, editRenderer: { classPropertyName: "editRenderer", publicName: "editRenderer", isSignal: true, isRequired: false, transformFunction: null }, highlighting: { classPropertyName: "highlighting", publicName: "highlighting", isSignal: true, isRequired: false, transformFunction: null }, rowDragEntireRow: { classPropertyName: "rowDragEntireRow", publicName: "rowDragEntireRow", isSignal: true, isRequired: false, transformFunction: null }, overscan: { classPropertyName: "overscan", publicName: "overscan", isSignal: true, isRequired: false, transformFunction: null }, rowLoading: { classPropertyName: "rowLoading", publicName: "rowLoading", isSignal: true, isRequired: false, transformFunction: null }, sortingEnabled: { classPropertyName: "sortingEnabled", publicName: "sortingEnabled", isSignal: true, isRequired: false, transformFunction: null }, wheelDampening: { classPropertyName: "wheelDampening", publicName: "wheelDampening", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onRowDragEnd: "onRowDragEnd", onCellValueChanged: "onCellValueChanged", onColumnResized: "onColumnResized", onColumnMoved: "onColumnMoved" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "body", first: true, predicate: GridBodyComponent, descendants: true }], ngImport: i0, template: "\n <div #container\n [class]=\"'gp-grid-container' + (darkMode() ? ' gp-grid-container--dark' : '')\"\n style=\"width: 100%; height: 100%; display: flex; flex-direction: column; position: relative; outline: none;\"\n tabindex=\"0\"\n (keydown)=\"onKeyDown($event)\"\n (paste)=\"onPaste($event)\"\n (wheel)=\"onWheel($event)\"\n >\n <gp-grid-header\n [headerHeight]=\"headerHeight()\"\n [scrollLeft]=\"vm.scrollLeft()\"\n [contentWidth]=\"vm.contentWidth()\"\n [totalWidth]=\"vm.totalWidth()\"\n [isLoading]=\"vm.isLoading()\"\n [visibleColumnsWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [columnWidths]=\"vm.columnWidths()\"\n [headers]=\"vm.headerState()\"\n [sortingEnabled]=\"sortingEnabled()\"\n [headerRenderers]=\"headerRenderers()\"\n [globalHeaderRenderer]=\"headerRenderer()\"\n (headerPointerDown)=\"onHeaderPointerDown($event)\"\n (filterPointerDown)=\"onFilterPointerDown($event)\"\n (resizePointerDown)=\"onResizePointerDown($event)\"\n (headerSort)=\"onHeaderSort($event)\"\n />\n <gp-grid-body\n [rowHeight]=\"rowHeight()\"\n [totalHeaderHeight]=\"headerHeight()\"\n [contentWidth]=\"vm.contentWidth()\"\n [contentHeight]=\"vm.contentHeight()\"\n [totalWidth]=\"vm.totalWidth()\"\n [rowsWrapperOffset]=\"vm.rowsWrapperOffset()\"\n [slotsArray]=\"vm.slotsArray()\"\n [visibleColumnWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [columnWidths]=\"vm.columnWidths()\"\n [totalRows]=\"vm.totalRows()\"\n [activeCell]=\"vm.activeCell()\"\n [selectionRange]=\"vm.selectionRange()\"\n [editingCell]=\"vm.editingCell()\"\n [cellRenderers]=\"cellRenderers()\"\n [globalCellRenderer]=\"cellRenderer()\"\n [editRenderers]=\"editRenderers()\"\n [globalEditRenderer]=\"editRenderer()\"\n [hoverPosition]=\"vm.hoverPosition()\"\n [computeRowClasses]=\"computeRowClassesFn\"\n [computeCellClasses]=\"computeCellClassesFn\"\n [fillHandlePosition]=\"vm.fillHandlePosition()\"\n [dragState]=\"vm.dragState()\"\n (scrolled)=\"onBodyScroll($event)\"\n (cellPointerDown)=\"onCellPointerDown($event)\"\n (cellPointerEnter)=\"onCellPointerEnter($event)\"\n (cellPointerLeave)=\"onCellPointerLeave()\"\n (cellDoubleClick)=\"onCellDoubleClick($event)\"\n (editValueChange)=\"onEditValueChange($event)\"\n (editCommit)=\"onEditCommit()\"\n (editCancel)=\"onEditCancel()\"\n (fillHandlePointerDown)=\"onFillHandlePointerDown($event)\"\n />\n <gp-grid-overlays\n [filterPopup]=\"vm.filterPopup()\"\n [isLoading]=\"vm.isLoading()\"\n [errorMessage]=\"vm.errorMessage()\"\n [headerHeight]=\"headerHeight()\"\n [rowHeight]=\"rowHeight()\"\n [dragState]=\"vm.dragState()\"\n [visibleColumnWithIndices]=\"vm.visibleColumnWithIndices()\"\n [columnPositions]=\"vm.columnPositions()\"\n [scrollLeft]=\"vm.scrollLeft()\"\n [effectiveColumns]=\"vm.effectiveColumns()\"\n [totalWidth]=\"vm.totalWidth()\"\n (filterApply)=\"onFilterApply($event)\"\n (filterClose)=\"onFilterClose()\"\n />\n </div>\n ", isInline: true, styles: [":host{display:block;height:100%;min-height:0}\n"], dependencies: [{ kind: "component", type: GridHeaderComponent, selector: "gp-grid-header", inputs: ["headerHeight", "scrollLeft", "contentWidth", "totalWidth", "isLoading", "visibleColumnsWithIndices", "columnPositions", "columnWidths", "headers", "sortingEnabled", "headerRenderers", "globalHeaderRenderer"], outputs: ["headerPointerDown", "filterPointerDown", "resizePointerDown", "headerSort", "headerFilterOpen"] }, { kind: "component", type: GridBodyComponent, selector: "gp-grid-body", inputs: ["rowHeight", "totalHeaderHeight", "contentWidth", "contentHeight", "rowsWrapperOffset", "slotsArray", "visibleColumnWithIndices", "totalWidth", "columnPositions", "columnWidths", "totalRows", "activeCell", "selectionRange", "editingCell", "cellRenderers", "globalCellRenderer", "editRenderers", "globalEditRenderer", "hoverPosition", "computeRowClasses", "computeCellClasses", "fillHandlePosition", "dragState"], outputs: ["scrolled", "cellPointerDown", "cellPointerEnter", "cellPointerLeave", "cellDoubleClick", "editValueChange", "editCommit", "editCancel", "fillHandlePointerDown"] }, { kind: "component", type: GridOverlaysComponent, selector: "gp-grid-overlays", inputs: ["filterPopup", "isLoading", "errorMessage", "headerHeight", "rowHeight", "dragState", "visibleColumnWithIndices", "columnPositions", "scrollLeft", "effectiveColumns", "totalWidth"], outputs: ["filterApply", "filterClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1587
1597
|
}
|
|
1588
1598
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: GpGridComponent, decorators: [{
|
|
1589
1599
|
type: Component,
|
|
@@ -1594,7 +1604,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImpor
|
|
|
1594
1604
|
}], body: [{
|
|
1595
1605
|
type: ViewChild,
|
|
1596
1606
|
args: [GridBodyComponent]
|
|
1597
|
-
}], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], getRowId: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowId", required: false }] }], rowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeight", required: false }] }], headerHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeight", required: false }] }], darkMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "darkMode", required: false }] }], cellRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellRenderers", required: false }] }], headerRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRenderers", required: false }] }], editRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRenderers", required: false }] }], cellRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellRenderer", required: false }] }], headerRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRenderer", required: false }] }], editRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRenderer", required: false }] }], highlighting: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlighting", required: false }] }], rowDragEntireRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowDragEntireRow", required: false }] }], overscan: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscan", required: false }] }], sortingEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortingEnabled", required: false }] }], wheelDampening: [{ type: i0.Input, args: [{ isSignal: true, alias: "wheelDampening", required: false }] }], onRowDragEnd: [{ type: i0.Output, args: ["onRowDragEnd"] }], onCellValueChanged: [{ type: i0.Output, args: ["onCellValueChanged"] }], onColumnResized: [{ type: i0.Output, args: ["onColumnResized"] }], onColumnMoved: [{ type: i0.Output, args: ["onColumnMoved"] }] } });
|
|
1607
|
+
}], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], getRowId: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowId", required: false }] }], rowHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHeight", required: false }] }], headerHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeight", required: false }] }], darkMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "darkMode", required: false }] }], cellRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellRenderers", required: false }] }], headerRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRenderers", required: false }] }], editRenderers: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRenderers", required: false }] }], cellRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellRenderer", required: false }] }], headerRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRenderer", required: false }] }], editRenderer: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRenderer", required: false }] }], highlighting: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlighting", required: false }] }], rowDragEntireRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowDragEntireRow", required: false }] }], overscan: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscan", required: false }] }], rowLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowLoading", required: false }] }], sortingEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortingEnabled", required: false }] }], wheelDampening: [{ type: i0.Input, args: [{ isSignal: true, alias: "wheelDampening", required: false }] }], onRowDragEnd: [{ type: i0.Output, args: ["onRowDragEnd"] }], onCellValueChanged: [{ type: i0.Output, args: ["onCellValueChanged"] }], onColumnResized: [{ type: i0.Output, args: ["onColumnResized"] }], onColumnMoved: [{ type: i0.Output, args: ["onColumnMoved"] }] } });
|
|
1598
1608
|
|
|
1599
1609
|
/**
|
|
1600
1610
|
* Angular helper for efficient grid data mutations.
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gp-grid/angular",
|
|
3
3
|
"description": "A high-performance Angular data grid component with virtual scrolling, cell selection, sorting, filtering, and Excel-like editing",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.15.0",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"module": "fesm2022/gp-grid-angular.mjs",
|
|
7
7
|
"typings": "types/gp-grid-angular.d.ts",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"@angular/core": ">=18.0.0"
|
|
52
52
|
},
|
|
53
53
|
"dependencies": {
|
|
54
|
-
"@gp-grid/core": "0.
|
|
54
|
+
"@gp-grid/core": "0.15.0",
|
|
55
55
|
"tslib": "^2.8.1"
|
|
56
56
|
},
|
|
57
57
|
"sideEffects": false,
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { TemplateRef, ElementRef, AfterViewInit, OnDestroy, Signal, OnInit, InjectionToken, Provider } from '@angular/core';
|
|
3
3
|
import * as _gp_grid_core from '@gp-grid/core';
|
|
4
|
-
import { HeaderRendererParams, SortDirection, VisibleColumnInfo, HeaderData, ColumnDefinition, SlotData, CellPosition, CellRange, CellValue, CellRendererParams, EditRendererParams, FillHandlePosition, DragState, ColumnFilterModel, BatchChangeSetters, DataSource, RowId, HighlightingOptions, CellValueChangedEvent, ParallelSortOptions, MutableDataSource } from '@gp-grid/core';
|
|
5
|
-
export { CellDataType, CellPosition, CellRange, CellRendererParams, CellValue, CellValueChangedEvent, ColumnDefinition, ColumnFilterModel, DataSource, DataSourceRequest, DataSourceResponse, EditRendererParams, FilterCondition, FilterModel, GridCore, GridInstruction, HeaderRendererParams, HighlightContext, HighlightingOptions, MutableDataSource, RowId, SortDirection, SortModel, createClientDataSource, createDataSourceFromArray, createMutableClientDataSource, createServerDataSource } from '@gp-grid/core';
|
|
4
|
+
import { HeaderRendererParams, SortDirection, VisibleColumnInfo, HeaderData, ColumnDefinition, SlotData, CellPosition, CellRange, CellValue, CellRendererParams, EditRendererParams, FillHandlePosition, DragState, ColumnFilterModel, BatchChangeSetters, DataSource, RowId, HighlightingOptions, RowLoadingOptions, CellValueChangedEvent, ParallelSortOptions, MutableDataSource } from '@gp-grid/core';
|
|
5
|
+
export { CellDataType, CellPosition, CellRange, CellRendererParams, CellValue, CellValueChangedEvent, ColumnDefinition, ColumnFilterModel, DataSource, DataSourceLoadMode, DataSourceRange, DataSourceRequest, DataSourceResponse, EditRendererParams, FilterCondition, FilterModel, GridCore, GridInstruction, HeaderRendererParams, HighlightContext, HighlightingOptions, MutableDataSource, RowCacheEviction, RowCacheOptions, RowId, RowLoadingMode, RowLoadingOptions, SortDirection, SortModel, createClientDataSource, createDataSourceFromArray, createMutableClientDataSource, createServerDataSource } from '@gp-grid/core';
|
|
6
6
|
|
|
7
7
|
type HeaderRendererTemplate = TemplateRef<{
|
|
8
8
|
$implicit: HeaderRendererParams;
|
|
@@ -310,6 +310,7 @@ declare class GpGridViewModel {
|
|
|
310
310
|
readonly contentHeight: _angular_core.WritableSignal<number>;
|
|
311
311
|
readonly rowsWrapperOffset: _angular_core.WritableSignal<number>;
|
|
312
312
|
readonly slots: _angular_core.WritableSignal<Map<string, SlotData<unknown>>>;
|
|
313
|
+
readonly totalRows: _angular_core.WritableSignal<number>;
|
|
313
314
|
readonly effectiveColumns: Signal<ColumnDefinition[]>;
|
|
314
315
|
readonly visibleColumnWithIndices: Signal<VisibleColumnInfo[]>;
|
|
315
316
|
readonly columnPositions: Signal<number[]>;
|
|
@@ -317,7 +318,6 @@ declare class GpGridViewModel {
|
|
|
317
318
|
readonly totalWidth: Signal<number>;
|
|
318
319
|
readonly fillHandlePosition: Signal<FillHandlePosition | null>;
|
|
319
320
|
readonly slotsArray: Signal<SlotData[]>;
|
|
320
|
-
readonly totalRows: Signal<number>;
|
|
321
321
|
readonly batchSetters: BatchChangeSetters;
|
|
322
322
|
private filterAnchorEl;
|
|
323
323
|
constructor(deps: GpGridViewModelDeps);
|
|
@@ -345,6 +345,7 @@ declare class GpGridComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
345
345
|
highlighting: _angular_core.InputSignal<HighlightingOptions<Record<string, unknown>>>;
|
|
346
346
|
rowDragEntireRow: _angular_core.InputSignal<boolean>;
|
|
347
347
|
overscan: _angular_core.InputSignal<number>;
|
|
348
|
+
rowLoading: _angular_core.InputSignal<RowLoadingOptions>;
|
|
348
349
|
sortingEnabled: _angular_core.InputSignal<boolean>;
|
|
349
350
|
wheelDampening: _angular_core.InputSignal<number>;
|
|
350
351
|
onRowDragEnd: _angular_core.OutputEmitterRef<{
|
|
@@ -382,6 +383,7 @@ declare class GpGridComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
382
383
|
protected onHeaderSort(evt: HeaderSortEvent): void;
|
|
383
384
|
protected onWheel(event: WheelEvent): void;
|
|
384
385
|
protected onKeyDown(event: KeyboardEvent): void;
|
|
386
|
+
protected onPaste(event: ClipboardEvent): void;
|
|
385
387
|
protected onResizePointerDown(evt: ResizePointerDownEvent): void;
|
|
386
388
|
protected onFilterApply(event: {
|
|
387
389
|
colId: string;
|
|
@@ -391,7 +393,7 @@ declare class GpGridComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
391
393
|
private onDocumentPointerMove;
|
|
392
394
|
private onDocumentPointerUp;
|
|
393
395
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<GpGridComponent, never>;
|
|
394
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<GpGridComponent, "gp-grid", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "getRowId": { "alias": "getRowId"; "required": false; "isSignal": true; }; "rowHeight": { "alias": "rowHeight"; "required": false; "isSignal": true; }; "headerHeight": { "alias": "headerHeight"; "required": false; "isSignal": true; }; "darkMode": { "alias": "darkMode"; "required": false; "isSignal": true; }; "cellRenderers": { "alias": "cellRenderers"; "required": false; "isSignal": true; }; "headerRenderers": { "alias": "headerRenderers"; "required": false; "isSignal": true; }; "editRenderers": { "alias": "editRenderers"; "required": false; "isSignal": true; }; "cellRenderer": { "alias": "cellRenderer"; "required": false; "isSignal": true; }; "headerRenderer": { "alias": "headerRenderer"; "required": false; "isSignal": true; }; "editRenderer": { "alias": "editRenderer"; "required": false; "isSignal": true; }; "highlighting": { "alias": "highlighting"; "required": false; "isSignal": true; }; "rowDragEntireRow": { "alias": "rowDragEntireRow"; "required": false; "isSignal": true; }; "overscan": { "alias": "overscan"; "required": false; "isSignal": true; }; "sortingEnabled": { "alias": "sortingEnabled"; "required": false; "isSignal": true; }; "wheelDampening": { "alias": "wheelDampening"; "required": false; "isSignal": true; }; }, { "onRowDragEnd": "onRowDragEnd"; "onCellValueChanged": "onCellValueChanged"; "onColumnResized": "onColumnResized"; "onColumnMoved": "onColumnMoved"; }, never, never, true, never>;
|
|
396
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<GpGridComponent, "gp-grid", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "getRowId": { "alias": "getRowId"; "required": false; "isSignal": true; }; "rowHeight": { "alias": "rowHeight"; "required": false; "isSignal": true; }; "headerHeight": { "alias": "headerHeight"; "required": false; "isSignal": true; }; "darkMode": { "alias": "darkMode"; "required": false; "isSignal": true; }; "cellRenderers": { "alias": "cellRenderers"; "required": false; "isSignal": true; }; "headerRenderers": { "alias": "headerRenderers"; "required": false; "isSignal": true; }; "editRenderers": { "alias": "editRenderers"; "required": false; "isSignal": true; }; "cellRenderer": { "alias": "cellRenderer"; "required": false; "isSignal": true; }; "headerRenderer": { "alias": "headerRenderer"; "required": false; "isSignal": true; }; "editRenderer": { "alias": "editRenderer"; "required": false; "isSignal": true; }; "highlighting": { "alias": "highlighting"; "required": false; "isSignal": true; }; "rowDragEntireRow": { "alias": "rowDragEntireRow"; "required": false; "isSignal": true; }; "overscan": { "alias": "overscan"; "required": false; "isSignal": true; }; "rowLoading": { "alias": "rowLoading"; "required": false; "isSignal": true; }; "sortingEnabled": { "alias": "sortingEnabled"; "required": false; "isSignal": true; }; "wheelDampening": { "alias": "wheelDampening"; "required": false; "isSignal": true; }; }, { "onRowDragEnd": "onRowDragEnd"; "onCellValueChanged": "onCellValueChanged"; "onColumnResized": "onColumnResized"; "onColumnMoved": "onColumnMoved"; }, never, never, true, never>;
|
|
395
397
|
}
|
|
396
398
|
|
|
397
399
|
interface CreateGridDataOptions<TData> {
|