@syncfusion/ej2-dropdowns 27.1.51 → 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 (77) 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 +46 -21
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +46 -21
  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 +4 -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/styles/bootstrap-dark-lite.css +4 -0
  19. package/styles/bootstrap-dark.css +4 -0
  20. package/styles/bootstrap-lite.css +4 -0
  21. package/styles/bootstrap.css +4 -0
  22. package/styles/bootstrap4-lite.css +4 -0
  23. package/styles/bootstrap4.css +4 -0
  24. package/styles/bootstrap5-dark-lite.css +4 -0
  25. package/styles/bootstrap5-dark.css +4 -0
  26. package/styles/bootstrap5-lite.css +4 -0
  27. package/styles/bootstrap5.3-lite.css +4 -0
  28. package/styles/bootstrap5.3.css +4 -0
  29. package/styles/bootstrap5.css +4 -0
  30. package/styles/fabric-dark-lite.css +4 -0
  31. package/styles/fabric-dark.css +4 -0
  32. package/styles/fabric-lite.css +4 -0
  33. package/styles/fabric.css +4 -0
  34. package/styles/fluent-dark-lite.css +4 -0
  35. package/styles/fluent-dark.css +4 -0
  36. package/styles/fluent-lite.css +4 -0
  37. package/styles/fluent.css +4 -0
  38. package/styles/fluent2-lite.css +4 -0
  39. package/styles/fluent2.css +4 -0
  40. package/styles/highcontrast-light-lite.css +4 -0
  41. package/styles/highcontrast-light.css +4 -0
  42. package/styles/highcontrast-lite.css +4 -0
  43. package/styles/highcontrast.css +4 -0
  44. package/styles/material-dark-lite.css +4 -0
  45. package/styles/material-dark.css +4 -0
  46. package/styles/material-lite.css +4 -0
  47. package/styles/material.css +4 -0
  48. package/styles/material3-dark-lite.css +4 -0
  49. package/styles/material3-dark.css +4 -0
  50. package/styles/material3-lite.css +4 -0
  51. package/styles/material3.css +4 -0
  52. package/styles/multi-select/_layout.scss +4 -0
  53. package/styles/multi-select/bootstrap-dark.css +4 -0
  54. package/styles/multi-select/bootstrap.css +4 -0
  55. package/styles/multi-select/bootstrap4.css +4 -0
  56. package/styles/multi-select/bootstrap5-dark.css +4 -0
  57. package/styles/multi-select/bootstrap5.3.css +4 -0
  58. package/styles/multi-select/bootstrap5.css +4 -0
  59. package/styles/multi-select/fabric-dark.css +4 -0
  60. package/styles/multi-select/fabric.css +4 -0
  61. package/styles/multi-select/fluent-dark.css +4 -0
  62. package/styles/multi-select/fluent.css +4 -0
  63. package/styles/multi-select/fluent2.css +4 -0
  64. package/styles/multi-select/highcontrast-light.css +4 -0
  65. package/styles/multi-select/highcontrast.css +4 -0
  66. package/styles/multi-select/material-dark.css +4 -0
  67. package/styles/multi-select/material.css +4 -0
  68. package/styles/multi-select/material3-dark.css +4 -0
  69. package/styles/multi-select/material3.css +4 -0
  70. package/styles/multi-select/tailwind-dark.css +4 -0
  71. package/styles/multi-select/tailwind.css +4 -0
  72. package/styles/tailwind-dark-lite.css +4 -0
  73. package/styles/tailwind-dark.css +4 -0
  74. package/styles/tailwind-lite.css +4 -0
  75. package/styles/tailwind.css +4 -0
  76. package/.eslintrc.json +0 -261
  77. package/tslint.json +0 -111
@@ -1964,7 +1964,7 @@ let DropDownBase = class DropDownBase extends Component {
1964
1964
  }
1965
1965
  dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
1966
1966
  }
1967
- else {
1967
+ else if (this.getModuleName() !== 'listbox' || (this.getModuleName() === 'listbox' && !this.preventDefActionFilter)) {
1968
1968
  dataSource = this.getSortedDataSource(dataSource);
1969
1969
  }
1970
1970
  this.sortedData = dataSource;
@@ -1972,21 +1972,23 @@ let DropDownBase = class DropDownBase extends Component {
1972
1972
  new DataManager(dataSource).executeLocal(new Query().take(100))
1973
1973
  : dataSource;
1974
1974
  ulElement = this.templateListItem((this.getModuleName() === 'autocomplete') ? spliceData : dataSource, fields);
1975
- const oldUlElement = this.list.querySelector('.e-list-parent');
1976
- const virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
1977
- if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
1978
- virtualUlElement.replaceChild(ulElement, oldUlElement);
1979
- const reOrderList = this.list.querySelectorAll('.e-reorder');
1980
- if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
1981
- this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
1975
+ if (this.isVirtualizationEnabled) {
1976
+ const oldUlElement = this.list.querySelector('.e-list-parent');
1977
+ const virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
1978
+ if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
1979
+ virtualUlElement.replaceChild(ulElement, oldUlElement);
1980
+ const reOrderList = this.list.querySelectorAll('.e-reorder');
1981
+ if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
1982
+ this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
1983
+ }
1984
+ this.updateListElements(listData);
1985
+ }
1986
+ else if (!virtualUlElement) {
1987
+ this.list.innerHTML = '';
1988
+ this.createVirtualContent();
1989
+ this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
1990
+ this.updateListElements(listData);
1982
1991
  }
1983
- this.updateListElements(listData);
1984
- }
1985
- else if ((!virtualUlElement)) {
1986
- this.list.innerHTML = '';
1987
- this.createVirtualContent();
1988
- this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
1989
- this.updateListElements(listData);
1990
1992
  }
