@syncfusion/ej2-dropdowns 27.1.50 → 27.1.52

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 (78) 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 +56 -26
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +55 -25
  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 +8 -8
  12. package/src/combo-box/combo-box.js +1 -0
  13. package/src/drop-down-base/drop-down-base.js +17 -15
  14. package/src/drop-down-list/drop-down-list.d.ts +2 -1
  15. package/src/drop-down-list/drop-down-list.js +12 -0
  16. package/src/drop-down-tree/drop-down-tree.js +2 -2
  17. package/src/list-box/list-box.js +22 -4
  18. package/src/multi-select/multi-select.js +1 -4
  19. package/styles/bootstrap-dark-lite.css +4 -0
  20. package/styles/bootstrap-dark.css +4 -0
  21. package/styles/bootstrap-lite.css +4 -0
  22. package/styles/bootstrap.css +4 -0
  23. package/styles/bootstrap4-lite.css +4 -0
  24. package/styles/bootstrap4.css +4 -0
  25. package/styles/bootstrap5-dark-lite.css +4 -0
  26. package/styles/bootstrap5-dark.css +4 -0
  27. package/styles/bootstrap5-lite.css +4 -0
  28. package/styles/bootstrap5.3-lite.css +4 -0
  29. package/styles/bootstrap5.3.css +4 -0
  30. package/styles/bootstrap5.css +4 -0
  31. package/styles/fabric-dark-lite.css +4 -0
  32. package/styles/fabric-dark.css +4 -0
  33. package/styles/fabric-lite.css +4 -0
  34. package/styles/fabric.css +4 -0
  35. package/styles/fluent-dark-lite.css +4 -0
  36. package/styles/fluent-dark.css +4 -0
  37. package/styles/fluent-lite.css +4 -0
  38. package/styles/fluent.css +4 -0
  39. package/styles/fluent2-lite.css +4 -0
  40. package/styles/fluent2.css +4 -0
  41. package/styles/highcontrast-light-lite.css +4 -0
  42. package/styles/highcontrast-light.css +4 -0
  43. package/styles/highcontrast-lite.css +4 -0
  44. package/styles/highcontrast.css +4 -0
  45. package/styles/material-dark-lite.css +4 -0
  46. package/styles/material-dark.css +4 -0
  47. package/styles/material-lite.css +4 -0
  48. package/styles/material.css +4 -0
  49. package/styles/material3-dark-lite.css +4 -0
  50. package/styles/material3-dark.css +4 -0
  51. package/styles/material3-lite.css +4 -0
  52. package/styles/material3.css +4 -0
  53. package/styles/multi-select/_layout.scss +4 -0
  54. package/styles/multi-select/bootstrap-dark.css +4 -0
  55. package/styles/multi-select/bootstrap.css +4 -0
  56. package/styles/multi-select/bootstrap4.css +4 -0
  57. package/styles/multi-select/bootstrap5-dark.css +4 -0
  58. package/styles/multi-select/bootstrap5.3.css +4 -0
  59. package/styles/multi-select/bootstrap5.css +4 -0
  60. package/styles/multi-select/fabric-dark.css +4 -0
  61. package/styles/multi-select/fabric.css +4 -0
  62. package/styles/multi-select/fluent-dark.css +4 -0
  63. package/styles/multi-select/fluent.css +4 -0
  64. package/styles/multi-select/fluent2.css +4 -0
  65. package/styles/multi-select/highcontrast-light.css +4 -0
  66. package/styles/multi-select/highcontrast.css +4 -0
  67. package/styles/multi-select/material-dark.css +4 -0
  68. package/styles/multi-select/material.css +4 -0
  69. package/styles/multi-select/material3-dark.css +4 -0
  70. package/styles/multi-select/material3.css +4 -0
  71. package/styles/multi-select/tailwind-dark.css +4 -0
  72. package/styles/multi-select/tailwind.css +4 -0
  73. package/styles/tailwind-dark-lite.css +4 -0
  74. package/styles/tailwind-dark.css +4 -0
  75. package/styles/tailwind-lite.css +4 -0
  76. package/styles/tailwind.css +4 -0
  77. package/.eslintrc.json +0 -261
  78. package/tslint.json +0 -111
