🤖 Merge PR DefinitelyTyped#64309 [tabulator-tables] add missing event…

… callbacks + fix some function return types by @lukecotter * style: move data callbacks to be together * feat: add tooltip event callbacks - TooltipOpened - TooltipClosed * fix: ColumnCalcParams to allow precision for default calcs * fix: add data promise return The returned promise for addData should be an array of components not a single component. * feat : add returned params to rowSelectionChanged event * feat: add missing event callbacks - pageSizeChanged - rowMoveCancelled * feat: add missing dataLoaderErrorTimeout option * feat: add missing scroll params added leftDir and topDir to scrollHorizontal and scrollVertical * style: apply prettier formatting https://github.com/DefinitelyTyped/DefinitelyTyped#common-mistakes
vicary · Jun 29, 2023 · 35e4afc · 35e4afc
1 parent 8b3a57a
commit 35e4afc
Show file tree

Hide file tree

Showing 2 changed files with 77 additions and 22 deletions.
diff --git a/types/tabulator-tables/index.d.ts b/types/tabulator-tables/index.d.ts
@@ -281,7 +281,16 @@ export interface OptionsPagination {
      * totalPages - Total pages in table
      * The function must return the contents of the counter, either the text value of the counter, valid HTML or a DOM node
      */
-    paginationCounter?: "rows" | "pages" | ((pageSize: number, currentRow: number, currentPage: number, totalRows: number, totalPages: number) => string|HTMLElement);
+    paginationCounter?:
+        | 'rows'
+        | 'pages'
+        | ((
+              pageSize: number,
+              currentRow: number,
+              currentPage: number,
+              totalRows: number,
+              totalPages: number,
+          ) => string | HTMLElement);
 
     /**
      * By default the counter will be displayed in the left of the table footer. If you would like it displayed in another element pass a DOM node or a CSS selector for that element.
@@ -507,6 +516,7 @@ export interface OptionsData {
     dataLoader?: boolean;
     dataLoaderLoading?: string | HTMLElement;
     dataLoaderError?: string;
+    dataLoaderErrorTimeout?: number;
     sortMode?: SortMode;
     filterMode?: SortMode;
 }
@@ -1602,7 +1612,7 @@ export type ColumnCalc =
     | 'count'
     | ((values: any[], data: any[], calcParams: {}) => any);
 
-export type ColumnCalcParams = (values: any, data: any) => any;
+export type ColumnCalcParams = { precision: number } | ((values: any, data: any) => any);
 
 export type Formatter =
     | 'plaintext'
@@ -2243,14 +2253,15 @@ export interface CellComponent {
 
 export interface EventCallBackMethods {
     validationFailed: (cell: CellComponent, value: any, validators: Validator[]) => void;
-    scrollHorizontal: (left: number) => void;
-    scrollVertical: (top: number) => void;
+    scrollHorizontal: (left: number, leftDir: boolean) => void;
+    scrollVertical: (top: number, topDir: boolean) => void;
     rowAdded: (row: RowComponent) => void;
     rowDeleted: (row: RowComponent) => void;
     rowMoving: (row: RowComponent) => void;
     rowMoved: (row: RowComponent) => void;
+    rowMoveCancelled: (row: RowComponent) => void;
     rowUpdated: (row: RowComponent) => void;
-    rowSelectionChanged: () => void;
+    rowSelectionChanged: (selectedData: any[], selectedRows: RowComponent[]) => void;
     rowSelected: (row: RowComponent) => void;
     rowDeselected: (row: RowComponent) => void;
     rowResized: (row: RowComponent) => void;
@@ -2277,6 +2288,7 @@ export interface EventCallBackMethods {
     dataTreeRowExpanded: (row: RowComponent, level: number) => void;
     dataTreeRowCollapsed: (row: RowComponent, level: number) => void;
     pageLoaded: (pageNo: number) => void;
+    pageSizeChanged: (pageSize: number) => void;
     headerClick: (event: UIEvent, column: ColumnComponent) => void;
     headerDblClick: (event: UIEvent, column: ColumnComponent) => void;
     headerContext: (event: UIEvent, column: ColumnComponent) => void;
@@ -2297,9 +2309,12 @@ export interface EventCallBackMethods {
     tableBuilding: () => void;
     tableBuilt: () => void;
     tableDestroyed: () => void;
+    dataChanged: (data: any[]) => void;
     dataLoading: (data: any[]) => void;
     dataLoaded: (data: any[]) => void;
-    dataChanged: (data: any[]) => void;
+    dataLoadError: (error: Error) => void;
+    dataProcessing: (data: any[]) => void;
+    dataProcessed: (data: any[]) => void;
     dataFiltering: (filters: Filter[]) => void;
     dataFiltered: (filters: Filter[], rows: RowComponent[]) => void;
     dataSorting: (sorters: SorterFromTable[]) => void;
@@ -2341,13 +2356,12 @@ export interface EventCallBackMethods {
     cellMouseOver: (event: UIEvent, cell: CellComponent) => void;
     cellMouseOut: (event: UIEvent, cell: CellComponent) => void;
     cellMouseMove: (event: UIEvent, cell: CellComponent) => void;
-    dataLoadError: (error: Error) => void;
-    dataProcessing: () => void;
-    dataProcessed: () => void;
     popupOpen: (cell: CellComponent) => void;
     popupClosed: (cell: CellComponent) => void;
     menuClosed: (cell: CellComponent) => void;
     menuOpened: (cell: CellComponent) => void;
+    TooltipClosed: (cell: CellComponent) => void;
+    TooltipOpened: (cell: CellComponent) => void;
 }
 
 declare class Tabulator {
@@ -2491,7 +2505,7 @@ declare class Tabulator {
     updateData: (data: Array<{}>) => Promise<void>;
 
     /** The addData method returns a promise, this can be used to run any other commands that have to be run after the data has been loaded into the table. By running them in the promise you ensure they are only run after the table has loaded the data. */
-    addData: (data?: Array<{}>, addToTop?: boolean, positionTarget?: RowLookup) => Promise<RowComponent>;
+    addData: (data?: Array<{}>, addToTop?: boolean, positionTarget?: RowLookup) => Promise<RowComponent[]>;
 
     /** If the data you are passing to the table contains a mix of existing rows to be updated and new rows to be added then you can call the updateOrAddData function. This will check each row object provided and update the existing row if available, or else create a new row with the data. */
     updateOrAddData: (data: Array<{}>) => Promise<RowComponent[]>;

diff --git a/types/tabulator-tables/tabulator-tables-tests.ts b/types/tabulator-tables/tabulator-tables-tests.ts
@@ -100,6 +100,19 @@ table
         // handle error updating data
     });
 
