@syncfusion/ej2-dropdowns 27.1.51 → 27.1.53

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (96) hide show
  1. package/dist/ej2-dropdowns.min.js +2 -2
  2. package/dist/ej2-dropdowns.umd.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-dropdowns.es2015.js +149 -56
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +149 -56
  7. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  8. package/dist/global/ej2-dropdowns.min.js +2 -2
  9. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +9 -9
  12. package/src/combo-box/combo-box.js +1 -0
  13. package/src/drop-down-base/drop-down-base.js +21 -15
  14. package/src/drop-down-list/drop-down-list.d.ts +2 -1
  15. package/src/drop-down-list/drop-down-list.js +6 -2
  16. package/src/drop-down-tree/drop-down-tree.js +3 -3
  17. package/src/list-box/list-box.js +28 -4
  18. package/src/multi-select/multi-select.js +90 -32
  19. package/styles/bootstrap-dark-lite.css +5 -0
  20. package/styles/bootstrap-dark.css +5 -0
  21. package/styles/bootstrap-lite.css +5 -0
  22. package/styles/bootstrap.css +5 -0
  23. package/styles/bootstrap4-lite.css +5 -0
  24. package/styles/bootstrap4.css +5 -0
  25. package/styles/bootstrap5-dark-lite.css +5 -0
  26. package/styles/bootstrap5-dark.css +5 -0
  27. package/styles/bootstrap5-lite.css +5 -0
  28. package/styles/bootstrap5.3-lite.css +5 -0
  29. package/styles/bootstrap5.3.css +5 -0
  30. package/styles/bootstrap5.css +5 -0
  31. package/styles/drop-down-list/_layout.scss +1 -0
  32. package/styles/drop-down-list/bootstrap-dark.css +1 -0
  33. package/styles/drop-down-list/bootstrap.css +1 -0
  34. package/styles/drop-down-list/bootstrap4.css +1 -0
  35. package/styles/drop-down-list/bootstrap5-dark.css +1 -0
  36. package/styles/drop-down-list/bootstrap5.3.css +1 -0
  37. package/styles/drop-down-list/bootstrap5.css +1 -0
  38. package/styles/drop-down-list/fabric-dark.css +1 -0
  39. package/styles/drop-down-list/fabric.css +1 -0
  40. package/styles/drop-down-list/fluent-dark.css +1 -0
  41. package/styles/drop-down-list/fluent.css +1 -0
  42. package/styles/drop-down-list/fluent2.css +1 -0
  43. package/styles/drop-down-list/highcontrast-light.css +1 -0
  44. package/styles/drop-down-list/highcontrast.css +1 -0
  45. package/styles/drop-down-list/material-dark.css +1 -0
  46. package/styles/drop-down-list/material.css +1 -0
  47. package/styles/drop-down-list/material3-dark.css +1 -0
  48. package/styles/drop-down-list/material3.css +1 -0
  49. package/styles/drop-down-list/tailwind-dark.css +1 -0
  50. package/styles/drop-down-list/tailwind.css +1 -0
  51. package/styles/fabric-dark-lite.css +5 -0
  52. package/styles/fabric-dark.css +5 -0
  53. package/styles/fabric-lite.css +5 -0
  54. package/styles/fabric.css +5 -0
  55. package/styles/fluent-dark-lite.css +5 -0
  56. package/styles/fluent-dark.css +5 -0
  57. package/styles/fluent-lite.css +5 -0
  58. package/styles/fluent.css +5 -0
  59. package/styles/fluent2-lite.css +5 -0
  60. package/styles/fluent2.css +5 -0
  61. package/styles/highcontrast-light-lite.css +5 -0
  62. package/styles/highcontrast-light.css +5 -0
  63. package/styles/highcontrast-lite.css +5 -0
  64. package/styles/highcontrast.css +5 -0
  65. package/styles/material-dark-lite.css +5 -0
  66. package/styles/material-dark.css +5 -0
  67. package/styles/material-lite.css +5 -0
  68. package/styles/material.css +5 -0
  69. package/styles/material3-dark-lite.css +5 -0
  70. package/styles/material3-dark.css +5 -0
  71. package/styles/material3-lite.css +5 -0
  72. package/styles/material3.css +5 -0
  73. package/styles/multi-select/_layout.scss +4 -0
  74. package/styles/multi-select/bootstrap-dark.css +4 -0
  75. package/styles/multi-select/bootstrap.css +4 -0
  76. package/styles/multi-select/bootstrap4.css +4 -0
  77. package/styles/multi-select/bootstrap5-dark.css +4 -0
  78. package/styles/multi-select/bootstrap5.3.css +4 -0
  79. package/styles/multi-select/bootstrap5.css +4 -0
  80. package/styles/multi-select/fabric-dark.css +4 -0
  81. package/styles/multi-select/fabric.css +4 -0
  82. package/styles/multi-select/fluent-dark.css +4 -0
  83. package/styles/multi-select/fluent.css +4 -0
  84. package/styles/multi-select/fluent2.css +4 -0
  85. package/styles/multi-select/highcontrast-light.css +4 -0
  86. package/styles/multi-select/highcontrast.css +4 -0
  87. package/styles/multi-select/material-dark.css +4 -0
  88. package/styles/multi-select/material.css +4 -0
  89. package/styles/multi-select/material3-dark.css +4 -0
  90. package/styles/multi-select/material3.css +4 -0
  91. package/styles/multi-select/tailwind-dark.css +4 -0
  92. package/styles/multi-select/tailwind.css +4 -0
  93. package/styles/tailwind-dark-lite.css +5 -0
  94. package/styles/tailwind-dark.css +5 -0
  95. package/styles/tailwind-lite.css +5 -0
  96. package/styles/tailwind.css +5 -0
