@syncfusion/ej2-dropdowns 29.2.4 → 29.2.7

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

@@ -1816,6 +1816,13 @@ let DropDownBase = class DropDownBase extends Component {
                 }
             }
         }
+        if (this.getModuleName() === 'multiselect' && this.isAngular && this.ngEle) {
+            const popupHolder = this.list;
+            if (popupHolder) {
+                const prevHeight = popupHolder.offsetHeight + 'px';
+                popupHolder.style.height = prevHeight;
+            }
+        }
         if (!isNullOrUndefined(this.list)) {
             if (!this.isVirtualizationEnabled) {
                 this.list.innerHTML = '';
@@ -1825,6 +1832,15 @@ let DropDownBase = class DropDownBase extends Component {
                 this.postRender(this.list, list, this.bindEvent);
             }
         }
+        if (this.getModuleName() === 'multiselect' && this.isAngular && this.ngEle) {
+            const popupHolder = this.list;
+            if (popupHolder) {
+                setTimeout(() => {
+                    popupHolder.style.height = '';
+                    this.refreshPopup();
+                }, 0);
+            }
+        }
     }
     /* eslint-disable @typescript-eslint/no-unused-vars */
     postRender(listElement, list, bindEvent) {
@@ -4288,7 +4304,8 @@ let DropDownList = class DropDownList extends DropDownBase {
             // eslint-disable-next-line @typescript-eslint/no-this-alias
             const proxy = this;
             // eslint-disable-next-line max-len
-            const duration = (this.element.tagName === this.getNgDirective() && this.itemTemplate) ? 500 : 100;
+            const duration = ((this.dataSource instanceof DataManager) && this.groupTemplate) ? 700 :
+                (this.element.tagName === this.getNgDirective() && this.itemTemplate) ? 500 : 100;
             if (!this.isSecondClick) {
                 setTimeout(() => {
                     proxy.cloneElements();
@@ -5141,6 +5158,9 @@ let DropDownList = class DropDownList extends DropDownBase {
         }
         if (this.getInitialData) {
             this.updateActionCompleteDataValues(ulElement, list);
+            if (this.enableVirtualization) {
+                this.updateSelectElementData(this.allowFiltering);
+            }
             this.getInitialData = false;
             this.isReactTemplateUpdate = true;
             this.searchLists(this.filterArgs);
@@ -5191,16 +5211,6 @@ let DropDownList = class DropDownList extends DropDownBase {
                                 if (!this.enableVirtualization) {
                                     this.addItem(e.result, list.length);
                                 }
-                                else {
-                                    this.itemData = e.result[0];
-                                    const dataItem = this.getItemData();
-                                    const value = this.allowObjectBinding ?
-                                        this.getDataByValue(dataItem.value) : dataItem.value;
-                                    if ((this.value === dataItem.value && this.text !== dataItem.text) ||
-                                        (this.value !== dataItem.value && this.text === dataItem.text)) {
-                                        this.setProperties({ 'text': dataItem.text ? dataItem.text.toString() : dataItem.text, 'value': value });
-                                    }
-                                }
                                 this.updateValues();
                             }
                             else {
@@ -6140,6 +6150,7 @@ let DropDownList = class DropDownList extends DropDownBase {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             dataSourceCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;
         }
+        this.customFilterQuery = null;
         if (this.enableVirtualization && this.isFiltering() && isFilterValue && this.totalItemCount !== dataSourceCount) {
             this.updateInitialData();
             this.checkAndResetCache();
@@ -6876,6 +6887,9 @@ let DropDownList = class DropDownList extends DropDownBase {
         if (!this.enabled) {
             return;
         }
+        if (this.getModuleName() === 'dropdownlist' && this.beforePopupOpen && !this.isPopupOpen) {
+            this.beforePopupOpen = false;
+        }
         this.firstItem = this.dataSource && this.dataSource.length > 0 ? this.dataSource[0] : null;
         if (this.isReact && this.getModuleName() === 'combobox' && this.itemTemplate && this.isCustomFilter && this.isAddNewItemTemplate) {
             this.renderList();
@@ -8910,7 +8924,8 @@ let DropDownTree = class DropDownTree extends Component {
             loadOnDemand: this.treeSettings.loadOnDemand,
             nodeSelecting: this.onBeforeSelect.bind(this),
             nodeTemplate: this.itemTemplate,
-            checkDisabledChildren: this.treeSettings.checkDisabledChildren
+            checkDisabledChildren: this.treeSettings.checkDisabledChildren,
+            checkOnClick: true
         });
         this.treeObj.root = this.root ? this.root : this;
         this.treeObj.appendTo(this.tree);
@@ -8988,7 +9003,7 @@ let DropDownTree = class DropDownTree extends Component {
                 this.popupObj.refreshPosition();
                 if (!(this.showSelectAll || this.allowFiltering) && (!this.popupDiv.classList.contains(NODATA)
                     && this.treeItems.length > 0)) {
-                    let focusedElement = this.value != null && this.text != null ? this.treeObj.element.querySelector('[data-uid="' + this.value[0] + '"]') : null;
+                    let focusedElement = this.value != null && this.text != null ? this.treeObj.element.querySelector('[data-uid="' + this.value[this.value.length - 1] + '"]') : null;
                     if (focusedElement) {
                         this.treeObj.element.querySelector('li').setAttribute('tabindex', '-1');
                         focusedElement.setAttribute('tabindex', '0');
@@ -9434,15 +9449,6 @@ let DropDownTree = class DropDownTree extends Component {
         }
         const target = args.event.target;
         if ((target.classList.contains('e-fullrow') || target.classList.contains('e-list-text')) && this.showCheckBox) {
-            this.isClicked = true;
-            const getNodeDetails = this.treeObj.getNode(args.node);
-            if (getNodeDetails.isChecked === 'true') {
-                this.treeObj.uncheckAll([args.node]);
-            }
-            else {
-                this.treeObj.checkAll([args.node]);
-            }
-            this.isClicked = false;
             this.setMultiSelect();
             this.ensurePlaceHolder();
         }
@@ -11029,19 +11035,22 @@ let ComboBox = class ComboBox extends DropDownList {
                 const fields = (this.fields.value) ? this.fields.value : '';
                 const currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;
                 if (this.dataSource instanceof DataManager) {
-                    const getItem = new DataManager(this.virtualGroupDataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue)));
-                    if (getItem && getItem.length > 0) {
-                        this.itemData = getItem[0];
-                        doesItemExist = true;
-                        const dataItem = this.getItemData();
-                        const value = this.allowObjectBinding
-                            ? this.getDataByValue(dataItem.value)
-                            : dataItem.value;
-                        if ((this.value === dataItem.value && this.text !== dataItem.text)
-                            || (this.value !== dataItem.value && this.text === dataItem.text)) {
-                            this.setProperties({ 'text': dataItem.text ? dataItem.text.toString() : dataItem.text, 'value': value });
+                    this.dataSource.executeQuery(new Query().where(new Predicate(fields, 'equal', currentValue)))
+                        .then((e) => {
+                        if (e.result.length > 0) {
+                            this.itemData = e.result[0];
+                            const dataItem = this.getItemData();
+                            const value = this.allowObjectBinding ?
+                                this.getDataByValue(dataItem.value) : dataItem.value;
+                            if ((this.value === dataItem.value && this.text !== dataItem.text) ||
+                                (this.value !== dataItem.value && this.text === dataItem.text)) {
+                                this.setProperties({ 'text': dataItem.text ? dataItem.text.toString() : dataItem.text, 'value': value });
+                            }
                         }
-                    }
+                        else {
+                            this.valueMuteChange(null);
+                        }
+                    });
                 }
                 else {
                     const getItem = new DataManager(this.dataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue)));
@@ -11069,7 +11078,8 @@ let ComboBox = class ComboBox extends DropDownList {
                 (this.allowCustom && this.enableVirtualization && !doesItemExist)) {
                 this.valueMuteChange(this.value);
             }
-            else if (!this.enableVirtualization || (this.enableVirtualization && !doesItemExist)) {
+            else if (!this.enableVirtualization || (this.enableVirtualization && !(this.dataSource instanceof DataManager)
+                && !doesItemExist)) {
                 this.valueMuteChange(null);
             }
         }
@@ -11232,7 +11242,10 @@ let ComboBox = class ComboBox extends DropDownList {
                 }
             }
             const activeElement = activeItem.item;
-            if (!isNullOrUndefined(activeElement)) {
+            const dataItem = this.getItemData();
+            if ((!isNullOrUndefined(activeElement) && !this.enableVirtualization) || (this.enableVirtualization &&
+                this.isTyped && isNullOrUndefined(dataItem) && isNullOrUndefined(dataItem.value) &&
+                dataItem.value.toString() === activeElement.getAttribute('data-value').toString())) {
                 const count = this.getIndexByValue(activeElement.getAttribute('data-value')) - 1;
                 const height = parseInt(getComputedStyle(this.liCollections[0], null).getPropertyValue('height'), 10);
                 if (!isNaN(height) && this.getModuleName() !== 'autocomplete') {
@@ -13818,13 +13831,20 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         this.checkAndScrollParent();
     }
     checkAndScrollParent() {
-        const parentElement = this.overAllWrapper ? this.overAllWrapper.parentElement : null;
-        if (parentElement) {
-            const wrapperHeight = parseFloat(getComputedStyle(this.overAllWrapper).height);
-            const parentMaxHeight = parseFloat(getComputedStyle(parentElement).maxHeight);
-            if (!isNaN(parentMaxHeight) && wrapperHeight > parentMaxHeight) {
-                parentElement.scrollTop = parentElement.scrollHeight;
+        let scrollElement = this.overAllWrapper ? this.overAllWrapper.parentElement : null;
+        while (scrollElement) {
+            const scrollElementStyle = getComputedStyle(scrollElement);
+            const scrollElmentHeight = parseFloat(scrollElementStyle.maxHeight) || parseFloat(scrollElementStyle.height);
+            if (!isNaN(scrollElmentHeight) && this.isPopupOpen()) {
+                const overflowY = scrollElementStyle.overflowY;
+                const wrapperBottom = this.overAllWrapper.getBoundingClientRect().bottom;
+                const scrollElementBottom = scrollElement.getBoundingClientRect().bottom;
+                if ((overflowY === 'auto' || overflowY === 'scroll') && wrapperBottom > scrollElementBottom) {
+                    scrollElement.scrollTop += (wrapperBottom - scrollElementBottom) + 10;
+                    return;
+                }
             }
+            scrollElement = scrollElement.parentElement;
         }
     }
     enable(state) {