@syncfusion/ej2-dropdowns 33.1.44 → 33.1.47

package/dist/es6/ej2-dropdowns.es5.js

@@ -525,7 +525,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
             this.parent.totalItemsCount();
         }
         if (isListUpdated) {
-            if (this.component === 'multiselect' && this.parent.itemCount * 2 > this.parent.totalItemCount) {
+            if (this.component === 'multiselect' && this.parent.itemCount * 2 > this.parent.totalItemCount && !(this.parent.dataSource instanceof DataManager)) {
                 this.parent.viewPortInfo.endIndex = endIndex = this.parent.totalItemCount;
                 this.parent.isVirtualTrackHeight = true;
             }
@@ -1363,6 +1363,12 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
         translateY = translateY - (this.skeletonCount * this.listItemHeight);
         translateY = ((this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0) ||
             this.skeletonCount === 0) ? 0 : translateY;
+        var virtualElement = this.list.getElementsByClassName('e-virtual-ddl')[0];
+        var style = virtualElement && virtualElement.style && virtualElement.style.height;
+        if (this.getModuleName() === 'multiselect' && !isNullOrUndefined(style) && style === '' &&
+            this.dataSource instanceof DataManager) {
+            translateY = 0;
+        }
         var styleText = "transform: translate(0px, " + translateY + "px);";
         return styleText;
     };
@@ -1645,12 +1651,25 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
                             _this.isPreventChange = _this.isAngular && _this.preventChange ? true : _this.isPreventChange;
                             var isReOrder = true;
                             if (!_this.virtualSelectAll) {
+                                var newQueryWhereCount = void 0;
+                                var queryWhereCount = void 0;
                                 var newQuery = query_1.clone();
                                 for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {
                                     if (newQuery.queries[queryElements].fn === 'onWhere') {
                                         isWhereExist_1 = true;
+                                        newQueryWhereCount++;
                                     }
                                 }
+                                for (var queryElements = 0; !isNullOrUndefined(_this.query) &&
+                                    queryElements < _this.query.queries.length; queryElements++) {
+                                    if (_this.query.queries[queryElements].fn === 'onWhere') {
+                                        isWhereExist_1 = true;
+                                        queryWhereCount++;
+                                    }
+                                }
+                                if (queryWhereCount === newQueryWhereCount) {
+                                    isWhereExist_1 = false;
+                                }
                                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                                 if (_this.isVirtualizationEnabled && (e.count !== 0 && e.count < (_this.itemCount * 2))) {
                                     if (newQuery) {
@@ -3735,6 +3754,11 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             this.isActive = false;
             this.beforePopupOpen = false;
         }
+        // Cancel any pending debounced filtering when focus leaves the component.
+        if (this.debounceTimer !== null) {
+            clearTimeout(this.debounceTimer);
+            this.debounceTimer = null;
+        }
         this.isFocused = false;
     };
     DropDownList.prototype.focusOutAction = function (e) {
@@ -6811,6 +6835,12 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             this.inputElement = this.createElement('input', { attrs: { role: 'combobox', type: 'text' } });
+            if (this.element.tagName === this.getNgDirective()) {
+                // Pre-populate id so Input.createInput/createFloatingInput can wire label.for correctly
+                var ngId = this.element.getAttribute('id') ? this.element.getAttribute('id') : getUniqueID('ej2_dropdownlist');
+                this.element.id = ngId;
+                this.inputElement.id = ngId + '_input';
+            }
             if (this.element.tagName !== this.getNgDirective()) {
                 this.element.style.display = 'none';
             }
@@ -6874,6 +6904,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         var id = this.element.getAttribute('id') ? this.element.getAttribute('id') : getUniqueID('ej2_dropdownlist');
         this.element.id = id;
         this.hiddenElement.id = id + '_hidden';
+        if (this.element.tagName === this.getNgDirective() && !this.inputElement.id) {
+            this.inputElement.id = id + '_input';
+        }
         this.targetElement().setAttribute('tabindex', this.tabIndex);
         if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'combobox') && !this.readonly) {
             if (!this.inputElement.hasAttribute('aria-label')) {
@@ -8227,6 +8260,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         _this.filterDelayTime = 300;
         _this.isClicked = false;
         _this.documentClickContext = _this.onDocumentClick.bind(_this);
+        _this.windowResizeContext = _this.windowResize.bind(_this);
         // Specifies if the checkAll method has been called
         _this.isCheckAllCalled = false;
         _this.isFromFilterChange = false;
@@ -8716,7 +8750,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         EventHandler.add(this.inputWrapper, 'mousemove', this.mouseIn, this);
         EventHandler.add(this.inputWrapper, 'mouseout', this.onMouseLeave, this);
         EventHandler.add(this.overAllClear, 'mousedown', this.clearAll, this);
-        EventHandler.add(window, 'resize', this.windowResize, this);
+        EventHandler.add(window, 'resize', this.windowResizeContext);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.add(formElement, 'reset', this.resetValueHandler, this);
@@ -8752,7 +8786,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         EventHandler.remove(this.inputWrapper, 'mousemove', this.mouseIn);
         EventHandler.remove(this.inputWrapper, 'mouseout', this.onMouseLeave);
         EventHandler.remove(this.overAllClear, 'mousedown', this.clearAll);
-        EventHandler.remove(window, 'resize', this.windowResize);
+        EventHandler.remove(window, 'resize', this.windowResizeContext);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.remove(formElement, 'reset', this.resetValueHandler);
@@ -13369,9 +13403,15 @@ function createFloatLabel(overAllWrapper, searchWrapper, element, inputElement,
     var floatLabelElement = createElement('label', { className: FLOATTEXT });
     var id = element.getAttribute('id') ? element.getAttribute('id') : getUniqueID('ej2_multiselect');
     element.id = id;
+    var isAngularComponent = false;
+    if (element.tagName && element.tagName.indexOf('EJS-') === 0 && inputElement.id === '' && element !== inputElement) {
+        inputElement.id = id + '_input';
+        isAngularComponent = true;
+    }
     if (!isNullOrUndefined(element.id) && element.id !== '') {
-        floatLabelElement.id = 'label_' + element.id.replace(/ /g, '_');
-        floatLabelElement.setAttribute('for', element.id);
+        var labelTarget = isAngularComponent ? inputElement.id || element.id : element.id;
+        floatLabelElement.id = 'label_' + labelTarget.replace(/ /g, '_');
+        floatLabelElement.setAttribute('for', labelTarget);
         attributes(inputElement, { 'aria-labelledby': floatLabelElement.id });
     }
     if (!isNullOrUndefined(inputElement.placeholder) && inputElement.placeholder !== '') {
@@ -16004,6 +16044,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 selectedChips[0].removeAttribute('id');
                 if (!isNullOrUndefined(this.inputElement) && this.inputElement.hasAttribute('aria-activedescendant')) {
                     this.inputElement.removeAttribute('aria-activedescendant');
+                    if (!this.inputElement.hasAttribute('aria-describedby') && this.chipCollectionWrapper.id) {
+                        this.inputElement.setAttribute('aria-describedby', this.chipCollectionWrapper.id);
+                    }
                 }
             }
             this.removeChipFocus();
@@ -16015,6 +16058,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             element.setAttribute('id', this.element.id + '_chip_item');
             if (!isNullOrUndefined(this.inputElement) && element.id) {
                 this.inputElement.setAttribute('aria-activedescendant', element.id);
+                if (this.inputElement.hasAttribute('aria-describedby')) {
+                    this.inputElement.removeAttribute('aria-describedby');
+                }
             }
             var chipClose = element.querySelector('span.' + CHIP_CLOSE$1.split(' ')[0]);
             if (chipClose) {
@@ -18540,9 +18586,11 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             firstItems.forEach(function (node) {
                 fragment_1.appendChild(node.cloneNode(true));
             });
-            li.forEach(function (node) {
-                fragment_1.appendChild(node.cloneNode(true));
-            });
+            if ((this.totalItemCount >= (this.itemCount * 2) && this.dataSource instanceof DataManager)) {
+                li.forEach(function (node) {
+                    fragment_1.appendChild(node.cloneNode(true));
+                });
+            }
             var concatenatedNodeList = fragment_1.childNodes;
             if (this.virtualSelectAllData instanceof Array) {
                 while (index < length && index <= 50 && index < count) {
@@ -19443,7 +19491,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                         _this.renderItems(_this.mainData, _this.fields);
                     }
                     _this.virtualCustomData = null;
-                    _this.isVirtualTrackHeight = _this.totalItemCount >= (_this.itemCount * 2) ? false : true;
+                    _this.isVirtualTrackHeight = (_this.totalItemCount >= (_this.itemCount * 2) ||
+                        _this.dataSource instanceof DataManager) ? false : true;
                 }
             });
         }
@@ -19660,7 +19709,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             this.chipCollectionWrapper = this.createElement('span', {
-                className: CHIP_WRAPPER$1, attrs: { role: 'listbox' }
+                className: CHIP_WRAPPER$1
             });
             this.chipCollectionWrapper.style.display = 'none';
             if (this.mode === 'Default') {
@@ -24184,6 +24233,12 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
             }
         }
         var currentRange = this.getTextRange();
+        // Pre-flight guard: close popup if mention character is no longer present
+        if (this.isPopupOpen && currentRange !== undefined && currentRange.indexOf(this.mentionChar) === -1) {
+            this.queryString = '';
+            this.hidePopup();
+            return;
+        }
         // eslint-disable-next-line security/detect-non-literal-regexp
         var mentionRegex = new RegExp(this.mentionChar.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + '\\s');
         var isValid = currentRange && mentionRegex.test(currentRange) ? false : true;