@cdmx/wappler_ag_grid 0.5.7 → 0.5.9

package/app_connect/components.hjson

@@ -438,6 +438,14 @@
               "defaultValue": false,
               "help": "Hides the ID Field in Grid"
             },
+            {
+              "name": "numericColumnAlign",
+              "attribute": "dmx-bind:numeric_column_align",
+              "title": "Right Align Numeric Columns",
+              "type": "boolean",
+              "defaultValue": false,
+              "help": "Align numeric columns to the right."
+            },
             {
               "name": "rowClickEvent",
               "attribute": "dmx-bind:row_click_event",
@@ -1044,6 +1052,52 @@
             }
           ]
         },
+        {
+          "group": "📒 Compact View",
+          "variables": [
+            {
+              "name": "compact_view",
+              "title": "Compact View Config",
+              "type": "boolean",
+              "defaultValue": false,
+              "display": "fieldset",
+              "show": [
+                "compactView",
+                "compactViewGridSize",
+                "compactViewItemHeight"
+              ],
+              "noChangeOnHide": true,
+              "groupEnabler": true,
+              "help": "Configure amount fields to have comma-seperation implemented"
+              "children": [
+                {
+                  "name": "compactView",
+                  "attribute": "dmx-bind:compact_view",
+                  "title": "Compact View",
+                  "type": "boolean",
+                  "defaultValue": false,
+                  "initDisplay": "none"
+                },
+                {
+                  "name": "compactViewGridSize",
+                  "attribute": "compact_view_grid_size",
+                  "title": "Grid Size",
+                  "type": "number",
+                  "defaultValue": 3,
+                  "initDisplay": "none"
+                },
+                {
+                  "name": "compactViewItemHeight",
+                  "attribute": "compact_view_item_height",
+                  "title": "Grid Item Height",
+                  "type": "number",
+                  "defaultValue": 20,
+                  "initDisplay": "none"
+                }
+              ]
+            }
+          ]
+        },
         {
           "group": "📒 Configure Actions Column",
           "variables": [

package/dmx-ag-grid.js

@@ -38,6 +38,7 @@ dmx.Component('ag-grid', {
     suppress_scroll_on_new_data: { type: Boolean, default: false },
     suppress_property_names_check: { type: Boolean, default: false },
     hide_id_field: { type: Boolean, default: false },
+    numeric_column_align: { type: Boolean, default: false },
     enable_rtl: { type: Boolean, default: false },
     locale_text: { type: String, default: null },
     date_locale: { type: String, default: 'en-IN' },
@@ -81,7 +82,10 @@ dmx.Component('ag-grid', {
     data_binded_changes: {type: Array, default: [] },
     hide_fields: {type: Array, default: [] },
     hide_filters: {type: Array, default: [] },
-    hide_sort: {type: Array, default: [] }
+    hide_sort: {type: Array, default: [] },
+    compact_view: { type: Boolean, default: false },
+    compact_view_grid_size: { type: Number, default: 3 },
+    compact_view_item_height: { type: Number, default: 20 }
   },
 
   methods: {
@@ -537,9 +541,12 @@ dmx.Component('ag-grid', {
         let minWidth;
         let hide;
         let colId;
-        
+
         if (dataType === 'number') {
           filter = 'agNumberColumnFilter';
+          if (options.numeric_column_align){
+            type = 'numericColumn';
+          }
           if (options.amount_fields && options.amount_fields.includes(key)) {
             valueFormatter = function (params) {
               if (params.value != null) {
@@ -695,6 +702,7 @@ dmx.Component('ag-grid', {
           valueGetter: valueGetter,
           minWidth: minWidth,
           hide: hide,
+          type: type,
           sortable: sortable,
           filterValueGetter: filterValueGetter,
           filterParams: filterParams,
@@ -854,6 +862,10 @@ dmx.Component('ag-grid', {
     // Create ag-Grid instance
     gridInstance = new agGrid.Grid(gridDiv, gridConfig);
     const gridElement = document.getElementById(options.id+'-grid');
+    if (options.compact_view) {
+      gridElement.style.setProperty('--ag-grid-size', `${options.compact_view_grid_size}`+'px');
+      gridElement.style.setProperty('--ag-list-item-height', `${options.compact_view_item_height}`+'px');
+    }
     const gridContainer = gridElement.parentNode;
     // Add an event listener to the grid
     if (options.row_checkbox_event) {

package/package.json

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