1991
1993
  }
1992
1994
  else {
@@ -2764,6 +2766,7 @@ let DropDownList = class DropDownList extends DropDownBase {
2764
2766
  this.preventChange = false;
2765
2767
  this.isTouched = false;
2766
2768
  this.isFocused = false;
2769
+ this.autoFill = false;
2767
2770
  }
2768
2771
  /**
2769
2772
  * Initialize the event handler.
@@ -4801,6 +4804,9 @@ let DropDownList = class DropDownList extends DropDownBase {
4801
4804
  }
4802
4805
  }
4803
4806
  onInput(e) {
4807
+ if (!isNullOrUndefined(e) && !isNullOrUndefined(e.data) && e.data.length > 1 && this.autoFill && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {
4808
+ this.inputElement.value = e.data;
4809
+ }
4804
4810
  this.isValidKey = true;
4805
4811
  if (this.getModuleName() === 'combobox') {
4806
4812
  this.updateIconState();
@@ -8538,8 +8544,8 @@ let DropDownTree = class DropDownTree extends Component {
8538
8544
  }
8539
8545
  else {
8540
8546
  const oldFocussedNode = this.treeObj.element.querySelector('.e-node-focus');
8541
- focusedElement = this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable):not(.e-prevent)') ||
8542
- this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
8547
+ focusedElement = this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable)') ||
8548
+ this.treeObj.element.querySelector('li:not(.e-disable)');
8543
8549
  if (oldFocussedNode && oldFocussedNode !== focusedElement) {
8544
8550
  oldFocussedNode.setAttribute('tabindex', '-1');
8545
8551
  removeClass([oldFocussedNode], 'e-node-focus');
@@ -11158,6 +11164,7 @@ let ComboBox = class ComboBox extends DropDownList {
11158
11164
  super.render();
11159
11165
  this.setSearchBox();
11160
11166
  this.renderComplete();
11167
+ this.autoFill = this.autofill;
11161
11168
  }
11162
11169
  /**
11163
11170
  * Return the module name of this component.
@@ -19439,6 +19446,17 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
19439
19446
  li.setAttribute('aria-disabled', 'true');
19440
19447
  }
19441
19448
  });
19449
+ if (this.allowFiltering && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
19450
+ let canDisable = false;
19451
+ this.liCollections.forEach((li) => { if (!li.classList.contains('e-disabled')) {
19452
+ canDisable = true;
19453
+ } });
19454
+ if (!canDisable) {
19455
+ const wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
19456
+ const btn = wrap.querySelector('[data-value="moveAllTo"]');
19457
+ btn.disabled = true;
19458
+ }
19459
+ }
19442
19460
  }
19443
19461
  /**
19444
19462
  * Based on the state parameter, specified list item will be selected/deselected.
@@ -20284,6 +20302,12 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
20284
20302
  if (fListBox.value.length === 1 && fListBox.getSelectedItems().length) {
20285
20303
  fListBox.value[0] = fListBox.getFormattedValue(fListBox.getSelectedItems()[0].getAttribute('data-value'));
20286
20304
  }
20305
+ if (fListBox.liCollections.length === fListBox.ulElement.querySelectorAll('.e-disabled').length) {
20306
+ const wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
20307
+ const toolbarAction = this.toolbarAction === 'moveFrom' ? 'moveAllFrom' : 'moveAllTo';
20308
+ const btn = wrap.querySelector('[data-value="' + toolbarAction + '"]');
20309
+ btn.disabled = true;
20310
+ }
20287
20311
  }
20288
20312
  selectNextList(elems, dataLiIdx, dataIdx, inst) {
20289
20313
  const childCnt = inst.ulElement.querySelectorAll('.e-list-item').length;
@@ -20407,7 +20431,7 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
20407
20431
  if (tempLiColl.length > 0) {
20408
20432
  for (let i = 0; i < tempLiColl.length; i++) {
20409
20433
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20410
- disabledData.push(this.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20434
+ disabledData.push(fListBox.getDataByValue(tempLiColl[i].getAttribute('data-value')));
20411
20435
  }
20412
20436
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
20413
20437
  fListBox.listData = fListBox.listData.filter((obj1) => !disabledData.some((obj2) => obj1 === obj2));
@@ -20429,9 +20453,7 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
20429
20453
  }
20430
20454
  if (isRefresh) {
20431
20455
  const sourceElem = tListBox.renderItems(listData, tListBox.fields);
20432
- if (!this.itemTemplate) {
20433
- tListBox.updateListItems(sourceElem, tListBox.ulElement);
20434
- }
20456
+ tListBox.updateListItems(sourceElem, tListBox.ulElement);
20435
20457
  }
20436
20458
  else {
20437
20459
  tListBox.sortedData = listData;
@@ -20872,6 +20894,9 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
20872
20894
  }
20873
20895
  }
20874
20896
  else {
20897
+ if (inst.ulElement.querySelectorAll('.e-disabled').length > 0) {
20898
+ return inst.liCollections.length === inst.ulElement.querySelectorAll('.e-disabled').length;
20899
+ }
20875
20900
  return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
20876
20901
  }
20877
20902
  }