json-rules-filter 1.0.22 → 1.0.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "json-rules-filter",
-  "version": "1.0.22",
+  "version": "1.0.24",
   "description": "para crear reglas avanzadas de filtrado sobre datasets JSON de forma dinámica y visual.",
   "main": "src/jquery.jsonRulesFilter.js",
   "scripts": {

package/src/jquery.jsonRulesFilter.js

@@ -33,12 +33,13 @@
                     nEquals: "Igual a", nDifference: "Diferente de", nGreatherThan: "Mayor que",
                     nGreatherThanOrEquals: "Mayor o igual que", nLowerThan: "Menor que", nLowerThanOrEquals: "Menor o igual que"
                 },
-                searchLabel:{
+                searchLabel: {
                     string: "Texto",
                     number: "Número"
                 }
             },
-            title: { text: "Reglas de filtrado", className: "fs-6 fw-semibold"},
+            scrollY: false,
+            title: { text: "Reglas de filtrado", className: "fs-6 fw-semibold" },
             buttons: {
                 reset: { text: "Resetear", className: "fw-semibold link-danger link-offset-2 link-underline link-underline-opacity-0" },
                 dropdown: { text: "Añadir regla", className: "btn btn-secondary" },
@@ -144,7 +145,7 @@
                                 <p class="${this.bs(this.settings.title.className)}">${this.settings.title.text}</p>
                                 <p><a class="${this.bs(this.settings.buttons.reset.className)} remove-rules-containers" href="#">${this.settings.buttons.reset.text}</a></p>
                             </div>
-                            <div class="py-2" id="container-rules-filters"></div>
+                            <div class="py-2 container-rules-filters"></div>
                             <div class="mt-2">
                                 <div class="d-flex justify-content-start dropdown">
                                     <button ${this.settings.bsVersion === 5 ? `data-bs-popper-config='{"strategy":"fixed"}'` : ''} class="${this.bs(this.settings.buttons.dropdown.className)} dropdown-toggle" type="button" ${toggleAttr}>
@@ -159,6 +160,19 @@
                                 </div>
                             </div>`;
                     this.$contenedor.append(template);
+                    if (this.settings.scrollY !== false) {
+                        const maxHeight = typeof this.settings.scrollY === 'number' ?
+                        this.settings.scrollY + 'px' :
+                        this.settings.scrollY;
+
+                        this.$contenedor.find(".container-rules-filters").css({
+                            "max-height": maxHeight,
+                            "overflow-y": "auto",
+                            "overflow-x": "hidden",
+                            "margin-right": "-10px",
+                            "padding-right":"10px"
+                        })
+                    }
                 },
 
                 // Event delegation and listeners
@@ -213,14 +227,14 @@
 
                 // Resets rule container and re-runs filtering (show all)
                 reset: function () {
-                    $("#container-rules-filters").empty();
+                    $(".container-rules-filters").empty();
                     this.applyRules();
                 },
 
                 // Adds a new rule row dynamically
                 addRuleRow: function (type, dataField, name) {
                     const self = this;
-                    const $container = this.$contenedor.find("#container-rules-filters");
+                    const $container = this.$contenedor.find(".container-rules-filters");
 
                     // Generate unique ID for the new row based on the last element
                     let id_select = 0;