angular-slickgrid 9.9.0 → 9.11.0

package/README.md

@@ -1,4 +1,4 @@
-# Angular-Slickgrid
+# [![Angular](https://avatars.githubusercontent.com/u/139426?s=65&v=4)](https://angular.io/) Angular-Slickgrid
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 [![TypeScript](https://img.shields.io/badge/%3C%2F%3E-TypeScript-%230074c1.svg)](http://www.typescriptlang.org/)
@@ -67,10 +67,6 @@ export class GridComponent implements OnInit {
     [dataset]="dataset">
 </angular-slickgrid>
 ```
-### Troubleshooting
-
-> [!WARNING]
-> Because of its use of native Custom Event, this project **does not** work well with `strictTemplates`, so please make sure to either disable `strictTemplates` or cast your event as `any` (see this [discussion](https://github.com/ghiscoding/Angular-Slickgrid/discussions/815) for more info)
 
 ### Styling Themes
 
@@ -143,7 +139,3 @@ Angular-Slickgrid uses [`ngx-translate`](https://github.com/ngx-translate/core)
 
 ### Tested with [Vitest](https://vitest.dev/) (Unit Tests) - [Cypress](https://www.cypress.io/) (E2E Tests)
 Slickgrid-Universal & Angular-Slickgrid both have **100%** Unit Test Coverage and also every Angular-Slickgrid Examples are fully tested with [Cypress](https://www.cypress.io/) as E2E tests.
-
-## Troubleshooting Section
-
-- [`strictTemplates` error](https://ghiscoding.gitbook.io/angular-slickgrid/getting-started/troubleshooting#stricttemplates-error)

package/fesm2022/angular-slickgrid.mjs

@@ -1,14 +1,14 @@
-import { unsubscribeAll, createDomElement, SlickRowSelectionModel, SlickEventData, castObservableToPromise, addToArrayWhenNotExists, DelimiterType, EventNamingStyle, Filters, SlickEventHandler, SlickgridConfig as SlickgridConfig$1, BackendUtilityService, GridEventService, SharedService, CollectionService, ExtensionUtility, FilterFactory, FilterService, ResizerService, SortService, TreeDataService, PaginationService, ExtensionService, GridStateService, GridService, HeaderGroupingService, emptyElement, SlickGroupItemMetadataProvider, SlickDataView, autoAddEditorFormatterToColumnsWithEditor, SlickGrid, ExtensionName, isColumnDateType } from '@slickgrid-universal/common';
+import { unsubscribeAll, createDomElement, SlickHybridSelectionModel, SlickRowSelectionModel, SlickEventData, castObservableToPromise, addToArrayWhenNotExists, DelimiterType, EventNamingStyle, Filters, SlickEventHandler, SlickgridConfig as SlickgridConfig$1, BackendUtilityService, GridEventService, SharedService, CollectionService, ExtensionUtility, FilterFactory, FilterService, ResizerService, SortService, TreeDataService, PaginationService, ExtensionService, GridStateService, GridService, HeaderGroupingService, emptyElement, SlickGroupItemMetadataProvider, SlickDataView, autoAddEditorFormatterToColumnsWithEditor, SlickGrid, ExtensionName, isColumnDateType } from '@slickgrid-universal/common';
 export * from '@slickgrid-universal/common';
 import * as i0 from '@angular/core';
-import { Injectable, Optional, EventEmitter, ContentChild, Input, Output, Inject, Component, NgModule } from '@angular/core';
+import { Injectable, Optional, EventEmitter, output, ContentChild, Input, Output, Inject, Component, NgModule } from '@angular/core';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
 import { SlickRowDetailView as SlickRowDetailView$1 } from '@slickgrid-universal/row-detail-view-plugin';
 import { Observable } from 'rxjs';
-import { EventPubSubService } from '@slickgrid-universal/event-pub-sub';
-import { SlickEmptyWarningComponent } from '@slickgrid-universal/empty-warning-component';
 import { SlickFooterComponent } from '@slickgrid-universal/custom-footer-component';
+import { SlickEmptyWarningComponent } from '@slickgrid-universal/empty-warning-component';
+import { EventPubSubService } from '@slickgrid-universal/event-pub-sub';
 import { SlickPaginationComponent } from '@slickgrid-universal/pagination-component';
 import { RxJsResource } from '@slickgrid-universal/rxjs-observable';
 import { extend } from '@slickgrid-universal/utils';
@@ -245,8 +245,8 @@ class SlickRowDetailView extends SlickRowDetailView$1 {
     }
     init(grid) {
         this._grid = grid;
-        super.init(this._grid);
-        this.register(grid?.getSelectionModel());
+        super.init(grid);
+        this.register(grid.getSelectionModel());
     }
     /**
      * Create the plugin before the Grid creation, else it will behave oddly.
@@ -266,16 +266,17 @@ class SlickRowDetailView extends SlickRowDetailView$1 {
             // load the Preload & RowDetail Templates (could be straight HTML or Angular View/ViewModel)
             // when those are Angular View/ViewModel, we need to create View Component & provide the html containers to the Plugin (preTemplate/postTemplate methods)
             if (!this.gridOptions.rowDetailView.preTemplate) {
-                this._preloadComponent = this.gridOptions?.rowDetailView?.preloadComponent;
+                this._preloadComponent = this.gridOptions.rowDetailView.preloadComponent;
                 this.addonOptions.preTemplate = () => createDomElement('div', { className: `${PRELOAD_CONTAINER_PREFIX}` });
             }
             if (!this.gridOptions.rowDetailView.postTemplate) {
-                this._viewComponent = this.gridOptions?.rowDetailView?.viewComponent;
+                this._viewComponent = this.gridOptions.rowDetailView.viewComponent;
                 this.addonOptions.postTemplate = (itemDetail) => createDomElement('div', { className: `${ROW_DETAIL_CONTAINER_PREFIX}${itemDetail[this.datasetIdPropName]}` });
             }
             // this also requires the Row Selection Model to be registered as well
             if (!rowSelectionPlugin || !this._grid.getSelectionModel()) {
-                rowSelectionPlugin = new SlickRowSelectionModel(this.gridOptions.rowSelectionOptions || { selectActiveRow: true });
+                const SelectionModelClass = this.gridOptions.enableHybridSelection ? SlickHybridSelectionModel : SlickRowSelectionModel;
+                rowSelectionPlugin = new SelectionModelClass(this.gridOptions.rowSelectionOptions || { selectActiveRow: true });
                 this._grid.setSelectionModel(rowSelectionPlugin);
             }
             // hook all events
@@ -339,7 +340,7 @@ class SlickRowDetailView extends SlickRowDetailView$1 {
                 // we need to redraw the open detail views if we change column position (column reorder)
                 this.eventHandler.subscribe(this._grid.onColumnsReordered, this.redrawAllViewComponents.bind(this, false));
                 // on row selection changed, we also need to redraw
-                if (this.gridOptions.enableRowSelection || this.gridOptions.enableCheckboxSelector) {
+                if (this.gridOptions.enableRowSelection || this.gridOptions.enableHybridSelection || this.gridOptions.enableCheckboxSelector) {
                     this.eventHandler.subscribe(this._grid.onSelectedRowsChanged, this.redrawAllViewComponents.bind(this, false));
                 }
                 // on sort, all row detail are collapsed so we can dispose of all the Views as well
@@ -949,6 +950,134 @@ class AngularSlickgridComponent {
     // make the columnDefinitions a 2-way binding so that plugin adding cols
     // are synched on user's side as well (RowMove, RowDetail, RowSelections)
     columnsChange = new EventEmitter(true);
+    // SlickGrid events
+    onActiveCellChanged = output();
+    onActiveCellPositionChanged = output();
+    onAddNewRow = output();
+    onAutosizeColumns = output();
+    onBeforeAppendCell = output();
+    onBeforeSearchChange = output();
+    onBeforeCellEditorDestroy = output();
+    onBeforeColumnsResize = output();
+    onBeforeDestroy = output();
+    onBeforeEditCell = output();
+    onBeforeHeaderCellDestroy = output();
+    onBeforeHeaderRowCellDestroy = output();
+    onBeforeFooterRowCellDestroy = output();
+    onBeforeSetColumns = output();
+    onBeforeSort = output();
+    onCellChange = output();
+    onCellCssStylesChanged = output();
+    onClick = output();
+    onColumnsDrag = output();
+    onColumnsReordered = output();
+    onColumnsResized = output();
+    onColumnsResizeDblClick = output();
+    onCompositeEditorChange = output();
+    onContextMenu = output();
+    onDrag = output();
+    onDragEnd = output();
+    onDragInit = output();
+    onDragStart = output();
+    onDragReplaceCells = output();
+    onDblClick = output();
+    onFooterContextMenu = output();
+    onFooterRowCellRendered = output();
+    onHeaderCellRendered = output();
+    onFooterClick = output();
+    onHeaderClick = output();
+    onHeaderContextMenu = output();
+    onHeaderMouseEnter = output();
+    onHeaderMouseLeave = output();
+    onHeaderRowCellRendered = output();
+    onHeaderRowMouseEnter = output();
+    onHeaderRowMouseLeave = output();
+    onKeyDown = output();
+    onMouseEnter = output();
+    onMouseLeave = output();
+    onValidationError = output();
+    onViewportChanged = output();
+    onRendered = output();
+    onSelectedRowsChanged = output();
+    onSetOptions = output();
+    onScroll = output();
+    onSort = output();
+    // DataView events
+    onBeforePagingInfoChanged = output();
+    onGroupExpanded = output();
+    onGroupCollapsed = output();
+    onPagingInfoChanged = output();
+    onRowCountChanged = output();
+    onRowsChanged = output();
+    onRowsOrCountChanged = output();
+    onSelectedRowIdsChanged = output();
+    onSetItemsCalled = output();
+    // other Slick Events
+    onAfterMenuShow = output();
+    onBeforeMenuClose = output();
+    onBeforeMenuShow = output();
+    onColumnsChanged = output();
+    onCommand = output();
+    onGridMenuColumnsChanged = output();
+    onMenuClose = output();
+    onCopyCells = output();
+    onCopyCancelled = output();
+    onPasteCells = output();
+    onBeforePasteCell = output();
+    // Slickgrid-Universal events
+    onAfterExportToExcel = output();
+    onBeforeExportToExcel = output();
+    onBeforeFilterChange = output();
+    onBeforeFilterClear = output();
+    onBeforeSortChange = output();
+    onContextMenuClearGrouping = output();
+    onContextMenuCollapseAllGroups = output();
+    onContextMenuExpandAllGroups = output();
+    onOptionSelected = output();
+    onColumnPickerColumnsChanged = output();
+    onGridMenuMenuClose = output();
+    onGridMenuBeforeMenuShow = output();
+    onGridMenuAfterMenuShow = output();
+    onGridMenuClearAllPinning = output();
+    onGridMenuClearAllFilters = output();
+    onGridMenuClearAllSorting = output();
+    onGridMenuCommand = output();
+    onHeaderButtonCommand = output();
+    onHeaderMenuCommand = output();
+    onHeaderMenuColumnResizeByContent = output();
+    onHeaderMenuBeforeMenuShow = output();
+    onHeaderMenuAfterMenuShow = output();
+    onHideColumns = output();
+    onItemsAdded = output();
+    onItemsDeleted = output();
+    onItemsUpdated = output();
+    onItemsUpserted = output();
+    onFullResizeByContentRequested = output();
+    onGridStateChanged = output();
+    onBeforePaginationChange = output();
+    onPaginationChanged = output();
+    onPaginationRefreshed = output();
+    onPaginationVisibilityChanged = output();
+    onPaginationSetCursorBased = output();
+    onGridBeforeResize = output();
+    onGridAfterResize = output();
+    onBeforeResizeByContent = output();
+    onAfterResizeByContent = output();
+    onSortCleared = output();
+    onFilterChanged = output();
+    onFilterCleared = output();
+    onSortChanged = output();
+    onTreeItemToggled = output();
+    onTreeFullToggleEnd = output();
+    onTreeFullToggleStart = output();
+    // Angular-Slickgrid specific events
+    onBeforeGridCreate = output();
+    onGridCreated = output();
+    onDataviewCreated = output();
+    onAngularGridCreated = output();
+    onBeforeGridDestroy = output();
+    onAfterGridDestroyed = output();
+    onLanguageChange = output();
     get dataset() {
         return (this.customDataView ? this.slickGrid?.getData?.() : this.dataView?.getItems()) || [];
     }
@@ -1026,8 +1155,8 @@ class AngularSlickgridComponent {
     get registeredResources() {
         return this._registeredResources;
     }
-    slickgridHeader;
-    slickgridFooter;
+    slickgridHeader = null;
+    slickgridFooter = null;
     constructor(angularUtilService, appRef, cd, containerService, elm, translate, translaterService, forRootConfig, externalServices) {
         this.angularUtilService = angularUtilService;
         this.appRef = appRef;
@@ -1332,7 +1461,8 @@ class AngularSlickgridComponent {
             }
             const datasetLn = this.dataView.getLength() || this._dataset?.length || 0;
             if (datasetLn > 0) {
-                if (!this._isDatasetInitialized && (this.options.enableCheckboxSelector || this.options.enableRowSelection)) {
+                if (!this._isDatasetInitialized &&
+                    (this.options.enableCheckboxSelector || this.options.enableRowSelection || this.options.enableHybridSelection)) {
                     this.loadRowSelectionPresetWhenExists();
                 }
                 this.loadFilterPresetsWhenDatasetInitialized();
@@ -1399,7 +1529,7 @@ class AngularSlickgridComponent {
         if (this.slickGrid &&
             !isSyncGridSelectionEnabled &&
             this.options?.backendServiceApi &&
-            (this.options.enableRowSelection || this.options.enableCheckboxSelector)) {
+            (this.options.enableRowSelection || this.options.enableHybridSelection || this.options.enableCheckboxSelector)) {
             this.slickGrid.setSelectedRows([]);
         }
         const { pageNumber, pageSize } = pagination;
@@ -1551,7 +1681,7 @@ class AngularSlickgridComponent {
             }
             this.subscriptions.push(this.translate.onLangChange.subscribe(({ lang }) => {
                 // publish event of the same name that Slickgrid-Universal uses on a language change event
-                this._eventPubSubService.publish('onLanguageChange');
+                this._eventPubSubService.publish('onLanguageChange', lang);
                 if (gridOptions.enableTranslate) {
                     this.extensionService.translateAllExtensions(lang);
                     if ((gridOptions.createPreHeaderPanel && gridOptions.createTopHeaderPanel) ||
@@ -1917,7 +2047,7 @@ class AngularSlickgridComponent {
     loadRowSelectionPresetWhenExists() {
         // if user entered some Row Selections "presets"
         const presets = this.options?.presets;
-        const enableRowSelection = this.options && (this.options.enableCheckboxSelector || this.options.enableRowSelection);
+        const enableRowSelection = this.options && (this.options.enableCheckboxSelector || this.options.enableRowSelection || this.options.enableHybridSelection);
         if (enableRowSelection &&
             this.slickGrid?.getSelectionModel() &&
             presets?.rowSelection &&
@@ -2154,19 +2284,11 @@ class AngularSlickgridComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AngularSlickgridComponent, deps: [{ token: AngularUtilService }, { token: i0.ApplicationRef }, { token: i0.ChangeDetectorRef }, { token: ContainerService }, { token: i0.ElementRef }, { token: i1.TranslateService, optional: true }, { token: TranslaterService, optional: true }, { token: 'config' }, { token: 'externalService' }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AngularSlickgridComponent, isStandalone: false, selector: "angular-slickgrid", inputs: { customDataView: "customDataView", gridId: "gridId", options: "options", paginationOptions: "paginationOptions", columns: "columns", dataset: "dataset", datasetHierarchical: "datasetHierarchical" }, outputs: { columnsChange: "columnsChange" }, providers: [
-            // make everything transient (non-singleton)
-            AngularUtilService,
-            TranslaterService,
-        ], queries: [{ propertyName: "slickgridHeader", first: true, predicate: ["slickgridHeader"], descendants: true, static: true }, { propertyName: "slickgridFooter", first: true, predicate: ["slickgridFooter"], descendants: true, static: true }], ngImport: i0, template: "<div id=\"slickGridContainer-{{ gridId }}\" class=\"gridPane\">\n  <ng-container *ngTemplateOutlet=\"slickgridHeader\"></ng-container>\n  <div attr.id=\"{{ gridId }}\" class=\"slickgrid-container\"></div>\n  <ng-container *ngTemplateOutlet=\"slickgridFooter\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], preserveWhitespaces: true });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AngularSlickgridComponent, isStandalone: false, selector: "angular-slickgrid", inputs: { customDataView: "customDataView", gridId: "gridId", options: "options", paginationOptions: "paginationOptions", columns: "columns", dataset: "dataset", datasetHierarchical: "datasetHierarchical" }, outputs: { columnsChange: "columnsChange", onActiveCellChanged: "onActiveCellChanged", onActiveCellPositionChanged: "onActiveCellPositionChanged", onAddNewRow: "onAddNewRow", onAutosizeColumns: "onAutosizeColumns", onBeforeAppendCell: "onBeforeAppendCell", onBeforeSearchChange: "onBeforeSearchChange", onBeforeCellEditorDestroy: "onBeforeCellEditorDestroy", onBeforeColumnsResize: "onBeforeColumnsResize", onBeforeDestroy: "onBeforeDestroy", onBeforeEditCell: "onBeforeEditCell", onBeforeHeaderCellDestroy: "onBeforeHeaderCellDestroy", onBeforeHeaderRowCellDestroy: "onBeforeHeaderRowCellDestroy", onBeforeFooterRowCellDestroy: "onBeforeFooterRowCellDestroy", onBeforeSetColumns: "onBeforeSetColumns", onBeforeSort: "onBeforeSort", onCellChange: "onCellChange", onCellCssStylesChanged: "onCellCssStylesChanged", onClick: "onClick", onColumnsDrag: "onColumnsDrag", onColumnsReordered: "onColumnsReordered", onColumnsResized: "onColumnsResized", onColumnsResizeDblClick: "onColumnsResizeDblClick", onCompositeEditorChange: "onCompositeEditorChange", onContextMenu: "onContextMenu", onDrag: "onDrag", onDragEnd: "onDragEnd", onDragInit: "onDragInit", onDragStart: "onDragStart", onDragReplaceCells: "onDragReplaceCells", onDblClick: "onDblClick", onFooterContextMenu: "onFooterContextMenu", onFooterRowCellRendered: "onFooterRowCellRendered", onHeaderCellRendered: "onHeaderCellRendered", onFooterClick: "onFooterClick", onHeaderClick: "onHeaderClick", onHeaderContextMenu: "onHeaderContextMenu", onHeaderMouseEnter: "onHeaderMouseEnter", onHeaderMouseLeave: "onHeaderMouseLeave", onHeaderRowCellRendered: "onHeaderRowCellRendered", onHeaderRowMouseEnter: "onHeaderRowMouseEnter", onHeaderRowMouseLeave: "onHeaderRowMouseLeave", onKeyDown: "onKeyDown", onMouseEnter: "onMouseEnter", onMouseLeave: "onMouseLeave", onValidationError: "onValidationError", onViewportChanged: "onViewportChanged", onRendered: "onRendered", onSelectedRowsChanged: "onSelectedRowsChanged", onSetOptions: "onSetOptions", onScroll: "onScroll", onSort: "onSort", onBeforePagingInfoChanged: "onBeforePagingInfoChanged", onGroupExpanded: "onGroupExpanded", onGroupCollapsed: "onGroupCollapsed", onPagingInfoChanged: "onPagingInfoChanged", onRowCountChanged: "onRowCountChanged", onRowsChanged: "onRowsChanged", onRowsOrCountChanged: "onRowsOrCountChanged", onSelectedRowIdsChanged: "onSelectedRowIdsChanged", onSetItemsCalled: "onSetItemsCalled", onAfterMenuShow: "onAfterMenuShow", onBeforeMenuClose: "onBeforeMenuClose", onBeforeMenuShow: "onBeforeMenuShow", onColumnsChanged: "onColumnsChanged", onCommand: "onCommand", onGridMenuColumnsChanged: "onGridMenuColumnsChanged", onMenuClose: "onMenuClose", onCopyCells: "onCopyCells", onCopyCancelled: "onCopyCancelled", onPasteCells: "onPasteCells", onBeforePasteCell: "onBeforePasteCell", onAfterExportToExcel: "onAfterExportToExcel", onBeforeExportToExcel: "onBeforeExportToExcel", onBeforeFilterChange: "onBeforeFilterChange", onBeforeFilterClear: "onBeforeFilterClear", onBeforeSortChange: "onBeforeSortChange", onContextMenuClearGrouping: "onContextMenuClearGrouping", onContextMenuCollapseAllGroups: "onContextMenuCollapseAllGroups", onContextMenuExpandAllGroups: "onContextMenuExpandAllGroups", onOptionSelected: "onOptionSelected", onColumnPickerColumnsChanged: "onColumnPickerColumnsChanged", onGridMenuMenuClose: "onGridMenuMenuClose", onGridMenuBeforeMenuShow: "onGridMenuBeforeMenuShow", onGridMenuAfterMenuShow: "onGridMenuAfterMenuShow", onGridMenuClearAllPinning: "onGridMenuClearAllPinning", onGridMenuClearAllFilters: "onGridMenuClearAllFilters", onGridMenuClearAllSorting: "onGridMenuClearAllSorting", onGridMenuCommand: "onGridMenuCommand", onHeaderButtonCommand: "onHeaderButtonCommand", onHeaderMenuCommand: "onHeaderMenuCommand", onHeaderMenuColumnResizeByContent: "onHeaderMenuColumnResizeByContent", onHeaderMenuBeforeMenuShow: "onHeaderMenuBeforeMenuShow", onHeaderMenuAfterMenuShow: "onHeaderMenuAfterMenuShow", onHideColumns: "onHideColumns", onItemsAdded: "onItemsAdded", onItemsDeleted: "onItemsDeleted", onItemsUpdated: "onItemsUpdated", onItemsUpserted: "onItemsUpserted", onFullResizeByContentRequested: "onFullResizeByContentRequested", onGridStateChanged: "onGridStateChanged", onBeforePaginationChange: "onBeforePaginationChange", onPaginationChanged: "onPaginationChanged", onPaginationRefreshed: "onPaginationRefreshed", onPaginationVisibilityChanged: "onPaginationVisibilityChanged", onPaginationSetCursorBased: "onPaginationSetCursorBased", onGridBeforeResize: "onGridBeforeResize", onGridAfterResize: "onGridAfterResize", onBeforeResizeByContent: "onBeforeResizeByContent", onAfterResizeByContent: "onAfterResizeByContent", onSortCleared: "onSortCleared", onFilterChanged: "onFilterChanged", onFilterCleared: "onFilterCleared", onSortChanged: "onSortChanged", onTreeItemToggled: "onTreeItemToggled", onTreeFullToggleEnd: "onTreeFullToggleEnd", onTreeFullToggleStart: "onTreeFullToggleStart", onBeforeGridCreate: "onBeforeGridCreate", onGridCreated: "onGridCreated", onDataviewCreated: "onDataviewCreated", onAngularGridCreated: "onAngularGridCreated", onBeforeGridDestroy: "onBeforeGridDestroy", onAfterGridDestroyed: "onAfterGridDestroyed", onLanguageChange: "onLanguageChange" }, providers: [AngularUtilService, TranslaterService], queries: [{ propertyName: "slickgridHeader", first: true, predicate: ["slickgridHeader"], descendants: true, static: true }, { propertyName: "slickgridFooter", first: true, predicate: ["slickgridFooter"], descendants: true, static: true }], ngImport: i0, template: "<div id=\"slickGridContainer-{{ gridId }}\" class=\"gridPane\">\n  <ng-container *ngTemplateOutlet=\"slickgridHeader\"></ng-container>\n  <div attr.id=\"{{ gridId }}\" class=\"slickgrid-container\"></div>\n  <ng-container *ngTemplateOutlet=\"slickgridFooter\"></ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], preserveWhitespaces: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AngularSlickgridComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'angular-slickgrid', providers: [
-                        // make everything transient (non-singleton)
-                        AngularUtilService,
-                        TranslaterService,
-                    ], standalone: false, template: "<div id=\"slickGridContainer-{{ gridId }}\" class=\"gridPane\">\n  <ng-container *ngTemplateOutlet=\"slickgridHeader\"></ng-container>\n  <div attr.id=\"{{ gridId }}\" class=\"slickgrid-container\"></div>\n  <ng-container *ngTemplateOutlet=\"slickgridFooter\"></ng-container>\n</div>\n" }]
+            args: [{ selector: 'angular-slickgrid', providers: [AngularUtilService, TranslaterService], standalone: false, template: "<div id=\"slickGridContainer-{{ gridId }}\" class=\"gridPane\">\n  <ng-container *ngTemplateOutlet=\"slickgridHeader\"></ng-container>\n  <div attr.id=\"{{ gridId }}\" class=\"slickgrid-container\"></div>\n  <ng-container *ngTemplateOutlet=\"slickgridFooter\"></ng-container>\n</div>\n" }]
         }], ctorParameters: () => [{ type: AngularUtilService }, { type: i0.ApplicationRef }, { type: i0.ChangeDetectorRef }, { type: ContainerService }, { type: i0.ElementRef }, { type: i1.TranslateService, decorators: [{
                     type: Optional
                 }] }, { type: TranslaterService, decorators: [{