@syncfusion/ej2-dropdowns 20.2.46 → 20.2.50

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

@@ -2945,7 +2945,7 @@ let DropDownList = class DropDownList extends DropDownBase {
                     && ((this.dataSource instanceof DataManager)
                         || (!isNullOrUndefined(this.dataSource) && !isNullOrUndefined(this.dataSource.length) &&
                             this.dataSource.length !== 0)))) {
-                    if (this.itemTemplate && this.element.tagName === 'EJS-COMBOBOX' && this.allowFiltering) {
+                    if (this.itemTemplate && (this.element.tagName === 'EJS-COMBOBOX' || this.element.tagName === 'EJS-DROPDOWNLIST') && this.allowFiltering) {
                         setTimeout(() => {
                             this.updateActionCompleteDataValues(ulElement, list);
                         }, 0);
@@ -3496,6 +3496,10 @@ let DropDownList = class DropDownList extends DropDownBase {
         this.setFields();
         this.inputWrapper.container.style.width = formatUnit(this.width);
         this.inputWrapper.container.classList.add('e-ddl');
+        Input.calculateWidth(this.inputElement, this.inputWrapper.container);
+        if (!isNullOrUndefined(this.inputWrapper) && !isNullOrUndefined(this.inputWrapper.buttons[0]) && this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0] && this.floatLabelType !== 'Never') {
+            this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');
+        }
         this.wireEvent();
         this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';
         this.element.removeAttribute('tabindex');
@@ -3507,7 +3511,7 @@ let DropDownList = class DropDownList extends DropDownBase {
         this.updateDataAttribute(this.htmlAttributes);
         this.setHTMLAttributes();
         if (this.targetElement() === this.inputElement) {
-            this.element.removeAttribute('aria-labelledby');
+            this.inputElement.removeAttribute('aria-labelledby');
         }
         if (this.value !== null || this.activeIndex !== null || this.text !== null) {
             this.initValue();
@@ -3688,6 +3692,7 @@ let DropDownList = class DropDownList extends DropDownBase {
                     break;
                 case 'width':
                     this.setEleWidth(newProp.width);
+                    Input.calculateWidth(this.inputElement, this.inputWrapper.container);
                     break;
                 case 'placeholder':
                     Input.setPlaceholder(newProp.placeholder, this.inputElement);
@@ -3705,6 +3710,7 @@ let DropDownList = class DropDownList extends DropDownBase {
                     break;
                 case 'cssClass':
                     this.setCssClass(newProp.cssClass, oldProp.cssClass);
+                    Input.calculateWidth(this.inputElement, this.inputWrapper.container);
                     break;
                 case 'enableRtl':
                     this.setEnableRtl();
@@ -3851,6 +3857,9 @@ let DropDownList = class DropDownList extends DropDownBase {
                 case 'floatLabelType':
                     Input.removeFloating(this.inputWrapper);
                     Input.addFloating(this.inputElement, newProp.floatLabelType, this.placeholder, this.createElement);
+                    if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0] && this.floatLabelType !== 'Never') {
+                        this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');
+                    }
                     break;
                 case 'showClearButton':
                     Input.setClearButton(newProp.showClearButton, this.inputElement, this.inputWrapper, null, this.createElement);
@@ -4032,6 +4041,7 @@ let DropDownList = class DropDownList extends DropDownBase {
         }
         addClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);
         this.onFocus(e);
+        Input.calculateWidth(this.inputElement, this.inputWrapper.container);
     }
     /**
      * Moves the focus from the component if the component is already focused.
@@ -4049,6 +4059,7 @@ let DropDownList = class DropDownList extends DropDownBase {
             this.targetElement().blur();
         }
         removeClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);
+        Input.calculateWidth(this.inputElement, this.inputWrapper.container);
     }
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
@@ -7791,6 +7802,7 @@ let ComboBox = class ComboBox extends DropDownList {
             this.preventFocus = false;
         }
         this.onFocus(e);
+        Input.calculateWidth(this.inputElement, this.inputWrapper.container);
     }
     dropDownClick(e) {
         e.preventDefault();
@@ -8465,6 +8477,10 @@ let AutoComplete = class AutoComplete extends ComboBox {
                     if (this.showPopupButton) {
                         const button = Input.appendSpan(dropDownListClasses.icon, this.inputWrapper.container, this.createElement);
                         this.inputWrapper.buttons[0] = button;
+                        Input.calculateWidth(this.inputElement, this.inputWrapper.container);
+                        if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {
+                            this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');
+                        }
                         if (this.inputWrapper && this.inputWrapper.buttons && this.inputWrapper.buttons[0]) {
                             EventHandler.add(this.inputWrapper.buttons[0], 'click', this.dropDownClick, this);
                         }
@@ -9557,6 +9573,11 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             this.ulElement = this.mainList;
         }
         this.checkPlaceholderSize();
+        Input.createSpanElement(this.overAllWrapper, this.createElement);
+        Input.calculateWidth(this.inputElement, this.overAllWrapper);
+        if (!isNullOrUndefined(this.overAllWrapper) && !isNullOrUndefined(this.overAllWrapper.getElementsByClassName('e-ddl-icon')[0] && this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
+            this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
+        }
     }
     checkPlaceholderSize() {
         if (this.showDropDownIcon) {
@@ -9687,6 +9708,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             if (this.isPopupOpen()) {
                 this.refreshPopup();
             }
+            Input.calculateWidth(this.inputElement, this.overAllWrapper);
             return true;
         }
         else {
@@ -12150,6 +12172,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
                 case 'cssClass':
                     this.updateOldPropCssClass(oldProp.cssClass);
                     this.updateCssClass();
+                    Input.calculateWidth(this.inputElement.parentElement.parentElement, this.overAllWrapper);
                     break;
                 case 'enableRtl':
                     this.enableRTL(newProp.enableRtl);
@@ -12176,6 +12199,11 @@ let MultiSelect = class MultiSelect extends DropDownBase {
                 case 'floatLabelType':
                     this.setFloatLabelType();
                     this.addValidInputClass();
+                    Input.createSpanElement(this.overAllWrapper, this.createElement);
+                    Input.calculateWidth(this.inputElement.parentElement.parentElement, this.overAllWrapper);
+                    if (!isNullOrUndefined(this.overAllWrapper) && !isNullOrUndefined(this.overAllWrapper.getElementsByClassName('e-ddl-icon')[0] && this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
+                        this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
+                    }
                     break;
                 case 'enableSelectionOrder':
                     break;
@@ -12509,6 +12537,11 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         if (this.element.hasAttribute('data-val')) {
             this.element.setAttribute('data-val', 'false');
         }
+        Input.createSpanElement(this.overAllWrapper, this.createElement);
+        Input.calculateWidth(this.inputElement, this.overAllWrapper);
+        if (!isNullOrUndefined(this.overAllWrapper) && !isNullOrUndefined(this.overAllWrapper.getElementsByClassName('e-ddl-icon')[0] && this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
+            this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
+        }
         this.renderComplete();
     }
     checkInitialValue() {