@syncfusion/ej2-dropdowns 33.2.15 → 34.1.30

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 33.2.15
+*  version : 34.1.30
 *  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-dropdowns",
-  "version": "33.2.15",
+  "version": "34.1.30",
   "description": "Essential JS 2 DropDown Components",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -8,13 +8,13 @@
   "module": "./index.js",
   "es2015": "./dist/es6/ej2-dropdowns.es5.js",
   "dependencies": {
-    "@syncfusion/ej2-base": "~33.2.3",
-    "@syncfusion/ej2-data": "~33.2.12",
-    "@syncfusion/ej2-inputs": "~33.2.15",
-    "@syncfusion/ej2-lists": "~33.2.3",
-    "@syncfusion/ej2-navigations": "~33.2.15",
-    "@syncfusion/ej2-notifications": "~33.2.7",
-    "@syncfusion/ej2-popups": "~33.2.7"
+    "@syncfusion/ej2-base": "~34.1.30",
+    "@syncfusion/ej2-data": "~34.1.29",
+    "@syncfusion/ej2-inputs": "~34.1.30",
+    "@syncfusion/ej2-lists": "~34.1.30",
+    "@syncfusion/ej2-navigations": "~34.1.30",
+    "@syncfusion/ej2-notifications": "~34.1.29",
+    "@syncfusion/ej2-popups": "~34.1.29"
   },
   "devDependencies": {},
   "keywords": [

package/src/combo-box/combo-box.js

@@ -475,7 +475,7 @@ var ComboBox = /** @class */ (function (_super) {
             return false;
         }
         else {
-            return _super.prototype.setValue.call(this, e);
+            return _super.prototype.setValue.call(this, e, this.autofill);
         }
     };
     ComboBox.prototype.checkCustomValue = function () {

package/src/common/virtual-scroll.d.ts

@@ -38,12 +38,14 @@ export declare class VirtualScroll {
     private touchModule;
     private component;
     private scrollHandler;
+    private previousScrollTop;
     constructor(parent: IDropdownlist);
     addEventListener(): void;
     removeEventListener(): void;
     private bindScrollEvent;
     private observe;
     getModuleName(): string;
+    private isFilterScrollScenario;
     private popupScrollHandler;
     private getPageQuery;
     private setGeneratedData;

package/src/common/virtual-scroll.js

@@ -50,6 +50,7 @@ import { DataManager, Query } from '@syncfusion/ej2-data';
 var VirtualScroll = /** @class */ (function () {
     function VirtualScroll(parent) {
         var _this = this;
+        this.previousScrollTop = 0;
         this.sentinelInfo = {
             'up': {
                 check: function (rect, info) {
@@ -110,9 +111,14 @@ var VirtualScroll = /** @class */ (function () {
     VirtualScroll.prototype.getModuleName = function () {
         return 'VirtualScroll';
     };
+    VirtualScroll.prototype.isFilterScrollScenario = function () {
+        return this.component === 'dropdownlist' && this.parent.allowFiltering;
+    };
     VirtualScroll.prototype.popupScrollHandler = function () {
         this.parent.isMouseScrollAction = true;
-        this.parent.isPreventScrollAction = false;
+        if (!(this.isFilterScrollScenario() && this.parent.isVirtualScrolling)) {
+            this.parent.isPreventScrollAction = false;
+        }
     };
     VirtualScroll.prototype.getPageQuery = function (query, virtualStartIndex, virtualEndIndex) {
         if (virtualEndIndex !== 0 && !this.parent.allowFiltering && this.component !== 'autocomplete') {
@@ -482,7 +488,8 @@ var VirtualScroll = /** @class */ (function () {
     };
     VirtualScroll.prototype.scrollListener = function (scrollArgs) {
         var _this = this;
-        if (!this.parent.isPreventScrollAction && !this.parent.isVirtualTrackHeight) {
+        var preventReentrant = this.isFilterScrollScenario() && this.parent.isVirtualScrolling;
+        if (!this.parent.isPreventScrollAction && !this.parent.isVirtualTrackHeight && !preventReentrant) {
             this.parent.preventSetCurrentData = false;
             var info = scrollArgs.sentinel;
             var pStartIndex = this.parent.previousStartIndex;
@@ -494,6 +501,8 @@ var VirtualScroll = /** @class */ (function () {
                 this.parent.virtualListInfo = __assign({}, this.parent.viewPortInfo);
                 this.parent.isPreventKeyAction = true;
                 this.parent.isVirtualScrolling = true;
+                var savedScrollTop_1 = this.parent.popupContentElement ?
+                    this.parent.popupContentElement.scrollTop : 0;
                 setTimeout(function () {
                     _this.parent.pageCount = _this.parent.getPageCount();
                     _this.parent.isRequesting = false;
@@ -503,9 +512,16 @@ var VirtualScroll = /** @class */ (function () {
                             _this.parent.updateSelectionList();
                             _this.parent.liCollections = _this.parent.getItems();
                         }
+                        if (_this.isFilterScrollScenario()) {
+                            var scrollContainer = _this.parent.popupContentElement || _this.parent.list;
+                            if (scrollContainer && scrollContainer.scrollTop < savedScrollTop_1) {
+                                scrollContainer.scrollTop = savedScrollTop_1;
+                            }
+                            _this.previousScrollTop = scrollContainer ? scrollContainer.scrollTop : savedScrollTop_1;
+                        }
                         _this.parent.isKeyBoardAction = false;
-                        _this.parent.isVirtualScrolling = false;
                         _this.parent.isPreventKeyAction = false;
+                        _this.parent.isVirtualScrolling = false;
                     });
                 }, 5);
             }
@@ -579,14 +595,17 @@ var VirtualScroll = /** @class */ (function () {
     VirtualScroll.prototype.virtualScrollHandler = function (callback) {
         var _this = this;
         var delay = Browser.info.name === 'chrome' ? 200 : 100;
-        var prevTop = 0;
         var debounced100 = debounce(callback, delay);
         var debounced50 = debounce(callback, 50);
         return function (e) {
             var top = e.target.scrollTop;
             var left = e.target.scrollLeft;
-            var direction = prevTop < top && !_this.parent.isUpwardScrolling ? 'down' : 'up';
-            prevTop = top;
+            if (_this.isFilterScrollScenario() && (_this.parent.isVirtualScrolling || _this.parent.isPreventScrollAction)) {
+                _this.previousScrollTop = top;
+                return;
+            }
+            var direction = _this.previousScrollTop < top && !_this.parent.isUpwardScrolling ? 'down' : 'up';
+            _this.previousScrollTop = top;
             var current = _this.sentinelInfo[direction];
             var pstartIndex = _this.parent.scrollPreStartIndex;
             var scrollOffsetargs = {

package/src/drop-down-base/drop-down-base.js

@@ -2268,6 +2268,9 @@ var DropDownBase = /** @class */ (function (_super) {
      * @returns {void}
      */
     DropDownBase.prototype.destroy = function () {
+        if (this.keyboardModule) {
+            this.keyboardModule.destroy();
+        }
         if (document) {
             if (this.fields && this.fields.groupBy) {
                 var elements = this.getScrollableParent();
@@ -2307,6 +2310,7 @@ var DropDownBase = /** @class */ (function (_super) {
         this.virtualSelectAllData = null;
         this.incrementalListData = null;
         _super.prototype.destroy.call(this);
+        this.keyboardModule = null;
     };
     __decorate([
         Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)

package/src/drop-down-list/drop-down-list.d.ts

@@ -534,7 +534,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
     protected updateSelectedItem(li: Element, e: MouseEvent | KeyboardEvent | TouchEvent, preventSelect?: boolean, isSelection?: boolean): void;
     private selectEventCallback;
     protected activeItem(li: Element): void;
-    protected setValue(e?: KeyboardEventArgs): boolean;
+    protected setValue(e?: KeyboardEventArgs, autofill?: boolean): boolean;
     protected setSelection(li: Element, e: MouseEvent | KeyboardEventArgs | TouchEvent): void;
     private setSelectOptions;
     private dropdownCompiler;

package/src/drop-down-list/drop-down-list.js

@@ -1594,7 +1594,7 @@ var DropDownList = /** @class */ (function (_super) {
         }
     };
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    DropDownList.prototype.setValue = function (e) {
+    DropDownList.prototype.setValue = function (e, autofill) {
         var dataItem = this.getItemData();
         this.isTouched = !isNullOrUndefined(e);
         if (dataItem.value === null) {
@@ -1626,7 +1626,7 @@ var DropDownList = /** @class */ (function (_super) {
             (this.previousValue != null && this.isObjectInArray(this.previousValue, [this.allowCustom &&
                     this.isObjectCustomValue ? this.value ? this.value : dataItem : dataItem.value ?
                     this.getDataByValue(dataItem.value) : dataItem])))) {
-            if (this.getModuleName() === 'combobox' && this.autoFill && e && (e.type === 'click' || e.action === 'enter')) {
+            if (this.getModuleName() === 'combobox' && autofill && e && (e.type === 'click' || e.action === 'enter')) {
                 return false;
             }
             this.isSelected = false;

package/src/drop-down-tree/drop-down-tree.d.ts

@@ -321,6 +321,8 @@ export declare class DropDownTree extends Component<HTMLElement> implements INot
     private isValueChange;
     private keyEventArgs;
     private keyboardModule;
+    private treeKeyboardModule;
+    private checkAllKeyboardModule;
     private keyConfigs;
     private overFlowWrapper;
     private isFilteredData;
@@ -333,6 +335,8 @@ export declare class DropDownTree extends Component<HTMLElement> implements INot
     private clearIconWidth;
     private isClicked;
     private documentClickContext;
+    private windowResizeHandler;
+    private documentClickHandler;
     private windowResizeContext;
     private isCheckAllCalled;
     private isFromFilterChange;

package/src/drop-down-tree/drop-down-tree.js

@@ -663,12 +663,13 @@ var DropDownTree = /** @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.windowResizeContext);
+        this.windowResizeHandler = this.windowResize.bind(this);
+        EventHandler.add(window, 'resize', this.windowResizeHandler, this);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.add(formElement, 'reset', this.resetValueHandler, this);
         }
-        this.keyboardModule = new KeyboardEvents(this.inputWrapper, {
+        this.treeKeyboardModule = new KeyboardEvents(this.inputWrapper, {
             keyAction: this.keyActionHandler.bind(this),
             keyConfigs: this.keyConfigs,
             eventName: 'keydown'
@@ -682,7 +683,7 @@ var DropDownTree = /** @class */ (function (_super) {
         });
     };
     DropDownTree.prototype.wireCheckAllWrapperEvents = function () {
-        this.keyboardModule = new KeyboardEvents(this.checkAllParent, {
+        this.checkAllKeyboardModule = new KeyboardEvents(this.checkAllParent, {
             keyAction: this.checkAllAction.bind(this),
             keyConfigs: this.keyConfigs,
             eventName: 'keydown'
@@ -699,12 +700,20 @@ var DropDownTree = /** @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.windowResizeContext);
+        EventHandler.remove(window, 'resize', this.windowResizeHandler);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.remove(formElement, 'reset', this.resetValueHandler);
         }
-        this.keyboardModule.destroy();
+        if (this.keyboardModule) {
+            this.keyboardModule.destroy();
+        }
+        if (this.treeKeyboardModule) {
+            this.treeKeyboardModule.destroy();
+        }
+        if (this.checkAllKeyboardModule) {
+            this.checkAllKeyboardModule.destroy();
+        }
         if (this.showSelectAll && this.checkAllParent) {
             EventHandler.remove(this.checkAllParent, 'mouseup', this.clickHandler);
         }
@@ -3381,9 +3390,22 @@ var DropDownTree = /** @class */ (function (_super) {
         this.overFlowWrapper = null;
         this.keyboardModule = null;
         _super.prototype.destroy.call(this);
+        this.treeKeyboardModule = null;
+        this.checkAllKeyboardModule = null;
+        this.selectedData = [];
+        this.treeData = null;
+        this.treeItems = [];
+        this.valueTemplateContainer = null;
+        this.filterContainer = null;
+        this.windowResizeHandler = null;
+        this.documentClickHandler = null;
         this.setProperties({ value: [] }, true);
     };
     DropDownTree.prototype.destroyFilter = function () {
+        if (this.filterTimer) {
+            window.clearTimeout(this.filterTimer);
+            this.filterTimer = null;
+        }
         if (this.filterObj) {
             this.filterObj.destroy();
             detach(this.filterObj.element);

package/src/mention/mention.d.ts

@@ -55,7 +55,6 @@ export declare class Mention extends DropDownBase {
     private selectedElementID;
     private isSelectCancel;
     private isTyped;
-    private didPopupOpenByTypingInitialChar;
     private isUpDownKey;
     private isRTE;
     private keyEventName;

package/src/mention/mention.js

@@ -157,10 +157,8 @@ var Mention = /** @class */ (function (_super) {
         this.unBindCommonEvent();
     };
     Mention.prototype.bindCommonEvent = function () {
-        if (!Browser.isDevice) {
-            this.keydownHandler = this.keyDownHandler.bind(this);
-            this.inputElement.addEventListener('keydown', this.keydownHandler, !this.isRTE);
-        }
+        this.keydownHandler = this.keyDownHandler.bind(this);
+        this.inputElement.addEventListener('keydown', this.keydownHandler, !this.isRTE);
     };
     /**
      * Hides the spinner loader.
@@ -348,7 +346,7 @@ var Mention = /** @class */ (function (_super) {
         return !isNullOrUndefined(element);
     };
     Mention.prototype.unBindCommonEvent = function () {
-        if (!Browser.isDevice && this.keydownHandler) {
+        if (this.keydownHandler) {
             this.inputElement.removeEventListener('keydown', this.keydownHandler, !this.isRTE);
             this.keydownHandler = null;
         }
@@ -365,10 +363,8 @@ var Mention = /** @class */ (function (_super) {
             return;
         }
         this.isTyped = e.code !== 'Enter' && e.code !== 'Space' && e.code !== 'ArrowDown' && e.code !== 'ArrowUp' ? true : false;
-        var activeParent = document.activeElement && document.activeElement.parentElement;
-        var isRteImage = activeParent && !!activeParent.querySelector('.e-rte-image');
-        var isBECodeDropdownFocused = activeParent && !!activeParent.querySelector('.e-blockeditor .e-code-block-container .e-input-group.e-input-focus');
-        if (document.activeElement !== this.inputElement && !isRteImage && !isBECodeDropdownFocused) {
+        var isRteImage = document.activeElement.parentElement && document.activeElement.parentElement.querySelector('.e-rte-image') ? true : false;
+        if (document.activeElement !== this.inputElement && !isRteImage) {
             this.inputElement.focus();
         }
         if (this.isContentEditable(this.inputElement)) {
@@ -489,7 +485,6 @@ var Mention = /** @class */ (function (_super) {
                 this.initValue();
             }
             if (!this.isPopupOpen && e.keyCode !== 38 && e.keyCode !== 40 && this.queryString.length >= this.minLength) {
-                this.didPopupOpenByTypingInitialChar = true;
                 this.showPopup();
                 if (this.initRemoteRender && this.list.querySelectorAll('li').length === 0) {
                     this.showWaitingSpinner();
@@ -748,8 +743,6 @@ var Mention = /** @class */ (function (_super) {
         if (document.activeElement !== this.inputElement) {
             this.inputElement.focus();
         }
-        this.queryString = this.didPopupOpenByTypingInitialChar ? this.queryString : '';
-        this.didPopupOpenByTypingInitialChar = false;
         if (this.isContentEditable(this.inputElement)) {
             this.range = this.getCurrentRange();
         }

package/src/multi-select/multi-select.d.ts

@@ -78,6 +78,7 @@ export declare class MultiSelect extends DropDownBase implements IInput {
     private isFilteringAction;
     private headerTemplateHeight;
     private resizeHandler;
+    private preventKeyboardInteraction;
     private scrollEvent;
     /**
      * The `fields` property maps the columns of the data table and binds the data to the component.
@@ -794,6 +795,7 @@ export declare class MultiSelect extends DropDownBase implements IInput {
     private invokeCheckboxSelection;
     private removeValue;
     private updateMainList;
+    private isFilteringWithRemoteData;
     private removeChip;
     private setWidth;
     private updateChipStatus;
@@ -826,8 +828,8 @@ export declare class MultiSelect extends DropDownBase implements IInput {
     private resetValueHandler;
     protected wireEvent(): void;
     private onInput;
-    private onWheelScroll;
     private pasteHandler;
+    private onWheelScroll;
     protected performFiltering(e: KeyboardEventArgs | MouseEvent): void;
     protected search(e: KeyboardEventArgs): void;
     protected preRender(): void;