@syncfusion/ej2-dropdowns 30.1.37 → 30.1.40

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 (34) 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 +59 -14
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +59 -14
  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 +6 -6
  12. package/src/combo-box/combo-box.js +1 -1
  13. package/src/common/incremental-search.js +1 -1
  14. package/src/drop-down-list/drop-down-list.d.ts +1 -0
  15. package/src/drop-down-list/drop-down-list.js +19 -3
  16. package/src/drop-down-tree/drop-down-tree-model.d.ts +1 -1
  17. package/src/drop-down-tree/drop-down-tree.d.ts +1 -0
  18. package/src/drop-down-tree/drop-down-tree.js +9 -1
  19. package/src/list-box/list-box.js +6 -1
  20. package/src/multi-select/multi-select.js +24 -8
  21. package/styles/bootstrap5-dark-lite.css +1 -1
  22. package/styles/bootstrap5-dark.css +1 -1
  23. package/styles/bootstrap5-lite.css +1 -1
  24. package/styles/bootstrap5.css +1 -1
  25. package/styles/drop-down-tree/_bootstrap5-definition.scss +1 -1
  26. package/styles/drop-down-tree/_material3-definition.scss +2 -2
  27. package/styles/drop-down-tree/bootstrap5-dark.css +1 -1
  28. package/styles/drop-down-tree/bootstrap5.css +1 -1
  29. package/styles/drop-down-tree/material3-dark.css +4 -4
  30. package/styles/drop-down-tree/material3.css +4 -4
  31. package/styles/material3-dark-lite.css +3 -3
  32. package/styles/material3-dark.css +4 -4
  33. package/styles/material3-lite.css +3 -3
  34. package/styles/material3.css +4 -4
