@syncfusion/ej2-dropdowns 19.3.56 → 19.4.38

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 (68) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/README.md +1 -1
  3. package/dist/ej2-dropdowns.umd.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +77 -31
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +78 -31
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/dist/global/ej2-dropdowns.min.js +2 -2
  10. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +11 -11
  13. package/src/combo-box/combo-box.js +2 -2
  14. package/src/common/incremental-search.d.ts +1 -1
  15. package/src/common/incremental-search.js +1 -1
  16. package/src/drop-down-base/drop-down-base.js +17 -0
  17. package/src/list-box/list-box.d.ts +0 -4
  18. package/src/list-box/list-box.js +0 -3
  19. package/src/multi-select/multi-select-model.d.ts +1 -1
  20. package/src/multi-select/multi-select.d.ts +2 -0
  21. package/src/multi-select/multi-select.js +58 -25
  22. package/styles/auto-complete/_fluent-definition.scss +2 -0
  23. package/styles/auto-complete/bootstrap5-dark.css +0 -1
  24. package/styles/auto-complete/bootstrap5.css +0 -1
  25. package/styles/bootstrap5-dark.css +12 -6
  26. package/styles/bootstrap5.css +12 -6
  27. package/styles/combo-box/_fluent-definition.scss +2 -0
  28. package/styles/combo-box/bootstrap5-dark.css +0 -1
  29. package/styles/combo-box/bootstrap5.css +0 -1
  30. package/styles/drop-down-base/_fluent-definition.scss +109 -0
  31. package/styles/drop-down-list/_bootstrap5-definition.scss +0 -1
  32. package/styles/drop-down-list/_fluent-definition.scss +193 -0
  33. package/styles/drop-down-list/bootstrap5-dark.css +0 -1
  34. package/styles/drop-down-list/bootstrap5.css +0 -1
  35. package/styles/drop-down-list/icons/_bootstrap5.scss +0 -1
  36. package/styles/drop-down-list/icons/_fluent.scss +14 -0
  37. package/styles/drop-down-tree/_bootstrap5-definition.scss +59 -58
  38. package/styles/drop-down-tree/_fluent-definition.scss +71 -0
  39. package/styles/drop-down-tree/_layout.scss +12 -4
  40. package/styles/drop-down-tree/_tailwind-definition.scss +1 -0
  41. package/styles/drop-down-tree/bootstrap5-dark.css +11 -4
  42. package/styles/drop-down-tree/bootstrap5.css +11 -4
  43. package/styles/drop-down-tree/icons/_bootstrap5.scss +11 -11
  44. package/styles/drop-down-tree/icons/_fluent.scss +11 -0
  45. package/styles/drop-down-tree/icons/_tailwind-dark.scss +11 -11
  46. package/styles/drop-down-tree/tailwind-dark.css +1 -0
  47. package/styles/drop-down-tree/tailwind.css +1 -0
  48. package/styles/list-box/_bootstrap5-definition.scss +2 -2
  49. package/styles/list-box/_fluent-definition.scss +115 -0
  50. package/styles/list-box/_layout.scss +1 -6
  51. package/styles/list-box/bootstrap5-dark.css +1 -1
  52. package/styles/list-box/bootstrap5.css +1 -1
  53. package/styles/list-box/icons/_fluent.scss +25 -0
  54. package/styles/list-box/icons/_tailwind-dark.scss +2 -2
  55. package/styles/list-box/tailwind-dark.css +3 -3
  56. package/styles/list-box/tailwind.css +1 -1
  57. package/styles/material-dark.css +0 -94
  58. package/styles/material.css +0 -94
  59. package/styles/multi-select/_fluent-definition.scss +214 -0
  60. package/styles/multi-select/_layout.scss +0 -116
  61. package/styles/multi-select/_material-dark-definition.scss +0 -22
  62. package/styles/multi-select/_material-definition.scss +0 -22
  63. package/styles/multi-select/icons/_fluent.scss +27 -0
  64. package/styles/multi-select/material-dark.css +0 -94
  65. package/styles/multi-select/material.css +0 -94
  66. package/styles/tailwind-dark.css +4 -3
  67. package/styles/tailwind.css +2 -1
  68. package/styles/_all.scss +0 -3