@@ -2048,7 +2048,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2048
2048
  }
2049
2049
  dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
2050
2050
  }
2051
- else {
2051
+ else if (this.getModuleName() !== 'listbox' || (this.getModuleName() === 'listbox' && !this.preventDefActionFilter)) {
2052
2052
  dataSource = this.getSortedDataSource(dataSource);
2053
2053
  }
2054
2054
  this.sortedData = dataSource;
@@ -2056,21 +2056,23 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2056
2056
  new DataManager(dataSource).executeLocal(new Query().take(100))
2057
2057
  : dataSource;
2058
2058
  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]);
2059
+ if (this.isVirtualizationEnabled) {
2060
+ var oldUlElement = this.list.querySelector('.e-list-parent');
2061
+ var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
2062
+ if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
2063
+ virtualUlElement.replaceChild(ulElement, oldUlElement);
2064
+ var reOrderList = this.list.querySelectorAll('.e-reorder');
2065
+ if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
2066
+ this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
2067
+ }
2068
+ this.updateListElements(listData);
2069
+ }
2070
+ else if (!virtualUlElement) {
2071
+ this.list.innerHTML = '';
2072
+ this.createVirtualContent();
2073
+ this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
2074
+ this.updateListElements(listData);
2066
2075
  }
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
2076
  }
2075
2077
  }
2076
2078
  else {
@@ -2866,6 +2868,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2866
2868
  _this.preventChange = false;
2867
2869
  _this.isTouched = false;
2868
2870
  _this.isFocused = false;
2871
+ _this.autoFill = false;
2869
2872
  return _this;
2870
2873
  }