+table
+    .addData([
+        { id: 5, name: 'jane' },
+        { id: 7, name: 'hayley' },
+    ])
+    .then(rows => {
+        // rows - array of the row components for the rows updated or added
+        // run code after data has been updated
+    })
+    .catch(error => {
+        // handle error updating data
+    });
+
 table.updateData([
     { id: 1, name: 'bob', gender: 'male' },
     { id: 2, name: 'Jenny', gender: 'female' },
@@ -362,10 +375,30 @@ colDef.bottomCalc = (values, data, calcParams) => {
     return {};
 };
 
+colDef.bottomCalcParams = (values, data) => {
+    return {};
+};
+
+colDef.bottomCalcParams = { precision: 2 };
+
 colDef.bottomCalcFormatter = (cell, formatterParams, onRendered) => {
     return '';
 };
 
+colDef.topCalc = (values, data, calcParams) => {
+    return {};
+};
+
+colDef.topCalcParams = (values, data) => {
+    return {};
+};
+
+colDef.topCalcParams = { precision: 2 };
+
+colDef.topCalcFormatter = (cell, formatterParams, onRendered) => {
+    return '';
+};
+
 colDef.tooltip = (event: MouseEvent, cell: CellComponent, onRendered: (callback: () => void) => void) => {
     onRendered(() => {
         console.log('rendering occured');
@@ -966,6 +999,7 @@ table = new Tabulator('#test', {
     renderVerticalBuffer: 300,
     dataLoaderError: 'Error Loading Data',
     dataLoaderLoading: 'Data Loading',
+    dataLoaderErrorTimeout: 50,
     dataLoader: false,
     sortMode: 'remote',
     pagination: true,
@@ -1001,10 +1035,15 @@ table.on('dataLoadError', () => {});
 table.on('dataProcessing', () => {});
 table.on('dataProcessed', () => {});
 table.on('rowMoving', () => {});
+table.on('rowMoveCancelled', row => {});
+table.on('rowSelectionChanged', (selectedData, selectedRows) => {});
 table.off('dataProcessed');
 table.off('dataProcessed', dataProcessedEvent);
 table.off('rowMoving', () => {});
 table.on('cellClick', () => {});
+table.on('scrollHorizontal', (left, leftDir) => {});
+table.on('scrollVertical', (top, topDir) => {});
+table.on('pageSizeChanged', pageSize => {});
 table = Tabulator.findTable('#example-table')[0];
 table = TabulatorFull.findTable('#example-table')[0];
 
@@ -1194,6 +1233,8 @@ table.on('popupClosed', component => {});
 table.on('popupOpen', component => {});
 table.on('menuOpened', component => {});
 table.on('menuClosed', component => {});
+table.on('TooltipOpened', component => {});
+table.on('TooltipClosed', component => {});
 
 column.popup('test', 'bottom');
 
@@ -1202,34 +1243,34 @@ table = new Tabulator('#testPagination', {
     columns: [
         {
             field: 'test_inline',
-            title: 'Test inline'
-        }
+            title: 'Test inline',
+        },
     ],
     pagination: true,
-    paginationCounter: "rows"
+    paginationCounter: 'rows',
 });
 table = new Tabulator('#testPagination', {
     columns: [
         {
             field: 'test_inline',
-            title: 'Test inline'
-        }
+            title: 'Test inline',
+        },
     ],
     pagination: true,
-    paginationCounter: "pages"
+    paginationCounter: 'pages',
 });
 table = new Tabulator('#testPagination', {
     data: [],
     columns: [
         {
             field: 'test_inline',
-            title: 'Test inline'
-        }
+            title: 'Test inline',
+        },
     ],
     pagination: true,
     paginationCounter: (pageSize, currentRow, currentPage, totalRows, totalPages) => {
         return `${pageSize}, ${currentRow}, ${currentPage}, ${totalRows}, ${totalPages}`;
-    }
+    },
 });
 
 // Testing data loader element
@@ -1238,8 +1279,8 @@ table = new Tabulator('#testDataLoader', {
     columns: [
         {
             field: 'test_inline',
-            title: 'Test inline'
-        }
+            title: 'Test inline',
+        },
     ],
-    dataLoaderLoading: document.createElement("div") as HTMLElement
+    dataLoaderLoading: document.createElement('div') as HTMLElement,
 });