@zeedhi/teknisa-components-common 1.107.2 → 1.109.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/teknisa-components-common",
-  "version": "1.107.2",
+  "version": "1.109.0",
   "description": "Teknisa Components Common",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -32,5 +32,5 @@
   "peerDependencies": {
     "@zeedhi/core": "^1.97.0"
   },
-  "gitHead": "22ed04e302519474cdb354aeb93ad1a29ad0407d"
+  "gitHead": "5b0e3a375f2b42bb3486f4b1bdf6b7dffcda1421"
 }

package/tests/unit/components/tek-datasource/rest-datasource.spec.ts

@@ -316,7 +316,7 @@ describe('TekRestDatasource', () => {
           search_in: [],
           page: 1,
           limit: 10,
-          search_in_params: '{}',
+          search_in_params: undefined,
         },
       });
     });

package/tests/unit/components/tek-grid/grid-filter-button.spec.ts

@@ -545,17 +545,17 @@ describe('TekGridFilterButton', () => {
 
       const dateComp = new Date(formElements[0]);
       dateComp.helperValue = 'TODAY';
-      dateComp.change({} as Event, {} as HTMLElement);
+      dateComp.changeEvent({} as Event, {} as HTMLElement);
       expect((instance.columns[0].filterProps as IFilterPropsComponent).helperValue).toBe('TODAY');
 
       const dateComp21 = new Date(formElements[1]);
       dateComp21.helperValue = 'TODAY';
-      dateComp21.change({} as Event, {} as HTMLElement);
+      dateComp21.changeEvent({} as Event, {} as HTMLElement);
       expect((instance.columns[1].filterProps as IFilterPropsComponent[])[0].helperValue).toBe('TODAY');
 
       const dateComp22 = new Date(formElements[2]);
       dateComp22.helperValue = 'TODAY';
-      dateComp22.change({} as Event, {} as HTMLElement);
+      dateComp22.changeEvent({} as Event, {} as HTMLElement);
       expect((instance.columns[1].filterProps as IFilterPropsComponent[])[1].helperValue).toBe('TODAY');
 
       spy.mockReset();

package/tests/unit/components/tek-grid/grid.spec.ts

@@ -4,6 +4,7 @@ import {
   Button, Dropdown, IModal, Modal, ModalService, Search, TextInput, Text, Report,
   AlertService,
   EmptyDataError,
+  IComponentRender,
 } from '@zeedhi/common';
 import {
   KeyMap, Http, Metadata, IDictionary, IEventParam,
@@ -13,11 +14,13 @@ import {
 import {
   ITekGrid,
   ITekGridFilterButton,
+  ITekGridGroupFooter,
   TekGrid, TekGridColumn, TekGridFilterButton, TekRestDatasource,
 } from '../../../../src';
 import { ReportFilter } from '../../../../src/utils';
 import { setClick, getChild } from '../../../__helpers__';
 import { flushPromises } from '../../../__helpers__/flush-promises-helper';
+import { TekGridDeleteRowsError } from '../../../../src/error/delete-rows-error';
 
 jest.mock('lodash.debounce', () => jest.fn((fn) => fn));
 
@@ -58,19 +61,19 @@ const createGroupedGrid = async (props: Partial<ITekGrid> = {}) => {
       uniqueKey: 'id',
       data: [
         {
-          id: '1', name: 'First', month: 11, department: 1,
+          id: '1', name: 'First', month: 11, department: 1, salary: 10,
         },
         {
-          id: '2', name: 'Second', month: 11, department: 1,
+          id: '2', name: 'Second', month: 11, department: 1, salary: 10,
         },
         {
-          id: '3', name: 'Third', month: 11, department: 2,
+          id: '3', name: 'Third', month: 11, department: 2, salary: 10,
         },
         {
-          id: '4', name: 'Fourth', month: 12, department: 1,
+          id: '4', name: 'Fourth', month: 12, department: 1, salary: 10,
         },
         {
-          id: '5', name: 'Fifth', month: 12, department: 2,
+          id: '5', name: 'Fifth', month: 12, department: 2, salary: 10,
         },
       ],
     },
@@ -81,6 +84,17 @@ const createGroupedGrid = async (props: Partial<ITekGrid> = {}) => {
   return grid;
 };
 
+const getNthFooter = (grid: TekGrid, n: number): ITekGridGroupFooter => {
+  const { groupedData } = grid;
+
+  return groupedData.filter((row) => row.groupFooter)[n] as ITekGridGroupFooter;
+};
+
+const getLastFooter = (grid: TekGrid) : ITekGridGroupFooter => {
+  const { groupedData } = grid;
+  return groupedData.filter((row) => row.groupFooter).reverse()[0] as ITekGridGroupFooter;
+};
+
 describe('TekGrid', () => {
   beforeEach(() => {
     // clear all metadata instances before testing
@@ -497,7 +511,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[1]);
+        const button = new Button(toolbarDiv.children[10]);
         const event = new Event('click');
         button.click(event, {} as HTMLElement);
         expect(spy).toBeCalled();
@@ -521,7 +535,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[1]);
+        const button = new Button(toolbarDiv.children[10]);
         const event = new Event('click');
         button.click(event, {} as HTMLElement);
         expect(beforeSaveCalled).toBeTruthy();
@@ -545,7 +559,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[1]);
+        const button = new Button(toolbarDiv.children[10]);
         button.click({ defaultPrevented: true } as Event, {} as HTMLElement);
         expect(beforeSaveCalled).toBeTruthy();
         expect(afterSaveCalled).toBeFalsy();
@@ -566,7 +580,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[2]);
+        const button = new Button(toolbarDiv.children[11]);
         const event = new Event('click');
         button.click(event, {} as HTMLElement);
         expect(spy).toBeCalled();
@@ -590,7 +604,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[2]);
+        const button = new Button(toolbarDiv.children[11]);
         const event = new Event('click');
         button.click(event, {} as HTMLElement);
         expect(beforeCancelCalled).toBeTruthy();
@@ -614,7 +628,7 @@ describe('TekGrid', () => {
       instance.onCreated();
       const toolbarDiv = instance.toolbarSlot[2];
       if (toolbarDiv.children) {
-        const button = new Button(toolbarDiv.children[2]);
+        const button = new Button(toolbarDiv.children[11]);
         button.click({ defaultPrevented: true } as Event, {} as HTMLElement);
         expect(beforeCancelCalled).toBeTruthy();
         expect(afterCancelCalled).toBeFalsy();
@@ -1965,6 +1979,79 @@ describe('TekGrid', () => {
     });
   });
 
+  describe('updateSummary()', () => {
+    it('should update aggregation data always using the visible cell value', async () => {
+      const instance = await createGroupedGrid({
+        columns: [
+          { name: 'id' },
+          { name: 'name' },
+          { name: 'department', grouped: true },
+          { name: 'salary', aggregation: 'SUM' },
+        ],
+      });
+
+      await flushPromises();
+      instance.buildGroupedData();
+
+      let firstFooter = getNthFooter(instance, 0);
+      let secondFooter = getNthFooter(instance, 1);
+      let thirdFooter = getNthFooter(instance, 2);
+      expect(firstFooter.salary).toBe(30);
+      expect(secondFooter.salary).toBe(20);
+      expect(thirdFooter.salary).toBe(50);
+
+      instance.editing = true;
+      instance.updateCell('1', 'salary', 20);
+
+      instance.updateSummary();
+
+      firstFooter = getNthFooter(instance, 0);
+      secondFooter = getNthFooter(instance, 1);
+      thirdFooter = getNthFooter(instance, 2);
+      expect(firstFooter.salary).toBe(40);
+      expect(secondFooter.salary).toBe(20);
+      expect(thirdFooter.salary).toBe(60);
+    });
+
+    it('should update aggregation data with many groups', async () => {
+      const instance = await createGroupedGrid({
+        columns: [
+          { name: 'id' },
+          { name: 'name' },
+          { name: 'month', grouped: true },
+          { name: 'department', grouped: true },
+          { name: 'salary', aggregation: 'SUM' },
+        ],
+      });
+
+      await flushPromises();
+      instance.buildGroupedData();
+
+      let firstFooter = getNthFooter(instance, 0);
+      let secondFooter = getNthFooter(instance, 1);
+      let thirdFooter = getNthFooter(instance, 2);
+      let lastFooter = getLastFooter(instance);
+      expect(firstFooter.salary).toBe(20);
+      expect(secondFooter.salary).toBe(10);
+      expect(thirdFooter.salary).toBe(30);
+      expect(lastFooter.salary).toBe(50);
+
+      instance.editing = true;
+      instance.updateCell('1', 'salary', 20);
+
+      instance.updateSummary();
+
+      firstFooter = getNthFooter(instance, 0);
+      secondFooter = getNthFooter(instance, 1);
+      thirdFooter = getNthFooter(instance, 2);
+      lastFooter = getLastFooter(instance);
+      expect(firstFooter.salary).toBe(30);
+      expect(secondFooter.salary).toBe(10);
+      expect(thirdFooter.salary).toBe(40);
+      expect(lastFooter.salary).toBe(60);
+    });
+  });
+
   describe('setSearch()', () => {
     let baseProps: ITekGrid;
     let httpSpy: jest.SpyInstance;
@@ -3113,4 +3200,141 @@ describe('TekGrid', () => {
       ]);
     });
   });
+
+  describe('toolbar creation', () => {
+    it('should render predefined items in toolbarConfig', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        toolbarConfig: ['addButton'],
+      });
+      grid.onCreated();
+
+      expect(grid.toolbarSlot.length).toBe(3);
+      const toolbarDiv = grid.toolbarSlot[2];
+      expect(toolbarDiv.children?.length).toBe(1);
+      expect(toolbarDiv.children?.[0].name).toContain('_add_tooltip');
+    });
+
+    it('should render custom components in toolbarConfig', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        toolbarConfig: [{ component: 'ZdButton', name: 'customButton' }],
+      });
+      grid.onCreated();
+
+      const toolbarDiv = grid.toolbarSlot[2];
+      expect(toolbarDiv.children?.length).toBe(1);
+      expect(toolbarDiv.children?.[0].name).toBe('customButton');
+    });
+
+    it('should alert about invalid items of string type in toolbarConfig', () => {
+      const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        toolbarConfig: ['invalidItem'],
+      });
+      grid.onCreated();
+
+      expect(warnSpy).toHaveBeenCalledWith('Predefined toolbar item "invalidItem" not found.');
+      warnSpy.mockRestore();
+    });
+
+    it('should alert about invalid items in toolbarConfig', () => {
+      const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        toolbarConfig: [123 as any],
+      });
+      grid.onCreated();
+
+      expect(warnSpy).toHaveBeenCalledWith('Invalid item in toolbarConfig:', 123);
+      warnSpy.mockRestore();
+    });
+  });
+
+  describe('addButtonClick', () => {
+    it('should set editingNewRows as true when editNewRowsOnly is enabled', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        addButton: true,
+        editNewRowsOnly: true,
+      });
+
+      (grid as any).gridBase.addButtonClick({ event: new Event('click') });
+
+      expect((grid as any).editingNewRows).toBe(true);
+    });
+  });
+
+  describe('deleteButtonClick', () => {
+    it('should throw TekGridDeleteRowsError when selectAllPages is true', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+        deleteButton: 'selection',
+        selectAllPages: true,
+      });
+
+      const deleteFn = () => {
+        (grid as any).gridBase.deleteButtonClick({ event: new Event('click') });
+      };
+
+      expect(deleteFn).toThrow(TekGridDeleteRowsError);
+    });
+  });
+
+  describe('reloadGrid', () => {
+    it('should call grid.reload() if beforeReload event is not prevented', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+      });
+      const reloadSpy = jest.spyOn(grid, 'reload');
+      const event = new Event('click');
+
+      (grid as any).gridBase.reloadGrid({ event });
+
+      expect(reloadSpy).toHaveBeenCalledTimes(1);
+
+      reloadSpy.mockRestore();
+    });
+
+    it('should not call grid.reload() if beforeReload event is prevented', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+      });
+      const reloadSpy = jest.spyOn(grid, 'reload');
+      const mockEvent = { defaultPrevented: true };
+
+      (grid as any).gridBase.reloadGrid({ event: mockEvent });
+
+      expect(reloadSpy).not.toHaveBeenCalled();
+
+      reloadSpy.mockRestore();
+    });
+  });
+
+  describe('toolbar creation', () => {
+    it('should create toolbar with default items', () => {
+      const grid = new TekGrid({
+        name: 'grid',
+        component: 'TekGrid',
+      });
+      const { gridBase } = grid as any;
+      delete (gridBase as any).defaultToolbar.title;
+      delete (gridBase as any).defaultToolbar.hideButton;
+
+      const toolbarSlot = gridBase.createToolbarProps();
+
+      expect(toolbarSlot.find((c: IComponentRender) => c.name?.includes('_title'))).toBeUndefined();
+      expect(toolbarSlot.find((c: IComponentRender) => c.name?.includes('_hideTooltip'))).toBeUndefined();
+      expect(toolbarSlot[0].name).toBe('grid_toolbarDiv');
+    });
+  });
 });

