@syncfusion/ej2-dropdowns 24.1.45 → 24.1.46
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/CHANGELOG.md +24 -0
- 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 +89 -17
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +94 -17
- 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 +9 -9
- package/src/drop-down-list/drop-down-list.d.ts +1 -0
- package/src/drop-down-list/drop-down-list.js +9 -2
- package/src/drop-down-tree/drop-down-tree.d.ts +3 -1
- package/src/drop-down-tree/drop-down-tree.js +76 -13
- package/src/mention/mention.js +8 -1
- package/src/multi-select/multi-select.js +1 -1
- package/styles/bootstrap-dark.css +5 -0
- package/styles/bootstrap.css +5 -0
- package/styles/bootstrap4.css +5 -0
- package/styles/bootstrap5-dark.css +5 -0
- package/styles/bootstrap5.css +5 -0
- package/styles/drop-down-list/_layout.scss +5 -0
- package/styles/drop-down-list/bootstrap-dark.css +5 -0
- package/styles/drop-down-list/bootstrap.css +5 -0
- package/styles/drop-down-list/bootstrap4.css +5 -0
- package/styles/drop-down-list/bootstrap5-dark.css +5 -0
- package/styles/drop-down-list/bootstrap5.css +5 -0
- package/styles/drop-down-list/fabric-dark.css +5 -0
- package/styles/drop-down-list/fabric.css +5 -0
- package/styles/drop-down-list/fluent-dark.css +5 -0
- package/styles/drop-down-list/fluent.css +5 -0
- package/styles/drop-down-list/highcontrast-light.css +5 -0
- package/styles/drop-down-list/highcontrast.css +5 -0
- package/styles/drop-down-list/material-dark.css +5 -0
- package/styles/drop-down-list/material.css +5 -0
- package/styles/drop-down-list/material3-dark.css +5 -0
- package/styles/drop-down-list/material3.css +5 -0
- package/styles/drop-down-list/tailwind-dark.css +5 -0
- package/styles/drop-down-list/tailwind.css +5 -0
- package/styles/fabric-dark.css +5 -0
- package/styles/fabric.css +5 -0
- package/styles/fluent-dark.css +5 -0
- package/styles/fluent.css +5 -0
- package/styles/highcontrast-light.css +5 -0
- package/styles/highcontrast.css +5 -0
- package/styles/material-dark.css +5 -0
- package/styles/material.css +5 -0
- package/styles/material3-dark.css +5 -0
- package/styles/material3.css +5 -0
- package/styles/tailwind-dark.css +5 -0
- package/styles/tailwind.css +5 -0
|
@@ -4795,9 +4795,16 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
4795
4795
|
DropDownList.prototype.scrollHandler = function () {
|
|
4796
4796
|
if (Browser.isDevice && ((this.getModuleName() === 'dropdownlist' &&
|
|
4797
4797
|
!this.isFilterLayout()) || (this.getModuleName() === 'combobox' && !this.allowFiltering && this.isDropDownClick))) {
|
|
4798
|
-
this.
|
|
4798
|
+
if (this.element && !(this.isElementInViewport(this.element))) {
|
|
4799
|
+
this.hidePopup();
|
|
4800
|
+
}
|
|
4799
4801
|
}
|
|
4800
4802
|
};
|
|
4803
|
+
DropDownList.prototype.isElementInViewport = function (element) {
|
|
4804
|
+
var elementRect = element.getBoundingClientRect();
|
|
4805
|
+
return (elementRect.top >= 0 && elementRect.left >= 0 && elementRect.bottom <= window.innerHeight && elementRect.right <= window.innerWidth);
|
|
4806
|
+
};
|
|
4807
|
+
|
|
4801
4808
|
DropDownList.prototype.setSearchBoxPosition = function () {
|
|
4802
4809
|
var searchBoxHeight = this.filterInput.parentElement.getBoundingClientRect().height;
|
|
4803
4810
|
this.popupObj.element.style.maxHeight = '100%';
|
|
@@ -5942,7 +5949,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
|
|
|
5942
5949
|
if (!this.enabled) {
|
|
5943
5950
|
return;
|
|
5944
5951
|
}
|
|
5945
|
-
if (!this.enableVirtualization && this.getModuleName() === 'combobox') {
|
|
5952
|
+
if (!this.enableVirtualization && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {
|
|
5946
5953
|
this.isTyped = true;
|
|
5947
5954
|
}
|
|
5948
5955
|
this.hidePopup(e);
|
|
@@ -6393,7 +6400,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6393
6400
|
var popupDiv = select('#' + this.element.id + '_options', document);
|
|
6394
6401
|
detach(popupDiv ? popupDiv : isTree.parentElement);
|
|
6395
6402
|
}
|
|
6396
|
-
this.ensureAutoCheck();
|
|
6397
6403
|
if (this.element.tagName === 'INPUT') {
|
|
6398
6404
|
this.inputEle = this.element;
|
|
6399
6405
|
if (isNullOrUndefined(this.inputEle.getAttribute('role'))) {
|
|
@@ -6480,11 +6486,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6480
6486
|
|| this.noRecordsTemplate || this.customTemplate;
|
|
6481
6487
|
this.renderComplete();
|
|
6482
6488
|
};
|
|
6483
|
-
DropDownTree.prototype.ensureAutoCheck = function () {
|
|
6484
|
-
if (this.allowFiltering && this.treeSettings.autoCheck) {
|
|
6485
|
-
this.setProperties({ treeSettings: { autoCheck: false } }, true);
|
|
6486
|
-
}
|
|
6487
|
-
};
|
|
6488
6489
|
DropDownTree.prototype.hideCheckAll = function (flag) {
|
|
6489
6490
|
var checkAllEle = !isNullOrUndefined(this.popupEle) ? this.popupEle.querySelector('.' + CHECKALLPARENT) : null;
|
|
6490
6491
|
if (!isNullOrUndefined(checkAllEle)) {
|
|
@@ -6522,10 +6523,21 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6522
6523
|
this.filterTimer = window.setTimeout(function () { _this.filterHandler(args.value, args.event); }, this.filterDelayTime);
|
|
6523
6524
|
}
|
|
6524
6525
|
};
|
|
6526
|
+
DropDownTree.prototype.isChildObject = function () {
|
|
6527
|
+
if (typeof this.treeObj.fields.child === 'object') {
|
|
6528
|
+
return true;
|
|
6529
|
+
}
|
|
6530
|
+
else {
|
|
6531
|
+
return false;
|
|
6532
|
+
}
|
|
6533
|
+
};
|
|
6525
6534
|
DropDownTree.prototype.filterHandler = function (value, event) {
|
|
6526
6535
|
var _this = this;
|
|
6527
6536
|
this.isFromFilterChange = true;
|
|
6528
6537
|
if (!this.isFilteredData) {
|
|
6538
|
+
if (this.isRemoteData) {
|
|
6539
|
+
this.treeObj.expandedNodes = [];
|
|
6540
|
+
}
|
|
6529
6541
|
this.treeData = this.treeObj.getTreeData();
|
|
6530
6542
|
}
|
|
6531
6543
|
var filterFields = this.cloneFields(this.fields);
|
|
@@ -6555,6 +6567,10 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6555
6567
|
}
|
|
6556
6568
|
else {
|
|
6557
6569
|
if (_this.fields.dataSource instanceof DataManager) {
|
|
6570
|
+
fields = _this.remoteDataFilter(value, args.fields);
|
|
6571
|
+
fields.child = _this.fields.child;
|
|
6572
|
+
_this.treeObj.fields = _this.getTreeFields(args.fields);
|
|
6573
|
+
_this.treeObj.dataBind();
|
|
6558
6574
|
flag = true;
|
|
6559
6575
|
}
|
|
6560
6576
|
else {
|
|
@@ -6566,6 +6582,14 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6566
6582
|
if (flag) {
|
|
6567
6583
|
return;
|
|
6568
6584
|
}
|
|
6585
|
+
if (_this.isRemoteData) {
|
|
6586
|
+
if (_this.isChildObject()) {
|
|
6587
|
+
fields.child = _this.fields.child;
|
|
6588
|
+
}
|
|
6589
|
+
else {
|
|
6590
|
+
fields = args.fields;
|
|
6591
|
+
}
|
|
6592
|
+
}
|
|
6569
6593
|
_this.treeObj.fields = _this.getTreeFields(fields);
|
|
6570
6594
|
_this.treeObj.dataBind();
|
|
6571
6595
|
if (_this.hasTemplate && _this.portals && _this.treeObj.portals) {
|
|
@@ -6581,6 +6605,38 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6581
6605
|
}
|
|
6582
6606
|
});
|
|
6583
6607
|
};
|
|
6608
|
+
DropDownTree.prototype.remoteDataFilter = function (value, filteredFields) {
|
|
6609
|
+
var _this = this;
|
|
6610
|
+
filteredFields.dataSource = this.treeData.map(function (item) {
|
|
6611
|
+
return _this.remoteChildFilter(value, item);
|
|
6612
|
+
}).filter(function (filteredChild) {
|
|
6613
|
+
return !isNullOrUndefined(filteredChild);
|
|
6614
|
+
});
|
|
6615
|
+
return filteredFields;
|
|
6616
|
+
};
|
|
6617
|
+
DropDownTree.prototype.remoteChildFilter = function (value, node, isChild, isChildFiltering) {
|
|
6618
|
+
var children = this.isChildObject() ? node['child'] : node[this.fields.child];
|
|
6619
|
+
if (isNullOrUndefined(children)) {
|
|
6620
|
+
return (this.isMatchedNode(value, node, isChild, isChildFiltering)) ? node : null;
|
|
6621
|
+
}
|
|
6622
|
+
var matchedChildren = [];
|
|
6623
|
+
for (var i = 0; i < children.length; i++) {
|
|
6624
|
+
var filteredChild = this.remoteChildFilter(value, children[i], true, true);
|
|
6625
|
+
if (!isNullOrUndefined(filteredChild)) {
|
|
6626
|
+
matchedChildren.push(filteredChild);
|
|
6627
|
+
}
|
|
6628
|
+
}
|
|
6629
|
+
var filteredItems = Object.assign({}, node);
|
|
6630
|
+
isChildFiltering = false;
|
|
6631
|
+
if (matchedChildren.length !== 0) {
|
|
6632
|
+
filteredItems.child = matchedChildren;
|
|
6633
|
+
}
|
|
6634
|
+
else {
|
|
6635
|
+
filteredItems.child = null;
|
|
6636
|
+
filteredItems = (this.isMatchedNode(value, filteredItems)) ? filteredItems : null;
|
|
6637
|
+
}
|
|
6638
|
+
return filteredItems;
|
|
6639
|
+
};
|
|
6584
6640
|
DropDownTree.prototype.nestedFilter = function (value, filteredFields) {
|
|
6585
6641
|
// eslint-disable-next-line
|
|
6586
6642
|
var matchedDataSource = [];
|
|
@@ -6662,8 +6718,17 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
6662
6718
|
return filteredFields;
|
|
6663
6719
|
};
|
|
6664
6720
|
// eslint-disable-next-line
|
|
6665
|
-
DropDownTree.prototype.isMatchedNode = function (value, node) {
|
|
6666
|
-
var checkValue
|
|
6721
|
+
DropDownTree.prototype.isMatchedNode = function (value, node, isChild, isChildFiltering) {
|
|
6722
|
+
var checkValue;
|
|
6723
|
+
var isObjectValue = isChild && isChildFiltering && this.isChildObject();
|
|
6724
|
+
checkValue = isObjectValue ? node[this.fields.child.text] : node[this.fields.text];
|
|
6725
|
+
if (!checkValue) {
|
|
6726
|
+
var tempChild = this.fields.child;
|
|
6727
|
+
while (!node[tempChild.text]) {
|
|
6728
|
+
tempChild = tempChild.child;
|
|
6729
|
+
}
|
|
6730
|
+
checkValue = node[tempChild.text];
|
|
6731
|
+
}
|
|
6667
6732
|
if (this.ignoreCase) {
|
|
6668
6733
|
checkValue = checkValue.toLowerCase();
|
|
6669
6734
|
value = value.toLowerCase();
|
|
@@ -7625,8 +7690,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
7625
7690
|
if (this.isFilteredData) {
|
|
7626
7691
|
this.filterObj.value = '';
|
|
7627
7692
|
this.treeObj.fields = this.getTreeFields(this.fields);
|
|
7628
|
-
if (this.isReact)
|
|
7629
|
-
this.refresh();
|
|
7630
7693
|
this.isFilterRestore = true;
|
|
7631
7694
|
this.isFilteredData = false;
|
|
7632
7695
|
this.hideCheckAll(false);
|
|
@@ -7647,12 +7710,18 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
7647
7710
|
}
|
|
7648
7711
|
else {
|
|
7649
7712
|
_this.popupEle = _this.popupObj.element;
|
|
7713
|
+
if (_this.isReact && _this.isFilterRestore) {
|
|
7714
|
+
_this.treeObj.refresh();
|
|
7715
|
+
_this.isFilteredData = true;
|
|
7716
|
+
_this.popupEle.removeChild(_this.filterContainer);
|
|
7717
|
+
}
|
|
7650
7718
|
}
|
|
7651
7719
|
}
|
|
7652
7720
|
else {
|
|
7653
7721
|
isCancelled = true;
|
|
7654
7722
|
}
|
|
7655
|
-
if (_this.isFirstRender && !isCancelled) {
|
|
7723
|
+
if (_this.isFirstRender && !isCancelled || _this.isFilteredData) {
|
|
7724
|
+
_this.isFilteredData = false;
|
|
7656
7725
|
prepend([_this.popupDiv], _this.popupEle);
|
|
7657
7726
|
removeClass([_this.popupDiv], DDTHIDEICON);
|
|
7658
7727
|
if (_this.allowFiltering) {
|
|
@@ -8019,6 +8088,9 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
8019
8088
|
if (this.value === null) {
|
|
8020
8089
|
this.setProperties({ value: [] }, true);
|
|
8021
8090
|
}
|
|
8091
|
+
if (args.node.classList.contains("e-active")) {
|
|
8092
|
+
this.hidePopup();
|
|
8093
|
+
}
|
|
8022
8094
|
}
|
|
8023
8095
|
};
|
|
8024
8096
|
DropDownTree.prototype.updateHiddenValue = function () {
|
|
@@ -8677,7 +8749,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
8677
8749
|
DropDownTree.prototype.updateTreeSettings = function (prop) {
|
|
8678
8750
|
var value = Object.keys(prop.treeSettings)[0];
|
|
8679
8751
|
if (value === 'autoCheck') {
|
|
8680
|
-
this.ensureAutoCheck();
|
|
8681
8752
|
this.treeObj.autoCheck = this.treeSettings.autoCheck;
|
|
8682
8753
|
}
|
|
8683
8754
|
else if (value === 'loadOnDemand') {
|
|
@@ -8798,7 +8869,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
|
|
|
8798
8869
|
this.destroyFilter();
|
|
8799
8870
|
}
|
|
8800
8871
|
}
|
|
8801
|
-
this.ensureAutoCheck();
|
|
8802
8872
|
};
|
|
8803
8873
|
DropDownTree.prototype.updateFilterPlaceHolder = function () {
|
|
8804
8874
|
if (this.filterObj) {
|
|
@@ -14786,10 +14856,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
|
|
|
14786
14856
|
if (!args.cancel) {
|
|
14787
14857
|
if (!_this.ulElement) {
|
|
14788
14858
|
_this.beforePopupOpen = true;
|
|
14789
|
-
_super.prototype.render.call(_this, e);
|
|
14790
14859
|
if (_this.mode === 'CheckBox' && Browser.isDevice && _this.allowFiltering) {
|
|
14791
14860
|
_this.notify('popupFullScreen', { module: 'CheckBoxSelection', enable: _this.mode === 'CheckBox' });
|
|
14792
14861
|
}
|
|
14862
|
+
_super.prototype.render.call(_this, e);
|
|
14793
14863
|
return;
|
|
14794
14864
|
}
|
|
14795
14865
|
if (_this.mode === 'CheckBox' && Browser.isDevice && _this.allowFiltering) {
|
|
@@ -18625,7 +18695,8 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
|
|
|
18625
18695
|
return;
|
|
18626
18696
|
}
|
|
18627
18697
|
this.isTyped = e.code !== 'Enter' && e.code !== 'Space' && e.code !== 'ArrowDown' && e.code !== 'ArrowUp' ? true : false;
|
|
18628
|
-
|
|
18698
|
+
var isRteImage = document.activeElement.parentElement && document.activeElement.parentElement.querySelector('.e-rte-image') ? true : false;
|
|
18699
|
+
if (document.activeElement != this.inputElement && !isRteImage) {
|
|
18629
18700
|
this.inputElement.focus();
|
|
18630
18701
|
}
|
|
18631
18702
|
if (this.isContentEditable(this.inputElement)) {
|
|
@@ -19497,6 +19568,12 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
|
|
|
19497
19568
|
if (this.isPopupOpen) {
|
|
19498
19569
|
this.hidePopup();
|
|
19499
19570
|
}
|
|
19571
|
+
//New event to update the RichTextEditor value, when a mention item is selected using mouse click action.
|
|
19572
|
+
if (!isNullOrUndefined(e.pointerType) && e.pointerType === 'mouse') {
|
|
19573
|
+
var event_1 = new CustomEvent('content-changed', { detail: { click: true } });
|
|
19574
|
+
this.inputElement.dispatchEvent(event_1);
|
|
19575
|
+
}
|
|
19576
|
+
|
|
19500
19577
|
this.onChangeEvent(e);
|
|
19501
19578
|
}
|
|
19502
19579
|
else {
|