@syncfusion/ej2-dropdowns 20.1.47 → 20.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.
@@ -88,10 +88,11 @@ function Search(inputVal, items, searchType, ignoreCase) {
88
88
  if (inputVal && inputVal.length) {
89
89
  var strLength = inputVal.length;
90
90
  var queryStr = ignoreCase ? inputVal.toLocaleLowerCase() : inputVal;
91
+ queryStr = escapeCharRegExp(queryStr);
91
92
  for (var i = 0, itemsData = listItems; i < itemsData.length; i++) {
92
93
  var item = itemsData[i];
93
94
  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) || (searchType === 'EndsWith' && text.substr(text.length - queryStr.length) === queryStr) || (searchType === 'Contains' && new RegExp(queryStr, "g").test(text))) {
95
+ 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
96
  itemData.item = item;
96
97
  itemData.index = i;
97
98
  return { item: item, index: i };
@@ -101,6 +102,9 @@ function Search(inputVal, items, searchType, ignoreCase) {
101
102
  }
102
103
  return itemData;
103
104
  }
105
+ function escapeCharRegExp(value) {
106
+ return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
107
+ }
104
108
  function resetIncrementalSearchValues(elementId) {
105
109
  if (prevElementId === elementId) {
106
110
  prevElementId = '';
@@ -326,7 +330,8 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
326
330
  compareValue_1 = value;
327
331
  dataSource.filter(function (item) {
328
332
  var itemValue = getValue(fields.value, item);
329
- if (!isNullOrUndefined(itemValue) && !isNullOrUndefined(value) && itemValue.toString() === compareValue_1.toString()) {
333
+ if (!isNullOrUndefined(itemValue) && !isNullOrUndefined(value)
334
+ && itemValue.toString() === compareValue_1.toString()) {
330
335
  value = getValue(fields.text, item);
331
336
  }
332
337
  });
@@ -752,7 +757,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
752
757
  if (this.getModuleName() === 'multiselect' && this.properties.allowCustomValue && this.fields.groupBy) {
753
758
  for (var i = 0; i < ulElement.childElementCount; i++) {
754
759
  if (ulElement.children[i].classList.contains('e-list-group-item')) {
755
- if (isNullOrUndefined(ulElement.children[i].innerHTML) || ulElement.children[i].innerHTML == "") {
760
+ if (isNullOrUndefined(ulElement.children[i].innerHTML) || ulElement.children[i].innerHTML === '') {
756
761
  addClass([ulElement.children[i]], HIDE_GROUPLIST);
757
762
  }
758
763
  }
@@ -1055,6 +1060,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1055
1060
  dataSource = this.selectData;
1056
1061
  }
1057
1062
  }
1063
+ dataSource = this.getModuleName() === 'combobox' && this.selectData && dataSource instanceof Array && dataSource.length < this.selectData.length ? this.selectData : dataSource;
1058
1064
  this.setListData(dataSource, fields, query);
1059
1065
  }
1060
1066
  };
@@ -1238,7 +1244,8 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1238
1244
  }
1239
1245
  if (this.itemTemplate && !isHeader) {
1240
1246
  var itemCheck = this.templateCompiler(this.itemTemplate);
1241
- var compiledString = itemCheck ? compile(select(this.itemTemplate, document).innerHTML.trim()) : compile(this.itemTemplate);
1247
+ var compiledString = itemCheck ?
1248
+ compile(select(this.itemTemplate, document).innerHTML.trim()) : compile(this.itemTemplate);
1242
1249
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
1243
1250
  var addItemTemplate = compiledString(item, this, 'itemTemplate', this.itemTemplateId, this.isStringTemplate, null, li);
1244
1251
  if (addItemTemplate) {
@@ -3954,7 +3961,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3954
3961
  if (!this.enabled) {
3955
3962
  return;
3956
3963
  }
3957
- if (this.isFiltering() && this.dataSource instanceof DataManager && (this.actionData.list != this.actionCompleteData.list) &&
3964
+ if (this.isFiltering() && this.dataSource instanceof DataManager && (this.actionData.list !== this.actionCompleteData.list) &&
3958
3965
  this.actionData.list && this.actionData.ulElement) {
3959
3966
  this.actionCompleteData = this.actionData;
3960
3967
  this.onActionComplete(this.actionCompleteData.ulElement, this.actionCompleteData.list, null, true);
@@ -6496,7 +6503,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6496
6503
  addClass([this.inputWrapper], SHOW_CHIP);
6497
6504
  }
6498
6505
  var chip = this.createElement('span', {
6499
- className: CHIP,
6506
+ className: CHIP
6500
6507
  });
6501
6508
  if (!this.inputEle.classList.contains(CHIP_INPUT)) {
6502
6509
  addClass([this.inputEle], CHIP_INPUT);
@@ -6632,7 +6639,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6632
6639
  this.ensurePlaceHolder();
6633
6640
  };
6634
6641
  DropDownTree.prototype.resetValue = function (isDynamicChange) {
6635
- if (this.value == [] && this.text == null) {
6642
+ if (this.value === [] && this.text === null) {
6636
6643
  return;
6637
6644
  }
6638
6645
  Input.setValue(null, this.inputEle, this.floatLabelType);
@@ -7014,10 +7021,10 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
7014
7021
  this.updateTreeSettings(newProp);
7015
7022
  break;
7016
7023
  case 'customTemplate':
7017
- if (this.mode !== "Custom") {
7024
+ if (this.mode !== 'Custom') {
7018
7025
  return;
7019
7026
  }
7020
- this.chipCollection.innerHTML = "";
7027
+ this.chipCollection.innerHTML = '';
7021
7028
  this.setTagValues();
7022
7029
  break;
7023
7030
  case 'sortOrder':
@@ -7234,7 +7241,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
7234
7241
  Property('')
7235
7242
  ], DropDownTree.prototype, "cssClass", void 0);
7236
7243
  __decorate$2([
7237
- Property("${value.length} item(s) selected")
7244
+ Property('${value.length} item(s) selected')
7238
7245
  ], DropDownTree.prototype, "customTemplate", void 0);
7239
7246
  __decorate$2([
7240
7247
  Property(',')
@@ -7712,7 +7719,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7712
7719
  }
7713
7720
  }
7714
7721
  if (!this.isAndroidAutoFill(currentValue)) {
7715
- this.setAutoFillSelection(currentValue);
7722
+ this.setAutoFillSelection(currentValue, isHover);
7716
7723
  }
7717
7724
  }
7718
7725
  };
@@ -7780,7 +7787,8 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7780
7787
  e.preventDefault();
7781
7788
  }
7782
7789
  };
7783
- ComboBox.prototype.setAutoFillSelection = function (currentValue) {
7790
+ ComboBox.prototype.setAutoFillSelection = function (currentValue, isKeyNavigate) {
7791
+ if (isKeyNavigate === void 0) { isKeyNavigate = false; }
7784
7792
  var selection = this.getSelectionPoints();
7785
7793
  var value = this.inputElement.value.substr(0, selection.start);
7786
7794
  if (value && (value.toLowerCase() === currentValue.substr(0, selection.start).toLowerCase())) {
@@ -7788,7 +7796,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7788
7796
  Input.setValue(inputValue, this.inputElement, this.floatLabelType, this.showClearButton);
7789
7797
  this.inputElement.setSelectionRange(selection.start, this.inputElement.value.length);
7790
7798
  }
7791
- else {
7799
+ else if (isKeyNavigate) {
7792
7800
  Input.setValue(currentValue, this.inputElement, this.floatLabelType, this.showClearButton);
7793
7801
  this.inputElement.setSelectionRange(0, this.inputElement.value.length);
7794
7802
  }
@@ -8424,7 +8432,9 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8424
8432
  this.setScrollPosition(e);
8425
8433
  if (this.autofill && this.isPopupOpen) {
8426
8434
  this.preventAutoFill = false;
8427
- _super.prototype.setAutoFill.call(this, li);
8435
+ var isKeyNavigate = (e && e.action === 'down' || e.action === 'up' ||
8436
+ e.action === 'home' || e.action === 'end' || e.action === 'pageUp' || e.action === 'pageDown');
8437
+ _super.prototype.setAutoFill.call(this, li, isKeyNavigate);
8428
8438
  }
8429
8439
  attributes(this.inputElement, { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
8430
8440
  }
@@ -9435,7 +9445,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9435
9445
  var list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
9436
9446
  if (this.backCommand) {
9437
9447
  this.remoteCustomValue = false;
9438
- if (this.allowCustomValue && list.querySelectorAll('li').length == 0 && this.mainData.length > 0) {
9448
+ if (this.allowCustomValue && list.querySelectorAll('li').length === 0 && this.mainData.length > 0) {
9439
9449
  this.mainData = [];
9440
9450
  }
9441
9451
  this.onActionComplete(list, this.mainData);
@@ -9830,7 +9840,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9830
9840
  var filterInput = this.popupWrapper.querySelector('.' + FILTERINPUT);
9831
9841
  filterInput && filterInput.setAttribute('aria-activedescendant', focusedItem.id);
9832
9842
  }
9833
- else if (this.mode == "CheckBox") {
9843
+ else if (this.mode === 'CheckBox') {
9834
9844
  this.overAllWrapper.setAttribute('aria-activedescendant', focusedItem.id);
9835
9845
  }
9836
9846
  }
@@ -11242,8 +11252,13 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11242
11252
  MultiSelect.prototype.updateDataList = function () {
11243
11253
  if (this.mainList && this.ulElement) {
11244
11254
  var isDynamicGroupItemUpdate = this.mainList.childElementCount < this.ulElement.childElementCount;
11245
- var isReactTemplateUpdate = ((this.ulElement.childElementCount > 0 && this.ulElement.children[0].childElementCount > 0) && (this.mainList.children[0].childElementCount < this.ulElement.children[0].childElementCount));
11246
- var isAngularTemplateUpdate = this.itemTemplate && this.ulElement.childElementCount > 0 && (this.ulElement.children[0].childElementCount > 0 || (this.fields.groupBy && this.ulElement.children[1] && this.ulElement.children[1].childElementCount > 0));
11255
+ var isReactTemplateUpdate = ((this.ulElement.childElementCount > 0 &&
11256
+ this.ulElement.children[0].childElementCount > 0) &&
11257
+ (this.mainList.children[0].childElementCount < this.ulElement.children[0].childElementCount));
11258
+ var isAngularTemplateUpdate = this.itemTemplate && this.ulElement.childElementCount > 0
11259
+ && !(this.ulElement.childElementCount < this.mainList.childElementCount)
11260
+ && (this.ulElement.children[0].childElementCount > 0
11261
+ || (this.fields.groupBy && this.ulElement.children[1] && this.ulElement.children[1].childElementCount > 0));
11247
11262
  if (isDynamicGroupItemUpdate || isReactTemplateUpdate || isAngularTemplateUpdate) {
11248
11263
  //EJ2-57748 - for this task, we prevent the ul element cloning ( this.mainList = this.ulElement.cloneNode ? <HTMLElement>this.ulElement.cloneNode(true) : this.ulElement;)
11249
11264
  this.mainList = this.ulElement;
@@ -12315,7 +12330,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12315
12330
  }
12316
12331
  return valuecheck;
12317
12332
  };
12318
-
12319
12333
  MultiSelect.prototype.addNonPresentItems = function (valuecheck, ulElement, list, event) {
12320
12334
  var _this = this;
12321
12335
  this.dataSource.executeQuery(this.getForQuery(valuecheck)).then(function (e) {
@@ -12323,7 +12337,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12323
12337
  _this.updateActionList(ulElement, list, event);
12324
12338
  });
12325
12339
  };
12326
-
12327
12340
  MultiSelect.prototype.updateVal = function (newProp, oldProp, prop) {
12328
12341
  if (!this.list) {
12329
12342
  this.onLoadSelect();
@@ -12336,7 +12349,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12336
12349
  if (!isNullOrUndefined(this.value) && !this.allowCustomValue) {
12337
12350
  valuecheck = this.presentItemValue(this.ulElement);
12338
12351
  }
12339
- if (prop == 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
12352
+ if (prop === 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
12340
12353
  && this.listData != null) {
12341
12354
  this.mainData = null;
12342
12355
  this.setDynValue = true;
@@ -13870,10 +13883,10 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
13870
13883
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
13871
13884
  var event = args.event;
13872
13885
  var wrapper;
13873
- if (args.target && (args.target.classList.contains("e-listbox-wrapper") || args.target.classList.contains("e-list-item")
13874
- || args.target.classList.contains("e-filter-parent") || args.target.classList.contains("e-input-group"))) {
13875
- if (args.target.classList.contains("e-list-item") || args.target.classList.contains("e-filter-parent")
13876
- || args.target.classList.contains("e-input-group")) {
13886
+ if (args.target && (args.target.classList.contains('e-listbox-wrapper') || args.target.classList.contains('e-list-item')
13887
+ || args.target.classList.contains('e-filter-parent') || args.target.classList.contains('e-input-group'))) {
13888
+ if (args.target.classList.contains('e-list-item') || args.target.classList.contains('e-filter-parent')
13889
+ || args.target.classList.contains('e-input-group')) {
13877
13890
  wrapper = args.target.closest('.e-listbox-wrapper');
13878
13891
  }
13879
13892
  else {
@@ -13928,7 +13941,8 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
13928
13941
  var getArgs = this.getDragArgs({ target: args.droppedElement }, true);
13929
13942
  var sourceArgs = { previousData: this.dataSource };
13930
13943
  var destArgs = { previousData: listObj.dataSource };
13931
- var dragArgs = extend({}, getArgs, { target: args.target, source: { previousData: this.dataSource }, previousIndex: args.previousIndex, currentIndex: args.currentIndex });
13944
+ var dragArgs = extend({}, getArgs, { target: args.target, source: { previousData: this.dataSource },
13945
+ previousIndex: args.previousIndex, currentIndex: args.currentIndex });
13932
13946
  if (listObj !== this) {
13933
13947
  var sourceArgs1 = extend(sourceArgs, { currentData: this.listData });
13934
13948
  dragArgs = extend(dragArgs, { source: sourceArgs1, destination: destArgs });
@@ -14059,7 +14073,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
14059
14073
  };
14060
14074
  ListBox.prototype.updateListItems = function (sourceElem, destElem) {
14061
14075
  var i = 0;
14062
- destElem.innerHTML = "";
14076
+ destElem.innerHTML = '';
14063
14077
  while (i < sourceElem.childNodes.length) {
14064
14078
  destElem.appendChild(sourceElem.childNodes[i]);
14065
14079
  }
@@ -14248,6 +14262,8 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
14248
14262
  if (this.listData.length === 0) {
14249
14263
  this.l10nUpdate();
14250
14264
  }
14265
+ this.value = null;
14266
+ this.updateToolBarState();
14251
14267
  };
14252
14268
  /**
14253
14269
  * Gets the array of data Object that matches the given array of values.
@@ -14499,6 +14515,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
14499
14515
  if (this.allowFiltering) {
14500
14516
  var filterType = this.inputString === '' ? 'contains' : this.filterType;
14501
14517
  var dataType = this.typeOfData(this.dataSource).typeof;
14518
+ if (dataType === null) {
14519
+ dataType = this.typeOfData(this.jsonData).typeof;
14520
+ }
14502
14521
  if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {
14503
14522
  filterQuery.where('', filterType, this.inputString, this.ignoreCase, this.ignoreAccent);
14504
14523
  }
@@ -15094,7 +15113,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
15094
15113
  }
15095
15114
  }
15096
15115
  }
15097
- else if (e.keyCode !== 37 && e.keyCode !== 39) {
15116
+ else if (e.keyCode !== 37 && e.keyCode !== 39 && e.code !== 'KeyA') {
15098
15117
  this.upDownKeyHandler(e);
15099
15118
  }
15100
15119
  }
@@ -15123,9 +15142,6 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
15123
15142
  }
15124
15143
  }
15125
15144
  removeClass([fli], 'e-focused');
15126
- if (e.ctrlKey && !e.shiftKey && !this.selectionSettings.showCheckbox) {
15127
- removeClass([fli], 'e-selected');
15128
- }
15129
15145
  }
15130
15146
  var cli = ul.children[fliIdx];
15131
15147
  if (cli) {
@@ -15141,8 +15157,8 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
15141
15157
  }
15142
15158
  if (this.selectionSettings.showCheckbox && e.ctrlKey && e.shiftKey && (e.keyCode === 36 || e.keyCode === 35)) {
15143
15159
  var selectedidx = Array.prototype.indexOf.call(ul.children, fli);
15144
- var sidx = e.code === "Home" ? 0 : selectedidx;
15145
- var eidx = e.code === "Home" ? selectedidx : ul.children.length - 1;
15160
+ var sidx = e.code === 'Home' ? 0 : selectedidx;
15161
+ var eidx = e.code === 'Home' ? selectedidx : ul.children.length - 1;
15146
15162
  for (var i = sidx; i <= eidx; i++) {
15147
15163
  var item = ul.children[i];
15148
15164
  this.notify('updatelist', { li: item, e: {
@@ -15729,5 +15745,5 @@ var listBoxClasses = {
15729
15745
  * export all modules from current location
15730
15746
  */
15731
15747
 
15732
- export { incrementalSearch, Search, resetIncrementalSearchValues, highlightSearch, revertHighlightSearch, FieldSettings, dropDownBaseClasses, DropDownBase, dropDownListClasses, DropDownList, Fields, TreeSettings, DropDownTree, ComboBox, AutoComplete, MultiSelect, CheckBoxSelection, createFloatLabel, updateFloatLabelState, removeFloating, setPlaceHolder, floatLabelFocus, floatLabelBlur, encodePlaceholder, SelectionSettings, ToolbarSettings, ListBox };
15748
+ export { incrementalSearch, Search, escapeCharRegExp, resetIncrementalSearchValues, highlightSearch, revertHighlightSearch, FieldSettings, dropDownBaseClasses, DropDownBase, dropDownListClasses, DropDownList, Fields, TreeSettings, DropDownTree, ComboBox, AutoComplete, MultiSelect, CheckBoxSelection, createFloatLabel, updateFloatLabelState, removeFloating, setPlaceHolder, floatLabelFocus, floatLabelBlur, encodePlaceholder, SelectionSettings, ToolbarSettings, ListBox };
15733
15749
  //# sourceMappingURL=ej2-dropdowns.es5.js.map