package/tests/unit/utils/grid-base/delete-rows-error.spec.ts

@@ -0,0 +1,24 @@
+import { TekGridDeleteRowsError } from '../../../../src/error/delete-rows-error';
+
+describe('TekGridDeleteRowsError', () => {
+  describe('constructor()', () => {
+    it('should create an instance of the error with the correct name and message', () => {
+      // Cria uma nova instância do erro
+      const error = new TekGridDeleteRowsError();
+
+      // Verifica se a instância foi criada corretamente
+      expect(error).toBeInstanceOf(TekGridDeleteRowsError);
+      expect(error).toBeInstanceOf(Error);
+
+      // Verifica se o nome do erro está correto
+      expect(error.name).toBe('TekGridDeleteRowsError');
+
+      // Verifica se a mensagem de erro está correta
+      expect(error.message).toBe(
+        'TekGrid can\'t automatically delete rows when selectAllPages property is true.'
+        + ' You should delete them manually using the beforeDelete event and preventing'
+        + ' the default execution',
+      );
+    });
+  });
+});

package/tests/unit/utils/grid-base/grid-controller.spec.ts

@@ -26,7 +26,7 @@ describe('GridController', () => {
         showReloadButton: true,
         actions: [{ name: 'button', component: 'ZdButton' }],
       });
