@cdmx/wappler_ag_grid 0.3.7 → 0.3.9

package/app_connect/components.hjson

@@ -179,10 +179,10 @@
             },
             {
               "name": "rowSelection",
-              "attribute": "rowSelection",
+              "attribute": "row_selection",
               "title": "Row Selection",
               "type": "droplist",
-              "defaultValue": 'single',
+              "defaultValue": 'multiple',
               "values": [
               {title: 'Single', value: 'single'},
               {title: 'Muliple', value: 'multiple'}
@@ -970,6 +970,15 @@
           help: 'Reload the AG Grid',
           properties : []
         },
+        {
+          addTitle: 'Update Grid',
+          title : 'Update Grid',
+          name : 'updateGrid',
+          icon : 'fa fa-lg fa-play',
+          state : 'opened',
+          help: 'Update the AG Grid',
+          properties : []
+        }
       ],
       "children": [],
       "allowed_children": {},

package/dmx-ag-grid.js

@@ -18,7 +18,7 @@ dmx.Component('ag-grid', {
     data: { type: Array, default: [] },
     dom_layout: { type: String, default: 'autoHeight' },
     enable_cell_text_selection: { type: Boolean, default: true },
-    row_selection: { type: String, default: 'single' },
+    row_selection: { type: String, default: 'multiple' },
     suppress_row_deselection: { type: Boolean, default: false },
     pagination: { type: Boolean, default: true },
     pagination_page_size: { type: Number, default: 20 },
@@ -81,6 +81,12 @@ dmx.Component('ag-grid', {
       dmx.nextTick(function() {
         this.refreshGrid();
       }, this);
+    },
+    updateGrid: function () {
+      dmx.nextTick(function() {
+        console.log(this.data.gridInstance)
+        // this.updateGrid();
+      }, this);
     }
   },
 
@@ -96,6 +102,7 @@ dmx.Component('ag-grid', {
     let localeText;
     let columnDefs = [];
     let exportToCSV = this.props.export_to_csv;
+    let gridInstance = null; 
     this.$node.innerHTML = `<div id=${options.id}-grid class="${options.grid_theme}"></div>`;
     if (!rowData || rowData.length === 0) {
       console.error('No row data provided.');
@@ -638,7 +645,6 @@ dmx.Component('ag-grid', {
         actionsRenderer: actionsRenderer
       }
     };
-
     const gridDiv = document.getElementById(options.id+'-grid');
     
 
@@ -647,8 +653,9 @@ dmx.Component('ag-grid', {
       return;
     }
 
-    if (this.props.gridInstance) {
-      this.props.gridInstance.destroy(); // Destroy the previous grid instance if it exists
+    if (gridInstance) {
+        gridInstance.destroy();
+        gridInstance = null;
     }
     const gridConfig = {
       columnDefs: columnDefs,
@@ -656,7 +663,7 @@ dmx.Component('ag-grid', {
       ...gridOptions
     };
     // Create ag-Grid instance
-    new agGrid.Grid(gridDiv, gridConfig);
+    gridInstance = new agGrid.Grid(gridDiv, gridConfig);
     const gridElement = document.getElementById(options.id+'-grid');
     const gridContainer = gridElement.parentNode;
     // Add an event listener to the grid
@@ -753,6 +760,7 @@ dmx.Component('ag-grid', {
       gridContainer.parentNode.insertBefore(exportButton, gridContainer);
       exportButton.style.marginBottom = '10px';
     }
+    return gridInstance;
     
   },
 
@@ -776,7 +784,8 @@ dmx.Component('ag-grid', {
   update: function (props) {
     this.set('count', this.props.data.length);
     if (!dmx.equal(this.props.data, props.data)) {
-      this.refreshGrid();
+      let gridInstance = this.refreshGrid();
+      this.set('gridInstance', gridInstance);
     }
   },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "0.3.7",
+    "version": "0.3.9",
     "type": "module",
     "description": "App Connect module for AG Grid Table Generation",
     "license": "MIT",