@cdmx/wappler_ag_grid 1.2.4 → 1.2.5

package/app_connect/components.hjson

@@ -85,11 +85,20 @@
               {title: 'Alpine', value: 'ag-theme-alpine'},
               {title: 'Balham', value: 'ag-theme-balham'},
               {title: 'Material', value: 'ag-theme-material'},
+              {title: 'Quartz', value: 'ag-theme-quartz'},
               {title: 'Custom', value: 'ag-theme-alpine ag-theme-custom'},
               {title: 'Base', value: 'ag-grid'}
               ],
               "help": "Select a theme for the grid"
             },
+            {
+              "name": "dark_mode",
+              "attribute": "dmx-bind:dark_mode",
+              "title": "Dark Mode",
+              "type": "boolean",
+              "defaultValue": true,
+              "help": "Enables dark mode"
+            },
             {
               "name": "locale_text",
               "attribute": "locale_text",
@@ -2264,6 +2273,10 @@
           "src": "../../../node_modules/ag-grid-community/styles/ag-theme-material.css",
           "dst": "css/ag-theme-material.css"
         },
+        {
+          "src": "../../../node_modules/ag-grid-community/styles/ag-theme-quartz.css",
+          "dst": "css/ag-theme-quartz.css"
+        },
         {
           "src": "../../../node_modules/moment/min/moment.min.js",
           "dst": "js/moment.min.js"
@@ -2333,6 +2346,10 @@
           "src": "css/ag-theme-material.css",
           "type": "css"
         },
+        {
+          "src": "css/ag-theme-quartz.css",
+          "type": "css"
+        },
         {
           "src": "css/switch-toggle-slider.css",
           "type": "css"

package/dmx-ag-grid.js

@@ -5,13 +5,19 @@ dmx.Component('ag-grid', {
     count: Number,
     fields: {},
     fileData: [],
-    selectedRows: []
+    selectedRows: [],
+    state: {
+      gridReady: !1,
+      firstDataRendered: !1,
+      rowDataUpdated: !1
+    }
   },
 
   attributes: {
     id: { default: null },
     noload: { type: Boolean, default: false },
     grid_theme: { type: String, default: 'ag-theme-alpine' },
+    dark_mode: { type: Boolean, default: false},
     column_defs: { type: Array, default: [] },
     tooltip_config: { type: Array, default: [] },
     custom_tooltip: { type: String, default: null },
@@ -359,7 +365,8 @@ dmx.Component('ag-grid', {
     let exportToCSV = this.props.export_to_csv;
     let gridInstance = null; 
     let cellRenderer;
-    this.$node.innerHTML = `<div id=${options.id}-grid class="${options.grid_theme}"></div>`;
+    const gridThemeClass = options.dark_mode ? `${options.grid_theme}-dark` : options.grid_theme;
+    this.$node.innerHTML = `<div id=${options.id}-grid class="${gridThemeClass}"></div>`;
     if (!rowData || rowData.length === 0) {
       console.error('No row data provided.');
       return;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "1.2.4",
+    "version": "1.2.5",
     "type": "module",
     "description": "App Connect module for AG Grid Table Generation.",
     "license": "MIT",
@@ -14,7 +14,7 @@
         "ag-grid"
     ],
     "dependencies": {
-        "ag-grid-community": "30.2.x",
+        "ag-grid-community": "31.0.x",
         "exceljs": "4.3.x",
         "moment": "2.29.x",
         "papaparse": "5.4.x"