@@ -2041,6 +2041,10 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2041
2041
  DropDownBase.prototype.renderItems = function (listData, fields, isCheckBoxUpdate) {
2042
2042
  var ulElement;
2043
2043
  if (this.itemTemplate && listData) {
2044
+ if (this.getModuleName() === 'multiselect' && this.virtualSelectAll) {
2045
+ this.virtualSelectAllData = listData;
2046
+ listData = listData.slice(this.virtualItemStartIndex, this.virtualItemEndIndex);
2047
+ }
2044
2048
  var dataSource = listData;
2045
2049
  if (dataSource && fields.groupBy) {
2046
2050
  if (this.sortOrder !== 'None') {
@@ -2048,7 +2052,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2048
2052
  }
2049
2053
  dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
2050
2054
  }
2051
- else {
2055
+ else if (this.getModuleName() !== 'listbox' || (this.getModuleName() === 'listbox' && !this.preventDefActionFilter)) {
2052
2056
  dataSource = this.getSortedDataSource(dataSource);
2053
2057
  }
2054
2058
  this.sortedData = dataSource;
@@ -2056,21 +2060,23 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2056
2060
  new DataManager(dataSource).executeLocal(new Query().take(100))
2057
2061
  : dataSource;
2058
2062
  ulElement = this.templateListItem((this.getModuleName() === 'autocomplete') ? spliceData : dataSource, fields);
2059
- var oldUlElement = this.list.querySelector('.e-list-parent');
2060
- var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
2061
- if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
2062
- virtualUlElement.replaceChild(ulElement, oldUlElement);
2063
- var reOrderList = this.list.querySelectorAll('.e-reorder');
2064
- if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
2065
- this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
2063
+ if (this.isVirtualizationEnabled) {
2064
+ var oldUlElement = this.list.querySelector('.e-list-parent');
2065
+ var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
2066
+ if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
2067
+ virtualUlElement.replaceChild(ulElement, oldUlElement);
2068
+ var reOrderList = this.list.querySelectorAll('.e-reorder');
2069
+ if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
2070
+ this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
2071
+ }
2072
+ this.updateListElements(listData);
2073
+ }
2074
+ else if (!virtualUlElement) {
2075
+ this.list.innerHTML = '';
2076
+ this.createVirtualContent();
2077
+ this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
2078
+ this.updateListElements(listData);
2066
2079
  }
2067
- this.updateListElements(listData);
2068
- }
2069
- else if ((!virtualUlElement)) {
2070
- this.list.innerHTML = '';
2071
- this.createVirtualContent();
2072
- this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
2073
- this.updateListElements(listData);
2074
2080
  }
2075
2081
  }
