@cdmx/wappler_ag_grid 2.0.7 → 2.0.8

package/README.md

@@ -86,6 +86,17 @@ The overrides for the "Custom" theme can be applied in the ag-theme-custom.css f
 
 To use the "Custom" theme, copy "ag-theme-custom.css" to public/css/ag-theme-custom.css and include it in your layout file.
 
+**Important CSS Fix for Custom Theme:**
+When using the custom theme, you may notice that the magnification lens icon on filter search overlaps with the text while typing. To fix this issue, add the following CSS to your custom theme file:
+
+```css
+.ag-input-wrapper:before {
+    content: unset !important;
+}
+```
+
+This CSS rule removes the pseudo-element that creates the overlapping magnification lens icon, ensuring proper text visibility during filter input.
+
 
 ## AG Grid Options
 1. **Minimum Width**: The minimum width of the column. (Default: 150)

package/dmx-ag-grid.js

@@ -1109,7 +1109,7 @@ dmx.Component('ag-grid', {
         else if (Array.isArray(options.tooltip_config)) {
           for (const config of options.tooltip_config) {
             if (config.field === key && config.tooltip === "yes") {
-                return value;
+              return value;
             }
           }
         }
@@ -1204,6 +1204,35 @@ dmx.Component('ag-grid', {
 
         if (dataType === 'number') {
           filter = 'agNumberColumnFilter';
+          const baseFilterOptions = [
+            'equals',
+            'notEqual',
+            'lessThan',
+            'lessThanOrEqual',
+            'greaterThan',
+            'greaterThanOrEqual',
+            'inRange'
+          ];
+          
+          filterParams = {
+            filterOptions: [
+              ...baseFilterOptions,
+              {
+                displayKey: 'contains',
+                displayName: 'Contains',
+                predicate: (filterValue, cellValue) => {
+                  return cellValue.toString().includes(filterValue.toString());
+                }
+              },
+              {
+                displayKey: 'doesNotContain',
+                displayName: 'Does not Contain',
+                predicate: (filterValue, cellValue) => {
+                  return !cellValue.toString().includes(filterValue.toString());
+                }
+              }
+            ]
+          };
           if (options.numeric_column_align){
             type = 'numericColumn';
           }
@@ -1314,14 +1343,14 @@ dmx.Component('ag-grid', {
             // Check if there's a matching change in jsDataChanges
             const matchingJsChange = options.js_data_changes.find(change => change.field === key);
             if (matchingJsChange) {
-                              cellRenderer = function (params) {
-                  // Don't apply custom renderer to pinned bottom rows (totals)
-                  if (params.node && params.node.rowPinned === 'bottom') {
-                    return "-";
-                  }
-                  if (typeof window[matchingJsChange.function] === 'function') {
-                    const cellValue = window[matchingJsChange.function](params.data);
-                    return cellValue;
+              cellRenderer = function (params) {
+                // Don't apply custom renderer to pinned bottom rows (totals)
+                if (params.node && params.node.rowPinned === 'bottom') {
+                  return "-";
+                }
+                if (typeof window[matchingJsChange.function] === 'function') {
+                  const cellValue = window[matchingJsChange.function](params.data); 
+                  return cellValue;
                 }
               }
             }
@@ -1917,8 +1946,8 @@ dmx.Component('ag-grid', {
             filter: customFilter.filter
           };
         });
-        gridInstance.setFilterModel(filterModel);
-        gridInstance.onFilterChanged();
+          gridInstance.setFilterModel(filterModel);
+          gridInstance.onFilterChanged();
       }
 
     const gridElement = document.getElementById(options.id+'-grid');

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "2.0.7",
+    "version": "2.0.8",
     "type": "module",
     "description": "App Connect module for AG Grid v34 - Advanced data grid with enhanced editing, filtering, and tree data capabilities.",
     "license": "MIT",