@syncfusion/ej2-dropdowns 25.2.7 → 26.1.38

package/src/list-box/list-box.js

@@ -29,7 +29,6 @@ import { cssClass, Sortable, moveTo } from '@syncfusion/ej2-lists';
 import { Button } from '@syncfusion/ej2-buttons';
 import { createSpinner, showSpinner, hideSpinner, getZindexPartial } from '@syncfusion/ej2-popups';
 import { DataManager, Query } from '@syncfusion/ej2-data';
-var ITEMTEMPLATE_PROPERTY = 'ItemTemplate';
 /**
  * Defines the Selection settings of List Box.
  */
@@ -145,6 +144,7 @@ var ListBox = /** @class */ (function (_super) {
         var hiddenSelect = this.createElement('select', { className: 'e-hidden-select', attrs: { 'multiple': '' } });
         hiddenSelect.style.visibility = 'hidden';
         this.list.classList.add('e-listbox-wrapper');
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.list.querySelector('.e-list-parent').setAttribute('role', 'presentation');
         var groupHdrs = this.list.querySelectorAll('.e-list-group-item');
         for (var i = 0; i < groupHdrs.length; i++) {
@@ -163,7 +163,7 @@ var ListBox = /** @class */ (function (_super) {
             }
         }
         else {
-            if (this.initLoad) {
+            if (this.initLoad && this.element.parentElement) {
                 this.element.parentElement.insertBefore(this.list, this.element);
             }
             this.list.insertBefore(this.element, this.list.firstChild);
@@ -181,6 +181,7 @@ var ListBox = /** @class */ (function (_super) {
         this.list.setAttribute('role', 'listbox');
         attributes(this.list, { 'role': 'listbox', 'aria-label': 'listbox', 'aria-multiselectable': this.selectionSettings.mode === 'Multiple' ? 'true' : 'false' });
         this.updateSelectionSettings();
+        this.resizeHandler();
     };
     ListBox.prototype.updateSelectionSettings = function () {
         if (this.selectionSettings.showCheckbox && this.selectionSettings.showSelectAll && this.liCollections.length) {
@@ -231,6 +232,7 @@ var ListBox = /** @class */ (function (_super) {
     ListBox.prototype.initToolbar = function () {
         var pos = this.toolbarSettings.position;
         var prevScope = this.element.getAttribute('data-value');
+        this.toolbarSettings.items = isNullOrUndefined(this.toolbarSettings.items) ? [] : this.toolbarSettings.items;
         if (this.toolbarSettings.items.length) {
             var toolElem = this.createElement('div', { className: 'e-listbox-tool', attrs: { 'role': 'toolbar' } });
             var wrapper = this.createElement('div', {
@@ -325,7 +327,9 @@ var ListBox = /** @class */ (function (_super) {
             this.spinner = this.createElement('div', { className: 'e-listbox-wrapper' });
         }
         this.spinner.style.height = formatUnit(this.height);
-        this.element.parentElement.insertBefore(this.spinner, this.element.nextSibling);
+        if (this.element.parentElement) {
+            this.element.parentElement.insertBefore(this.spinner, this.element.nextSibling);
+        }
         createSpinner({ target: this.spinner }, this.createElement);
         showSpinner(this.spinner);
     };
@@ -631,7 +635,7 @@ var ListBox = /** @class */ (function (_super) {
             }
             var fListData_1 = [].slice.call(this.listData);
             var fSortData_1 = [].slice.call(this.sortedData);
-            selectedOptions.forEach(function (value, index) {
+            selectedOptions.forEach(function (value) {
                 droppedData = _this.getDataByValue(value);
                 var srcIdx = _this.listData.indexOf(droppedData);
                 var jsonSrcIdx = _this.jsonData.indexOf(droppedData);
@@ -1159,6 +1163,7 @@ var ListBox = /** @class */ (function (_super) {
         if (form) {
             EventHandler.add(form, 'reset', this.formResetHandler, this);
         }
+        window.addEventListener('resize', this.resizeHandler.bind(this));
     };
     ListBox.prototype.wireToolbarEvent = function () {
         if (this.toolbarSettings.items.length) {
@@ -1180,8 +1185,13 @@ var ListBox = /** @class */ (function (_super) {
         if (form) {
             EventHandler.remove(form, 'reset', this.formResetHandler);
         }
+        window.removeEventListener('resize', this.resizeHandler.bind(this));
     };
     ListBox.prototype.clickHandler = function (e) {
+        var li = closest(e.target, '.' + 'e-list-item');
+        if (isNullOrUndefined(li)) {
+            return;
+        }
         this.selectHandler(e);
     };
     ListBox.prototype.checkSelectAll = function () {
@@ -1674,6 +1684,7 @@ var ListBox = /** @class */ (function (_super) {
         }
         var _loop_3 = function (i) {
             if (fListBox.ulElement.childNodes[i].classList.contains('e-disabled')) {
+                // eslint-disable-next-line @typescript-eslint/tslint/config
                 flistboxarray = flistboxarray.filter(function (item) { return item !== i; });
                 tempLiColl.push(fListBox.ulElement.childNodes[i]);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -2029,6 +2040,14 @@ var ListBox = /** @class */ (function (_super) {
             this.refreshClearIcon();
         }
     };
+    ListBox.prototype.resizeHandler = function () {
+        if (this.list.scrollWidth > this.list.offsetWidth) {
+            this.list.querySelector('.e-list-parent').style.display = 'inline-block';
+        }
+        else {
+            this.list.querySelector('.e-list-parent').style.display = 'block';
+        }
+    };
     ListBox.prototype.getValidIndex = function (cli, index, keyCode) {
         var cul = this.ulElement;
         if (cli.classList.contains('e-disabled') || cli.classList.contains(cssClass.group)) {
@@ -2094,7 +2113,9 @@ var ListBox = /** @class */ (function (_super) {
             });
         }
     };
-    ListBox.prototype.setSelection = function (values, isSelect, isText, canFocus) {
+    ListBox.prototype.setSelection = function (
+    // eslint-disable-next-line max-len
+    values, isSelect, isText, canFocus) {
         var _this = this;
         if (values === void 0) { values = this.value; }
         if (isSelect === void 0) { isSelect = true; }
@@ -2119,21 +2140,21 @@ var ListBox = /** @class */ (function (_super) {
                     li = _this.list.querySelector('[data-value="' + text + '"]');
                 }
                 if (li) {
-                    if (_this.selectionSettings.showCheckbox) {
+                    if (_this.selectionSettings.showCheckbox && !li.classList.contains('e-disabled')) {
                         liselect = li.getElementsByClassName('e-frame')[0].classList.contains('e-check');
                     }
                     else {
                         liselect = li.classList.contains('e-selected');
                     }
                     if (!isSelect && liselect || isSelect && !liselect && li) {
-                        if (_this.selectionSettings.showCheckbox) {
+                        if (_this.selectionSettings.showCheckbox && !li.classList.contains('e-disabled')) {
                             _this.notify('updatelist', { li: li, module: 'listbox' });
                             if (canFocus) {
                                 li.focus();
                             }
                         }
                         else {
-                            if (isSelect) {
+                            if (isSelect && !li.classList.contains('e-disabled')) {
                                 li.classList.add(cssClass.selected);
                                 li.setAttribute('aria-selected', 'true');
                                 if (canFocus) {
@@ -2167,7 +2188,17 @@ var ListBox = /** @class */ (function (_super) {
         this.checkSelectAll();
     };
     ListBox.prototype.checkDisabledState = function (inst) {
-        return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
+        if (isNullOrUndefined(inst.ulElement)) {
+            if (!isNullOrUndefined(this.dataSource) && isNullOrUndefined(this.dataSource.length)) {
+                return false;
+            }
+            else {
+                return true;
+            }
+        }
+        else {
+            return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
+        }
     };
     ListBox.prototype.updateToolBarState = function () {
         var _this = this;
@@ -2405,6 +2436,7 @@ var ListBox = /** @class */ (function (_super) {
                         }
                     }
                     if (newProp.toolbarSettings.items) {
+                        oldProp.toolbarSettings.items = isNullOrUndefined(oldProp.toolbarSettings.items) ? [] : oldProp.toolbarSettings.items;
                         if (oldProp.toolbarSettings && oldProp.toolbarSettings.items.length) {
                             ele = this.list.parentElement;
                             ele.parentElement.insertBefore(this.list, ele);

package/src/mention/mention.js

@@ -296,6 +296,9 @@ var Mention = /** @class */ (function (_super) {
         }
     };
     Mention.prototype.updateUpDownAction = function (e) {
+        if (this.fields.disabled && this.list && this.list.querySelectorAll('.e-list-item:not(.e-disabled)').length === 0) {
+            return;
+        }
         var focusEle = this.list.querySelector('.' + dropDownBaseClasses.focus);
         if (this.isSelectFocusItem(focusEle)) {
             this.setSelection(focusEle, e);
@@ -316,6 +319,17 @@ var Mention = /** @class */ (function (_super) {
                 this.setSelection(nextItem, e);
             }
         }
+        var itemIndex;
+        for (var index = 0; index < this.liCollections.length; index++) {
+            if (this.liCollections[index].classList.contains(dropDownBaseClasses.focus)
+                || this.liCollections[index].classList.contains(dropDownBaseClasses.selected)) {
+                itemIndex = index;
+                break;
+            }
+        }
+        if (itemIndex != null && this.isDisabledElement(this.liCollections[itemIndex])) {
+            this.updateUpDownAction(e);
+        }
         if (this.isPopupOpen) {
             e.preventDefault();
         }
@@ -491,7 +505,7 @@ var Mention = /** @class */ (function (_super) {
             if (!isNullOrUndefined(ulElement)) {
                 attributes(ulElement, { 'id': this.inputElement.id + '_options', 'role': 'listbox', 'aria-hidden': 'false' });
             }
-            var focusItem = ulElement.querySelector('.' + dropDownBaseClasses.li);
+            var focusItem = this.fields.disabled ? ulElement.querySelector('.' + dropDownBaseClasses.li + ':not(.e-disabled)') : ulElement.querySelector('.' + dropDownBaseClasses.li);
             if (focusItem) {
                 focusItem.classList.add(dropDownBaseClasses.selected);
                 this.selectedLI = focusItem;
@@ -720,10 +734,10 @@ var Mention = /** @class */ (function (_super) {
                     }
                 }
                 append([_this.list], popupEle_1);
-                if (_this.inputElement.parentElement && _this.inputElement.parentElement.parentElement &&
-                    _this.inputElement.parentElement.parentElement.classList.contains('e-richtexteditor')) {
-                    if (popupEle_1.firstElementChild && popupEle_1.firstElementChild.childElementCount > 0) {
-                        popupEle_1.firstElementChild.setAttribute('aria-owns', _this.inputElement.parentElement.parentElement.id);
+                if (_this.inputElement.parentElement) {
+                    var rteRootElement = _this.inputElement.parentElement.closest('.e-richtexteditor');
+                    if (rteRootElement && popupEle_1.firstElementChild && popupEle_1.firstElementChild.childElementCount > 0) {
+                        popupEle_1.firstElementChild.setAttribute('aria-owns', rteRootElement.id);
                         addClass([popupEle_1], 'e-rte-elements');
                     }
                 }
@@ -1026,7 +1040,7 @@ var Mention = /** @class */ (function (_super) {
     Mention.prototype.onMouseClick = function (e) {
         var target = e.target;
         var li = closest(target, '.' + dropDownBaseClasses.li);
-        if (!this.isValidLI(li)) {
+        if (!this.isValidLI(li) || this.isDisabledElement(li)) {
             return;
         }
         this.isSelected = true;
@@ -1257,6 +1271,7 @@ var Mention = /** @class */ (function (_super) {
             }
             this.isTyped = false;
             range.deleteContents();
+            range.startContainer.parentElement.normalize();
             var element = this.createElement('div');
             element.innerHTML = value;
             var frag = document.createDocumentFragment();
@@ -1293,10 +1308,10 @@ var Mention = /** @class */ (function (_super) {
         }
         if (this.isContentEditable(this.inputElement)) {
             if (Browser.isAndroid) {
-                return '<span contenteditable="true" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : ' ');
+                return '<span contenteditable="true" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : '');
             }
             else {
-                return '<span contenteditable="false" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : ' ');
+                return '<span contenteditable="false" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : '');
             }
         }
         else {

package/src/multi-select/interface.js

@@ -1 +0,0 @@
-

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

@@ -906,6 +906,13 @@ export declare class MultiSelect extends DropDownBase implements IInput {
      */
     render(): void;
     private getListHeight;
+    /**
+     * Removes disabled values from the given array.
+     *
+     * @param { number[] | string[] | boolean[] | object[] } value - The array to check.
+     * @returns {void}
+     */
+    private removeDisabledItemsValue;
     private checkInitialValue;
     private checkAutoFocus;
     private updatevirtualizationList;
@@ -913,6 +920,14 @@ export declare class MultiSelect extends DropDownBase implements IInput {
     private addValidInputClass;
     private dropDownIcon;
     private initialUpdate;
+    /**
+     * Method to disable specific item in the popup.
+     *
+     * @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
+     * @returns {void}
+
+     */
+    disableItem(item: string | number | object | HTMLLIElement): void;
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
      *

package/src/multi-select/multi-select.js

@@ -358,13 +358,26 @@ var MultiSelect = /** @class */ (function (_super) {
             }
             else {
                 if (this.enableVirtualization) {
-                    element = this.ulElement.querySelector('li.'
-                        + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)');
+                    if (this.fields.disabled) {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)' + ':not(.' + DISABLED + ')');
+                    }
+                    else {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)');
+                    }
                 }
                 else {
-                    element = this.ulElement.querySelector('li.'
-                        + dropDownBaseClasses.li + ':not(.'
-                        + HIDE_LIST + ')');
+                    if (this.fields.disabled) {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.'
+                            + HIDE_LIST + ')' + ':not(.' + DISABLED + ')');
+                    }
+                    else {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.'
+                            + HIDE_LIST + ')');
+                    }
                 }
             }
             if (element !== null) {
@@ -2097,6 +2110,21 @@ var MultiSelect = /** @class */ (function (_super) {
                 }
             }
         }
+        var focusedLi = this.list ? this.list.querySelector('.e-item-focus') : null;
+        if (this.isDisabledElement(focusedLi)) {
+            if (this.list.querySelectorAll('.e-list-item:not(.e-hide-listitem):not(.e-disabled)').length === 0) {
+                this.removeFocus();
+                return;
+            }
+            var index = this.getIndexByValue(focusedLi.getAttribute('data-value'));
+            if (index === 0 && this.mode !== 'CheckBox') {
+                position = 1;
+            }
+            if (index === (this.list.querySelectorAll('.e-list-item:not(.e-hide-listitem)').length - 1)) {
+                position = -1;
+            }
+            this.moveByList(position);
+        }
     };
     MultiSelect.prototype.getElementByValue = function (value) {
         var item;
@@ -2287,7 +2315,7 @@ var MultiSelect = /** @class */ (function (_super) {
                     }
                     _this.setProperties({ value: [].concat([], removeVal) }, true);
                     if (_this.enableVirtualization) {
-                        var currentText = index == 0 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index] + _this.delimiterChar, '') : _this.text.replace(_this.delimiterChar + _this.text.split(_this.delimiterChar)[index], '');
+                        var currentText = index == 0 && _this.text.split(_this.delimiterChar) && _this.text.split(_this.delimiterChar).length == 1 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index], '') : index == 0 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index] + _this.delimiterChar, '') : _this.text.replace(_this.delimiterChar + _this.text.split(_this.delimiterChar)[index], '');
                         _this.setProperties({ text: currentText.toString() }, true);
                     }
                     if (element_1 !== null) {
@@ -3679,7 +3707,7 @@ var MultiSelect = /** @class */ (function (_super) {
         }
     };
     MultiSelect.prototype.addListFocus = function (element) {
-        if (this.enabled && this.isValidLI(element)) {
+        if (this.enabled && (this.isValidLI(element) || (this.fields.disabled && this.isDisabledElement(element)))) {
             this.removeFocus();
             addClass([element], dropDownBaseClasses.focus);
             this.updateAriaActiveDescendant();
@@ -4270,14 +4298,14 @@ var MultiSelect = /** @class */ (function (_super) {
         var li;
         if (!isNullOrUndefined(this.list)) {
             li = this.list.querySelectorAll(state ?
-                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-virtual-list)' :
-                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-virtual-list)');
+                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)' :
+                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)');
         }
         if (this.value && this.value.length && event && event.target
             && closest(event.target, '.e-close-hooker') && this.allowFiltering) {
             li = this.mainList.querySelectorAll(state ?
-                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-virtual-list)' :
-                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-virtual-list)');
+                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)' :
+                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)');
         }
         if (this.enableGroupCheckBox && this.mode === 'CheckBox' && !isNullOrUndefined(this.fields.groupBy)) {
             var target = (event ? (this.groupTemplate ? closest(event.target, '.e-list-group-item') : event.target) : null);
@@ -4725,9 +4753,16 @@ var MultiSelect = /** @class */ (function (_super) {
                     this.updateClearButton(newProp.showClearButton);
                     break;
                 case 'text':
+                    if (this.fields.disabled) {
+                        this.text =
+                            this.text && !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+                    }
                     this.updateVal(this.value, this.value, 'text');
                     break;
                 case 'value':
+                    if (this.fields.disabled) {
+                        this.removeDisabledItemsValue(this.value);
+                    }
                     this.updateVal(this.value, oldProp.value, 'value');
                     this.addValidInputClass();
                     if (!this.closePopupOnSelect && this.isPopupOpen()) {
@@ -5299,8 +5334,33 @@ var MultiSelect = /** @class */ (function (_super) {
         listParent.remove();
         return listItemHeight;
     };
+    /**
+     * Removes disabled values from the given array.
+     *
+     * @param { number[] | string[] | boolean[] | object[] } value - The array to check.
+     * @returns {void}
+     */
+    MultiSelect.prototype.removeDisabledItemsValue = function (value) {
+        if (value) {
+            var data = [];
+            var dataIndex = 0;
+            for (var index = 0; index < value.length; index++) {
+                var indexValue = value[index];
+                if (typeof (indexValue) === 'object') {
+                    indexValue = JSON.parse(JSON.stringify(indexValue))[this.fields.value];
+                }
+                if ((indexValue != null) && !(this.isDisabledItemByIndex(this.getIndexByValue(indexValue)))) {
+                    data[dataIndex++] = value[index];
+                }
+            }
+            this.value = data.length > 0 ? data : null;
+        }
+    };
     MultiSelect.prototype.checkInitialValue = function () {
         var _this = this;
+        if (this.fields.disabled) {
+            this.removeDisabledItemsValue(this.value);
+        }
         var isData = this.dataSource instanceof Array ? (this.dataSource.length > 0)
             : !isNullOrUndefined(this.dataSource);
         if (!(this.value && this.value.length) &&
@@ -5339,6 +5399,9 @@ var MultiSelect = /** @class */ (function (_super) {
                 _super.prototype.render.call(this);
             }
         }
+        if (this.fields.disabled) {
+            this.text = this.text && !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+        }
         if (!isNullOrUndefined(this.text) && (isNullOrUndefined(this.value) || this.value.length === 0)) {
             this.initialTextUpdate();
         }
@@ -5473,6 +5536,66 @@ var MultiSelect = /** @class */ (function (_super) {
         this.refreshInputHight();
         this.checkPlaceholderSize();
     };
+    /**
+     * Method to disable specific item in the popup.
+     *
+     * @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
+     * @returns {void}
+
+     */
+    MultiSelect.prototype.disableItem = function (item) {
+        if (this.fields.disabled) {
+            if (!this.list) {
+                this.renderList();
+            }
+            var itemIndex = -1;
+            if (this.liCollections && this.liCollections.length > 0 && this.listData && this.fields.disabled) {
+                if (typeof (item) === 'string') {
+                    itemIndex = this.getIndexByValue(item);
+                }
+                else if (typeof item === 'object') {
+                    if (item instanceof HTMLLIElement) {
+                        for (var index = 0; index < this.liCollections.length; index++) {
+                            if (this.liCollections[index] === item) {
+                                itemIndex = this.getIndexByValue(item.getAttribute('data-value'));
+                                break;
+                            }
+                        }
+                    }
+                    else {
+                        var value = JSON.parse(JSON.stringify(item))[this.fields.value];
+                        for (var index = 0; index < this.listData.length; index++) {
+                            if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.value] === value) {
+                                itemIndex = this.getIndexByValue(value);
+                                break;
+                            }
+                        }
+                    }
+                }
+                else {
+                    itemIndex = item;
+                }
+                var isValidIndex = itemIndex < this.liCollections.length && itemIndex > -1;
+                if (isValidIndex && !(JSON.parse(JSON.stringify(this.listData[itemIndex]))[this.fields.disabled])) {
+                    var li = this.liCollections[itemIndex];
+                    if (li) {
+                        this.disableListItem(li);
+                        var parsedData = JSON.parse(JSON.stringify(this.listData[itemIndex]));
+                        parsedData[this.fields.disabled] = true;
+                        this.listData[itemIndex] = parsedData;
+                        if (li.classList.contains(dropDownBaseClasses.focus)) {
+                            this.removeFocus();
+                        }
+                        if (li.classList.contains(HIDE_LIST) || li.classList.contains(dropDownBaseClasses.selected)) {
+                            var oldValue = this.value;
+                            this.removeDisabledItemsValue(this.value);
+                            this.updateVal(this.value, oldValue, 'value');
+                        }
+                    }
+                }
+            }
+        }
+    };
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
      *
@@ -5540,7 +5663,7 @@ var MultiSelect = /** @class */ (function (_super) {
         this.selectAllEventEle = null;
     };
     __decorate([
-        Complex({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)
+        Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
     ], MultiSelect.prototype, "fields", void 0);
     __decorate([
         Property(false)

package/styles/auto-complete/_bootstrap5.3-definition.scss

@@ -0,0 +1,2 @@
+//default
+//enddefault

package/styles/auto-complete/_fluent2-definition.scss

@@ -0,0 +1,2 @@
+//default
+//enddefault

package/styles/auto-complete/bootstrap-dark.css

@@ -1,6 +1,7 @@
 .e-popup.e-ddl {
   border-radius: 4px;
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
+          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
   margin-top: 3px;
 }
 .e-popup.e-ddl .e-input-group {
@@ -15,6 +16,7 @@
 }
 
 .e-popup.e-ddl .e-filter-parent .e-input-group {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: auto;
@@ -73,7 +75,8 @@
 .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-ddl.e-popup .e-filter-parent {

package/styles/auto-complete/bootstrap.css

@@ -1,6 +1,7 @@
 .e-popup.e-ddl {
   border-radius: 4px;
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
   margin-top: 3px;
 }
 .e-popup.e-ddl .e-input-group {
@@ -15,6 +16,7 @@
 }
 
 .e-popup.e-ddl .e-filter-parent .e-input-group {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: auto;
@@ -73,7 +75,8 @@
 .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-ddl.e-popup .e-filter-parent {

package/styles/auto-complete/bootstrap4.css

@@ -1,6 +1,7 @@
 .e-popup.e-ddl {
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   margin-top: 3px;
 }
 .e-popup.e-ddl .e-input-group {
@@ -15,6 +16,7 @@
 }
 
 .e-popup.e-ddl .e-filter-parent .e-input-group {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: auto;
@@ -91,11 +93,13 @@
 .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon {
   background: transparent;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   position: relative;

package/styles/auto-complete/bootstrap5-dark.css

@@ -1,6 +1,7 @@
 .e-popup.e-ddl {
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   margin-top: 3px;
 }
 .e-popup.e-ddl .e-input-group {
@@ -15,6 +16,7 @@
 }
 
 .e-popup.e-ddl .e-filter-parent .e-input-group {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: auto;
@@ -102,11 +104,13 @@
 .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon {
   background: transparent;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   position: relative;

package/styles/auto-complete/bootstrap5.css

@@ -1,6 +1,7 @@
 .e-popup.e-ddl {
   border-radius: 4px;
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
   margin-top: 3px;
 }
 .e-popup.e-ddl .e-input-group {
@@ -15,6 +16,7 @@
 }
 
 .e-popup.e-ddl .e-filter-parent .e-input-group {
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: auto;
@@ -102,11 +104,13 @@
 .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
-  box-shadow: none;
+  -webkit-box-shadow: none;
+          box-shadow: none;
 }
 
 .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon {
   background: transparent;
+  display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   position: relative;