2076
2082
  else {
@@ -2866,6 +2872,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2866
2872
  _this.preventChange = false;
2867
2873
  _this.isTouched = false;
2868
2874
  _this.isFocused = false;
2875
+ _this.autoFill = false;
2869
2876
  return _this;
2870
2877
  }
2871
2878
  /**
@@ -4912,6 +4919,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4912
4919
  }
4913
4920
  };
4914
4921
  DropDownList.prototype.onInput = function (e) {
4922
+ if (!isNullOrUndefined(e) && !isNullOrUndefined(e.data) && e.data.length > 1 && this.autoFill && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {
4923
+ this.inputElement.value = e.data;
4924
+ }
4915
4925
  this.isValidKey = true;
4916
4926
  if (this.getModuleName() === 'combobox') {
4917
4927
  this.updateIconState();
@@ -5121,7 +5131,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5121
5131
  if (!isNullOrUndefined(this.itemData) && !isNullOrUndefined(newElement)) {
5122
5132
  var value_2 = this.getItemData().value;
5123
5133
  var isExist = listData.some(function (data) {
5124
- return (((typeof data === 'string' || typeof data === 'number') && data === value_2) ||
5134
+ return (((typeof data === 'string' || typeof data === 'number' || typeof data === 'boolean') && data === value_2) ||
5125
5135
  (getValue(_this.fields.value, data) === value_2));
5126
5136
  });
5127
5137
  if (!isExist) {
@@ -5426,7 +5436,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5426
5436
  _this.isNotSearchList = false;
5427
5437
  _this.isDocumentClick = false;
5428
5438
  _this.destroyPopup();
5429
- if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list[0]) {
5439
+ if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list.length > 0) {
5430
5440
  _this.isActive = true;
5431
5441
  if (_this.enableVirtualization) {
5432
5442
  _this.onActionComplete(_this.ulElement, _this.listData, null, true);
@@ -8722,8 +8732,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
8722
8732
  }
8723
8733
  else {
8724
8734
  var oldFocussedNode = _this.treeObj.element.querySelector('.e-node-focus');
8725
- focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable):not(.e-prevent)') ||
8726
- _this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
8735
+ focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable)') ||
8736
+ _this.treeObj.element.querySelector('li:not(.e-disable)');
8727
8737
  if (oldFocussedNode && oldFocussedNode !== focusedElement) {
8728
8738
  oldFocussedNode.setAttribute('tabindex', '-1');
8729
8739
  removeClass([oldFocussedNode], 'e-node-focus');
@@ -9167,7 +9177,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
9167
9177
  var id = getValue('id', args.data[0]).toString();
9168
9178
  this.removeSelectedData(id, true);
9169
9179
  }
9170
- if (!this.isChipDelete && args.isInteracted) {
9180
+ if (!this.isChipDelete && args.isInteracted || (!this.isFilteredData && args.action === 'check' && this.isFromFilterChange)) {
9171
9181
  this.setMultiSelect();
9172
9182
  this.ensurePlaceHolder();
9173
9183
  }
@@ -11370,6 +11380,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
11370
11380
  _super.prototype.render.call(this);
11371
11381
  this.setSearchBox();
11372
11382
  this.renderComplete();
11383
+ this.autoFill = this.autofill;
11373
11384
  };
11374
11385
  /**
11375
11386
  * Return the module name of this component.
@@ -14898,7 +14909,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14898
14909
  var value_1 = this.allowObjectBinding ?
14899
14910
  getValue(((this.fields.value) ? this.fields.value : ''), this.value[this.value.length - 1]) :
14900
14911
  this.value[this.value.length - 1];
14901
- var temp = this.getTextByValue(value_1);
14912
+ var temp = text;
14902
14913
  var textValues = this.text != null && this.text !== '' ? this.text + ',' + temp : temp;
14903
14914
  currentText.push(textValues);
14904
14915
  this.setProperties({ text: currentText.toString() }, true);
@@ -14935,12 +14946,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14935
14946
  removeClass(collection, 'e-disable');
14936
14947
  }
14937
14948
  };
14938
- MultiSelect.prototype.dispatchSelect = function (value, eve, element, isNotTrigger, length) {
14949
+ MultiSelect.prototype.dispatchSelect = function (value, eve, element, isNotTrigger, length, dataValue, text) {
14939
14950
  var _this = this;
14940
14951
  var list = this.listData;
14941
14952
  if (this.initStatus && !isNotTrigger) {
14942
14953
  value = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), value) : value;
14943
- var val_2 = this.getDataByValue(value);
14954
+ var val_2 = dataValue ? dataValue : this.getDataByValue(value);
14944
14955
  var eventArgs = {
14945
14956
  e: eve,
14946
14957
  item: element,
@@ -14974,16 +14985,26 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14974
14985
  _this.selectedListData = [(_this.getDataByValue(value))];
14975
14986
  }
14976
14987
  else {
14977
- if (Array.isArray(_this.selectedListData)) {
14978
- _this.selectedListData.push((_this.getDataByValue(value)));
14988
+ if (dataValue) {
14989
+ if (Array.isArray(_this.selectedListData)) {
14990
+ _this.selectedListData.push(dataValue);
14991
+ }
14992
+ else {
14993
+ _this.selectedListData = [_this.selectedListData, dataValue];
14994
+ }
14979
14995
  }
14980
14996
  else {
14981
- _this.selectedListData = [_this.selectedListData, (_this.getDataByValue(value))];
14997
+ if (Array.isArray(_this.selectedListData)) {
14998
+ _this.selectedListData.push((_this.getDataByValue(value)));
14999
+ }
15000
+ else {
15001
+ _this.selectedListData = [_this.selectedListData, (_this.getDataByValue(value))];
15002
+ }
14982
15003
  }
14983
15004
  }
14984
15005
  }
14985
15006
  if ((_this.enableVirtualization && value) || !_this.enableVirtualization) {
14986
- _this.updateListSelectEventCallback(value, element, eve);
15007
+ _this.updateListSelectEventCallback(value, element, eve, text);
14987
15008
  }
14988
15009
  if (_this.hideSelectedItem && _this.fixedHeaderElement && _this.fields.groupBy && _this.mode !== 'CheckBox') {
14989
15010
  _super.prototype.scrollStop.call(_this);
@@ -16097,10 +16118,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16097
16118
  this.removeValue(value, e, length);
16098
16119
  }
16099
16120
  };
16100
- MultiSelect.prototype.updateListSelectEventCallback = function (value, li, e) {
16121
+ MultiSelect.prototype.updateListSelectEventCallback = function (value, li, e, currentText) {
16101
16122
  var _this = this;
16102
16123
  value = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), value) : value;
16103
- var text = this.getTextByValue(value);
16124
+ var text = currentText ? currentText : this.getTextByValue(value);
16104
16125
  if ((this.allowCustomValue || this.allowFiltering) &&
16105
16126
  !this.findListElement(this.mainList, 'li', 'data-value', value) &&
16106
16127
  (!this.enableVirtualization || (this.enableVirtualization && this.virtualCustomData))) {
@@ -16947,7 +16968,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16947
16968
  if (_this.value && obj[_this.fields.value] != null && Array.isArray(_this.value) &&
16948
16969
  ((!_this.allowObjectBinding && _this.value.indexOf(obj[_this.fields.value]) < 0) ||
16949
16970
  (_this.allowObjectBinding && !_this.isObjectInArray(obj[_this.fields.value], _this.value)))) {
16950
- _this.dispatchSelect(obj[_this.fields.value], event, null, false, length);
16971
+ var value = obj[_this.fields.value];
16972
+ var text = (obj[_this.fields.text]).toString();
16973
+ _this.dispatchSelect(value, event, null, false, length, obj, text);
16951
16974
  }
16952
16975
  });
16953
16976
  }
@@ -16957,7 +16980,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16957
16980
  _this.updateValueState(event, _this.value, _this.tempValues);
16958
16981
  _this.isSelectAll = _this.isSelectAll ? !_this.isSelectAll : _this.isSelectAll;
16959
16982
  }
16960
- _this.updateHiddenElement();
16983
+ _this.updateHiddenElement(true);
16961
16984
  if (_this.popupWrapper && li[index - 1] && li[index - 1].classList.contains('e-item-focus')) {
16962
16985
  var selectAllParent = document.getElementsByClassName('e-selectall-parent')[0];
16963
16986
  if (selectAllParent && selectAllParent.classList.contains('e-item-focus')) {
@@ -17127,7 +17150,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
17127
17150
  }
17128
17151
  }
17129
17152
  };
17130
- MultiSelect.prototype.updateHiddenElement = function () {
17153
+ MultiSelect.prototype.updateHiddenElement = function (isVirtualSelectAll) {
17131
17154
  var _this = this;
17132
17155
  var hiddenValue = '';
17133
17156
  var wrapperText = '';
@@ -17136,20 +17159,24 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
17136
17159
  if (this.mode === 'CheckBox') {
17137
17160
  this.value.map(function (value, index) {
17138
17161
  hiddenValue += '<option selected value ="' + value + '">' + index + '</option>';
17139
- if (_this.listData) {
17140
- data = _this.getTextByValue(value);
17141
- }
17142
- else {
17143
- data = value;
17162
+ if (!isVirtualSelectAll) {
17163
+ if (_this.listData) {
17164
+ data = _this.getTextByValue(value);
17165
+ }
17166
+ else {
17167
+ data = value;
17168
+ }
17169
+ wrapperText += data + _this.delimiterChar + ' ';
17170
+ text.push(data);
17144
17171
  }
17145
- wrapperText += data + _this.delimiterChar + ' ';
17146
- text.push(data);
17147
17172
  });
17148
17173
  this.hiddenElement.innerHTML = hiddenValue;
17149
- this.updateWrapperText(this.delimiterWrapper, wrapperText);
17174
+ if (!isVirtualSelectAll) {
17175
+ this.updateWrapperText(this.delimiterWrapper, wrapperText);
17176
+ this.setProperties({ text: text.toString() }, true);
17177
+ }
17150
17178
  this.delimiterWrapper.setAttribute('id', getUniqueID('delim_val'));
17151
17179
  this.inputElement.setAttribute('aria-describedby', this.delimiterWrapper.id);
17152
- this.setProperties({ text: text.toString() }, true);
17153
17180
  this.refreshInputHight();
17154
17181
  this.refreshPlaceHolder();
17155
17182
  }
@@ -18178,20 +18205,13 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
18178
18205
  if (this.isReact) {
18179
18206
  this.clearTemplate();
18180
18207
  }
18181
- if (this.popupObj) {
18208
+ if (!isNullOrUndefined(this.popupObj)) {
18182
18209
  this.popupObj.hide();
18210
+ this.popupObj.destroy();
18183
18211
  }
18184
18212
  this.notify(destroy, {});
18185
18213
  this.unwireListEvents();
18186
18214
  this.unWireEvent();
18187
- this.list = null;
18188
- this.popupObj = null;
18189
- this.mainList = null;
18190
- this.mainData = null;
18191
- this.filterParent = null;
18192
- this.ulElement = null;
18193
- this.mainListCollection = null;
18194
- _super.prototype.destroy.call(this);
18195
18215
  var temp = ['readonly', 'aria-disabled', 'placeholder', 'aria-label', 'aria-expanded'];
18196
18216
  var length = temp.length;
18197
18217
  if (!isNullOrUndefined(this.inputElement)) {
@@ -18213,6 +18233,56 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
18213
18233
  remove(this.overAllWrapper);
18214
18234
  }
18215
18235
  }
18236
+ if (this.popupWrapper && this.popupWrapper.parentElement) {
18237
+ this.popupWrapper.parentElement.remove();
18238
+ }
18239
+ while (this.searchWrapper && this.searchWrapper.firstChild) {
18240
+ this.searchWrapper.removeChild(this.searchWrapper.firstChild);
18241
+ }
18242
+ if (this.searchWrapper && this.searchWrapper.parentElement) {
18243
+ this.searchWrapper.parentElement.remove();
18244
+ }
18245
+ if (this.viewWrapper && this.viewWrapper.parentElement) {
18246
+ this.viewWrapper.parentElement.remove();
18247
+ }
18248
+ if (this.overAllClear && this.overAllClear.parentElement) {
18249
+ this.overAllClear.parentElement.remove();
18250
+ }
18251
+ if (this.delimiterWrapper && this.delimiterWrapper.parentElement) {
18252
+ this.delimiterWrapper.parentElement.remove();
18253
+ }
18254
+ // Remove the select element if it exists
18255
+ var selectElement = this.overAllWrapper.querySelector('select.e-multi-hidden');
18256
+ if (selectElement && selectElement.parentElement) {
18257
+ selectElement.parentElement.remove();
18258
+ }
18259
+ while (this.componentWrapper && this.componentWrapper.firstChild) {
18260
+ this.componentWrapper.removeChild(this.componentWrapper.firstChild);
18261
+ }
18262
+ if (this.componentWrapper && this.componentWrapper.parentElement) {
18263
+ this.componentWrapper.removeAttribute('class');
18264
+ this.componentWrapper.parentElement.remove();
18265
+ }
18266
+ while (this.popupWrapper && this.popupWrapper.firstChild) {
18267
+ this.popupWrapper.removeChild(this.popupWrapper.firstChild);
18268
+ }
18269
+ if (this.inputElement) {
18270
+ var attrArray = ['readonly', 'aria-disabled', 'placeholder', 'aria-labelledby',
18271
+ 'aria-expanded', 'autocomplete', 'aria-readonly', 'autocapitalize',
18272
+ 'spellcheck', 'aria-autocomplete', 'aria-live', 'aria-label', 'aria-hidden', 'tabindex', 'aria-controls',
18273
+ 'aria-describedby', 'size', 'role', 'type', 'class'];
18274
+ for (var i = 0; i < attrArray.length; i++) {
18275
+ this.inputElement.removeAttribute(attrArray[i]);
18276
+ }
18277
+ }
18278
+ if (this.inputElement) {
18279
+ this.inputElement.remove();
18280
+ }
18281
+ this.list = null;
18282
+ this.popupObj = null;
18283
+ this.mainData = null;
18284
+ this.filterParent = null;
18285
+ this.ulElement = null;
18216
18286
  this.componentWrapper = null;
18217
18287
  this.overAllClear = null;
18218
18288
  this.overAllWrapper = null;
@@ -18224,14 +18294,13 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
18224
18294
  this.popupWrapper = null;
18225
18295
  this.inputElement = null;
18226
18296
  this.delimiterWrapper = null;
18227
- this.popupObj = null;
18228
- this.popupWrapper = null;
18229
18297
  this.liCollections = null;
18230
18298
  this.header = null;
18231
18299
  this.mainList = null;
18232
18300
  this.mainListCollection = null;
18233
18301
  this.footer = null;
18234
18302
  this.selectAllEventEle = null;
18303
+ _super.prototype.destroy.call(this);
18235
18304
  };
18236
18305
  __decorate$5([
18237
18306
  Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
@@ -19677,6 +19746,12 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19677
19746
  liCollElem[i].classList.remove('e-grabbed');
19678
19747
  }
19679
19748
  }
19749
+ if (this.toolbarSettings.items.length > 0) {
19750
+ this.updateToolBarState();
19751
+ }
19752
+ else if (this.tBListBox && this.tBListBox.toolbarSettings.items.length > 0) {
19753
+ this.tBListBox.updateToolBarState();
19754
+ }
19680
19755
  };
19681
19756
  ListBox.prototype.updateListItems = function (sourceElem, destElem) {
19682
19757
  destElem.innerHTML = '';
@@ -19762,6 +19837,17 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19762
19837
  li.setAttribute('aria-disabled', 'true');
19763
19838
  }
19764
19839
  });
19840
+ if (this.allowFiltering && this.filterInput && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
19841
+ var canDisable_1 = false;
19842
+ this.ulElement.childNodes.forEach(function (li) { if (!li.classList.contains('e-disabled')) {
19843
+ canDisable_1 = true;
19844
+ } });
19845
+ if (!canDisable_1) {
19846
+ var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
19847
+ var btn = wrap.querySelector('[data-value="moveAllTo"]');
19848
+ btn.disabled = true;
19849
+ }
19850
+ }
19765
19851
  };
19766
19852
  /**
19767
19853
  * Based on the state parameter, specified list item will be selected/deselected.
@@ -20625,6 +20711,12 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20625
20711
  if (fListBox.value.length === 1 && fListBox.getSelectedItems().length) {
20626
20712
  fListBox.value[0] = fListBox.getFormattedValue(fListBox.getSelectedItems()[0].getAttribute('data-value'));
20627
20713
  }
20714
+ if (fListBox.liCollections.length === fListBox.ulElement.querySelectorAll('.e-disabled').length) {
20715
+ var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
20716
+ var toolbarAction = this.toolbarAction === 'moveFrom' ? 'moveAllFrom' : 'moveAllTo';
20717
+ var btn = wrap.querySelector('[data-value="' + toolbarAction + '"]');
20718
+ btn.disabled = true;
20719
+ }
20628
20720
  };
20629
20721
  ListBox.prototype.selectNextList = function (elems, dataLiIdx, dataIdx, inst) {
20630
20722
  var childCnt = inst.ulElement.querySelectorAll('.e-list-item').length;
@@ -20748,7 +20840,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20748
20840
  if (tempLiColl.length > 0) {
20749
20841
  for (var i = 0; i < tempLiColl.length; i++) {
20750
20842
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20751
- disabledData_1.push(this.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20843
+ disabledData_1.push(fListBox.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20752
20844
  }
20753
20845
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20754
20846
  fListBox.listData = fListBox.listData.filter(function (obj1) {
@@ -20772,9 +20864,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20772
20864
  }
20773
20865
  if (isRefresh) {
20774
20866
  var sourceElem = tListBox.renderItems(listData, tListBox.fields);
20775
- if (!this.itemTemplate) {
20776
- tListBox.updateListItems(sourceElem, tListBox.ulElement);
20777
- }
20867
+ tListBox.updateListItems(sourceElem, tListBox.ulElement);
20778
20868
  }
20779
20869
  else {
20780
20870
  tListBox.sortedData = listData;
@@ -21225,6 +21315,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
21225
21315
  }
21226
21316
  }
21227
21317
  else {
21318
+ if (inst.ulElement.querySelectorAll('.e-disabled').length > 0) {
21319
+ return inst.liCollections.length === inst.ulElement.querySelectorAll('.e-disabled').length;
21320
+ }
21228
21321
  return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
21229
21322
  }
21230
21323
  };