@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 (var i = 0, itemsData = listItems; i < itemsData.length; i++) {
92
92
  var item = itemsData[i];
93
93
  var 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 };
@@ -659,6 +659,11 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
659
659
  _this.renderGroupTemplate(ulElement);
660
660
  }
661
661
  _this.bindChildItems(localDataArgs.result, ulElement, fields);
662
+ setTimeout(function () {
663
+ if (_this.getModuleName() === 'multiselect' && _this.itemTemplate != null && (ulElement.childElementCount > 0 && ulElement.children[0].childElementCount > 0)) {
664
+ _this.updateDataList();
665
+ }
666
+ });
662
667
  }
663
668
  });
664
669
  }
@@ -790,10 +795,22 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
790
795
  var groupValue = select(this.groupTemplate, document).innerHTML.trim();
791
796
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
792
797
  var tempHeaders = ListBase.renderGroupTemplate(groupValue, dataSource, this.fields.properties, headerItems, option, this);
798
+ //EJ2-55168- Group checkbox is not working with group template
799
+ if (this.isGroupChecking) {
800
+ for (var i = 0; i < tempHeaders.length; i++) {
801
+ this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
802
+ }
803
+ }
793
804
  }
794
805
  else {
795
806
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
796
807
  var tempHeaders = ListBase.renderGroupTemplate(this.groupTemplate, dataSource, this.fields.properties, headerItems, option, this);
808
+ //EJ2-55168- Group checkbox is not working with group template
809
+ if (this.isGroupChecking) {
810
+ for (var i = 0; i < tempHeaders.length; i++) {
811
+ this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
812
+ }
813
+ }
797
814
  }
798
815
  this.renderReactTemplates();
799
816
  }
@@ -7547,7 +7564,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7547
7564
  if ((Browser.isDevice && !this.isDropDownClick || !Browser.isDevice) &&
7548
7565
  !isNullOrUndefined(this.liCollections) && this.liCollections.length > 0) {
7549
7566
  var inputValue = this.inputElement.value;
7550
- var activeItem = Search(inputValue, this.liCollections, 'StartsWith', true);
7567
+ var activeItem = Search(inputValue, this.liCollections, this.filterType, true);
7551
7568
  var activeElement = activeItem.item;
7552
7569
  if (!isNullOrUndefined(activeElement)) {
7553
7570
  var count = this.getIndexByValue(activeElement.getAttribute('data-value')) - 1;
@@ -7704,7 +7721,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7704
7721
  else {
7705
7722
  this.activeIndex = null;
7706
7723
  this.removeSelection();
7707
- if (this.liCollections && this.liCollections.length < 0) {
7724
+ if (this.liCollections && this.liCollections.length > 0 && !this.isCustomFilter) {
7708
7725
  this.removeFocus();
7709
7726
  }
7710
7727
  }
@@ -9132,7 +9149,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9132
9149
  this.mainData = list;
9133
9150
  this.mainListCollection = this.liCollections;
9134
9151
  }
9135
- else if (!isNullOrUndefined(this.mainData) && this.mainData.length === 0) {
9152
+ else if (isNullOrUndefined(this.mainData) || this.mainData.length === 0) {
9136
9153
  this.mainData = list;
9137
9154
  }
9138
9155
  if ((this.remoteCustomValue || list.length <= 0) && this.allowCustomValue && this.inputFocus && this.allowFiltering &&
@@ -11154,7 +11171,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11154
11171
  MultiSelect.prototype.updateActionCompleteData = function (li, item) {
11155
11172
  if (this.value && this.value.indexOf(li.getAttribute('data-value')) > -1) {
11156
11173
  this.mainList = this.ulElement;
11157
- addClass([li], HIDE_LIST);
11174
+ if (this.hideSelectedItem) {
11175
+ addClass([li], HIDE_LIST);
11176
+ }
11158
11177
  }
11159
11178
  };
11160
11179
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -11172,7 +11191,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11172
11191
  }
11173
11192
  };
11174
11193
  MultiSelect.prototype.updateDataList = function () {
11175
- if (this.mainList && this.ulElement && this.mainList.childElementCount < this.ulElement.childElementCount) {
11194
+ 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)))) {
11176
11195
  this.mainList = this.ulElement.cloneNode ? this.ulElement.cloneNode(true) : this.ulElement;
11177
11196
  }
11178
11197
  };
@@ -12218,6 +12237,25 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12218
12237
  }
12219
12238
  this.renderPopup();
