@toolbox-web/grid-angular 1.2.0 → 1.3.1

package/fesm2022/toolbox-web-grid-angular-features-row-drag-drop.mjs

@@ -0,0 +1,24 @@
+import '@toolbox-web/grid/features/row-drag-drop';
+
+/**
+ * Row drag & drop feature for @toolbox-web/grid-angular
+ *
+ * Import this module to enable the `rowDragDrop` input on Grid directive
+ * along with the `(rowDragStart)`, `(rowDragEnd)`, `(rowDrop)`, and
+ * `(rowTransfer)` outputs. Supports both intra-grid reorder and cross-grid
+ * transfer.
+ *
+ * @example
+ * ```typescript
+ * import '@toolbox-web/grid-angular/features/row-drag-drop';
+ *
+ * <tbw-grid [rowDragDrop]="{ dropZone: 'employees' }" />
+ * ```
+ *
+ * @packageDocumentation
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+//# sourceMappingURL=toolbox-web-grid-angular-features-row-drag-drop.mjs.map

package/fesm2022/toolbox-web-grid-angular-features-row-drag-drop.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbox-web-grid-angular-features-row-drag-drop.mjs","sources":["../../../../libs/grid-angular/features/row-drag-drop/src/index.ts","../../../../libs/grid-angular/features/row-drag-drop/src/toolbox-web-grid-angular-features-row-drag-drop.ts"],"sourcesContent":["/**\n * Row drag & drop feature for @toolbox-web/grid-angular\n *\n * Import this module to enable the `rowDragDrop` input on Grid directive\n * along with the `(rowDragStart)`, `(rowDragEnd)`, `(rowDrop)`, and\n * `(rowTransfer)` outputs. Supports both intra-grid reorder and cross-grid\n * transfer.\n *\n * @example\n * ```typescript\n * import '@toolbox-web/grid-angular/features/row-drag-drop';\n *\n * <tbw-grid [rowDragDrop]=\"{ dropZone: 'employees' }\" />\n * ```\n *\n * @packageDocumentation\n */\n\nimport '@toolbox-web/grid/features/row-drag-drop';\nexport type { _Augmentation as _RowDragDropAugmentation } from '@toolbox-web/grid/features/row-drag-drop';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;;;AAgBG;;AChBH;;AAEG"}

package/fesm2022/toolbox-web-grid-angular-features-server-side.mjs

@@ -5,11 +5,34 @@ import '@toolbox-web/grid/features/server-side';
  *
  * Import this module to enable the `serverSide` input on Grid directive.
  *
+ * The grid's `ServerSideDataSource.getRows()` accepts either a `Promise` or an
+ * RxJS-style `Observable` (any `Subscribable`) directly — Angular `HttpClient`
+ * results work without any wrapper. Superseded requests are cancelled by the
+ * grid via `unsubscribe()`, which is what causes `HttpClient` to abort the
+ * underlying XHR.
+ *
  * @example
  * ```typescript
+ * import { Component, inject } from '@angular/core';
+ * import { HttpClient } from '@angular/common/http';
+ * import { map } from 'rxjs/operators';
+ * import { Grid } from '@toolbox-web/grid-angular';
  * import '@toolbox-web/grid-angular/features/server-side';
+ * import type { ServerSideDataSource } from '@toolbox-web/grid/plugins/server-side';
  *
- * <tbw-grid [serverSide]="{ dataSource: fetchDataFn }" />
+ * @Component({
+ *   imports: [Grid],
+ *   template: `<tbw-grid [serverSide]="{ dataSource }" />`,
+ * })
+ * class MyGrid {
+ *   private http = inject(HttpClient);
+ *   dataSource: ServerSideDataSource = {
+ *     getRows: (params) =>
+ *       this.http.get<{ items: unknown[]; total: number }>('/api/data', {
+ *         params: { offset: params.startNode, limit: params.endNode - params.startNode },
+ *       }).pipe(map((d) => ({ rows: d.items, totalNodeCount: d.total }))),
+ *   };
+ * }
  * ```
  *
  * @packageDocumentation

