@cdmx/wappler_ag_grid 1.3.9 → 1.4.0

package/README.md

@@ -60,23 +60,24 @@ To use the "Custom" theme, copy "ag-theme-custom.css" to public/css/ag-theme-cus
 19. **Row Height**: Height of each row in pixels. (Default: Auto)
 20. **Header Height**: Height of the header row in pixels. (Default: Auto)
 21. **Wrap Header Text**: This will cause long headers to wrap. (Default: true)
-22. **Auto Header Height**: The column header height is automatically set based on the content of the header cells. (Default: true)
-23. **Wrap Text**: This will cause long texts to wrap in the cells. (Default: false)
-24. **Suppress Row Click Selection**: Disables row selection on row click. (Default: false)
-25. **Suppress Menu Hide**: Prevents hiding the column menu. (Default: false)
-26. **Suppress Movable Columns**: Disables moving columns. (Default: false)
-27. **Enable Cell Expressions**: Enables expressions in cell values. (Default: false)
-28. **Animate Rows**: Enables row animation on data changes. (Default: false)
-29. **Suppress Aggregation Function in Header**: Hides the aggregation function in column headers. (Default: false)
-30. **Suppress Clipboard Paste**: Disables pasting data from the clipboard. (Default: false)
-31. **Suppress Scroll on New Data**: Prevents scrolling to newly added data. (Default: false)
-32. **Suppress Property Names Check**: Disables checking for duplicate property names. (Default: false)
-33. **Hide ID Field**: Hides the ID Field in the Grid. (Default: false)
-34. **Numeric Column Align**: Align numeric columns to the right. (Default: false)
-35. **Row Click Events**: Enables row click events. This can be used in Dynamic events => Grid Events => Row Clicked. (Default: false)
-36. **Row Double Click Events**: Enables row double click events. This can be used in Dynamic events => Grid Events => Row Double Clicked. (Default: false)
-37. **Enable Row Selection**: Enables row selection. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
-38. **Enable Row Status Toggle**: Enables row status toggle events. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
+22. **Auto Header Height**: The header height is automatically set based on the content of the header. (Default: true)
+23. **Auto Height**: The height is automatically set based on the content of the cells. (Default: false)
+24. **Wrap Text**: This will cause long texts to wrap in the cells. (Default: false)
+25. **Suppress Row Click Selection**: Disables row selection on row click. (Default: false)
+26. **Suppress Menu Hide**: Prevents hiding the column menu. (Default: false)
+27. **Suppress Movable Columns**: Disables moving columns. (Default: false)
+28. **Enable Cell Expressions**: Enables expressions in cell values. (Default: false)
+29. **Animate Rows**: Enables row animation on data changes. (Default: false)
+30. **Suppress Aggregation Function in Header**: Hides the aggregation function in column headers. (Default: false)
+31. **Suppress Clipboard Paste**: Disables pasting data from the clipboard. (Default: false)
+32. **Suppress Scroll on New Data**: Prevents scrolling to newly added data. (Default: false)
+33. **Suppress Property Names Check**: Disables checking for duplicate property names. (Default: false)
+34. **Hide ID Field**: Hides the ID Field in the Grid. (Default: false)
+35. **Numeric Column Align**: Align numeric columns to the right. (Default: false)
+36. **Row Click Events**: Enables row click events. This can be used in Dynamic events => Grid Events => Row Clicked. (Default: false)
+37. **Row Double Click Events**: Enables row double click events. This can be used in Dynamic events => Grid Events => Row Double Clicked. (Default: false)
+38. **Enable Row Selection**: Enables row selection. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
+39. **Enable Row Status Toggle**: Enables row status toggle events. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
 
 # Data Type Overrides
 

package/app_connect/components.hjson

@@ -411,7 +411,7 @@
               "title": "Auto Header Height",
               "type": "boolean",
               "defaultValue": true,
-              "help": "The column header height is automatically set based on the content of the header cells."
+              "help": "The header row height is automatically set based on the content of the header."
             },
             {
               "name": "wrapText",
@@ -421,6 +421,14 @@
               "defaultValue": false,
               "help": "This will cause long texts to wrap in the cells."
             },
+            {
+              "name": "autoHeight",
+              "attribute": "dmx-bind:auto_height",
+              "title": "Auto Height",
+              "type": "boolean",
+              "defaultValue": false,
+              "help": "The height is automatically set based on the content of the cells."
+            },
             {
               "name": "suppressRowClickSelection",
               "attribute": "dmx-bind:suppress_row_click_selection",

package/dmx-ag-grid.js

@@ -29,6 +29,7 @@ dmx.Component('ag-grid', {
     wrap_header_text: { type: Boolean, default: true },
     auto_header_height: { type: Boolean, default: true },
     wrap_text: { type: Boolean, default: false },
+    auto_height: { type: Boolean, default: false },
     data_changes: { type: Array, default: [] },
     display_data_changes: { type: Array, default: [] },
     js_data_changes: { type: Array, default: [] },
@@ -999,6 +1000,7 @@ dmx.Component('ag-grid', {
         function applyCellStyle(params) {
           const field = params.colDef.field.toString();
           const styles = cstyles.filter((cs) => cs.field === field);
+          const whiteSpace = options.wrap_text ? 'normal' : 'nowrap'
         
           for (const style of styles) {
             const condition = style.condition;
@@ -1011,13 +1013,15 @@ dmx.Component('ag-grid', {
               (params.data[left] !== null ? evaluateCondition(params.data[left], operator, right) : false)
             ) {
               if (area === 'text') {
-                return { color: customColor, fontStyle: font, fontWeight: (font==='bold'?'bold':null) };
+                return { color: customColor, fontStyle: font, fontWeight: (font==='bold'?'bold':null), whiteSpace: whiteSpace };
               } else if (area === 'cell') {
-                return { backgroundColor: customColor, fontStyle: font };
+                return { backgroundColor: customColor, fontStyle: font, whiteSpace: whiteSpace };
               }
             }
           }
-        
+          if (options.wrap_text) {
+            return { whiteSpace: 'normal' };
+          }
           return null;
         }
 
@@ -1272,7 +1276,7 @@ dmx.Component('ag-grid', {
         resizable: options.resizable,
         wrapHeaderText: options.wrap_header_text,
         autoHeaderHeight: options.auto_header_height,
-        wrapText: options.wrap_text,
+        autoHeight: options.auto_height,
         filter: options.filter,
         sortable: options.sortable,
         floatingFilter: options.floating_filter

package/package.json

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