@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.
- package/CHANGELOG.md +2 -0
- package/README.md +1 -1
- 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 +77 -31
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +78 -31
- 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 -11
- package/src/combo-box/combo-box.js +2 -2
- package/src/common/incremental-search.d.ts +1 -1
- package/src/common/incremental-search.js +1 -1
- package/src/drop-down-base/drop-down-base.js +17 -0
- package/src/list-box/list-box.d.ts +0 -4
- package/src/list-box/list-box.js +0 -3
- package/src/multi-select/multi-select-model.d.ts +1 -1
- package/src/multi-select/multi-select.d.ts +2 -0
- package/src/multi-select/multi-select.js +58 -25
- package/styles/auto-complete/_fluent-definition.scss +2 -0
- package/styles/auto-complete/bootstrap5-dark.css +0 -1
- package/styles/auto-complete/bootstrap5.css +0 -1
- package/styles/bootstrap5-dark.css +12 -6
- package/styles/bootstrap5.css +12 -6
- package/styles/combo-box/_fluent-definition.scss +2 -0
- package/styles/combo-box/bootstrap5-dark.css +0 -1
- package/styles/combo-box/bootstrap5.css +0 -1
- package/styles/drop-down-base/_fluent-definition.scss +109 -0
- package/styles/drop-down-list/_bootstrap5-definition.scss +0 -1
- package/styles/drop-down-list/_fluent-definition.scss +193 -0
- package/styles/drop-down-list/bootstrap5-dark.css +0 -1
- package/styles/drop-down-list/bootstrap5.css +0 -1
- package/styles/drop-down-list/icons/_bootstrap5.scss +0 -1
- package/styles/drop-down-list/icons/_fluent.scss +14 -0
- package/styles/drop-down-tree/_bootstrap5-definition.scss +59 -58
- package/styles/drop-down-tree/_fluent-definition.scss +71 -0
- package/styles/drop-down-tree/_layout.scss +12 -4
- package/styles/drop-down-tree/_tailwind-definition.scss +1 -0
- package/styles/drop-down-tree/bootstrap5-dark.css +11 -4
- package/styles/drop-down-tree/bootstrap5.css +11 -4
- package/styles/drop-down-tree/icons/_bootstrap5.scss +11 -11
- package/styles/drop-down-tree/icons/_fluent.scss +11 -0
- package/styles/drop-down-tree/icons/_tailwind-dark.scss +11 -11
- package/styles/drop-down-tree/tailwind-dark.css +1 -0
- package/styles/drop-down-tree/tailwind.css +1 -0
- package/styles/list-box/_bootstrap5-definition.scss +2 -2
- package/styles/list-box/_fluent-definition.scss +115 -0
- package/styles/list-box/_layout.scss +1 -6
- package/styles/list-box/bootstrap5-dark.css +1 -1
- package/styles/list-box/bootstrap5.css +1 -1
- package/styles/list-box/icons/_fluent.scss +25 -0
- package/styles/list-box/icons/_tailwind-dark.scss +2 -2
- package/styles/list-box/tailwind-dark.css +3 -3
- package/styles/list-box/tailwind.css +1 -1
- package/styles/material-dark.css +0 -94
- package/styles/material.css +0 -94
- package/styles/multi-select/_fluent-definition.scss +214 -0
- package/styles/multi-select/_layout.scss +0 -116
- package/styles/multi-select/_material-dark-definition.scss +0 -22
- package/styles/multi-select/_material-definition.scss +0 -22
- package/styles/multi-select/icons/_fluent.scss +27 -0
- package/styles/multi-select/material-dark.css +0 -94
- package/styles/multi-select/material.css +0 -94
- package/styles/tailwind-dark.css +4 -3
- package/styles/tailwind.css +2 -1
- package/styles/_all.scss +0 -3
|
@@ -91,7 +91,7 @@ function Search(inputVal, items, searchType, ignoreCase) {
|
|
|
91
91
|
for (let i = 0, itemsData = listItems; i < itemsData.length; i++) {
|
|
92
92
|
const item = itemsData[i];
|
|
93
93
|
const 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 };
|
|
@@ -635,6 +635,11 @@ let DropDownBase = class DropDownBase extends Component {
|
|
|
635
635
|
this.renderGroupTemplate(ulElement);
|
|
636
636
|
}
|
|
637
637
|
this.bindChildItems(localDataArgs.result, ulElement, fields);
|
|
638
|
+
setTimeout(() => {
|
|
639
|
+
if (this.getModuleName() === 'multiselect' && this.itemTemplate != null && (ulElement.childElementCount > 0 && ulElement.children[0].childElementCount > 0)) {
|
|
640
|
+
this.updateDataList();
|
|
641
|
+
}
|
|
642
|
+
});
|
|
638
643
|
}
|
|
639
644
|
});
|
|
640
645
|
}
|
|
@@ -765,10 +770,22 @@ let DropDownBase = class DropDownBase extends Component {
|
|
|
765
770
|
const groupValue = select(this.groupTemplate, document).innerHTML.trim();
|
|
766
771
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
767
772
|
const tempHeaders = ListBase.renderGroupTemplate(groupValue, dataSource, this.fields.properties, headerItems, option, this);
|
|
773
|
+
//EJ2-55168- Group checkbox is not working with group template
|
|
774
|
+
if (this.isGroupChecking) {
|
|
775
|
+
for (var i = 0; i < tempHeaders.length; i++) {
|
|
776
|
+
this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
|
|
777
|
+
}
|
|
778
|
+
}
|
|
768
779
|
}
|
|
769
780
|
else {
|
|
770
781
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
771
782
|
const tempHeaders = ListBase.renderGroupTemplate(this.groupTemplate, dataSource, this.fields.properties, headerItems, option, this);
|
|
783
|
+
//EJ2-55168- Group checkbox is not working with group template
|
|
784
|
+
if (this.isGroupChecking) {
|
|
785
|
+
for (var i = 0; i < tempHeaders.length; i++) {
|
|
786
|
+
this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });
|
|
787
|
+
}
|
|
788
|
+
}
|
|
772
789
|
}
|
|
773
790
|
this.renderReactTemplates();
|
|
774
791
|
}
|
|
@@ -7436,7 +7453,7 @@ let ComboBox = class ComboBox extends DropDownList {
|
|
|
7436
7453
|
if ((Browser.isDevice && !this.isDropDownClick || !Browser.isDevice) &&
|
|
7437
7454
|
!isNullOrUndefined(this.liCollections) && this.liCollections.length > 0) {
|
|
7438
7455
|
const inputValue = this.inputElement.value;
|
|
7439
|
-
const activeItem = Search(inputValue, this.liCollections,
|
|
7456
|
+
const activeItem = Search(inputValue, this.liCollections, this.filterType, true);
|
|
7440
7457
|
const activeElement = activeItem.item;
|
|
7441
7458
|
if (!isNullOrUndefined(activeElement)) {
|
|
7442
7459
|
const count = this.getIndexByValue(activeElement.getAttribute('data-value')) - 1;
|
|
@@ -7593,7 +7610,7 @@ let ComboBox = class ComboBox extends DropDownList {
|
|
|
7593
7610
|
else {
|
|
7594
7611
|
this.activeIndex = null;
|
|
7595
7612
|
this.removeSelection();
|
|
7596
|
-
if (this.liCollections && this.liCollections.length
|
|
7613
|
+
if (this.liCollections && this.liCollections.length > 0 && !this.isCustomFilter) {
|
|
7597
7614
|
this.removeFocus();
|
|
7598
7615
|
}
|
|
7599
7616
|
}
|
|
@@ -8982,7 +8999,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
|
|
|
8982
8999
|
this.mainData = list;
|
|
8983
9000
|
this.mainListCollection = this.liCollections;
|
|
8984
9001
|
}
|
|
8985
|
-
else if (
|
|
9002
|
+
else if (isNullOrUndefined(this.mainData) || this.mainData.length === 0) {
|
|
8986
9003
|
this.mainData = list;
|
|
8987
9004
|
}
|
|
8988
9005
|
if ((this.remoteCustomValue || list.length <= 0) && this.allowCustomValue && this.inputFocus && this.allowFiltering &&
|
|
@@ -10998,7 +11015,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
|
|
|
10998
11015
|
updateActionCompleteData(li, item) {
|
|
10999
11016
|
if (this.value && this.value.indexOf(li.getAttribute('data-value')) > -1) {
|
|
11000
11017
|
this.mainList = this.ulElement;
|
|
11001
|
-
|
|
11018
|
+
if (this.hideSelectedItem) {
|
|
11019
|
+
addClass([li], HIDE_LIST);
|
|
11020
|
+
}
|
|
11002
11021
|
}
|
|
11003
11022
|
}
|
|
11004
11023
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
@@ -11016,7 +11035,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
|
|
|
11016
11035
|
}
|
|
11017
11036
|
}
|
|
11018
11037
|
updateDataList() {
|
|
11019
|
-
if (this.mainList && this.ulElement && this.mainList.childElementCount < this.ulElement.childElementCount) {
|
|
11038
|
+
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)))) {
|
|
11020
11039
|
this.mainList = this.ulElement.cloneNode ? this.ulElement.cloneNode(true) : this.ulElement;
|
|
11021
11040
|
}
|
|
11022
11041
|
}
|
|
@@ -12056,6 +12075,24 @@ let MultiSelect = class MultiSelect extends DropDownBase {
|
|
|
12056
12075
|
}
|
|
12057
12076
|
this.renderPopup();
|
|
12058
12077
|
}
|
|
12078
|
+
presentItemValue(ulElement) {
|
|
12079
|
+
let valuecheck = [];
|
|
12080
|
+
for (let i = 0; i < this.value.length; i++) {
|
|
12081
|
+
let checkEle = this.findListElement(((this.allowFiltering && !isNullOrUndefined(this.mainList)) ? this.mainList : ulElement), 'li', 'data-value', this.value[i]);
|
|
12082
|
+
if (!checkEle) {
|
|
12083
|
+
valuecheck.push(this.value[i]);
|
|
12084
|
+
}
|
|
12085
|
+
}
|
|
12086
|
+
return valuecheck;
|
|
12087
|
+
}
|
|
12088
|
+
;
|
|
12089
|
+
addNonPresentItems(valuecheck, ulElement, list, event) {
|
|
12090
|
+
this.dataSource.executeQuery(this.getForQuery(valuecheck)).then((e) => {
|
|
12091
|
+
this.addItem(e.result, list.length);
|
|
12092
|
+
this.updateActionList(ulElement, list, event);
|
|
12093
|
+
});
|
|
12094
|
+
}
|
|
12095
|
+
;
|
|
12059
12096
|
updateVal(newProp, oldProp, prop) {
|
|
12060
12097
|
if (!this.list) {
|
|
12061
12098
|
this.onLoadSelect();
|
|
@@ -12064,31 +12101,43 @@ let MultiSelect = class MultiSelect extends DropDownBase {
|
|
|
12064
12101
|
this.onLoadSelect();
|
|
12065
12102
|
}
|
|
12066
12103
|
else {
|
|
12067
|
-
|
|
12068
|
-
|
|
12069
|
-
|
|
12070
|
-
}
|
|
12071
|
-
if (isNullOrUndefined(this.value) || this.value.length === 0) {
|
|
12072
|
-
this.tempValues = oldProp;
|
|
12073
|
-
}
|
|
12074
|
-
// eslint-disable-next-line
|
|
12075
|
-
if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
|
|
12076
|
-
&& this.isPopupOpen() && this.mainData !== this.listData) {
|
|
12077
|
-
const list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
|
|
12078
|
-
this.onActionComplete(list, this.mainData);
|
|
12079
|
-
}
|
|
12080
|
-
this.initialValueUpdate();
|
|
12081
|
-
if (this.mode !== 'Box' && !this.inputFocus) {
|
|
12082
|
-
this.updateDelimView();
|
|
12104
|
+
let valuecheck = [];
|
|
12105
|
+
if (!isNullOrUndefined(this.value) && !this.allowCustomValue) {
|
|
12106
|
+
valuecheck = this.presentItemValue(this.ulElement);
|
|
12083
12107
|
}
|
|
12084
|
-
if (!this.
|
|
12085
|
-
this.
|
|
12108
|
+
if (prop == 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
|
|
12109
|
+
&& this.listData != null) {
|
|
12110
|
+
this.mainData = null;
|
|
12111
|
+
this.setDynValue = true;
|
|
12112
|
+
this.addNonPresentItems(valuecheck, this.ulElement, this.listData);
|
|
12086
12113
|
}
|
|
12087
|
-
|
|
12088
|
-
|
|
12089
|
-
|
|
12114
|
+
else {
|
|
12115
|
+
if (prop === 'text') {
|
|
12116
|
+
this.initialTextUpdate();
|
|
12117
|
+
newProp = this.value;
|
|
12118
|
+
}
|
|
12119
|
+
if (isNullOrUndefined(this.value) || this.value.length === 0) {
|
|
12120
|
+
this.tempValues = oldProp;
|
|
12121
|
+
}
|
|
12122
|
+
// eslint-disable-next-line
|
|
12123
|
+
if (this.allowCustomValue && (this.mode === 'Default' || this.mode === 'Box') && this.isReact && this.inputFocus
|
|
12124
|
+
&& this.isPopupOpen() && this.mainData !== this.listData) {
|
|
12125
|
+
const list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
|
|
12126
|
+
this.onActionComplete(list, this.mainData);
|
|
12127
|
+
}
|
|
12128
|
+
this.initialValueUpdate();
|
|
12129
|
+
if (this.mode !== 'Box' && !this.inputFocus) {
|
|
12130
|
+
this.updateDelimView();
|
|
12131
|
+
}
|
|
12132
|
+
if (!this.inputFocus) {
|
|
12133
|
+
this.refreshInputHight();
|
|
12134
|
+
}
|
|
12135
|
+
this.refreshPlaceHolder();
|
|
12136
|
+
if (this.mode !== 'CheckBox' && this.changeOnBlur) {
|
|
12137
|
+
this.updateValueState(null, newProp, oldProp);
|
|
12138
|
+
}
|
|
12139
|
+
this.checkPlaceholderSize();
|
|
12090
12140
|
}
|
|
12091
|
-
this.checkPlaceholderSize();
|
|
12092
12141
|
}
|
|
12093
12142
|
if (!this.changeOnBlur) {
|
|
12094
12143
|
this.updateValueState(null, newProp, oldProp);
|
|
@@ -13565,9 +13614,6 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
|
|
|
13565
13614
|
args.items = this.getDataByValues([dragValue]);
|
|
13566
13615
|
}
|
|
13567
13616
|
this.trigger('beforeDrop', args);
|
|
13568
|
-
if (args.isDragAll !== null) {
|
|
13569
|
-
this.allowDragAll = args.isDragAll;
|
|
13570
|
-
}
|
|
13571
13617
|
}
|
|
13572
13618
|
dragEnd(args) {
|
|
13573
13619
|
let listData;
|