package/fesm2022/toolbox-web-grid-angular-features-server-side.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"toolbox-web-grid-angular-features-server-side.mjs","sources":["../../../../libs/grid-angular/features/server-side/src/index.ts","../../../../libs/grid-angular/features/server-side/src/toolbox-web-grid-angular-features-server-side.ts"],"sourcesContent":["/**\n * Server-side feature for @toolbox-web/grid-angular\n *\n * Import this module to enable the `serverSide` input on Grid directive.\n *\n * @example\n * ```typescript\n * import '@toolbox-web/grid-angular/features/server-side';\n *\n * <tbw-grid [serverSide]=\"{ dataSource: fetchDataFn }\" />\n * ```\n *\n * @packageDocumentation\n */\n\nimport '@toolbox-web/grid/features/server-side';\nexport type { _Augmentation as _ServerSideAugmentation } from '@toolbox-web/grid/features/server-side';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;AAaG;;ACbH;;AAEG"}
+{"version":3,"file":"toolbox-web-grid-angular-features-server-side.mjs","sources":["../../../../libs/grid-angular/features/server-side/src/index.ts","../../../../libs/grid-angular/features/server-side/src/toolbox-web-grid-angular-features-server-side.ts"],"sourcesContent":["/**\n * Server-side feature for @toolbox-web/grid-angular\n *\n * Import this module to enable the `serverSide` input on Grid directive.\n *\n * The grid's `ServerSideDataSource.getRows()` accepts either a `Promise` or an\n * RxJS-style `Observable` (any `Subscribable`) directly — Angular `HttpClient`\n * results work without any wrapper. Superseded requests are cancelled by the\n * grid via `unsubscribe()`, which is what causes `HttpClient` to abort the\n * underlying XHR.\n *\n * @example\n * ```typescript\n * import { Component, inject } from '@angular/core';\n * import { HttpClient } from '@angular/common/http';\n * import { map } from 'rxjs/operators';\n * import { Grid } from '@toolbox-web/grid-angular';\n * import '@toolbox-web/grid-angular/features/server-side';\n * import type { ServerSideDataSource } from '@toolbox-web/grid/plugins/server-side';\n *\n * @Component({\n *   imports: [Grid],\n *   template: `<tbw-grid [serverSide]=\"{ dataSource }\" />`,\n * })\n * class MyGrid {\n *   private http = inject(HttpClient);\n *   dataSource: ServerSideDataSource = {\n *     getRows: (params) =>\n *       this.http.get<{ items: unknown[]; total: number }>('/api/data', {\n *         params: { offset: params.startNode, limit: params.endNode - params.startNode },\n *       }).pipe(map((d) => ({ rows: d.items, totalNodeCount: d.total }))),\n *   };\n * }\n * ```\n *\n * @packageDocumentation\n */\n\nimport '@toolbox-web/grid/features/server-side';\nexport type { _Augmentation as _ServerSideAugmentation } from '@toolbox-web/grid/features/server-side';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCG;;ACpCH;;AAEG"}

package/fesm2022/toolbox-web-grid-angular.mjs

@@ -1554,6 +1554,21 @@ class GridAdapter {
     editorViewRefs = [];
     /** Editor-specific component refs tracked separately for per-cell cleanup via releaseCell. */
     editorComponentRefs = [];
+    /**
+     * Per-editor `before-edit-close` listener teardown functions, keyed by
+     * editor host element.
+     *
+     * The grid's editing plugin emits `before-edit-close` on the host
+     * `<tbw-grid>` before tearing down a row's managed editors. Angular
+     * editors that commit on `(blur)` rely on the focused input firing `blur`
+     * naturally, but Tab / programmatic row exit rebuilds the cell DOM
+     * synchronously without giving the focused input a chance to blur first
+     * — pending input is silently discarded.
+     *
+     * Mirror of Vue's `editorBeforeCloseUnsubs` and React's
+     * `wrapReactEditor` queueMicrotask bridge.
+     */
+    editorBeforeCloseUnsubs = new Map();
     typeRegistry = null;
     constructor(injector, appRef, viewContainerRef) {
         this.injector = injector;
@@ -1828,6 +1843,7 @@ class GridAdapter {
             const container = document.createElement('span');
             container.style.display = 'contents';
             syncRootNodes(viewRef, container);
+            this.attachBeforeEditCloseFlush(container);
             // Auto-wire: Listen for commit/cancel events on the rendered component.
             // This allows components to just emit (commit) and (cancel) without
             // requiring explicit template bindings like (commit)="onCommit($event)".
@@ -2114,6 +2130,7 @@ class GridAdapter {
                 column: ctx.column,
             }, true);
             wireEditorCallbacks(hostElement, componentRef.instance, (value) => ctx.commit(value), () => ctx.cancel());
+            this.attachBeforeEditCloseFlush(hostElement);
             // Auto-update editor when value changes externally (e.g., via updateRow cascade
             // or Escape-revert). Update the component input and run detectChanges() —
             // the component's own template handles rendering regardless of editor type.
@@ -2432,6 +2449,13 @@ class GridAdapter {
                 this.editorComponentRefs.splice(i, 1);
             }
         }
+        // Detach `before-edit-close` listeners for editor hosts inside this cell
+        for (const [hostEl, unsub] of this.editorBeforeCloseUnsubs) {
+            if (cellEl.contains(hostEl)) {
+                unsub();
+                this.editorBeforeCloseUnsubs.delete(hostEl);
+            }
+        }
     }
     /**
      * Unmount a specific container (e.g., detail panel, tool panel).
@@ -2469,6 +2493,41 @@ class GridAdapter {
         this.componentRefs = [];
         this.editorComponentRefs.forEach((ref) => ref.destroy());
         this.editorComponentRefs = [];
+        this.editorBeforeCloseUnsubs.forEach((unsub) => unsub());
+        this.editorBeforeCloseUnsubs.clear();
+    }
+    /**
+     * Attaches a `before-edit-close` listener on the host grid that flushes
+     * the focused input inside `host` via native `.blur()` so editors that
+     * commit on `(blur)` flush pending input before the cell DOM is torn
+     * down by Tab / programmatic row exit.
+     *
+     * The grid is resolved lazily via `queueMicrotask` because the host is
+     * appended to the cell *after* the editor wrapper returns. Mirror of
+     * Vue's `attachBeforeEditCloseFlush` and React's `wrapReactEditor`
+     * queueMicrotask bridge.
+     * @internal
+     */
+    attachBeforeEditCloseFlush(host) {
+        queueMicrotask(() => {
+            const gridEl = host.closest('tbw-grid');
+            if (!gridEl)
+                return;
+            const flush = () => {
+                const focused = host.ownerDocument.activeElement;
+                if (focused &&
+                    host.contains(focused) &&
+                    (focused instanceof HTMLInputElement ||
+                        focused instanceof HTMLTextAreaElement ||
+                        focused instanceof HTMLSelectElement)) {
+                    focused.blur();
+                }
+            };
+            gridEl.addEventListener('before-edit-close', flush);
+            this.editorBeforeCloseUnsubs.set(host, () => {
+                gridEl.removeEventListener('before-edit-close', flush);
+            });
+        });
     }
 }
 
