@syncfusion/ej2-querybuilder 26.2.10 → 27.1.48

package/src/query-builder/query-builder.js

@@ -217,234 +217,6 @@ var QueryBuilder = /** @class */ (function (_super) {
         _this.cloneGrpBtnClick = false;
         _this.isMiddleGroup = false;
         _this.cloneRuleBtnClick = false;
-        _this.isValueEmpty = false;
-        _this.dragStopHandler = function (e) {
-            if (_this.isDragEventPrevent) {
-                return;
-            }
-            var targetGroup = closest(e.target, '.e-rule-container');
-            if (isNullOrUndefined(targetGroup) && e.target.parentElement &&
-                e.target.parentElement.classList.contains('e-btn-group') && _this.enableSeparateConnector) {
-                targetGroup = closest(e.target.parentElement.previousElementSibling, '.e-rule-container');
-            }
-            var isPreventelem = closest(e.helper, '.e-notallowedcur');
-            var prevRule;
-            if (!isPreventelem) {
-                var targetGrp = closest(e.target, '.e-group-container');
-                var dropEventArgs = { cancel: false, dropRuleID: targetGroup !== null ? targetGroup.id
-                        : targetGrp !== null ? targetGrp.id : null, dropGroupID: targetGrp !== null ? targetGrp.id : null };
-                _this.trigger('drop', dropEventArgs);
-                if (dropEventArgs.cancel) {
-                    isPreventelem = true;
-                }
-                prevRule = _this.getValidRules();
-            }
-            _this.prvtEvtTgrDaD = true;
-            var tgrt = _this.enableSeparateConnector && e.target.parentElement &&
-                e.target.parentElement.classList.contains('e-btn-group') ? e.target.parentElement.previousElementSibling : e.target;
-            if (targetGroup && !isPreventelem) {
-                var groupId_1 = targetGroup.id.split(_this.element.id + '_')[1].split('_')[0];
-                if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-rule-field') ||
-                    _this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                    var rule = void 0;
-                    if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                        rule = _this.getGroup(_this.draggedRule);
-                        _this.deleteGroup(closest(_this.draggedRule, '.e-group-container'));
-                    }
-                    else {
-                        rule = _this.getRule(_this.draggedRule);
-                        _this.deleteRule(_this.draggedRule);
-                    }
-                    var groupRule = extend([], _this.getGroup(targetGroup), [], true);
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    if (groupRule.properties) {
-                        groupRule = groupRule.properties;
-                    }
-                    var groupElem = closest(targetGroup, '.e-group-container');
-                    var nestGrpElem = groupElem.querySelectorAll('.e-group-container');
-                    nestGrpElem.forEach(function (ele) {
-                        if (_this.element.querySelector('#' + ele.id)) {
-                            _this.deleteGroup(ele);
-                        }
-                    });
-                    var ruleElems = groupElem.querySelectorAll('.e-rule-container');
-                    var ruleIds = [];
-                    var dropInd = void 0;
-                    for (var i = 0; i < ruleElems.length; i++) {
-                        if (ruleElems[i].classList.contains('e-drag-rule-top-line') ||
-                            ruleElems[i].classList.contains('e-drag-rule-bottom-line')) {
-                            dropInd = i;
-                        }
-                        ruleIds.push(ruleElems[i].id.split(_this.element.id + '_')[1]);
-                    }
-                    _this.deleteRules(ruleIds);
-                    if (targetGroup.classList.contains('e-drag-rule-top-line')) {
-                        groupRule.rules.splice(dropInd, 0, rule);
-                    }
-                    else {
-                        groupRule.rules.splice(dropInd + 1, 0, rule);
-                    }
-                    groupRule.rules.forEach(function (rule) {
-                        if (_this.enableSeparateConnector) {
-                            if (!rule.rules) {
-                                _this.addRules([rule], groupId_1);
-                            }
-                            else {
-                                _this.addGroups([rule], groupId_1);
-                            }
-                        }
-                        else {
-                            if (rule.condition) {
-                                _this.addGroups([rule], groupId_1);
-                            }
-                            else {
-                                _this.addRules([rule], groupId_1);
-                            }
-                        }
-                    });
-                }
-            }
-            else if (tgrt.classList.contains('e-rule-list') && tgrt.children.length === 0 && !isPreventelem) {
-                var groupElem = closest(tgrt, '.e-group-container');
-                var groupId = groupElem.id.split(_this.element.id + '_')[1].split('_')[0];
-                var rule = void 0;
-                if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                    rule = _this.getGroup(_this.draggedRule);
-                    _this.deleteGroup(closest(_this.draggedRule, '.e-group-container'));
-                }
-                else {
-                    rule = _this.getRule(_this.draggedRule);
-                    _this.deleteRule(_this.draggedRule);
-                }
-                if (_this.enableSeparateConnector) {
-                    if (!rule.rules) {
-                        _this.addRules([rule], groupId);
-                    }
-                    else {
-                        _this.addGroups([rule], groupId);
-                    }
-                }
-                else {
-                    if (rule.condition) {
-                        _this.addGroups([rule], groupId);
-                    }
-                    else {
-                        _this.addRules([rule], groupId);
-                    }
-                }
-            }
-            else if (tgrt.classList.contains('e-rule-list') && tgrt.children[0].classList.contains('e-group-container') && !isPreventelem) {
-                var groupElem = closest(tgrt, '.e-group-container');
-                var groupId_2 = groupElem.id.split(_this.element.id + '_')[1].split('_')[0];
-                var rule = void 0;
-                if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                    rule = _this.getGroup(_this.draggedRule);
-                    _this.deleteGroup(closest(_this.draggedRule, '.e-group-container'));
-                }
-                else {
-                    rule = _this.getRule(_this.draggedRule);
-                    _this.deleteRule(_this.draggedRule);
-                }
-                var groupRule = extend([], _this.getGroup(tgrt), [], true);
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                if (groupRule.properties) {
-                    groupRule = groupRule.properties;
-                }
-                var groupElems = tgrt.querySelectorAll('.e-group-container');
-                groupElems.forEach(function (ele) {
-                    if (_this.element.querySelector('#' + ele.id)) {
-                        _this.deleteGroup(ele);
-                    }
-                });
-                var ruleElems = groupElem.querySelectorAll('.e-rule-container');
-                ruleElems.forEach(function (ele) {
-                    if (_this.element.querySelector('#' + ele.id)) {
-                        _this.deleteRule(ele);
-                    }
-                });
-                if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                    _this.addGroups([rule], groupId_2);
-                }
-                else {
-                    _this.addRules([rule], groupId_2);
-                }
-                groupRule.rules.forEach(function (rule) {
-                    if (_this.enableSeparateConnector) {
-                        if (!rule.rules) {
-                            _this.addRules([rule], groupId_2);
-                        }
-                        else {
-                            _this.addGroups([rule], groupId_2);
-                        }
-                    }
-                    else {
-                        if (rule.condition) {
-                            _this.addGroups([rule], groupId_2);
-                        }
-                        else {
-                            _this.addRules([rule], groupId_2);
-                        }
-                    }
-                });
-            }
-            else if ((closest(e.target, '.e-group-container') || e.target.classList.contains('e-group-container')) && !isPreventelem) {
-                var rule = void 0;
-                targetGroup = closest(e.target, '.e-group-container');
-                if (!targetGroup && e.target.classList.contains('e-group-container')) {
-                    targetGroup = e.target;
-                }
-                var groupId = targetGroup.id.split(_this.element.id + '_')[1].split('_')[0];
-                if (groupId === 'group0') {
-                    if (_this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
-                        rule = _this.getGroup(_this.draggedRule);
-                        _this.deleteGroup(closest(_this.draggedRule, '.e-group-container'));
-                    }
-                    else {
-                        rule = _this.getRule(_this.draggedRule);
-                        _this.deleteRule(_this.draggedRule);
-                    }
-                    if (_this.enableSeparateConnector) {
-                        if (!rule.rules) {
-                            _this.addRules([rule], groupId);
-                        }
-                        else {
-                            _this.addGroups([rule], groupId);
-                        }
-                    }
-                    else {
-                        if (rule.condition) {
-                            _this.addGroups([rule], groupId);
-                        }
-                        else {
-                            _this.addRules([rule], groupId);
-                        }
-                    }
-                }
-            }
-            if (!isPreventelem) {
-                _this.trigger('ruleChange', { previousRule: prevRule, rule: _this.getValidRules(), type: 'drag-and-drop' });
-            }
-            _this.prvtEvtTgrDaD = false;
-            document.body.classList.remove('e-prevent-select');
-            var borderLineElem = _this.element.querySelectorAll('.e-drag-rule-bottom-line');
-            borderLineElem.forEach(function (ele) {
-                ele.classList.remove('e-drag-rule-bottom-line');
-            });
-            borderLineElem = _this.element.querySelectorAll('.e-drag-rule-top-line');
-            borderLineElem.forEach(function (ele) {
-                ele.classList.remove('e-drag-rule-top-line');
-            });
-            borderLineElem = _this.element.querySelectorAll('.e-qb-dragging-rule');
-            borderLineElem.forEach(function (ele) {
-                ele.classList.remove('e-qb-dragging-rule');
-            });
-            if (e.helper.classList.contains('e-cloneproperties') && document.querySelector('.' + e.helper.classList[0])) {
-                remove(e.helper);
-            }
-            if (_this.enableSeparateConnector) {
-                _this.refresh();
-            }
-        };
         MultiSelect.Inject(CheckBoxSelection);
         return _this;
     }