@@ -91,7 +91,7 @@ function Search(inputVal, items, searchType, ignoreCase) {
91
91
  for (let i = 0, itemsData = listItems; i < itemsData.length; i++) {
92
92
  const item = itemsData[i];
93
93
  const text = (ignoreCase ? item.textContent.toLocaleLowerCase() : item.textContent).replace(/^\s+|\s+$/g, '');
94
- if ((searchType === 'Equal' && text === queryStr) || (searchType === 'StartsWith' && text.substr(0, strLength) === queryStr)) {
94
+ if ((searchType === 'Equal' && text === queryStr) || (searchType === 'StartsWith' && text.substr(0, strLength) === queryStr) || (searchType === 'EndsWith' && text.substr(text.length - queryStr.length) === queryStr) || (searchType === 'Contains' && new RegExp(queryStr, "g").test(text))) {
95
95
  itemData.item = item;
96
96
  itemData.index = i;
97
97
  return { item: item, index: i };
@@ -635,6 +635,11 @@ let DropDownBase = class DropDownBase extends Component {
635
635
  this.renderGroupTemplate(ulElement);
636
636
  }
637
637
  this.bindChildItems(localDataArgs.result, ulElement, fields);
638
+ setTimeout(() => {
639
+ if (this.getModuleName() === 'multiselect' && this.itemTemplate != null && (ulElement.childElementCount > 0 && ulElement.children[0].childElementCount > 0)) {
640
+ this.updateDataList();
641
+ }
642
+ });
638
643
  }
639
644
  });
640
645
  }
@@ -765,10 +770,22 @@ let DropDownBase = class DropDownBase extends Component {
765
770
  const groupValue = select(this.groupTemplate, document).innerHTML.trim();
766
771
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
767
772
  const tempHeaders = ListBase.renderGroupTemplate(groupValue, dataSource, this.fields.properties, headerItems, option, this);
773
+ //EJ2-55168- Group checkbox is not working with group template
774
+ if (this.isGroupChecking) {
775
+ for (var i = 0; i < tempHeaders.length; i++) {
776
+ this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
777
+ }
778
+ }
768
779
  }
769
780
  else {
770
781
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
771
782
  const tempHeaders = ListBase.renderGroupTemplate(this.groupTemplate, dataSource, this.fields.properties, headerItems, option, this);
783
+ //EJ2-55168- Group checkbox is not working with group template
784
+ if (this.isGroupChecking) {
785
+ for (var i = 0; i < tempHeaders.length; i++) {
786
+ this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
787
+ }
788
+ }
772
789
  }
773
790
  this.renderReactTemplates();
774
791
  }
