@syncfusion/ej2-dropdowns 28.1.37 → 28.1.39
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.
- package/README.md +1 -1
- package/dist/ej2-dropdowns.min.js +2 -2
- package/dist/ej2-dropdowns.umd.min.js +2 -2
- package/dist/ej2-dropdowns.umd.min.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es2015.js +63 -8
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +64 -8
- package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-dropdowns.min.js +2 -2
- package/dist/global/ej2-dropdowns.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -7
- package/src/combo-box/combo-box.js +2 -2
- package/src/drop-down-base/drop-down-base.js +14 -2
- package/src/drop-down-list/drop-down-list.d.ts +1 -0
- package/src/drop-down-list/drop-down-list.js +12 -2
- package/src/drop-down-tree/drop-down-tree.js +3 -0
- package/src/list-box/list-box.js +1 -1
- package/src/mention/mention.js +3 -1
- package/src/multi-select/multi-select.d.ts +2 -0
- package/src/multi-select/multi-select.js +29 -0
- package/styles/bds-lite.css +8 -0
- package/styles/bds.css +8 -0
- package/styles/bootstrap-dark-lite.css +8 -0
- package/styles/bootstrap-dark.css +8 -0
- package/styles/bootstrap-lite.css +8 -0
- package/styles/bootstrap.css +8 -0
- package/styles/bootstrap4-lite.css +8 -0
- package/styles/bootstrap4.css +8 -0
- package/styles/bootstrap5-dark-lite.css +8 -0
- package/styles/bootstrap5-dark.css +8 -0
- package/styles/bootstrap5-lite.css +8 -0
- package/styles/bootstrap5.3-lite.css +8 -0
- package/styles/bootstrap5.3.css +8 -0
- package/styles/bootstrap5.css +8 -0
- package/styles/drop-down-list/_layout.scss +8 -0
- package/styles/drop-down-list/bds.css +8 -0
- package/styles/drop-down-list/bootstrap-dark.css +8 -0
- package/styles/drop-down-list/bootstrap.css +8 -0
- package/styles/drop-down-list/bootstrap4.css +8 -0
- package/styles/drop-down-list/bootstrap5-dark.css +8 -0
- package/styles/drop-down-list/bootstrap5.3.css +8 -0
- package/styles/drop-down-list/bootstrap5.css +8 -0
- package/styles/drop-down-list/fabric-dark.css +8 -0
- package/styles/drop-down-list/fabric.css +8 -0
- package/styles/drop-down-list/fluent-dark.css +8 -0
- package/styles/drop-down-list/fluent.css +8 -0
- package/styles/drop-down-list/fluent2.css +8 -0
- package/styles/drop-down-list/highcontrast-light.css +8 -0
- package/styles/drop-down-list/highcontrast.css +8 -0
- package/styles/drop-down-list/material-dark.css +8 -0
- package/styles/drop-down-list/material.css +8 -0
- package/styles/drop-down-list/material3-dark.css +8 -0
- package/styles/drop-down-list/material3.css +8 -0
- package/styles/drop-down-list/tailwind-dark.css +8 -0
- package/styles/drop-down-list/tailwind.css +8 -0
- package/styles/drop-down-list/tailwind3.css +8 -0
- package/styles/fabric-dark-lite.css +8 -0
- package/styles/fabric-dark.css +8 -0
- package/styles/fabric-lite.css +8 -0
- package/styles/fabric.css +8 -0
- package/styles/fluent-dark-lite.css +8 -0
- package/styles/fluent-dark.css +8 -0
- package/styles/fluent-lite.css +8 -0
- package/styles/fluent.css +8 -0
- package/styles/fluent2-lite.css +8 -0
- package/styles/fluent2.css +8 -0
- package/styles/highcontrast-light-lite.css +8 -0
- package/styles/highcontrast-light.css +8 -0
- package/styles/highcontrast-lite.css +8 -0
- package/styles/highcontrast.css +8 -0
- package/styles/material-dark-lite.css +8 -0
- package/styles/material-dark.css +8 -0
- package/styles/material-lite.css +8 -0
- package/styles/material.css +8 -0
- package/styles/material3-dark-lite.css +8 -0
- package/styles/material3-dark.css +8 -0
- package/styles/material3-lite.css +8 -0
- package/styles/material3.css +8 -0
- package/styles/tailwind-dark-lite.css +8 -0
- package/styles/tailwind-dark.css +8 -0
- package/styles/tailwind-lite.css +8 -0
- package/styles/tailwind.css +8 -0
- package/styles/tailwind3-lite.css +8 -0
- package/styles/tailwind3.css +8 -0
|
@@ -1861,7 +1861,17 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
|
|
|
1861
1861
|
var liCollections = listElement.querySelectorAll('.' + dropDownBaseClasses.li);
|
|
1862
1862
|
for (var index = 0; index < liCollections.length; index++) {
|
|
1863
1863
|
if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.disabled]) {
|
|
1864
|
-
this.
|
|
1864
|
+
if (!isNullOrUndefined(this.fields.groupBy)) {
|
|
1865
|
+
var item = this.listData[index];
|
|
1866
|
+
var value = getValue((this.fields.value ? this.fields.value : 'value'), item);
|
|
1867
|
+
var li = listElement.querySelector('li[data-value="' + value + '"]');
|
|
1868
|
+
if (!isNullOrUndefined(li)) {
|
|
1869
|
+
this.disableListItem(li);
|
|
1870
|
+
}
|
|
1871
|
+
}
|
|
1872
|
+
else {
|
|
1873
|
+
this.disableListItem(liCollections[index]);
|
|
1874
|
+
}
|
|
1865
1875
|
}
|
|
1866
1876
|
}
|
|
1867
1877
|
}
|
|
@@ -2002,8 +2012,10 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
|
|
|
2002
2012
|
DropDownBase.prototype.scrollStop = function (e, isDownkey) {
|
|
2003
2013
|
var target = !isNullOrUndefined(e) ? e.target : this.list;
|
|
2004
2014
|
var computedHeight = getComputedStyle(this.getValidLi(), null).getPropertyValue('height');
|
|
2015
|
+
var computedMarginValue = getComputedStyle(this.getValidLi(), null).getPropertyValue('margin-bottom');
|
|
2016
|
+
var marginValue = parseInt(computedMarginValue, 10);
|
|
2005
2017
|
var liHeight = this.getModuleName() === 'multiselect' ? parseFloat(computedHeight) : parseInt(computedHeight, 10);
|
|
2006
|
-
var topIndex = Math.round(target.scrollTop / liHeight);
|
|
2018
|
+
var topIndex = Math.round(target.scrollTop / (liHeight + marginValue));
|
|
2007
2019
|
var liCollections = this.list.querySelectorAll('li' + ':not(.e-hide-listitem)');
|
|
2008
2020
|
var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;
|
|
2009
2021
|
for (var i = topIndex; i > -1; i--) {
|
|
@@ -2923,6 +2935,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
2923
2935
|
_this.autoFill = false;
|
|
2924
2936
|
_this.isUpdateHeaderHeight = false;
|
|
2925
2937
|
_this.isUpdateFooterHeight = false;
|
|
2938
|
+
_this.isReactTemplateUpdate = false;
|
|
2926
2939
|
return _this;
|
|
2927
2940
|
}
|
|
2928
2941
|
/**
|
|
@@ -4293,6 +4306,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
4293
4306
|
setTimeout(function () {
|
|
4294
4307
|
proxy_1.cloneElements();
|
|
4295
4308
|
proxy_1.isSecondClick = true;
|
|
4309
|
+
proxy_1.isSecondClick = proxy_1.isReact && proxy_1.isFiltering() && proxy_1.dataSource instanceof DataManager && !proxy_1.list.querySelector('ul') ? false : true;
|
|
4296
4310
|
}, duration);
|
|
4297
4311
|
}
|
|
4298
4312
|
}
|
|
@@ -5132,6 +5146,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
5132
5146
|
if (this.getInitialData) {
|
|
5133
5147
|
this.updateActionCompleteDataValues(ulElement, list);
|
|
5134
5148
|
this.getInitialData = false;
|
|
5149
|
+
this.isReactTemplateUpdate = true;
|
|
5135
5150
|
this.searchLists(this.filterArgs);
|
|
5136
5151
|
return;
|
|
5137
5152
|
}
|
|
@@ -5567,6 +5582,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
5567
5582
|
addClass([_this.inputWrapper.container], [dropDownListClasses.iconAnimation]);
|
|
5568
5583
|
}
|
|
5569
5584
|
_this.renderReactTemplates();
|
|
5585
|
+
if (_this.isReact && _this.isFiltering() && _this.dataSource instanceof DataManager && _this.list.querySelector('ul') && !_this.isSecondClick) {
|
|
5586
|
+
_this.executeCloneElements();
|
|
5587
|
+
}
|
|
5570
5588
|
if (!isNullOrUndefined(_this.popupObj)) {
|
|
5571
5589
|
_this.popupObj.show(new Animation(eventArgs.animation), (_this.zIndex === 1000) ? _this.element : null);
|
|
5572
5590
|
}
|
|
@@ -5593,7 +5611,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
5593
5611
|
_this.destroyPopup();
|
|
5594
5612
|
}
|
|
5595
5613
|
});
|
|
5596
|
-
if (_this.allowResize) {
|
|
5614
|
+
if (_this.allowResize && (_this.getModuleName() !== 'dropdownlist' || !(Browser.isDevice && _this.isDeviceFullScreen && _this.allowFiltering))) {
|
|
5597
5615
|
var resizePaddingBottom = 16;
|
|
5598
5616
|
// Create the resizer div
|
|
5599
5617
|
_this.resizer = _this.createElement('div', {
|
|
@@ -5664,6 +5682,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
5664
5682
|
_this.destroyPopup();
|
|
5665
5683
|
if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list.length > 0) {
|
|
5666
5684
|
_this.isActive = true;
|
|
5685
|
+
if (_this.isReactTemplateUpdate && _this.isReact && _this.itemTemplate && !_this.enableVirtualization) {
|
|
5686
|
+
_this.actionCompleteData.ulElement = _this.renderItems(_this.actionCompleteData.list, _this.fields);
|
|
5687
|
+
_this.isReactTemplateUpdate = false;
|
|
5688
|
+
}
|
|
5667
5689
|
if (_this.enableVirtualization) {
|
|
5668
5690
|
_this.onActionComplete(_this.ulElement, _this.listData, null, true);
|
|
5669
5691
|
}
|
|
@@ -6974,7 +6996,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
6974
6996
|
if (isSelectVal && this.enableVirtualization && this.selectedLI.classList) {
|
|
6975
6997
|
isSelectVal = this.selectedLI.classList.contains('e-active');
|
|
6976
6998
|
}
|
|
6977
|
-
if (this.inputElement && this.inputElement.value
|
|
6999
|
+
if (this.inputElement && this.inputElement.value === '' && !this.isInteracted && (this.isSelectCustom ||
|
|
6978
7000
|
isSelectVal && this.inputElement.value !== dataItem.text)) {
|
|
6979
7001
|
this.isSelectCustom = false;
|
|
6980
7002
|
this.clearAll(e);
|
|
@@ -7802,6 +7824,9 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
7802
7824
|
}
|
|
7803
7825
|
_this.treeObj.fields = _this.getTreeFields(fields);
|
|
7804
7826
|
_this.treeObj.dataBind();
|
|
7827
|
+
if (_this.popupObj) {
|
|
7828
|
+
_this.popupObj.refreshPosition();
|
|
7829
|
+
}
|
|
7805
7830
|
if (_this.hasTemplate && _this.portals && _this.treeObj.portals) {
|
|
7806
7831
|
for (var i = 0; i < _this.treeObj.portals.length; i++) {
|
|
7807
7832
|
if (_this.portals.indexOf(_this.treeObj.portals[i]) === -1) {
|
|
@@ -11495,7 +11520,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
11495
11520
|
this.onChangeEvent(e);
|
|
11496
11521
|
}
|
|
11497
11522
|
}
|
|
11498
|
-
if (e.action === 'enter' && this.inputElement.value
|
|
11523
|
+
if (e.action === 'enter' && this.inputElement.value === '') {
|
|
11499
11524
|
this.clearAll(e);
|
|
11500
11525
|
}
|
|
11501
11526
|
else if (this.isTyped && !this.isSelected && isNullOrUndefined(li)) {
|
|
@@ -11541,7 +11566,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
11541
11566
|
this.onChangeEvent(null);
|
|
11542
11567
|
}
|
|
11543
11568
|
}
|
|
11544
|
-
else if (this.inputElement.value
|
|
11569
|
+
else if (this.inputElement.value !== '') {
|
|
11545
11570
|
var previousValue_1 = this.value;
|
|
11546
11571
|
if (isNullOrUndefined(value)) {
|
|
11547
11572
|
var value_1 = this.inputElement.value === '' ? null : this.inputElement.value;
|
|
@@ -12722,6 +12747,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
12722
12747
|
_this.storedSelectAllHeight = 0;
|
|
12723
12748
|
_this.isUpdateHeaderHeight = false;
|
|
12724
12749
|
_this.isUpdateFooterHeight = false;
|
|
12750
|
+
_this.isBlurDispatching = false;
|
|
12751
|
+
_this.isFilterPrevented = false;
|
|
12725
12752
|
_this.isValidKey = false;
|
|
12726
12753
|
_this.selectAllEventData = [];
|
|
12727
12754
|
_this.selectAllEventEle = [];
|
|
@@ -13180,10 +13207,24 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
13180
13207
|
};
|
|
13181
13208
|
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
13182
13209
|
MultiSelect.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {
|
|
13210
|
+
var _this = this;
|
|
13183
13211
|
if (this.dataSource instanceof DataManager && !isNullOrUndefined(e) && !this.virtualGroupDataSource) {
|
|
13184
13212
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13185
13213
|
this.totalItemCount = e.count;
|
|
13186
13214
|
}
|
|
13215
|
+
if (this.value && list && list.length > 0 && this.allowFiltering && this.mode !== 'CheckBox' && !this.enableVirtualization && !this.isFilterPrevented && !this.allowCustomValue) {
|
|
13216
|
+
var allItemsInValue = list.every(function (item) {
|
|
13217
|
+
var itemValue = getValue((_this.fields.value) ? _this.fields.value : '', item);
|
|
13218
|
+
return _this.value.some(function (val) {
|
|
13219
|
+
var value = _this.allowObjectBinding ? getValue((_this.fields.value) ? _this.fields.value : '', val) : val;
|
|
13220
|
+
return itemValue === value;
|
|
13221
|
+
});
|
|
13222
|
+
});
|
|
13223
|
+
if (allItemsInValue) {
|
|
13224
|
+
ulElement.innerHTML = '';
|
|
13225
|
+
list = [];
|
|
13226
|
+
}
|
|
13227
|
+
}
|
|
13187
13228
|
/* eslint-enable @typescript-eslint/no-unused-vars */
|
|
13188
13229
|
_super.prototype.onActionComplete.call(this, ulElement, list, e);
|
|
13189
13230
|
this.skeletonCount = this.totalItemCount !== 0 && this.totalItemCount < (this.itemCount * 2) &&
|
|
@@ -13832,6 +13873,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
13832
13873
|
};
|
|
13833
13874
|
MultiSelect.prototype.onBlurHandler = function (eve, isDocClickFromCheck) {
|
|
13834
13875
|
var target;
|
|
13876
|
+
if (this.isBlurDispatching && this.isAngular) {
|
|
13877
|
+
this.isBlurDispatching = false;
|
|
13878
|
+
return;
|
|
13879
|
+
}
|
|
13835
13880
|
if (!isNullOrUndefined(eve)) {
|
|
13836
13881
|
target = eve.relatedTarget;
|
|
13837
13882
|
}
|
|
@@ -13914,6 +13959,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
13914
13959
|
this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
|
|
13915
13960
|
this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
|
|
13916
13961
|
}
|
|
13962
|
+
this.isBlurDispatching = true;
|
|
13963
|
+
if (this.isAngular) {
|
|
13964
|
+
this.dispatchEvent(this.inputElement, 'blur');
|
|
13965
|
+
}
|
|
13917
13966
|
};
|
|
13918
13967
|
MultiSelect.prototype.calculateWidth = function () {
|
|
13919
13968
|
var elementWidth;
|
|
@@ -15563,6 +15612,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
15563
15612
|
if (!this.list) {
|
|
15564
15613
|
_super.prototype.render.call(this);
|
|
15565
15614
|
}
|
|
15615
|
+
if (this.popupObj && document.body.contains(this.popupObj.element) && this.allowFiltering) {
|
|
15616
|
+
this.refreshPopup();
|
|
15617
|
+
return;
|
|
15618
|
+
}
|
|
15566
15619
|
if (!this.popupObj) {
|
|
15567
15620
|
if (!isNullOrUndefined(this.popupWrapper)) {
|
|
15568
15621
|
document.body.appendChild(this.popupWrapper);
|
|
@@ -16056,6 +16109,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
16056
16109
|
cancel: false
|
|
16057
16110
|
};
|
|
16058
16111
|
this.trigger('filtering', eventArgs_1, function (eventArgs) {
|
|
16112
|
+
_this.isFilterPrevented = eventArgs.cancel;
|
|
16059
16113
|
if (!eventArgs.cancel) {
|
|
16060
16114
|
if (!_this.isFiltered && !eventArgs.preventDefaultAction) {
|
|
16061
16115
|
_this.filterAction = true;
|
|
@@ -21662,7 +21716,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
21662
21716
|
};
|
|
21663
21717
|
ListBox.prototype.KeyUp = function (e) {
|
|
21664
21718
|
var _this = this;
|
|
21665
|
-
if (this.allowFiltering && e.ctrlKey && e.keyCode === 65) {
|
|
21719
|
+
if (this.allowFiltering && ((e.ctrlKey && e.keyCode === 65) || (e.keyCode === 8 && !this.filterInput.value))) {
|
|
21666
21720
|
e.preventDefault();
|
|
21667
21721
|
return;
|
|
21668
21722
|
}
|
|
@@ -22423,7 +22477,9 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
|
|
|
22423
22477
|
? document.querySelector(this.target)
|
|
22424
22478
|
: this.target) : this.element;
|
|
22425
22479
|
if (this.isContentEditable(this.inputElement)) {
|
|
22426
|
-
this.inputElement.
|
|
22480
|
+
if (!this.inputElement.hasAttribute('contenteditable')) {
|
|
22481
|
+
this.inputElement.setAttribute('contenteditable', 'true');
|
|
22482
|
+
}
|
|
22427
22483
|
addClass([this.inputElement], ['e-mention']);
|
|
22428
22484
|
if (isNullOrUndefined(this.target)) {
|
|
22429
22485
|
addClass([this.inputElement], ['e-editable-element']);
|