@@ -950,7 +722,9 @@ var QueryBuilder = /** @class */ (function (_super) {
                 elem = template;
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 append(elem, ruleElem);
-                ruleElem.children[ruleElem.children.length - 1].className += ' e-rule-field';
+                if (ruleElem.children.length) {
+                    ruleElem.children[ruleElem.children.length - 1].className += ' e-rule-field';
+                }
             }
             else {
                 template = this.ruleTemplateFn(args, this, 'Template', templateID)[0];
@@ -1240,7 +1014,9 @@ var QueryBuilder = /** @class */ (function (_super) {
                 .filter(function (filteredChild) { return filteredChild !== null; });
             this.changeDataSource(matchedDataSource);
             setTimeout(function () {
-                proxy.ddTree.treeObj.expandAll();
+                if (!isNullOrUndefined(proxy.ddTree)) {
+                    proxy.ddTree.treeObj.expandAll();
+                }
             }, 100);
         }
     };
@@ -1983,7 +1759,7 @@ var QueryBuilder = /** @class */ (function (_super) {
         if (this.headerTemplate) {
             args = { requestType: 'header-template-initialize', ruleID: groupElem.id,
                 notCondition: this.enableNotCondition ? not : undefined,
-                condition: condition, rule: this.getRuleCollection(rule, true), groupID: groupID };
+                condition: condition, rule: this.getRuleCollection(rule, false), groupID: groupID };
             this.trigger('actionBegin', args);
             if (this.enableSeparateConnector && groupElem.id.indexOf('rule') !== -1) {
                 args.requestType = 'rule-template-create';
@@ -2019,6 +1795,17 @@ var QueryBuilder = /** @class */ (function (_super) {
             }
             else if (this.isVue3) {
                 template = this.headerFn(args, this, groupElem.id, templateID);
+                if (this.enableSeparateConnector && (isInitialRule || groupElem.id.indexOf('rule') !== -1)) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    for (var i = 0; i < template.length; i++) {
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                        if (template[i].nodeName === 'DIV') {
+                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                            template = template[i];
+                            break;
+                        }
+                    }
+                }
                 if (this.enableSeparateConnector && isInitialRule) {
                     this.enableSeparateConnectorInitialRule(groupElem, template);
                 }
@@ -2222,7 +2009,8 @@ var QueryBuilder = /** @class */ (function (_super) {
         var _this = this;
         var element;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        if (this.isNumInput && typeof args.value === 'number') {
+        if ((this.isNumInput && typeof args.value === 'number') || (args.type === 'input' && args.target && args.target.classList.contains('e-numerictextbox'))
+            && (this.selectedColumn.validation.max !== Number.MAX_VALUE || this.selectedColumn.validation.min > 0)) {
             this.isNumInput = false;
             return;
         }
@@ -2235,7 +2023,7 @@ var QueryBuilder = /** @class */ (function (_super) {
             element = args.event.target;
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
         }
-        else if (args.type === 'input' && args.currentTarget) {
+        else if (args.type === 'input' && args.target && args.target.classList.contains('e-numerictextbox')) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             element = args.currentTarget;
         }
@@ -2297,7 +2085,7 @@ var QueryBuilder = /** @class */ (function (_super) {
         else {
             value = args.value;
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            if (args.type === 'input' && args.currentTarget) {
+            if (args.type === 'input' && args.target && args.target.classList.contains('e-numerictextbox')) {
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 value = Number(args.currentTarget.value);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -2305,8 +2093,7 @@ var QueryBuilder = /** @class */ (function (_super) {
                 var numericTextBoxObj = getInstance(elem, NumericTextBox);
                 var decimalSeparator = getValue('decimal', getNumericObject(this.locale));
                 if (isNaN(value) && elem.value.indexOf(decimalSeparator) !== -1) {
-                    var numberValue = parseFloat(args.currentTarget.value);
-                    value = numberValue;
+                    value = this.intl.getNumberParser({ format: 'n' })(elem.value);
                 }
                 numericTextBoxObj.value = value;
                 this.isNumInput = true;
@@ -2348,7 +2135,7 @@ var QueryBuilder = /** @class */ (function (_super) {
         this.isFieldClose = true;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var ddl = getComponent(id, 'dropdownlist');
-        var item = ddl.popupObj.element.querySelector('.e-active');
+        var item = ddl.popupObj && ddl.popupObj.element.querySelector('.e-active');
         var itemData = ddl.getItemData();
         ddl.value = itemData.value;
         var customArgs = { element: ddl.element, value: itemData.value, isInteracted: true,
@@ -2687,13 +2474,11 @@ var QueryBuilder = /** @class */ (function (_super) {
                 }
                 var height = (this.element.className.indexOf('e-device') > -1) ? '250px' : '200px';
                 var operator_2;
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 operatorList.forEach(function (obj) {
                     if ('value' in obj && typeof obj.value === 'string' && obj.value.toLowerCase() === rule.operator.toLowerCase()) {
                         operator_2 = obj.value;
                     }
                 });
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var value = operator_2 ? operator_2 : operatorList[0].value;
                 var ddlIdx = 0;
                 if (!this.autoSelectOperator) {
@@ -3028,8 +2813,11 @@ var QueryBuilder = /** @class */ (function (_super) {
     QueryBuilder.prototype.closePopup = function (i, args) {
         var element = document.getElementById(args.popup.element.id.replace('_popup', ''));
         if (element) {
-            var value = getComponent(element, 'multiselect').value;
-            this.updateRules(element, value, i);
+            var ms = getComponent(element, 'multiselect');
+            if (ms) {
+                var value = ms.value;
+                this.updateRules(element, value, i);
+            }
         }
     };
     QueryBuilder.prototype.processTemplate = function (target, itemData, rule, tempRule) {
@@ -4661,6 +4449,237 @@ var QueryBuilder = /** @class */ (function (_super) {
         this.trigger('drag', dragEventArgs);
         this.isDragEventPrevent = dragEventArgs.cancel;
     };
+    QueryBuilder.prototype.dragStopHandler = function (e) {
+        var _this = this;
+        if (this.isDragEventPrevent) {
+            return;
+        }
+        var targetGroup = closest(e.target, '.e-rule-container');
+        if (isNullOrUndefined(targetGroup) && e.target.parentElement &&
+            e.target.parentElement.classList.contains('e-btn-group') && this.enableSeparateConnector) {
+            targetGroup = closest(e.target.parentElement.previousElementSibling, '.e-rule-container');
+        }
+        var isPreventelem;
+        if (!isNullOrUndefined(e.helper)) {
+            isPreventelem = closest(e.helper, '.e-notallowedcur');
+        }
+        var prevRule;
+        if (!isPreventelem) {
+            var targetGrp = closest(e.target, '.e-group-container');
+            var dropEventArgs = { cancel: false, dropRuleID: targetGroup !== null ? targetGroup.id
+                    : targetGrp !== null ? targetGrp.id : null, dropGroupID: targetGrp !== null ? targetGrp.id : null };
+            this.trigger('drop', dropEventArgs);
+            if (dropEventArgs.cancel) {
+                isPreventelem = true;
+            }
+            prevRule = this.getValidRules();
+        }
+        this.prvtEvtTgrDaD = true;
+        var tgrt = this.enableSeparateConnector && e.target.parentElement &&
+            e.target.parentElement.classList.contains('e-btn-group') ? e.target.parentElement.previousElementSibling : e.target;
+        if (targetGroup && !isPreventelem) {
+            var groupId_1 = targetGroup.id.split(this.element.id + '_')[1].split('_')[0];
+            if (this.draggable.currentStateTarget.parentElement.classList.contains('e-rule-field') ||
+                this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                var rule = void 0;
+                if (this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                    rule = this.getGroup(this.draggedRule);
+                    this.deleteGroup(closest(this.draggedRule, '.e-group-container'));
+                }
+                else {
+                    rule = this.getRule(this.draggedRule);
+                    this.deleteRule(this.draggedRule);
+                }
+                var groupRule = extend([], this.getGroup(targetGroup), [], true);
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                if (groupRule.properties) {
+                    groupRule = groupRule.properties;
+                }
+                var groupElem = closest(targetGroup, '.e-group-container');
+                var nestGrpElem = groupElem.querySelectorAll('.e-group-container');
+                nestGrpElem.forEach(function (ele) {
+                    if (_this.element.querySelector('#' + ele.id)) {
+                        _this.deleteGroup(ele);
+                    }
+                });
+                var ruleElems = groupElem.querySelectorAll('.e-rule-container');
+                var ruleIds = [];
+                var dropInd = void 0;
+                for (var i = 0; i < ruleElems.length; i++) {
+                    if (ruleElems[i].classList.contains('e-drag-rule-top-line') ||
+                        ruleElems[i].classList.contains('e-drag-rule-bottom-line')) {
+                        dropInd = i;
+                    }
+                    ruleIds.push(ruleElems[i].id.split(this.element.id + '_')[1]);
+                }
+                this.deleteRules(ruleIds);
+                if (targetGroup.classList.contains('e-drag-rule-top-line')) {
+                    groupRule.rules.splice(dropInd, 0, rule);
+                }
+                else {
+                    groupRule.rules.splice(dropInd + 1, 0, rule);
+                }
+                groupRule.rules.forEach(function (rule) {
+                    if (_this.enableSeparateConnector) {
+                        if (!rule.rules) {
+                            _this.addRules([rule], groupId_1);
+                        }
+                        else {
+                            _this.addGroups([rule], groupId_1);
+                        }
+                    }
+                    else {
+                        if (rule.condition) {
+                            _this.addGroups([rule], groupId_1);
+                        }
+                        else {
+                            _this.addRules([rule], groupId_1);
+                        }
+                    }
+                });
+            }
+        }
+        else if (tgrt.classList.contains('e-rule-list') && tgrt.children.length === 0 && !isPreventelem) {
+            var groupElem = closest(tgrt, '.e-group-container');
+            var groupId = groupElem.id.split(this.element.id + '_')[1].split('_')[0];
+            var rule = void 0;
+            if (this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                rule = this.getGroup(this.draggedRule);
+                this.deleteGroup(closest(this.draggedRule, '.e-group-container'));
+            }
+            else {
+                rule = this.getRule(this.draggedRule);
+                this.deleteRule(this.draggedRule);
+            }
+            if (this.enableSeparateConnector) {
+                if (!rule.rules) {
+                    this.addRules([rule], groupId);
+                }
+                else {
+                    this.addGroups([rule], groupId);
+                }
+            }
+            else {
+                if (rule.condition) {
+                    this.addGroups([rule], groupId);
+                }
+                else {
+                    this.addRules([rule], groupId);
+                }
+            }
+        }
+        else if (tgrt.classList.contains('e-rule-list') && tgrt.children[0].classList.contains('e-group-container') && !isPreventelem) {
+            var groupElem = closest(tgrt, '.e-group-container');
+            var groupId_2 = groupElem.id.split(this.element.id + '_')[1].split('_')[0];
+            var rule = void 0;
+            if (this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                rule = this.getGroup(this.draggedRule);
+                this.deleteGroup(closest(this.draggedRule, '.e-group-container'));
+            }
+            else {
+                rule = this.getRule(this.draggedRule);
+                this.deleteRule(this.draggedRule);
+            }
+            var groupRule = extend([], this.getGroup(tgrt), [], true);
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            if (groupRule.properties) {
+                groupRule = groupRule.properties;
+            }
+            var groupElems = tgrt.querySelectorAll('.e-group-container');
+            groupElems.forEach(function (ele) {
+                if (_this.element.querySelector('#' + ele.id)) {
+                    _this.deleteGroup(ele);
+                }
+            });
+            var ruleElems = groupElem.querySelectorAll('.e-rule-container');
+            ruleElems.forEach(function (ele) {
+                if (_this.element.querySelector('#' + ele.id)) {
+                    _this.deleteRule(ele);
+                }
+            });
+            if (this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                this.addGroups([rule], groupId_2);
+            }
+            else {
+                this.addRules([rule], groupId_2);
+            }
+            groupRule.rules.forEach(function (rule) {
+                if (_this.enableSeparateConnector) {
+                    if (!rule.rules) {
+                        _this.addRules([rule], groupId_2);
+                    }
+                    else {
+                        _this.addGroups([rule], groupId_2);
+                    }
+                }
+                else {
+                    if (rule.condition) {
+                        _this.addGroups([rule], groupId_2);
+                    }
+                    else {
+                        _this.addRules([rule], groupId_2);
+                    }
+                }
+            });
+        }
+        else if ((closest(e.target, '.e-group-container') || e.target.classList.contains('e-group-container')) && !isPreventelem) {
+            var rule = void 0;
+            targetGroup = closest(e.target, '.e-group-container');
+            if (!targetGroup && e.target.classList.contains('e-group-container')) {
+                targetGroup = e.target;
+            }
+            var groupId = targetGroup.id.split(this.element.id + '_')[1].split('_')[0];
+            if (groupId === 'group0') {
+                if (this.draggable.currentStateTarget.parentElement.classList.contains('e-group-header')) {
+                    rule = this.getGroup(this.draggedRule);
+                    this.deleteGroup(closest(this.draggedRule, '.e-group-container'));
+                }
+                else {
+                    rule = this.getRule(this.draggedRule);
+                    this.deleteRule(this.draggedRule);
+                }
+                if (this.enableSeparateConnector) {
+                    if (!rule.rules) {
+                        this.addRules([rule], groupId);
+                    }
+                    else {
+                        this.addGroups([rule], groupId);
+                    }
+                }
+                else {
+                    if (rule.condition) {
+                        this.addGroups([rule], groupId);
+                    }
+                    else {
+                        this.addRules([rule], groupId);
+                    }
+                }
+            }
+        }
+        if (!isPreventelem) {
+            this.trigger('ruleChange', { previousRule: prevRule, rule: this.getValidRules(), type: 'drag-and-drop' });
+        }
+        this.prvtEvtTgrDaD = false;
+        document.body.classList.remove('e-prevent-select');
+        var borderLineElem = this.element.querySelectorAll('.e-drag-rule-bottom-line');
+        borderLineElem.forEach(function (ele) {
+            ele.classList.remove('e-drag-rule-bottom-line');
+        });
+        borderLineElem = this.element.querySelectorAll('.e-drag-rule-top-line');
+        borderLineElem.forEach(function (ele) {
+            ele.classList.remove('e-drag-rule-top-line');
+        });
+        borderLineElem = this.element.querySelectorAll('.e-qb-dragging-rule');
+        borderLineElem.forEach(function (ele) {
+            ele.classList.remove('e-qb-dragging-rule');
+        });
+        if (e.helper && e.helper.classList.contains('e-cloneproperties') && document.querySelector('.' + e.helper.classList[0])) {
+            remove(e.helper);
+        }
+        if (this.enableSeparateConnector) {
+            this.refresh();
+        }
+    };
     QueryBuilder.prototype.templateParser = function (template) {
         if (template) {
             try {
@@ -4736,10 +4755,14 @@ var QueryBuilder = /** @class */ (function (_super) {
         if (typeof target === 'string') {
             groupId = this.element.id + '_' + target;
             target = document.getElementById(groupId);
+            groupId = groupId.replace(this.element.id + '_', '');
         }
         else {
             groupId = groupElem.id.replace(this.element.id + '_', '');
         }
+        if (groupId === 'group0' || !target) {
+            return;
+        }
         var args = { groupID: groupId, cancel: false, type: 'deleteGroup' };
         if (!this.isImportRules && !this.prvtEvtTgrDaD) {
             this.trigger('beforeChange', args, function (observedChangeArgs) {
@@ -5105,7 +5128,7 @@ var QueryBuilder = /** @class */ (function (_super) {
                         }
                     }
                 }
-                else if (!isNewRuleAdded) {
+                else if (!isNewRuleAdded && !isNullOrUndefined(andElem)) {
                     andElem.checked = false;
                     andElem.disabled = true;
                     orElem.checked = false;
@@ -5125,7 +5148,6 @@ var QueryBuilder = /** @class */ (function (_super) {
      * @returns {RuleModel} - Valid rule or rules collection
      */
     QueryBuilder.prototype.getValidRules = function (currentRule) {
-        this.isValueEmpty = true;
         if (!currentRule) {
             currentRule = this.getRules();
         }
@@ -5135,7 +5157,6 @@ var QueryBuilder = /** @class */ (function (_super) {
         var rule = !isNullOrUndefined(currentRule.isLocked) ?
             this.getRuleCollection({ condition: ruleCondtion, rules: ruleColl, not: notCondition, isLocked: currentRule.isLocked }, true) :
             this.getRuleCollection({ condition: ruleCondtion, rules: ruleColl, not: notCondition }, true);
-        this.isValueEmpty = false;
         return rule;
     };
     QueryBuilder.prototype.getRuleCollection = function (rule, isValidRule) {
@@ -5165,9 +5186,8 @@ var QueryBuilder = /** @class */ (function (_super) {
                     rule.value = null;
                 }
             }
-            if ((this.isRefreshed && this.enablePersistence) || (rule.field !== '' && rule.operator !== '' &&
-                (this.isValueEmpty ? rule.value !== '' && rule.value !== undefined : rule.value !== undefined)) ||
-                (customObj && customObj.isQuestion)) {
+            if ((this.isRefreshed && this.enablePersistence) || (rule.field !== '' && rule.operator !== '' && (rule.value !== '' &&
+                rule.value !== undefined)) || (customObj && customObj.isQuestion)) {
                 var condition = rule.condition;
                 var lockedRule = rule.isLocked;
                 rule = { 'label': rule.label, 'field': rule.field, 'operator': rule.operator, 'type': rule.type, 'value': rule.value };
@@ -5323,6 +5343,9 @@ var QueryBuilder = /** @class */ (function (_super) {
         var len = groupIdColl.length;
         var groupID;
         for (i = 0; i < len; i++) {
+            if (groupIdColl[i] === 'group0') {
+                continue;
+            }
             groupID = this.element.id + '_' + groupIdColl[i];
             this.deleteGroup(document.getElementById(groupID));
         }
@@ -6446,9 +6469,13 @@ var QueryBuilder = /** @class */ (function (_super) {
             return matchValue.length + 2;
         }
         if (this.checkNumberLiteral(sqlString, sqlLocale)) {
-            matchValue = /^[0-9]+(\.[0-9]+)$/.exec(sqlString)[0];
-            this.parser.push(['Literal', matchValue]);
-            return matchValue.length;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var regExValue = /^[0-9]+(\.[0-9]+)$/.exec(sqlString);
+            if (regExValue) {
+                matchValue = regExValue[0];
+                this.parser.push(['Literal', matchValue]);
+                return matchValue.length;
+            }
         }
         //String
         var singleString = this.getSingleQuoteString(sqlString);
@@ -6862,16 +6889,8 @@ var QueryBuilder = /** @class */ (function (_super) {
      */
     QueryBuilder.prototype.groupClone = function (target) {
         var groupElem = target.closest('.e-rule-list').closest('.e-group-container');
-        var targetGrpId;
-        var groupId;
-        if (typeof target === 'string') {
-            groupId = this.element.id + '_' + target;
-            target = document.getElementById(groupId);
-        }
-        else {
-            targetGrpId = target.id.replace(this.element.id + '_', '');
-            groupId = groupElem.id.replace(this.element.id + '_', '');
-        }
+        var targetGrpId = target.id.replace(this.element.id + '_', '');
+        var groupId = groupElem.id.replace(this.element.id + '_', '');
         var group = this.getGroup(targetGrpId);
         this.groupIndex = Array.prototype.indexOf.call(target.closest('.e-rule-list').children, target.closest('.e-group-container'));
         this.addGroups([{ 'condition': group.condition, 'not': group.not, 'rules': group.rules }], groupId);