@@ -7436,7 +7453,7 @@ let ComboBox = class ComboBox extends DropDownList {
7436
7453
  if ((Browser.isDevice && !this.isDropDownClick || !Browser.isDevice) &&
7437
7454
  !isNullOrUndefined(this.liCollections) && this.liCollections.length > 0) {
7438
7455
  const inputValue = this.inputElement.value;
7439
- const activeItem = Search(inputValue, this.liCollections, 'StartsWith', true);
7456
+ const activeItem = Search(inputValue, this.liCollections, this.filterType, true);
7440
7457
  const activeElement = activeItem.item;
7441
7458
  if (!isNullOrUndefined(activeElement)) {
7442
7459
  const count = this.getIndexByValue(activeElement.getAttribute('data-value')) - 1;
@@ -7593,7 +7610,7 @@ let ComboBox = class ComboBox extends DropDownList {
7593
7610
  else {
7594
7611
  this.activeIndex = null;
7595
7612
  this.removeSelection();
7596
- if (this.liCollections && this.liCollections.length < 0) {
7613
+ if (this.liCollections && this.liCollections.length > 0 && !this.isCustomFilter) {
7597
7614
  this.removeFocus();
7598
7615
  }
7599
7616
  }
@@ -8982,7 +8999,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
8982
8999
  this.mainData = list;
8983
9000
  this.mainListCollection = this.liCollections;
8984
9001
  }
8985
- else if (!isNullOrUndefined(this.mainData) && this.mainData.length === 0) {
9002
+ else if (isNullOrUndefined(this.mainData) || this.mainData.length === 0) {
8986
9003
  this.mainData = list;
8987
9004
  }
8988
9005
  if ((this.remoteCustomValue || list.length <= 0) && this.allowCustomValue && this.inputFocus && this.allowFiltering &&
@@ -10998,7 +11015,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
10998
11015
  updateActionCompleteData(li, item) {
10999
11016
  if (this.value && this.value.indexOf(li.getAttribute('data-value')) > -1) {
11000
11017
  this.mainList = this.ulElement;
11001
- addClass([li], HIDE_LIST);
11018
+ if (this.hideSelectedItem) {
11019
+ addClass([li], HIDE_LIST);
11020
+ }
11002
11021
  }
11003
11022
  }
11004
11023
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -11016,7 +11035,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
11016
11035
  }
11017
11036
  }
11018
11037
  updateDataList() {
11019
- if (this.mainList && this.ulElement && this.mainList.childElementCount < this.ulElement.childElementCount) {
11038
+ if (this.mainList && this.ulElement && (this.mainList.childElementCount < this.ulElement.childElementCount || ((this.ulElement.childElementCount > 0 && this.ulElement.children[0].childElementCount > 0) && (this.mainList.children[0].childElementCount < this.ulElement.children[0].childElementCount)))) {
11020
11039
  this.mainList = this.ulElement.cloneNode ? this.ulElement.cloneNode(true) : this.ulElement;
11021
11040
  }
11022
11041
  }
@@ -12056,6 +12075,24 @@ let MultiSelect = class MultiSelect extends DropDownBase {
12056
12075
  }
12057
12076
  this.renderPopup();
12058
12077
  }
12078
+ presentItemValue(ulElement) {
12079
+ let valuecheck = [];
12080
+ for (let i = 0; i < this.value.length; i++) {
12081
+ let checkEle = this.findListElement(((this.allowFiltering && !isNullOrUndefined(this.mainList)) ? this.mainList : ulElement), 'li', 'data-value', this.value[i]);
12082
+ if (!checkEle) {
12083
+ valuecheck.push(this.value[i]);
12084
+ }
12085
+ }
12086
+ return valuecheck;
12087
+ }
12088
+ ;
12089
+ addNonPresentItems(valuecheck, ulElement, list, event) {
12090
+ this.dataSource.executeQuery(this.getForQuery(valuecheck)).then((e) => {
12091
+ this.addItem(e.result, list.length);
12092
+ this.updateActionList(ulElement, list, event);
12093
+ });
12094
+ }
12095
+ ;
12059
12096
  updateVal(newProp, oldProp, prop) {
12060
12097
  if (!this.list) {
12061
12098
  this.onLoadSelect();
@@ -12064,31 +12101,43 @@ let MultiSelect = class MultiSelect extends DropDownBase {
12064
12101
  this.onLoadSelect();
12065
12102
  }
12066
12103
  else {
12067
- if (prop === 'text') {
12068
- this.initialTextUpdate();
12069
- newProp = this.value;
12070
- }
12071
- if (isNullOrUndefined(this.value) || this.value.length === 0) {
12072
- this.tempValues = oldProp;
12073
- }
12074
- // eslint-disable-next-line
12075
- if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
12076
- && this.isPopupOpen() && this.mainData !== this.listData) {
12077
- const list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
12078
- this.onActionComplete(list, this.mainData);
12079
- }
12080
- this.initialValueUpdate();
12081
- if (this.mode !== 'Box' && !this.inputFocus) {
12082
- this.updateDelimView();
12104
+ let valuecheck = [];
12105
+ if (!isNullOrUndefined(this.value) && !this.allowCustomValue) {
12106
+ valuecheck = this.presentItemValue(this.ulElement);
12083
12107
  }
12084
- if (!this.inputFocus) {
12085
- this.refreshInputHight();
12108
+ if (prop == 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
12109
+ && this.listData != null) {
12110
+ this.mainData = null;
12111
+ this.setDynValue = true;
12112
+ this.addNonPresentItems(valuecheck, this.ulElement, this.listData);
12086
12113
  }
12087
- this.refreshPlaceHolder();
12088
- if (this.mode !== 'CheckBox' && this.changeOnBlur) {
12089
- this.updateValueState(null, newProp, oldProp);
12114
+ else {
12115
+ if (prop === 'text') {
12116
+ this.initialTextUpdate();
12117
+ newProp = this.value;
12118
+ }
12119
+ if (isNullOrUndefined(this.value) || this.value.length === 0) {
12120
+ this.tempValues = oldProp;
12121
+ }
12122
+ // eslint-disable-next-line
12123
+ if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
12124
+ && this.isPopupOpen() && this.mainData !== this.listData) {
12125
+ const list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
12126
+ this.onActionComplete(list, this.mainData);
12127
+ }
12128
+ this.initialValueUpdate();
12129
+ if (this.mode !== 'Box' && !this.inputFocus) {
12130
+ this.updateDelimView();
12131
+ }
12132
+ if (!this.inputFocus) {
12133
+ this.refreshInputHight();
12134
+ }
12135
+ this.refreshPlaceHolder();
12136
+ if (this.mode !== 'CheckBox' && this.changeOnBlur) {
12137
+ this.updateValueState(null, newProp, oldProp);
12138
+ }
12139
+ this.checkPlaceholderSize();
12090
12140
  }
12091
- this.checkPlaceholderSize();
12092
12141
  }
12093
12142
  if (!this.changeOnBlur) {
12094
12143
  this.updateValueState(null, newProp, oldProp);
@@ -13565,9 +13614,6 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
13565
13614
  args.items = this.getDataByValues([dragValue]);
13566
13615
  }
13567
13616
  this.trigger('beforeDrop', args);
13568
- if (args.isDragAll !== null) {
13569
- this.allowDragAll = args.isDragAll;
13570
- }
13571
13617
  }
13572
13618
  dragEnd(args) {
13573
13619
  let listData;