feat: auto-enabled external resources with their associated flags

ghiscoding · ghiscoding · commit 9983453e810d · 2026-02-06T00:45:48.000-05:00
diff --git a/demos/aurelia/src/examples/slickgrid/example18.ts b/demos/aurelia/src/examples/slickgrid/example18.ts
@@ -253,12 +253,13 @@ export class Example18 {
         initialGroupBy: ['duration'],
       },
       darkMode: this._darkMode,
-      enableTextExport: true,
-      enableExcelExport: true,
       excelExportOptions: { sanitizeDataExport: true },
       textExportOptions: { sanitizeDataExport: true },
       externalResources: [this.excelExportService, this.pdfExportService, this.textExportService],
-      enablePdfExport: true,
+      // -- NOTE: registered resources are auto-enabled
+      // enableTextExport: true,
+      // enablePdfExport: true,
+      // enableExcelExport: true,
       pdfExportOptions: {
         repeatHeadersOnEachPage: true, // defaults to true
         documentTitle: 'Grouping Grid',
diff --git a/demos/aurelia/test/cypress/e2e/example18.cy.ts b/demos/aurelia/test/cypress/e2e/example18.cy.ts
@@ -122,11 +122,10 @@ describe('Example 18 - Draggable Grouping & Aggregators', () => {
     it('should expand all rows with "Expand All" from context menu and expect all the Groups to be expanded and the Toogle All icon to be collapsed', () => {
       cy.get('#grid18').find('.slick-row .slick-cell:nth(1)').rightclick({ force: true });
 
-      cy.get('.slick-context-menu .slick-menu-command-list')
-        .find('.slick-menu-item')
-        .find('.slick-menu-content')
-        .contains('Expand all Groups')
-        .click();
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export in CSV format');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to Excel');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to PDF');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Expand all Groups').click();
 
       cy.get('#grid18').find('.slick-group-toggle.collapsed').should('have.length', 0);
 
diff --git a/demos/react/src/examples/slickgrid/Example18.tsx b/demos/react/src/examples/slickgrid/Example18.tsx
@@ -245,16 +245,17 @@ const Example18: React.FC = () => {
         initialGroupBy: ['duration'],
       },
       darkMode,
-      enableTextExport: true,
-      enableExcelExport: true,
       excelExportOptions: { sanitizeDataExport: true },
       textExportOptions: { sanitizeDataExport: true },
-      enablePdfExport: true,
       pdfExportOptions: {
         repeatHeadersOnEachPage: true, // defaults to true
         documentTitle: 'Grouping Grid',
       },
       externalResources: [excelExportService, pdfExportService, textExportService],
+      // -- NOTE: registered resources are auto-enabled
+      // enableTextExport: true,
+      // enablePdfExport: true,
+      // enableExcelExport: true,
     };
 
     setColumnDefinitions(columnDefinitions);
diff --git a/demos/react/test/cypress/e2e/example18.cy.ts b/demos/react/test/cypress/e2e/example18.cy.ts
@@ -122,11 +122,10 @@ describe('Example 18 - Draggable Grouping & Aggregators', () => {
     it('should expand all rows with "Expand All" from context menu and expect all the Groups to be expanded and the Toogle All icon to be collapsed', () => {
       cy.get('#grid18').find('.slick-row .slick-cell:nth(1)').rightclick({ force: true });
 
-      cy.get('.slick-context-menu .slick-menu-command-list')
-        .find('.slick-menu-item')
-        .find('.slick-menu-content')
-        .contains('Expand all Groups')
-        .click();
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export in CSV format');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to Excel');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to PDF');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Expand all Groups').click();
 
       cy.get('#grid18').find('.slick-group-toggle.collapsed').should('have.length', 0);
 
diff --git a/demos/vanilla/src/examples/example03.ts b/demos/vanilla/src/examples/example03.ts
@@ -355,9 +355,6 @@ export default class Example03 {
       enableAutoSizeColumns: true,
       enableAutoResize: true,
       enableCellNavigation: true,
-      enablePdfExport: true,
-      enableTextExport: true,
-      enableExcelExport: true,
       excelExportOptions: {
         exportWithFormatter: true,
       },
@@ -367,6 +364,10 @@ export default class Example03 {
         repeatHeadersOnEachPage: true, // defaults to true
       },
       externalResources: [new TextExportService(), this.excelExportService, this.pdfExportService],
+      // -- NOTE: registered resources are auto-enabled
+      // enableTextExport: true,
+      // enablePdfExport: true,
+      // enableExcelExport: true,
       enableFiltering: true,
       selectionOptions: {
         // True (Single Selection), False (Multiple Selections)
diff --git a/demos/vue/src/components/Example18.vue b/demos/vue/src/components/Example18.vue
@@ -243,12 +243,13 @@ function defineGrid() {
       initialGroupBy: ['duration'],
     },
     darkMode: darkMode.value,
-    enableTextExport: true,
-    enableExcelExport: true,
     excelExportOptions: { sanitizeDataExport: true },
     textExportOptions: { sanitizeDataExport: true },
     externalResources: [excelExportService, pdfExportService, textExportService],
-    enablePdfExport: true,
+    // -- NOTE: registered resources are auto-enabled
+    // enableTextExport: true,
+    // enableExcelExport: true,
+    // enablePdfExport: true,
     pdfExportOptions: {
       repeatHeadersOnEachPage: true, // defaults to true
       documentTitle: 'Grouping Grid',
diff --git a/demos/vue/test/cypress/e2e/example18.cy.ts b/demos/vue/test/cypress/e2e/example18.cy.ts
@@ -122,11 +122,10 @@ describe('Example 18 - Draggable Grouping & Aggregators', () => {
     it('should expand all rows with "Expand All" from context menu and expect all the Groups to be expanded and the Toogle All icon to be collapsed', () => {
       cy.get('#grid18').find('.slick-row .slick-cell:nth(1)').rightclick({ force: true });
 
-      cy.get('.slick-context-menu .slick-menu-command-list')
-        .find('.slick-menu-item')
-        .find('.slick-menu-content')
-        .contains('Expand all Groups')
-        .click();
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export in CSV format');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to Excel');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to PDF');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Expand all Groups').click();
 
       cy.get('#grid18').find('.slick-group-toggle.collapsed').should('have.length', 0);
 
diff --git a/docs/migrations/migration-to-10.x.md b/docs/migrations/migration-to-10.x.md
@@ -63,6 +63,10 @@ gridOptions = {
 };
 ```
 
+### External Resources are now auto-enabled
+
+This change does not require any change from the end user, but it is a change that you should probably be aware of nonetheless. The reason I've implemented that is because I forgot to enable them myself and typically if you wanted to load the resource, ten it's because you also want it enabled. So for example, if your register `ExcelExportService` then the library will now auto-enable the resource with its associated flag which in this case is `enableExcelExport:true`... unless the flag is already is disabled by the user, if so then it will skip that flag. Also just to be clear, the list of auto-enabled external resources is rather small, it will auto-enable the following resources: ExcelExportService, PdfExportService, TextExportService, CompositeEditorComponent and RowDetailView.
+
 ---
 
 {% hint style="note" %}
diff --git a/frameworks/angular-slickgrid/docs/migrations/migration-to-10.x.md b/frameworks/angular-slickgrid/docs/migrations/migration-to-10.x.md
@@ -88,6 +88,10 @@ gridOptions = {
 };
 ```
 
+### External Resources are now auto-enabled
+
+This change does not require any change from the end user, but it is a change that you should probably be aware of nonetheless. The reason I've implemented that is because I forgot to enable them myself and typically if you wanted to load the resource, ten it's because you also want it enabled. So for example, if your register `ExcelExportService` then the library will now auto-enable the resource with its associated flag which in this case is `enableExcelExport:true`... unless the flag is already is disabled by the user, if so then it will skip that flag. Also just to be clear, the list of auto-enabled external resources is rather small, it will auto-enable the following resources: ExcelExportService, PdfExportService, TextExportService, CompositeEditorComponent and RowDetailView.
+
 ### `ngx-translate` v17.x now required
 
 Because of the Angular v21 upgrade, the user (you) will also need to upgrade [`ngx-translate`](https://ngx-translate.org/) to its latest version 17.x.
diff --git a/frameworks/angular-slickgrid/src/demos/examples/example18.component.ts b/frameworks/angular-slickgrid/src/demos/examples/example18.component.ts
@@ -280,11 +280,12 @@ export class Example18Component implements OnInit, OnDestroy {
         initialGroupBy: ['duration'],
       },
       darkMode: this._darkMode,
-      enableTextExport: true,
-      enableExcelExport: true,
       excelExportOptions: { sanitizeDataExport: true },
       externalResources: [this.excelExportService, this.pdfExportService, this.textExportService],
-      enablePdfExport: true,
+      // -- NOTE: registered resources are auto-enabled
+      // enableTextExport: true,
+      // enablePdfExport: true,
+      // enableExcelExport: true,
       pdfExportOptions: {
         repeatHeadersOnEachPage: true, // defaults to true
         documentTitle: 'Grouping Grid',
diff --git a/frameworks/angular-slickgrid/src/library/components/angular-slickgrid.component.ts b/frameworks/angular-slickgrid/src/library/components/angular-slickgrid.component.ts
@@ -31,6 +31,7 @@ import {
   HeaderGroupingService,
   isColumnDateType,
   PaginationService,
+  PluginFlagMappings,
   ResizerService,
   SharedService,
   SlickDataView,
@@ -753,15 +754,14 @@ export class AngularSlickgridComponent<TData = any> implements AfterViewInit, On
       this.slickGrid.registerPlugin(this.groupItemMetadataProvider); // register GroupItemMetadataProvider when Grouping is enabled
     }
 
+    // get any possible Services that user want to register
+    this.registerResources();
+
     this.extensionService.bindDifferentExtensions();
     this.bindDifferentHooks(this.slickGrid, this.options, this.dataView);
 
     // when it's a frozen grid, we need to keep the frozen column id for reference if we ever show/hide column from ColumnPicker/GridMenu afterward
     this.sharedService.frozenVisibleColumnId = this.slickGrid.getFrozenColumnId();
-
-    // get any possible Services that user want to register
-    this.registerResources();
-
     // initialize the SlickGrid grid
     this.slickGrid.init();
 
@@ -1618,12 +1618,28 @@ export class AngularSlickgridComponent<TData = any> implements AfterViewInit, On
     }
   }
 
+  /** initialized & auto-enable external registered resources, e.g. if user registers `ExcelExportService` then let's auto-enable `enableExcelExport:true` */
+  protected autoEnableInitializedResources(resource: ExternalResource): void {
+    if (this.slickGrid && typeof (resource as ExternalResource).init === 'function') {
+      (resource as ExternalResource).init!(this.slickGrid, this.containerService);
+    }
+
+    // auto-enable unless the flag was specifically disabled by the end user
+    if ('className' in (resource as ExternalResource)) {
+      const pluginFlagName = PluginFlagMappings.get((resource as ExternalResource).className!);
+      if (pluginFlagName && this.options[pluginFlagName] !== false) {
+        this.options[pluginFlagName] = true;
+        this.slickGrid?.setOptions({ [pluginFlagName]: true });
+      }
+    }
+  }
+
   protected initializeExternalResources(resources: Array<ExternalResource | ExternalResourceConstructor>) {
+    PluginFlagMappings.set('AngularSlickRowDetailView', 'enableRowDetailView');
+
     if (Array.isArray(resources)) {
       for (const resource of resources) {
-        if (this.slickGrid && typeof (resource as ExternalResource).init === 'function') {
-          (resource as ExternalResource).init!(this.slickGrid, this.containerService);
-        }
+        this.autoEnableInitializedResources(resource);
       }
     }
   }
diff --git a/frameworks/angular-slickgrid/test/cypress/e2e/example18.cy.ts b/frameworks/angular-slickgrid/test/cypress/e2e/example18.cy.ts
@@ -122,11 +122,10 @@ describe('Example 18 - Draggable Grouping & Aggregators', () => {
     it('should expand all rows with "Expand All" from context menu and expect all the Groups to be expanded and the Toogle All icon to be collapsed', () => {
       cy.get('#grid18').find('.slick-row .slick-cell:nth(1)').rightclick({ force: true });
 
-      cy.get('.slick-context-menu .slick-menu-command-list')
-        .find('.slick-menu-item')
-        .find('.slick-menu-content')
-        .contains('Expand all Groups')
-        .click();
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export in CSV format');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to Excel');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Export to PDF');
+      cy.get('.slick-context-menu .slick-menu-command-list').find('.slick-menu-content').contains('Expand all Groups').click();
 
       cy.get('#grid18').find('.slick-group-toggle.collapsed').should('have.length', 0);
 
diff --git a/frameworks/aurelia-slickgrid/docs/migrations/migration-to-10.x.md b/frameworks/aurelia-slickgrid/docs/migrations/migration-to-10.x.md
@@ -84,6 +84,10 @@ gridOptions = {
 };
 ```
 
+### External Resources are now auto-enabled
+
+This change does not require any change from the end user, but it is a change that you should probably be aware of nonetheless. The reason I've implemented that is because I forgot to enable them myself and typically if you wanted to load the resource, ten it's because you also want it enabled. So for example, if your register `ExcelExportService` then the library will now auto-enable the resource with its associated flag which in this case is `enableExcelExport:true`... unless the flag is already is disabled by the user, if so then it will skip that flag. Also just to be clear, the list of auto-enabled external resources is rather small, it will auto-enable the following resources: ExcelExportService, PdfExportService, TextExportService, CompositeEditorComponent and RowDetailView.
+
 ---
 
 {% hint style="note" %}
diff --git a/frameworks/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts b/frameworks/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts
@@ -32,6 +32,7 @@ import {
   HeaderGroupingService,
   isColumnDateType,
   PaginationService,
+  PluginFlagMappings,
   ResizerService,
   SharedService,
   SlickDataView,
@@ -404,15 +405,15 @@ export class AureliaSlickgridCustomElement {
       this.grid.registerPlugin(this.groupItemMetadataProvider); // register GroupItemMetadataProvider when Grouping is enabled
     }
 
+    // get any possible Services that user want to register
+    this.registerResources();
+
     this.extensionService.bindDifferentExtensions();
     this.bindDifferentHooks(this.grid, this.options, this.dataview);
 
     // when it's a frozen grid, we need to keep the frozen column id for reference if we ever show/hide column from ColumnPicker/GridMenu afterward
     this.sharedService.frozenVisibleColumnId = this.grid.getFrozenColumnId();
 
-    // get any possible Services that user want to register
-    this.registerResources();
-
     // initialize the SlickGrid grid
     this.grid.init();
 
@@ -1479,12 +1480,28 @@ export class AureliaSlickgridCustomElement {
     this._registeredResources = [];
   }
 
+  /** initialized & auto-enable external registered resources, e.g. if user registers `ExcelExportService` then let's auto-enable `enableExcelExport:true` */
+  protected autoEnableInitializedResources(resource: ExternalResource): void {
+    if (this.grid && typeof (resource as ExternalResource).init === 'function') {
+      (resource as ExternalResource).init!(this.grid, this.containerService);
+    }
+
+    // auto-enable unless the flag was specifically disabled by the end user
+    if ('className' in (resource as ExternalResource)) {
+      const pluginFlagName = PluginFlagMappings.get((resource as ExternalResource).className!);
+      if (pluginFlagName && this.options[pluginFlagName] !== false) {
+        this.options[pluginFlagName] = true;
+        this.grid?.setOptions({ [pluginFlagName]: true });
+      }
+    }
+  }
+
   protected initializeExternalResources(resources: Array<ExternalResource | ExternalResourceConstructor>) {
+    PluginFlagMappings.set('AureliaSlickRowDetailView', 'enableRowDetailView');
+
     if (Array.isArray(resources)) {
       for (const resource of resources) {
-        if (this.grid && typeof (resource as ExternalResource).init === 'function') {
-          (resource as ExternalResource).init!(this.grid, this.containerService);
-        }
+        this.autoEnableInitializedResources(resource);
       }
     }
   }
diff --git a/frameworks/slickgrid-react/docs/migrations/migration-to-10.x.md b/frameworks/slickgrid-react/docs/migrations/migration-to-10.x.md
@@ -84,6 +84,10 @@ gridOptions = {
 };
 ```
 
+### External Resources are now auto-enabled
+
+This change does not require any change from the end user, but it is a change that you should probably be aware of nonetheless. The reason I've implemented that is because I forgot to enable them myself and typically if you wanted to load the resource, ten it's because you also want it enabled. So for example, if your register `ExcelExportService` then the library will now auto-enable the resource with its associated flag which in this case is `enableExcelExport:true`... unless the flag is already is disabled by the user, if so then it will skip that flag. Also just to be clear, the list of auto-enabled external resources is rather small, it will auto-enable the following resources: ExcelExportService, PdfExportService, TextExportService, CompositeEditorComponent and RowDetailView.
+
 ---
 
 {% hint style="note" %}
diff --git a/frameworks/slickgrid-react/src/components/slickgrid-react.tsx b/frameworks/slickgrid-react/src/components/slickgrid-react.tsx
@@ -14,6 +14,7 @@ import {
   HeaderGroupingService,
   isColumnDateType,
   PaginationService,
+  PluginFlagMappings,
   ResizerService,
   SharedService,
   SlickDataView,
@@ -535,15 +536,15 @@ export class SlickgridReact<TData = any> extends React.Component<SlickgridReactP
       this.grid.registerPlugin(this.groupItemMetadataProvider); // register GroupItemMetadataProvider when Grouping is enabled
     }
 
+    // get any possible Services that user want to register
+    this.registerResources();
+
     this.extensionService.bindDifferentExtensions();
     this.bindDifferentHooks(this.grid, this._options, this.dataView);
 
     // when it's a frozen grid, we need to keep the frozen column id for reference if we ever show/hide column from ColumnPicker/GridMenu afterward
     this.sharedService.frozenVisibleColumnId = this.grid.getFrozenColumnId();
 
-    // get any possible Services that user want to register
-    this.registerResources();
-
     // initialize the SlickGrid grid
     this.grid.init();
 
@@ -1586,12 +1587,28 @@ export class SlickgridReact<TData = any> extends React.Component<SlickgridReactP
     }
   }
 
+  /** initialized & auto-enable external registered resources, e.g. if user registers `ExcelExportService` then let's auto-enable `enableExcelExport:true` */
+  protected autoEnableInitializedResources(resource: ExternalResource): void {
+    if (this.grid && typeof (resource as ExternalResource).init === 'function') {
+      (resource as ExternalResource).init!(this.grid, this.props.containerService);
+    }
+
+    // auto-enable unless the flag was specifically disabled by the end user
+    if ('className' in (resource as ExternalResource)) {
+      const pluginFlagName = PluginFlagMappings.get((resource as ExternalResource).className!);
+      if (pluginFlagName && this.options[pluginFlagName] !== false) {
+        this.options[pluginFlagName] = true;
+        this.grid?.setOptions({ [pluginFlagName]: true });
+      }
+    }
+  }
+
   protected initializeExternalResources(resources: Array<ExternalResource | ExternalResourceConstructor>) {
+    PluginFlagMappings.set('ReactSlickRowDetailView', 'enableRowDetailView');
+
     if (Array.isArray(resources)) {
       for (const resource of resources) {
-        if (this.grid && typeof (resource as ExternalResource).init === 'function') {
-          (resource as ExternalResource).init!(this.grid, this.props.containerService);
-        }
+        this.autoEnableInitializedResources(resource);
       }
     }
   }
diff --git a/frameworks/slickgrid-vue/docs/migrations/migration-to-10.x.md b/frameworks/slickgrid-vue/docs/migrations/migration-to-10.x.md
diff --git a/frameworks/slickgrid-vue/src/components/SlickgridVue.vue b/frameworks/slickgrid-vue/src/components/SlickgridVue.vue
diff --git a/packages/common/src/global-grid-options.ts b/packages/common/src/global-grid-options.ts
diff --git a/packages/common/src/interfaces/externalResource.interface.ts b/packages/common/src/interfaces/externalResource.interface.ts
diff --git a/packages/composite-editor-component/src/slick-composite-editor.component.ts b/packages/composite-editor-component/src/slick-composite-editor.component.ts
diff --git a/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts b/packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts
diff --git a/packages/vanilla-force-bundle/src/vanilla-force-bundle.ts b/packages/vanilla-force-bundle/src/vanilla-force-bundle.ts
diff --git a/test/cypress/e2e/example03.cy.ts b/test/cypress/e2e/example03.cy.ts