@@ -136,7 +136,7 @@ function Search(inputVal, items, searchType, ignoreCase, dataSource, fields, typ
136
136
  const listItems = items;
137
137
  ignoreCase = ignoreCase !== undefined && ignoreCase !== null ? ignoreCase : true;
138
138
  const itemData = { item: null, index: null };
139
- if (inputVal && inputVal.length) {
139
+ if (inputVal && inputVal.length && items) {
140
140
  const strLength = inputVal.length;
141
141
  let queryStr = ignoreCase ? inputVal.toLocaleLowerCase() : inputVal;
142
142
  queryStr = escapeCharRegExp(queryStr);
@@ -2958,6 +2958,7 @@ let DropDownList = class DropDownList extends DropDownBase {
2958
2958
  initializeData() {
2959
2959
  this.isPopupOpen = false;
2960
2960
  this.isDocumentClick = false;
2961
+ this.isPopupRender = false;
2961
2962
  this.isInteracted = false;
2962
2963
  this.isFilterFocus = false;
2963
2964
  this.beforePopupOpen = false;
@@ -4288,7 +4289,8 @@ let DropDownList = class DropDownList extends DropDownBase {
4288
4289
  e.preventDefault();
4289
4290
  }
4290
4291
  if (!this.readonly) {
4291
- if (this.isPopupOpen) {
4292
+ if (this.isPopupOpen || (this.popupObj && document.body.contains(this.popupObj.element) &&
4293
+ this.beforePopupOpen && this.isPopupRender)) {
4292
4294
  this.hidePopup(e);
4293
4295
  if (this.isFilterLayout()) {
4294
4296
  this.focusDropDown(e);
@@ -5440,8 +5442,19 @@ let DropDownList = class DropDownList extends DropDownBase {
5440
5442
  initialPopupHeight = popupEle.clientHeight;
5441
5443
  if (this.enableVirtualization && (this.itemTemplate || this.isAngular)) {
5442
5444
  const listitems = popupEle.querySelectorAll('li.e-list-item:not(.e-virtual-list)');
5443
- this.listItemHeight = listitems.length > 0 ? Math.ceil(listitems[0].getBoundingClientRect().height) +
5444
- parseInt(window.getComputedStyle(listitems[0]).marginBottom, 10) : 0;
5445
+ const virtualListitems = popupEle.querySelectorAll('li.e-virtual-list');
5446
+ const listitemsHeight = listitems && listitems.length > 0 ?
5447
+ Math.ceil(listitems[0].getBoundingClientRect().height) +
5448
+ parseInt(window.getComputedStyle(listitems[0]).marginBottom, 10) : 0;
5449
+ const VirtualLiHeight = virtualListitems && virtualListitems.length > 0 ?
5450
+ Math.ceil(virtualListitems[0].getBoundingClientRect().height) +
5451
+ parseInt(window.getComputedStyle(virtualListitems[0]).marginBottom, 10) : 0;
5452
+ if (listitemsHeight !== VirtualLiHeight && virtualListitems && virtualListitems.length > 0) {
5453
+ virtualListitems.forEach((item) => {
5454
+ item.parentNode.removeChild(item);
5455
+ });
5456
+ }
5457
+ this.listItemHeight = listitemsHeight;
5445
5458
  }
5446
5459
  if (this.enableVirtualization && !this.list.classList.contains(dropDownBaseClasses.noData)) {
5447
5460
  this.getSkeletonCount();
@@ -5603,6 +5616,7 @@ let DropDownList = class DropDownList extends DropDownBase {
5603
5616
  }
5604
5617
  if (!isNullOrUndefined(this.popupObj)) {
5605
5618
  this.popupObj.show(new Animation(eventArgs.animation), (this.zIndex === 1000) ? this.element : null);
5619
+ this.isPopupRender = true;
5606
5620
  }
5607
5621
  if (this.isReact) {
5608
5622
  setTimeout(() => {
@@ -6131,6 +6145,7 @@ let DropDownList = class DropDownList extends DropDownBase {
6131
6145
  this.rippleFun();
6132
6146
  }
6133
6147
  if (this.isPopupOpen) {
6148
+ this.isPopupRender = false;
6134
6149
  this.popupObj.hide(new Animation(eventArgs.animation));
6135
6150
  }
6136
6151
  else {
@@ -7139,6 +7154,7 @@ let DropDownList = class DropDownList extends DropDownBase {
7139
7154
  }
7140
7155
  this.hidePopup();
7141
7156
  if (this.popupObj) {
7157
+ this.isPopupRender = false;
7142
7158
  this.popupObj.hide();
7143
7159
  }
7144
7160
  this.unWireEvent();
@@ -9007,6 +9023,7 @@ let DropDownTree = class DropDownTree extends Component {
9007
9023
  removeClass([this.popupEle], DDTHIDEICON);
9008
9024
  this.updatePopupHeight();
9009
9025
  this.popupObj.refreshPosition();
9026
+ this.checkCollision(this.popupEle);
9010
9027
  if (!(this.showSelectAll || this.allowFiltering) && (!this.popupDiv.classList.contains(NODATA)
9011
9028
  && this.treeItems.length > 0)) {
9012
9029
  let focusedElement = this.value != null && this.text != null ? this.treeObj.element.querySelector('[data-uid="' + this.value[this.value.length - 1] + '"]') : null;
@@ -9050,6 +9067,13 @@ let DropDownTree = class DropDownTree extends Component {
9050
9067
  }
9051
9068
  });
9052
9069
  }
9070
+ checkCollision(popupEle) {
9071
+ const collision = isCollide(popupEle);
9072
+ if (collision.length > 0) {
9073
+ popupEle.style.marginTop = -parseInt(getComputedStyle(popupEle).marginTop, 10) + 'px';
9074
+ }
9075
+ this.popupObj.resolveCollision();
9076
+ }
9053
9077
  removeFocus(focusedElement, oldFocusedElement) {
9054
9078
  if (oldFocusedElement && oldFocusedElement !== focusedElement) {
9055
9079
  oldFocusedElement.setAttribute('tabindex', '-1');
@@ -11753,7 +11777,7 @@ let ComboBox = class ComboBox extends DropDownList {
11753
11777
  this.removeFillSelection();
11754
11778
  }
11755
11779
  const dataItem = this.isSelectCustom ? { text: '' } : this.getItemData();
11756
- const text = !isNullOrUndefined(dataItem.text) ? dataItem.text.replace(/\r\n|\n|\r/g, '') : dataItem.text;
11780
+ const text = !isNullOrUndefined(dataItem.text) ? dataItem.text.toString().replace(/\r\n|\n|\r/g, '') : dataItem.text;
11757
11781
  const selected = !isNullOrUndefined(this.list) ? this.list.querySelector('.' + dropDownListClasses.selected) : null;
11758
11782
  if (this.inputElement && text === this.inputElement.value && !isNullOrUndefined(selected)) {
11759
11783
  if (this.isSelected) {
@@ -13283,11 +13307,16 @@ let MultiSelect = class MultiSelect extends DropDownBase {
13283
13307
  if (!isNullOrUndefined(this.text) && (isNullOrUndefined(this.value) || this.value.length === 0)) {
13284
13308
  this.initialTextUpdate();
13285
13309
  }
13286
- if (!this.enableVirtualization || (this.enableVirtualization && (!(this.dataSource instanceof DataManager)))) {
13287
- this.initialValueUpdate();
13310
+ if (!this.enableVirtualization) {
13311
+ if (!this.isRemoveSelection) {
13312
+ this.initialValueUpdate(this.listData, true);
13313
+ }
13314
+ else {
13315
+ this.initialValueUpdate();
13316
+ }
13288
13317
  }
13289
- else if (!this.isRemoveSelection) {
13290
- this.initialValueUpdate(this.listData, true);
13318
+ else if (!(this.dataSource instanceof DataManager)) {
13319
+ this.initialValueUpdate();
13291
13320
  }
13292
13321
  this.initialUpdate();
13293
13322
  this.refreshPlaceHolder();
@@ -13773,6 +13802,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
13773
13802
  tempData[0] = (typeof customData === 'boolean') ?
13774
13803
  (tempData[0] === 'true' ? true : (tempData[0] === 'false' ? false : tempData[0])) : tempData[0];
13775
13804
  this.resetList(tempData, field);
13805
+ this.focusAtLastListItem(value);
13776
13806
  }
13777
13807
  }
13778
13808
  else if (this.listData && this.mainData && !dataChecks && this.allowCustomValue) {
@@ -15133,6 +15163,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
15133
15163
  }
15134
15164
  else {
15135
15165
  this.setFloatLabelType();
15166
+ Input.createSpanElement(this.overAllWrapper, this.createElement);
15136
15167
  }
15137
15168
  this.expandTextbox();
15138
15169
  }
@@ -15431,7 +15462,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
15431
15462
  }
15432
15463
  dispatchSelect(value, eve, element, isNotTrigger, length, dataValue, text) {
15433
15464
  const list = this.listData;
15434
- if (this.initStatus && !isNotTrigger) {
15465
+ if (this.initStatus && !isNotTrigger && (!this.allowObjectBinding || (this.allowObjectBinding && value))) {
15435
15466
  value = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), value) : value;
15436
15467
  const val = dataValue ? dataValue : this.getDataByValue(value);
15437
15468
  const eventArgs = {
@@ -16336,7 +16367,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
16336
16367
  else {
16337
16368
  if (this.listData) {
16338
16369
  if (this.enableVirtualization) {
16339
- if (delim && !this.isDynamicRemoteVirtualData) {
16370
+ if (delim && !this.isDynamicRemoteVirtualData && !isInitialVirtualData) {
16340
16371
  data = this.delimiterWrapper && this.delimiterWrapper.innerHTML === '' ? data :
16341
16372
  this.delimiterWrapper.innerHTML;
16342
16373
  }
@@ -16348,7 +16379,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
16348
16379
  text = this.text.split(delimiterChar);
16349
16380
  }
16350
16381
  else {
16351
- temp = isInitialVirtualData && delim ? this.text : this.getTextByValue(value);
16382
+ temp = isInitialVirtualData && delim ? this.text.replace(/,/g, delimiterChar + ' ') : this.getTextByValue(value);
16352
16383
  const textValues = this.isDynamicRemoteVirtualData && value != null && value !== '' && !isInitialVirtualData ?
16353
16384
  this.getTextByValue(value) : isInitialVirtualData ? this.text : (this.text && this.text !== '' ? this.text + this.delimiterChar + temp : temp);
16354
16385
  data += temp + delimiterChar + ' ';
@@ -16504,6 +16535,12 @@ let MultiSelect = class MultiSelect extends DropDownBase {
16504
16535
  text = this.getTextByValue(value);
16505
16536
  isCustomData = true;
16506
16537
  }
16538
+ else if ((isNullOrUndefined(text) && !this.allowCustomValue) &&
16539
+ ((!(this.dataSource instanceof DataManager)) ||
16540
+ (this.dataSource instanceof DataManager && isInitialVirtualData))) {
16541
+ this.value.splice(index, 1);
16542
+ index -= 1;
16543
+ }
16507
16544
  }
16508
16545
  else {
16509
16546
  text = this.getTextByValue(value);
@@ -18089,6 +18126,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
18089
18126
  this.isaddNonPresentItems = false;
18090
18127
  }
18091
18128
  else {
18129
+ this.selectedListData = [];
18092
18130
  if (prop === 'text') {
18093
18131
  this.initialTextUpdate();
18094
18132
  newProp = this.value;
@@ -18132,7 +18170,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
18132
18170
  setTimeout(() => {
18133
18171
  this.initialValueUpdate(listItems, true);
18134
18172
  this.isDynamicRemoteVirtualData = false;
18135
- this.initialUpdate();
18173
+ if (!this.inputFocus || (this.inputFocus && this.mode !== 'Default')) {
18174
+ this.initialUpdate();
18175
+ }
18136
18176
  }, 100);
18137
18177
  }
18138
18178
  });
@@ -19949,6 +19989,9 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
19949
19989
  this.unSelectAllText = l10nSelect.getConstant('unSelectAllText');
19950
19990
  this.popupWrapper = this.list;
19951
19991
  this.checkBoxSelectionModule.checkAllParent = null;
19992
+ if (this.filterParent) {
19993
+ this.filterParent = null;
19994
+ }
19952
19995
  this.notify('selectAll', {});
19953
19996
  }
19954
19997
  }
@@ -20018,6 +20061,9 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
20018
20061
  this.tBListBox = getComponent(document.getElementById(scope), this.getModuleName());
20019
20062
  this.tBListBox.updateToolBarState();
20020
20063
  }
20064
+ else if (this.refreshing) {
20065
+ this.updateToolBarState();
20066
+ }
20021
20067
  }
20022
20068
  createButtons(toolElem) {
20023
20069
  let btn;
@@ -21024,7 +21070,6 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
21024
21070
  }
21025
21071
  this.inputString = this.filterInput.value;
21026
21072
  this.filterWireEvents();
21027
- this.ulElement.style.setProperty('height', 'calc(100% - ' + (this.filterParent.offsetHeight) + 'px)', 'important');
21028
21073
  return filterInputObj;
21029
21074
  }
21030
21075
  }