-      grid.editing = true;
+      grid.editing = false;
       const instance = new GridController(grid);
       expect(instance.gridTitle).toBe('title');
       expect(instance.showAddButton).toBeFalsy();
@@ -39,15 +39,13 @@ describe('GridController', () => {
       expect(instance.showToolbar).toBeTruthy();
       expect(instance.toolbarStyle).toBe('');
       expect(instance.tooltipName).toBe('TEKGRID_HIDE');
-      expect(instance.showDivider2).toBeTruthy();
-      expect(instance.showDivider3).toBeTruthy();
       expect(instance.showColumnsButton).toBeTruthy();
       expect(instance.columnsButtonIgnore).toEqual([]);
       expect(instance.showLayoutOptionsButton).toBeTruthy();
       expect(instance.showReloadButton).toBeTruthy();
-      expect(instance.showDivider1).toBeTruthy();
-      expect(instance.isEditing).toBeTruthy();
-      expect(instance.isNotEditing).toBeFalsy();
+      expect(instance.showDivider).toBeTruthy();
+      expect(instance.isEditing).toBeFalsy();
+      expect(instance.isNotEditing).toBeTruthy();
       expect(instance.showEditButtons).toBeFalsy();
       expect(instance.disableDeleteButton).toBeTruthy();
       expect(instance.showModalFilterProps).toEqual(
@@ -94,7 +92,6 @@ describe('GridController', () => {
       });
       const instance = new GridController(grid);
 
-      expect(instance.showDivider3).toBeFalsy();
       expect(instance.showActionsButton).toBeFalsy();
       expect(instance.showExportButton).toBeFalsy();
       expect(instance.showSearchInput).toBeFalsy();
@@ -139,7 +136,6 @@ describe('GridController', () => {
       });
       const instance = new GridController(grid);
 
-      expect(instance.showDivider2).toBeFalsy();
       expect(instance.showActionsButton).toBeFalsy();
       expect(instance.showSearchInput).toBeFalsy();
       expect(instance.showColumnsButton).toBeFalsy();
@@ -163,7 +159,6 @@ describe('GridController', () => {
       });
       const instance = new GridController(grid);
 
-      expect(instance.showDivider1).toBeFalsy();
       expect(instance.showActionsButton).toBeFalsy();
       expect(instance.showSearchInput).toBeFalsy();
       expect(instance.showColumnsButton).toBeFalsy();
@@ -171,4 +166,102 @@ describe('GridController', () => {
       expect(instance.showReloadButton).toBeFalsy();
     });
   });
+  describe('showAddButton', () => {
+    it('should return true when addButton is true, not editing, and toolbar is open', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', addButton: true, editing: false,
+      });
+      const instance = new GridController(grid);
+      instance.openToolbar = true;
+      expect(instance.showAddButton).toBe(true);
+    });
+
+    it('should return false when grid is in editing mode', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', addButton: true, editing: true,
+      });
+      const instance = new GridController(grid);
+      expect(instance.showAddButton).toBe(true);
+    });
+
+    it('should return false when toolbar is closed', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', addButton: true, editing: false,
+      });
+      const instance = new GridController(grid);
+      instance.openToolbar = false;
+      expect(instance.showAddButton).toBe(false);
+    });
+  });
+
+  describe('disableDeleteButton', () => {
+    it('should be disabled if selectAllPages is true, allSelected is true, and all items are exceptions', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', deleteButton: 'selection', selectAllPages: true,
+      });
+      grid.datasource.total = 3;
+      grid.selectionState = { allSelected: true, except: [{ id: 1 }, { id: 2 }, { id: 3 }] };
+      const instance = new GridController(grid);
+      expect(instance.disableDeleteButton).toBe(true);
+    });
+
+    it('should be disabled if selectAllPages is true, allSelected is false, and no items are exceptions', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', deleteButton: 'selection', selectAllPages: true,
+      });
+      grid.selectionState = { allSelected: false, except: [] };
+      const instance = new GridController(grid);
+      expect(instance.disableDeleteButton).toBe(true);
+    });
+
+    it('should be enabled if selectAllPages is true and there is a valid selection', () => {
+      const grid = new TekGrid({
+        name: 'Grid', component: 'TekGrid', deleteButton: 'selection', selectAllPages: true,
+      });
+      grid.datasource.total = 5;
+      grid.selectionState = { allSelected: true, except: [{ id: 1 }] };
+      const instance = new GridController(grid);
+      expect(instance.disableDeleteButton).toBe(false);
+    });
+
+    it('should not be disabled when deleteButton is "none"', () => {
+      const grid = new TekGrid({ name: 'Grid', component: 'TekGrid', deleteButton: 'none' }); //
+      const instance = new GridController(grid);
+      expect(instance.disableDeleteButton).toBe(false);
+    });
+  });
+
+  describe('showEditButtons', () => {
+    it('deve retornar true quando o grid está em modo de edição e a propriedade showEditButtons é true', () => {
+      const grid = new TekGrid({
+        name: 'Grid',
+        component: 'TekGrid',
+      });
+      grid.editing = true;
+      const instance = new GridController(grid);
+      expect(instance.showEditButtons).toBe(true);
+    });
+
+    it('deve retornar false quando o grid não está em modo de edição', () => {
+      const grid = new TekGrid({
+        name: 'Grid',
+        component: 'TekGrid',
+        editing: false,
+        showEditButtons: true,
+      });
+      const instance = new GridController(grid);
+      expect(instance.showEditButtons).toBe(false);
+    });
+
+    it('deve retornar false quando a propriedade showEditButtons do grid é false', () => {
+      const grid = new TekGrid({
+        name: 'Grid',
+        component: 'TekGrid',
+        editing: true,
+        showEditButtons: false,
+      });
+      const instance = new GridController(grid);
+      expect(instance.showEditButtons).toBe(false);
+    });
+  });
 });