2871
2874
  /**
@@ -3138,12 +3141,20 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3138
3141
  removeClass([this.inputWrapper.container], dropDownListClasses.disable);
3139
3142
  this.inputElement.setAttribute('aria-disabled', 'false');
3140
3143
  this.targetElement().setAttribute('tabindex', this.tabIndex);
3144
+ if (this.inputWrapper && this.inputWrapper.container) {
3145
+ this.inputWrapper.container.setAttribute('aria-disabled', 'false');
3146
+ this.inputWrapper.container.removeAttribute('disabled');
3147
+ }
3141
3148
  }
3142
3149
  else {
3143
3150
  this.hidePopup();
3144
3151
  addClass([this.inputWrapper.container], dropDownListClasses.disable);
3145
3152
  this.inputElement.setAttribute('aria-disabled', 'true');
3146
3153
  this.targetElement().tabIndex = -1;
3154
+ if (this.inputWrapper && this.inputWrapper.container) {
3155
+ this.inputWrapper.container.setAttribute('aria-disabled', 'true');
3156
+ this.inputWrapper.container.setAttribute('disabled', '');
3157
+ }
3147
3158
  }
3148
3159
  };
3149
3160
  /**
@@ -4904,6 +4915,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4904
4915
  }
4905
4916
  };
4906
4917
  DropDownList.prototype.onInput = function (e) {
4918
+ if (!isNullOrUndefined(e) && !isNullOrUndefined(e.data) && e.data.length > 1 && this.autoFill && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {
4919
+ this.inputElement.value = e.data;
4920
+ }
4907
4921
  this.isValidKey = true;
4908
4922
  if (this.getModuleName() === 'combobox') {
4909
4923
  this.updateIconState();
@@ -8714,8 +8728,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
8714
8728
  }
8715
8729
  else {
8716
8730
  var oldFocussedNode = _this.treeObj.element.querySelector('.e-node-focus');
8717
- focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable):not(.e-prevent)') ||
8718
- _this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
8731
+ focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable)') ||
8732
+ _this.treeObj.element.querySelector('li:not(.e-disable)');
8719
8733
  if (oldFocussedNode && oldFocussedNode !== focusedElement) {
8720
8734
  oldFocussedNode.setAttribute('tabindex', '-1');
8721
8735
  removeClass([oldFocussedNode], 'e-node-focus');
@@ -11362,6 +11376,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
11362
11376
  _super.prototype.render.call(this);
11363
11377
  this.setSearchBox();
11364
11378
  this.renderComplete();
11379
+ this.autoFill = this.autofill;
11365
11380
  };
11366
11381
  /**
11367
11382
  * Return the module name of this component.
@@ -14697,9 +14712,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14697
14712
  _this.fields.value : ''), value) : value;
14698
14713
  _this.virtualSelectAll = false;
14699
14714
  var removeVal = _this.value.slice(0);
14700
- if (_this.enableVirtualization && isClearAll) {
14701
- removeVal = [];
14702
- }
14703
14715
  removeVal.splice(index, 1);
14704
14716
  if (_this.enableVirtualization && _this.mode === 'CheckBox') {
14705
14717
  _this.selectedListData.splice(index, 1);
@@ -16976,7 +16988,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16976
16988
  this.isSelectAll = this.isSelectAll ? !this.isSelectAll : this.isSelectAll;
16977
16989
  }
16978
16990
  this.updateHiddenElement();
16979
- this.value = [];
16991
+ this.setProperties({ value: [] }, true);
16980
16992
  this.virtualSelectAll = false;
16981
16993
  if (!isNullOrUndefined(this.viewPortInfo.startIndex) && !isNullOrUndefined(this.viewPortInfo.endIndex)) {
16982
16994
  this.notify('setCurrentViewDataAsync', {
@@ -19757,6 +19769,17 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19757
19769
  li.setAttribute('aria-disabled', 'true');
19758
19770
  }
19759
19771
  });
19772
+ if (this.allowFiltering && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
19773
+ var canDisable_1 = false;
19774
+ this.liCollections.forEach(function (li) { if (!li.classList.contains('e-disabled')) {
19775
+ canDisable_1 = true;
19776
+ } });
19777
+ if (!canDisable_1) {
19778
+ var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
19779
+ var btn = wrap.querySelector('[data-value="moveAllTo"]');
19780
+ btn.disabled = true;
19781
+ }
19782
+ }
19760
19783
  };
19761
19784
  /**
19762
19785
  * Based on the state parameter, specified list item will be selected/deselected.
@@ -20620,6 +20643,12 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20620
20643
  if (fListBox.value.length === 1 && fListBox.getSelectedItems().length) {
20621
20644
  fListBox.value[0] = fListBox.getFormattedValue(fListBox.getSelectedItems()[0].getAttribute('data-value'));
20622
20645
  }
20646
+ if (fListBox.liCollections.length === fListBox.ulElement.querySelectorAll('.e-disabled').length) {
20647
+ var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
20648
+ var toolbarAction = this.toolbarAction === 'moveFrom' ? 'moveAllFrom' : 'moveAllTo';
20649
+ var btn = wrap.querySelector('[data-value="' + toolbarAction + '"]');
20650
+ btn.disabled = true;
20651
+ }
20623
20652
  };
20624
20653
  ListBox.prototype.selectNextList = function (elems, dataLiIdx, dataIdx, inst) {
20625
20654
  var childCnt = inst.ulElement.querySelectorAll('.e-list-item').length;
@@ -20743,7 +20772,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20743
20772
  if (tempLiColl.length > 0) {
20744
20773
  for (var i = 0; i < tempLiColl.length; i++) {
20745
20774
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20746
- disabledData_1.push(this.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20775
+ disabledData_1.push(fListBox.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20747
20776
  }
20748
20777
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20749
20778
  fListBox.listData = fListBox.listData.filter(function (obj1) {
@@ -20767,9 +20796,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
20767
20796
  }
20768
20797
  if (isRefresh) {
20769
20798
  var sourceElem = tListBox.renderItems(listData, tListBox.fields);
20770
- if (!this.itemTemplate) {
20771
- tListBox.updateListItems(sourceElem, tListBox.ulElement);
20772
- }
20799
+ tListBox.updateListItems(sourceElem, tListBox.ulElement);
20773
20800
  }
20774
20801
  else {
20775
20802
  tListBox.sortedData = listData;
@@ -21220,6 +21247,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
21220
21247
  }
21221
21248
  }
21222
21249
  else {
21250
+ if (inst.ulElement.querySelectorAll('.e-disabled').length > 0) {
21251
+ return inst.liCollections.length === inst.ulElement.querySelectorAll('.e-disabled').length;
21252
+ }
21223
21253
  return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
21224
21254
  }
21225
21255
  };