@cdmx/wappler_ag_grid 1.2.7 → 1.2.9

package/README.md

@@ -42,8 +42,8 @@ To use the "Custom" theme, copy "ag-theme-custom.css" to public/css/ag-theme-cus
 9. **Suppress Row Deselection**: Specifies if rows can be deselected. (Default: false)
 10. **Pagination**: Enables pagination. (Default: true)
 11. **Auto Pagination**: Enables automatic pagination. (Default: false)
-12. **Page Size Selectors**: Allowed selectors for for page size. (Default: [20,50,100] ).
-13. **Pagination Page Size**: Number of rows to show per page. (Default: 20)
+12. **Page Limit Selectors**: Allowed selectors for for page size. (Default: [20,50,100] ).
+13. **Page Limit**: Number of rows to show per page. (Default: 20)
 14. **Row Selection**: Row Selection (single or multiple).
    - "Single"
    - "Multiple" (Default)
@@ -136,6 +136,8 @@ This grid allows you to define custom data changes for specific fields. The grid
 
 **Amount Fields** (Type: textbox, Default: null)
 - Define the fields where the comma-separation and float parsing need to be applied.
+**Amount Field Precision** (Type: number, Default: 2)
+- Define the precision to be used for currency fields.
 
 ---
 

package/app_connect/components.hjson

@@ -218,7 +218,7 @@
             {
               "name": "paginationPageSizeSelector",
               "attribute": "dmx-bind:pagination_page_size_selector",
-              "title": "Pagination Size Selectors",
+              "title": "Page Limit Selectors",
               "type": "text",
               "defaultValue": "[20,50,100]",
               "help": "Allowed selectors for for page size."
@@ -226,7 +226,7 @@
             {
               "name": "paginationPageSize",
               "attribute": "pagination_page_size",
-              "title": "Pagination Page Size",
+              "title": "Page Limit",
               "type": "number",
               "defaultValue": 20,
               "help": "Number of rows to show per page"

package/dmx-ag-grid.js

@@ -243,7 +243,7 @@ dmx.Component('ag-grid', {
   transactionUpdate: function () {
     // const oldRowData = this.get('oldData');
     const gridInstance = this.get('gridInstance');
-    const oldRowData = gridInstance.gridOptions.api.getModel().rowsToDisplay.map(row => row.data);
+    const oldRowData = gridInstance.getModel().rowsToDisplay.map(row => row.data);
     const newRowData = this.props.data;
     let transaction;
   
@@ -264,8 +264,8 @@ dmx.Component('ag-grid', {
       }
       
     if (gridInstance && gridInstance.gridOptions && transaction) {
-      gridInstance.gridOptions.api.applyTransaction(transaction);
-      gridInstance.gridOptions.api.refreshCells();
+      gridInstance.applyTransaction(transaction);
+      gridInstance.refreshCells();
     } else {
       console.error('AG Grid instance or transaction not found.');
     }
@@ -422,6 +422,14 @@ dmx.Component('ag-grid', {
       this.dispatchEvent('row_double_clicked')
     }
 
+    function actionsRendererForPinnedBottom(params) {
+      if (params.node && params.node.rowPinned === 'bottom') {
+        return ''; // Render an empty string for bottom pinned row
+      } else {
+        return actionsRenderer(params);
+      }
+    }
+
     function checkboxCellRenderer(params) {
       const idValue = params.data.id;
       const columnName = params.colDef.field;
@@ -1145,7 +1153,7 @@ dmx.Component('ag-grid', {
         colId: 'actionsColumn',
         filter: null,
         sortable: false,
-        cellRenderer: actionsRenderer,
+        cellRenderer: actionsRendererForPinnedBottom,
         minWidth: options.actions_column_min_width,
         maxWidth: options.actions_column_max_width,
         pinned: (options.pin_actions ? options.actions_column_position: undefined),
@@ -1322,24 +1330,27 @@ dmx.Component('ag-grid', {
         columnsToCount.forEach(function (colObj) {
           const col = colObj.field;
           const uniqueValuesToCount = colObj.unique_values.split(',');
-      
+          
           result[0][col] = 0;
           let uniqueValues = new Set();
-      
+          
           rowData.forEach(function (line) {
             if (line.index < rowData.length) {
               const value = line.data[col];
-              if (uniqueValuesToCount.includes(value) && !uniqueValues.has(value)) {
+              if (!isNaN(value) && uniqueValuesToCount.includes(value.toString()) && !uniqueValues.has(value)) {
+                uniqueValues.add(value);
+                result[0][col]++;
+              } else if (typeof value === 'string' && uniqueValuesToCount.includes(value) && !uniqueValues.has(value)) {
                 uniqueValues.add(value);
                 result[0][col]++;
               }
             }
           });
-      
+          
           result[0][col + '_unique_count'] = uniqueValues.size;
         });
       }
-      api.setPinnedBottomRowData(result);
+      api.setGridOption('pinnedBottomRowData', result);
     }
 
     const gridDiv = document.getElementById(options.id+'-grid');
@@ -1425,8 +1436,8 @@ dmx.Component('ag-grid', {
         filter: customFilter.filter
       };
     });
-    gridInstance.gridOptions.api.setFilterModel(filterModel);
-    gridInstance.gridOptions.api.onFilterChanged();
+    gridInstance.setFilterModel(filterModel);
+    gridInstance.onFilterChanged();
     }
 
     const gridElement = document.getElementById(options.id+'-grid');
@@ -1437,7 +1448,7 @@ dmx.Component('ag-grid', {
     const gridContainer = gridElement.parentNode;
     // Add an event listener to the grid
     if (options.row_checkbox_event) {
-      gridConfig.api.addEventListener('rowSelected', (event) => {
+      gridInstance.addEventListener('rowSelected', (event) => {
         if (event.node && event.node.isSelected()) {
           const rowData = event.node.data;
           this.set('data', rowData);
@@ -1513,7 +1524,7 @@ dmx.Component('ag-grid', {
       });
     }
     exportSelectedRows = () => {
-      const selectedRows = gridConfig.api.getSelectedRows();
+      const selectedRows = gridInstance.getSelectedRows();
       this.set('selectedRows', selectedRows);
     }
     function updateHoveringBarStyles() {
@@ -1596,7 +1607,7 @@ dmx.Component('ag-grid', {
           return params.value;
         },
       };
-      gridConfig.api.exportDataAsCsv(params);
+      gridInstance.exportDataAsCsv(params);
     };
     // Create the export button
     if (exportToCSV) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "1.2.7",
+    "version": "1.2.9",
     "type": "module",
     "description": "App Connect module for AG Grid Table Generation.",
     "license": "MIT",
@@ -15,7 +15,7 @@
     ],
     "dependencies": {
         "ag-grid-community": "31.0.x",
-        "exceljs": "4.3.x",
+        "exceljs": "4.4.x",
         "moment": "2.29.x",
         "papaparse": "5.4.x"
     },
@@ -24,3 +24,4 @@
         "publish-dry-run": "npm publish ./dist --access public --dry-run"
     }
 }
+