12220
12239
  };
12240
+ MultiSelect.prototype.presentItemValue = function (ulElement) {
12241
+ var valuecheck = [];
12242
+ for (var i = 0; i < this.value.length; i++) {
12243
+ var checkEle = this.findListElement(((this.allowFiltering && !isNullOrUndefined(this.mainList)) ? this.mainList : ulElement), 'li', 'data-value', this.value[i]);
12244
+ if (!checkEle) {
12245
+ valuecheck.push(this.value[i]);
12246
+ }
12247
+ }
12248
+ return valuecheck;
12249
+ };
12250
+
12251
+ MultiSelect.prototype.addNonPresentItems = function (valuecheck, ulElement, list, event) {
12252
+ var _this = this;
12253
+ this.dataSource.executeQuery(this.getForQuery(valuecheck)).then(function (e) {
12254
+ _this.addItem(e.result, list.length);
12255
+ _this.updateActionList(ulElement, list, event);
12256
+ });
12257
+ };
12258
+
12221
12259
  MultiSelect.prototype.updateVal = function (newProp, oldProp, prop) {
12222
12260
  if (!this.list) {
12223
12261
  this.onLoadSelect();
@@ -12226,31 +12264,43 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12226
12264
  this.onLoadSelect();
12227
12265
  }
12228
12266
  else {
12229
- if (prop === 'text') {
12230
- this.initialTextUpdate();
12231
- newProp = this.value;
12232
- }
12233
- if (isNullOrUndefined(this.value) || this.value.length === 0) {
12234
- this.tempValues = oldProp;
12235
- }
12236
- // eslint-disable-next-line
12237
- if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
12238
- && this.isPopupOpen() && this.mainData !== this.listData) {
12239
- var list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
12240
- this.onActionComplete(list, this.mainData);
12267
+ var valuecheck = [];
12268
+ if (!isNullOrUndefined(this.value) && !this.allowCustomValue) {
12269
+ valuecheck = this.presentItemValue(this.ulElement);
12241
12270
  }
12242
- this.initialValueUpdate();
12243
- if (this.mode !== 'Box' && !this.inputFocus) {
12244
- this.updateDelimView();
12271
+ if (prop == 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
12272
+ && this.listData != null) {
12273
+ this.mainData = null;
12274
+ this.setDynValue = true;
12275
+ this.addNonPresentItems(valuecheck, this.ulElement, this.listData);
12245
12276
  }
12246
- if (!this.inputFocus) {
12247
- this.refreshInputHight();
12248
- }
12249
- this.refreshPlaceHolder();
12250
- if (this.mode !== 'CheckBox' && this.changeOnBlur) {
12251
- this.updateValueState(null, newProp, oldProp);
12277
+ else {
12278
+ if (prop === 'text') {
12279
+ this.initialTextUpdate();
12280
+ newProp = this.value;
12281
+ }
12282
+ if (isNullOrUndefined(this.value) || this.value.length === 0) {
12283
+ this.tempValues = oldProp;
12284
+ }
12285
+ // eslint-disable-next-line
12286
+ if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
12287
+ && this.isPopupOpen() && this.mainData !== this.listData) {
12288
+ var list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
12289
+ this.onActionComplete(list, this.mainData);
12290
+ }
12291
+ this.initialValueUpdate();
12292
+ if (this.mode !== 'Box' && !this.inputFocus) {
12293
+ this.updateDelimView();
12294
+ }
12295
+ if (!this.inputFocus) {
12296
+ this.refreshInputHight();
12297
+ }
12298
+ this.refreshPlaceHolder();
12299
+ if (this.mode !== 'CheckBox' && this.changeOnBlur) {
12300
+ this.updateValueState(null, newProp, oldProp);
12301
+ }
12302
+ this.checkPlaceholderSize();
12252
12303
  }
12253
- this.checkPlaceholderSize();
12254
12304
  }
12255
12305
  if (!this.changeOnBlur) {
12256
12306
  this.updateValueState(null, newProp, oldProp);
@@ -13763,9 +13813,6 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
13763
13813
  args.items = this.getDataByValues([dragValue]);
13764
13814
  }
13765
13815
  this.trigger('beforeDrop', args);
13766
- if (args.isDragAll !== null) {
13767
- this.allowDragAll = args.isDragAll;
13768
- }
13769
13816
  };
13770
13817
  ListBox.prototype.dragEnd = function (args) {
13771
13818
  var _this = this;