@@ -5025,17 +5084,29 @@ class Grid {
     /**
      * Enable row drag-to-reorder.
      *
+     * @deprecated Use `rowDragDrop` instead. `reorderRows` remains as an alias.
+     *
      * **Requires feature import:**
      * ```typescript
      * import '@toolbox-web/grid-angular/features/reorder-rows';
      * ```
+     */
+    reorderRows = input(...(ngDevMode ? [undefined, { debugName: "reorderRows" }] : /* istanbul ignore next */ []));
+    /**
+     * Enable row drag-and-drop within and across grids.
+     *
+     * **Requires feature import:**
+     * ```typescript
+     * import '@toolbox-web/grid-angular/features/row-drag-drop';
+     * ```
      *
      * @example
      * ```html
-     * <tbw-grid [reorderRows]="true" />
+     * <tbw-grid [rowDragDrop]="{ dropZone: 'employees', operation: 'move' }" />
      * ```
      */
-    reorderRows = input(...(ngDevMode ? [undefined, { debugName: "reorderRows" }] : /* istanbul ignore next */ []));
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    rowDragDrop = input(...(ngDevMode ? [undefined, { debugName: "rowDragDrop" }] : /* istanbul ignore next */ []));
     /**
      * Enable row grouping by field values.
      *
@@ -5338,6 +5409,33 @@ class Grid {
      */
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     rowMove = output();
+    /**
+     * Emitted when a row drag starts. Cancelable via `event.preventDefault()`.
+     *
+     * @example
+     * ```html
+     * <tbw-grid (rowDragStart)="onRowDragStart($event)">...</tbw-grid>
+     * ```
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    rowDragStart = output();
+    /**
+     * Emitted when a row drag ends (after drop or cancel).
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    rowDragEnd = output();
+    /**
+     * Emitted on the target grid when rows are dropped from another grid.
+     * Cancelable via `event.preventDefault()`.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    rowDrop = output();
+    /**
+     * Emitted on BOTH source and target grids after a successful cross-grid
+     * row transfer.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    rowTransfer = output();
     /**
      * Emitted when a group is expanded or collapsed.
      *
@@ -5462,6 +5560,10 @@ class Grid {
         columnStateChange: 'column-state-change',
         selectionChange: 'selection-change',
         rowMove: 'row-move',
+        rowDragStart: 'row-drag-start',
+        rowDragEnd: 'row-drag-end',
+        rowDrop: 'row-drop',
+        rowTransfer: 'row-transfer',
         groupToggle: 'group-toggle',
         treeExpand: 'tree-expand',
         detailExpand: 'detail-expand',
@@ -5542,6 +5644,7 @@ class Grid {
         }
         addPlugin('columnVirtualization', this.columnVirtualization());
         addPlugin('reorderRows', this.reorderRows());
+        addPlugin('rowDragDrop', this.rowDragDrop());
         // Pre-process groupingRows config to bridge Angular component classes
         const grConfig = this.groupingRows();
         if (grConfig && typeof grConfig === 'object' && this.adapter) {
@@ -5703,12 +5806,12 @@ class Grid {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: Grid, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: Grid, isStandalone: true, selector: "tbw-grid", inputs: { customStyles: { classPropertyName: "customStyles", publicName: "customStyles", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, fitMode: { classPropertyName: "fitMode", publicName: "fitMode", isSignal: true, isRequired: false, transformFunction: null }, gridConfig: { classPropertyName: "gridConfig", publicName: "gridConfig", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, editing: { classPropertyName: "editing", publicName: "editing", isSignal: true, isRequired: false, transformFunction: null }, clipboard: { classPropertyName: "clipboard", publicName: "clipboard", isSignal: true, isRequired: false, transformFunction: null }, contextMenu: { classPropertyName: "contextMenu", publicName: "contextMenu", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, filtering: { classPropertyName: "filtering", publicName: "filtering", isSignal: true, isRequired: false, transformFunction: null }, reorderColumns: { classPropertyName: "reorderColumns", publicName: "reorderColumns", isSignal: true, isRequired: false, transformFunction: null }, visibility: { classPropertyName: "visibility", publicName: "visibility", isSignal: true, isRequired: false, transformFunction: null }, pinnedColumns: { classPropertyName: "pinnedColumns", publicName: "pinnedColumns", isSignal: true, isRequired: false, transformFunction: null }, groupingColumns: { classPropertyName: "groupingColumns", publicName: "groupingColumns", isSignal: true, isRequired: false, transformFunction: null }, columnVirtualization: { classPropertyName: "columnVirtualization", publicName: "columnVirtualization", isSignal: true, isRequired: false, transformFunction: null }, reorderRows: { classPropertyName: "reorderRows", publicName: "reorderRows", isSignal: true, isRequired: false, transformFunction: null }, groupingRows: { classPropertyName: "groupingRows", publicName: "groupingRows", isSignal: true, isRequired: false, transformFunction: null }, pinnedRows: { classPropertyName: "pinnedRows", publicName: "pinnedRows", isSignal: true, isRequired: false, transformFunction: null }, tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, masterDetail: { classPropertyName: "masterDetail", publicName: "masterDetail", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, undoRedo: { classPropertyName: "undoRedo", publicName: "undoRedo", isSignal: true, isRequired: false, transformFunction: null }, exportFeature: { classPropertyName: "exportFeature", publicName: "export", isSignal: true, isRequired: false, transformFunction: null }, print: { classPropertyName: "print", publicName: "print", isSignal: true, isRequired: false, transformFunction: null }, pivot: { classPropertyName: "pivot", publicName: "pivot", isSignal: true, isRequired: false, transformFunction: null }, serverSide: { classPropertyName: "serverSide", publicName: "serverSide", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cellClick: "cellClick", rowClick: "rowClick", cellActivate: "cellActivate", cellChange: "cellChange", cellCommit: "cellCommit", rowCommit: "rowCommit", changedRowsReset: "changedRowsReset", sortChange: "sortChange", filterChange: "filterChange", columnResize: "columnResize", columnMove: "columnMove", columnVisibility: "columnVisibility", columnStateChange: "columnStateChange", selectionChange: "selectionChange", rowMove: "rowMove", groupToggle: "groupToggle", treeExpand: "treeExpand", detailExpand: "detailExpand", responsiveChange: "responsiveChange", copy: "copy", paste: "paste", undoRedoAction: "undoRedoAction", exportComplete: "exportComplete", printStart: "printStart", printComplete: "printComplete", tbwScroll: "tbwScroll" }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: Grid, isStandalone: true, selector: "tbw-grid", inputs: { customStyles: { classPropertyName: "customStyles", publicName: "customStyles", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, fitMode: { classPropertyName: "fitMode", publicName: "fitMode", isSignal: true, isRequired: false, transformFunction: null }, gridConfig: { classPropertyName: "gridConfig", publicName: "gridConfig", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, editing: { classPropertyName: "editing", publicName: "editing", isSignal: true, isRequired: false, transformFunction: null }, clipboard: { classPropertyName: "clipboard", publicName: "clipboard", isSignal: true, isRequired: false, transformFunction: null }, contextMenu: { classPropertyName: "contextMenu", publicName: "contextMenu", isSignal: true, isRequired: false, transformFunction: null }, multiSort: { classPropertyName: "multiSort", publicName: "multiSort", isSignal: true, isRequired: false, transformFunction: null }, filtering: { classPropertyName: "filtering", publicName: "filtering", isSignal: true, isRequired: false, transformFunction: null }, reorderColumns: { classPropertyName: "reorderColumns", publicName: "reorderColumns", isSignal: true, isRequired: false, transformFunction: null }, visibility: { classPropertyName: "visibility", publicName: "visibility", isSignal: true, isRequired: false, transformFunction: null }, pinnedColumns: { classPropertyName: "pinnedColumns", publicName: "pinnedColumns", isSignal: true, isRequired: false, transformFunction: null }, groupingColumns: { classPropertyName: "groupingColumns", publicName: "groupingColumns", isSignal: true, isRequired: false, transformFunction: null }, columnVirtualization: { classPropertyName: "columnVirtualization", publicName: "columnVirtualization", isSignal: true, isRequired: false, transformFunction: null }, reorderRows: { classPropertyName: "reorderRows", publicName: "reorderRows", isSignal: true, isRequired: false, transformFunction: null }, rowDragDrop: { classPropertyName: "rowDragDrop", publicName: "rowDragDrop", isSignal: true, isRequired: false, transformFunction: null }, groupingRows: { classPropertyName: "groupingRows", publicName: "groupingRows", isSignal: true, isRequired: false, transformFunction: null }, pinnedRows: { classPropertyName: "pinnedRows", publicName: "pinnedRows", isSignal: true, isRequired: false, transformFunction: null }, tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, masterDetail: { classPropertyName: "masterDetail", publicName: "masterDetail", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, undoRedo: { classPropertyName: "undoRedo", publicName: "undoRedo", isSignal: true, isRequired: false, transformFunction: null }, exportFeature: { classPropertyName: "exportFeature", publicName: "export", isSignal: true, isRequired: false, transformFunction: null }, print: { classPropertyName: "print", publicName: "print", isSignal: true, isRequired: false, transformFunction: null }, pivot: { classPropertyName: "pivot", publicName: "pivot", isSignal: true, isRequired: false, transformFunction: null }, serverSide: { classPropertyName: "serverSide", publicName: "serverSide", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cellClick: "cellClick", rowClick: "rowClick", cellActivate: "cellActivate", cellChange: "cellChange", cellCommit: "cellCommit", rowCommit: "rowCommit", changedRowsReset: "changedRowsReset", sortChange: "sortChange", filterChange: "filterChange", columnResize: "columnResize", columnMove: "columnMove", columnVisibility: "columnVisibility", columnStateChange: "columnStateChange", selectionChange: "selectionChange", rowMove: "rowMove", rowDragStart: "rowDragStart", rowDragEnd: "rowDragEnd", rowDrop: "rowDrop", rowTransfer: "rowTransfer", groupToggle: "groupToggle", treeExpand: "treeExpand", detailExpand: "detailExpand", responsiveChange: "responsiveChange", copy: "copy", paste: "paste", undoRedoAction: "undoRedoAction", exportComplete: "exportComplete", printStart: "printStart", printComplete: "printComplete", tbwScroll: "tbwScroll" }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: Grid, decorators: [{
             type: Directive,
             args: [{ selector: 'tbw-grid' }]
-        }], ctorParameters: () => [], propDecorators: { customStyles: [{ type: i0.Input, args: [{ isSignal: true, alias: "customStyles", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], fitMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "fitMode", required: false }] }], gridConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridConfig", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], editing: [{ type: i0.Input, args: [{ isSignal: true, alias: "editing", required: false }] }], clipboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "clipboard", required: false }] }], contextMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextMenu", required: false }] }], multiSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSort", required: false }] }], filtering: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtering", required: false }] }], reorderColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderColumns", required: false }] }], visibility: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibility", required: false }] }], pinnedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedColumns", required: false }] }], groupingColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupingColumns", required: false }] }], columnVirtualization: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnVirtualization", required: false }] }], reorderRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderRows", required: false }] }], groupingRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupingRows", required: false }] }], pinnedRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedRows", required: false }] }], tree: [{ type: i0.Input, args: [{ isSignal: true, alias: "tree", required: false }] }], masterDetail: [{ type: i0.Input, args: [{ isSignal: true, alias: "masterDetail", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], undoRedo: [{ type: i0.Input, args: [{ isSignal: true, alias: "undoRedo", required: false }] }], exportFeature: [{ type: i0.Input, args: [{ isSignal: true, alias: "export", required: false }] }], print: [{ type: i0.Input, args: [{ isSignal: true, alias: "print", required: false }] }], pivot: [{ type: i0.Input, args: [{ isSignal: true, alias: "pivot", required: false }] }], serverSide: [{ type: i0.Input, args: [{ isSignal: true, alias: "serverSide", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], cellClick: [{ type: i0.Output, args: ["cellClick"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], cellActivate: [{ type: i0.Output, args: ["cellActivate"] }], cellChange: [{ type: i0.Output, args: ["cellChange"] }], cellCommit: [{ type: i0.Output, args: ["cellCommit"] }], rowCommit: [{ type: i0.Output, args: ["rowCommit"] }], changedRowsReset: [{ type: i0.Output, args: ["changedRowsReset"] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }], columnResize: [{ type: i0.Output, args: ["columnResize"] }], columnMove: [{ type: i0.Output, args: ["columnMove"] }], columnVisibility: [{ type: i0.Output, args: ["columnVisibility"] }], columnStateChange: [{ type: i0.Output, args: ["columnStateChange"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], rowMove: [{ type: i0.Output, args: ["rowMove"] }], groupToggle: [{ type: i0.Output, args: ["groupToggle"] }], treeExpand: [{ type: i0.Output, args: ["treeExpand"] }], detailExpand: [{ type: i0.Output, args: ["detailExpand"] }], responsiveChange: [{ type: i0.Output, args: ["responsiveChange"] }], copy: [{ type: i0.Output, args: ["copy"] }], paste: [{ type: i0.Output, args: ["paste"] }], undoRedoAction: [{ type: i0.Output, args: ["undoRedoAction"] }], exportComplete: [{ type: i0.Output, args: ["exportComplete"] }], printStart: [{ type: i0.Output, args: ["printStart"] }], printComplete: [{ type: i0.Output, args: ["printComplete"] }], tbwScroll: [{ type: i0.Output, args: ["tbwScroll"] }] } });
+        }], ctorParameters: () => [], propDecorators: { customStyles: [{ type: i0.Input, args: [{ isSignal: true, alias: "customStyles", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], fitMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "fitMode", required: false }] }], gridConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridConfig", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], editing: [{ type: i0.Input, args: [{ isSignal: true, alias: "editing", required: false }] }], clipboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "clipboard", required: false }] }], contextMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "contextMenu", required: false }] }], multiSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSort", required: false }] }], filtering: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtering", required: false }] }], reorderColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderColumns", required: false }] }], visibility: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibility", required: false }] }], pinnedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedColumns", required: false }] }], groupingColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupingColumns", required: false }] }], columnVirtualization: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnVirtualization", required: false }] }], reorderRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderRows", required: false }] }], rowDragDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowDragDrop", required: false }] }], groupingRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupingRows", required: false }] }], pinnedRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinnedRows", required: false }] }], tree: [{ type: i0.Input, args: [{ isSignal: true, alias: "tree", required: false }] }], masterDetail: [{ type: i0.Input, args: [{ isSignal: true, alias: "masterDetail", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], undoRedo: [{ type: i0.Input, args: [{ isSignal: true, alias: "undoRedo", required: false }] }], exportFeature: [{ type: i0.Input, args: [{ isSignal: true, alias: "export", required: false }] }], print: [{ type: i0.Input, args: [{ isSignal: true, alias: "print", required: false }] }], pivot: [{ type: i0.Input, args: [{ isSignal: true, alias: "pivot", required: false }] }], serverSide: [{ type: i0.Input, args: [{ isSignal: true, alias: "serverSide", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], cellClick: [{ type: i0.Output, args: ["cellClick"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], cellActivate: [{ type: i0.Output, args: ["cellActivate"] }], cellChange: [{ type: i0.Output, args: ["cellChange"] }], cellCommit: [{ type: i0.Output, args: ["cellCommit"] }], rowCommit: [{ type: i0.Output, args: ["rowCommit"] }], changedRowsReset: [{ type: i0.Output, args: ["changedRowsReset"] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }], columnResize: [{ type: i0.Output, args: ["columnResize"] }], columnMove: [{ type: i0.Output, args: ["columnMove"] }], columnVisibility: [{ type: i0.Output, args: ["columnVisibility"] }], columnStateChange: [{ type: i0.Output, args: ["columnStateChange"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], rowMove: [{ type: i0.Output, args: ["rowMove"] }], rowDragStart: [{ type: i0.Output, args: ["rowDragStart"] }], rowDragEnd: [{ type: i0.Output, args: ["rowDragEnd"] }], rowDrop: [{ type: i0.Output, args: ["rowDrop"] }], rowTransfer: [{ type: i0.Output, args: ["rowTransfer"] }], groupToggle: [{ type: i0.Output, args: ["groupToggle"] }], treeExpand: [{ type: i0.Output, args: ["treeExpand"] }], detailExpand: [{ type: i0.Output, args: ["detailExpand"] }], responsiveChange: [{ type: i0.Output, args: ["responsiveChange"] }], copy: [{ type: i0.Output, args: ["copy"] }], paste: [{ type: i0.Output, args: ["paste"] }], undoRedoAction: [{ type: i0.Output, args: ["undoRedoAction"] }], exportComplete: [{ type: i0.Output, args: ["exportComplete"] }], printStart: [{ type: i0.Output, args: ["printStart"] }], printComplete: [{ type: i0.Output, args: ["printComplete"] }], tbwScroll: [{ type: i0.Output, args: ["tbwScroll"] }] } });
 
 /**
  * @packageDocumentation