package/types/components/tek-grid/grid.d.ts

@@ -1,8 +1,8 @@
-import { GridEditable, IComponentRender } from '@zeedhi/common';
+import { GridEditable, IComponentRender, IGridColumnEditable, Input } from '@zeedhi/common';
 import { Datasource, IDictionary, IEventParam } from '@zeedhi/core';
 import { ITekGridAtoms } from '../../utils';
 import { TekGridColumn } from './grid-column';
-import { IGroupedData, IModalFilterProps, ITekGrid, ITekGridColumn, ITekGridEvents, ITekGridExportConfig } from './interfaces';
+import { IGroupedData, IModalFilterProps, ITekGrid, ITekGridColumn, ITekGridEvents, ITekGridExportConfig, ITekGridGroup, ITekGridGroupFooter } from './interfaces';
 import { TekGridLayoutOptions } from './layout-options';
 export declare class TekGrid extends GridEditable implements ITekGrid {
     title: string;
@@ -22,6 +22,10 @@ export declare class TekGrid extends GridEditable implements ITekGrid {
      * @public
      */
     dragColumns: boolean;
+    /**
+     * Components that will be rendered on toolbar slot
+     */
+    toolbarConfig: (IComponentRender | string)[];
     /**
      * Enables column resizing
      * @public
@@ -65,8 +69,8 @@ export declare class TekGrid extends GridEditable implements ITekGrid {
     groupColumnNames: string[];
     summaryColumns: TekGridColumn[];
     groupColumns: TekGridColumn[];
-    groupedData: IGroupedData[];
     private toolbarSlotProps;
+    groupedData: IGroupedData[];
     viewUpdateScrollData?: () => void;
     private gridBase;
     filterRelationsDatasource: Datasource;
@@ -129,12 +133,39 @@ export declare class TekGrid extends GridEditable implements ITekGrid {
     private initSummaryColumns;
     private addGroupHeader;
     private addGroupFooters;
+    /**
+     * Creates a group footer, calculating its summary data
+     * @param group Group to which this footer is related
+     * @param groupIndex Index of the group
+     * @returns new group footer
+     */
+    getGroupFooter(group: ITekGridGroup, groupIndex: number): ITekGridGroupFooter;
+    /**
+     * Gets all of the group headers that belong to the group at the specified index
+     * This method should be called only during the groups creation process because it depends on the
+     * group creation order (because it accesses lastGroupHeaderRow that changes during the creation process)
+     * @param groupIndex
+     * @returns
+     */
+    private getGroupHeaders;
+    /**
+     * Updates all footers summary data and the summary total
+     */
+    updateSummary(): void;
+    /**
+     * Takes a group footer and updates its summary data
+     */
+    private updateGroupFooterSummary;
+    /**
+     * Updates the total summary data
+     */
+    private updateSummaryTotal;
     private resetFooterVariables;
     private isUndefined;
     private calcSummaryValues;
     private calcSummary;
-    private addSummary;
-    private summaryData;
+    private getSummary;
+    private getSummaryData;
     openGroup(group: IDictionary<any>): void;
     isItemVisible(row: IDictionary<any>): any;
     private getGroupValue;
@@ -172,7 +203,7 @@ export declare class TekGrid extends GridEditable implements ITekGrid {
      */
     selectGroupClick(row: IDictionary<any>, isSelected: boolean, event: Event, element: HTMLElement): void;
     getAtomInstance<T>(key: keyof ITekGridAtoms): T;
-    getFilterInputs(columnName?: string): import("@zeedhi/common").Input[];
+    getFilterInputs(columnName?: string): Input[];
     isColumnSearchable(column: TekGridColumn): boolean;
     getColumn(name: string): TekGridColumn;
     /**
@@ -214,8 +245,21 @@ export declare class TekGrid extends GridEditable implements ITekGrid {
      * Checks if a row is a group header, adding typescript type-checking
      */
     private isGroupHeader;
+    /**
+     * Checks if a row is a group footer, adding typescript type-checking
+     */
+    private isGroupFooter;
+    /**
+     * Checks if a row is a summary, adding typescript type-checking
+     */
+    private isGroupSummary;
     /**
      * Checks if a row is the last grouping of the grid (the most internal grouping)
      */
     private isLastGrouping;
+    /**
+     * change event of editable components
+     * - override to call updateSummary on change
+     */
+    protected changeEditableComponent(column: IGridColumnEditable, row: IDictionary<any>, value: any, component?: Input): void;
 }

package/types/components/tek-grid/interfaces.d.ts

@@ -184,16 +184,18 @@ export interface ITekGridGroupFooter {
     groupHeaders: ITekGridGroupHeader[];
     groupLabel: string;
     groupValue: any;
+    [key: string]: any;
 }
+export declare type ITekGridSummaryTotal = ITekGridGroupFooter & {
+    [key: string]: any;
+};
 export declare type IGroupedData = (ITekGridGroupHeader & {
     [key: string]: any;
 }) | {
     [key: string]: any;
     groupFooter: boolean;
     groupSummary: boolean;
-} | (ITekGridGroupFooter & {
-    [key: string]: any;
-}) | {
+} | ITekGridSummaryTotal | {
     [key: string]: any;
     groupHeaders: ITekGridGroupHeader[];
 };