@syncfusion/ej2-dropdowns 34.2.3 → 34.2.5

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.
@@ -1,12 +1,3 @@
1
- /*!
2
- * filename: index.d.ts
3
- * version : 34.2.3
4
- * Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
5
- * Use of this code is subject to the terms of our license.
6
- * A copy of the current license can be obtained at any time by e-mailing
7
- * licensing@syncfusion.com. Any infringement will be prosecuted under
8
- * applicable laws.
9
- */
10
1
  import * as _dropdowns from '@syncfusion/ej2-dropdowns';
11
2
 
12
3
  export declare namespace ej {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@syncfusion/ej2-dropdowns",
3
- "version": "34.2.3",
3
+ "version": "34.2.5",
4
4
  "description": "Essential JS 2 DropDown Components",
5
5
  "author": "Syncfusion Inc.",
6
6
  "license": "SEE LICENSE IN license",
@@ -8,13 +8,13 @@
8
8
  "module": "./index.js",
9
9
  "es2015": "./dist/es6/ej2-dropdowns.es5.js",
10
10
  "dependencies": {
11
- "@syncfusion/ej2-base": "~34.2.2",
11
+ "@syncfusion/ej2-base": "~34.2.5",
12
12
  "@syncfusion/ej2-data": "~34.2.2",
13
13
  "@syncfusion/ej2-inputs": "~34.2.2",
14
14
  "@syncfusion/ej2-lists": "~34.2.2",
15
- "@syncfusion/ej2-navigations": "~34.2.3",
15
+ "@syncfusion/ej2-navigations": "~34.2.5",
16
16
  "@syncfusion/ej2-notifications": "~34.2.2",
17
- "@syncfusion/ej2-popups": "~34.2.3"
17
+ "@syncfusion/ej2-popups": "~34.2.4"
18
18
  },
19
19
  "devDependencies": {},
20
20
  "keywords": [
@@ -846,6 +846,7 @@ export declare class DropDownTree extends Component<HTMLElement> implements INot
846
846
  private getNestedItems;
847
847
  private getChildType;
848
848
  private renderTree;
849
+ private updateIndeterminateNodes;
849
850
  private renderPopup;
850
851
  private checkCollision;
851
852
  private removeFocus;
@@ -894,6 +895,7 @@ export declare class DropDownTree extends Component<HTMLElement> implements INot
894
895
  private getFilteredTreeData;
895
896
  private getChildren;
896
897
  private getDirectChildren;
898
+ private restoreRootParentValues;
897
899
  private updateFilteredAutoCheckValues;
898
900
  private updateSelectedValues;
899
901
  private setChipValues;
@@ -1680,8 +1680,129 @@ var DropDownTree = /** @class */ (function (_super) {
1680
1680
  checkOnClick: true
1681
1681
  });
1682
1682
  this.treeObj.root = this.root ? this.root : this;
1683
+ this.treeObj.filterIndeterminateNodes = [];
1684
+ this.treeObj.filterCheckedNodes = [];
1683
1685
  this.treeObj.appendTo(this.tree);
1684
1686
  };
1687
+ DropDownTree.prototype.updateIndeterminateNodes = function () {
1688
+ if (!(this.allowFiltering && this.treeSettings.autoCheck) || (this.isRemoteData || this.treeSettings.loadOnDemand)) {
1689
+ return;
1690
+ }
1691
+ var checkedNodes = Array.isArray(this.value) ? this.value.slice() : [];
1692
+ var checkedSet = {};
1693
+ for (var i = 0; i < checkedNodes.length; i++) {
1694
+ checkedSet[checkedNodes[i]] = true;
1695
+ }
1696
+ var treeData = this.treeObj.element.classList.contains('e-filtering') ? this.treeData : this.treeItems;
1697
+ var valueField = this.fields.value;
1698
+ var parentValueField = this.fields.parentValue;
1699
+ var hasChildrenField = this.fields.hasChildren;
1700
+ var childField = this.fields.child;
1701
+ var indeterminateNodes = [];
1702
+ var childrenMap = {};
1703
+ for (var i = 0; i < treeData.length; i++) {
1704
+ var node = treeData[i];
1705
+ var nodeId = getValue(valueField, node);
1706
+ var nodePid = getValue(parentValueField, node);
1707
+ if (isNOU(node) || isNOU(nodeId) || isNOU(nodePid)) {
1708
+ continue;
1709
+ }
1710
+ var parentId = nodePid.toString();
1711
+ if (!childrenMap[parentId]) {
1712
+ childrenMap[parentId] = [];
1713
+ }
1714
+ childrenMap[parentId].push(nodeId.toString());
1715
+ }
1716
+ var allNodes = treeData.slice();
1717
+ if (!isNOU(childField)) {
1718
+ var collectNestedChildren_1 = function (nodes, fields) {
1719
+ if (!nodes) {
1720
+ return;
1721
+ }
1722
+ for (var i = 0; i < nodes.length; i++) {
1723
+ var node = nodes[i];
1724
+ if (isNOU(node)) {
1725
+ continue;
1726
+ }
1727
+ var nodeId = getValue(fields.value, node);
1728
+ if (isNOU(nodeId)) {
1729
+ continue;
1730
+ }
1731
+ allNodes.push(node);
1732
+ var childMapper = fields.child;
1733
+ var childrenArr = void 0;
1734
+ if (typeof childMapper === 'string') {
1735
+ childrenArr = node[childMapper];
1736
+ }
1737
+ else if (!isNOU(childMapper)) {
1738
+ childrenArr = node[childMapper.value];
1739
+ }
1740
+ else {
1741
+ childrenArr = null;
1742
+ }
1743
+ if (!isNOU(childrenArr) && Array.isArray(childrenArr) && childrenArr.length) {
1744
+ var parentId = nodeId.toString();
1745
+ if (!childrenMap[parentId]) {
1746
+ childrenMap[parentId] = [];
1747
+ }
1748
+ for (var k = 0; k < childrenArr.length; k++) {
1749
+ var childId = getValue(fields.value, childrenArr[k]);
1750
+ if (!isNOU(childId) && childrenMap[parentId].indexOf(childId.toString()) === -1) {
1751
+ childrenMap[parentId].push(childId.toString());
1752
+ }
1753
+ }
1754
+ var nextFields = (typeof childMapper !== 'string' && !isNOU(childMapper)) ?
1755
+ childMapper : fields;
1756
+ collectNestedChildren_1(childrenArr, nextFields);
1757
+ }
1758
+ }
1759
+ };
1760
+ collectNestedChildren_1(treeData, this.fields);
1761
+ }
1762
+ for (var i = 0; i < allNodes.length; i++) {
1763
+ var node = allNodes[i];
1764
+ var nodeId = getValue(valueField, node);
1765
+ if (isNOU(node) || isNOU(nodeId)) {
1766
+ continue;
1767
+ }
1768
+ var nodeIdStr = nodeId.toString();
1769
+ if (hasChildrenField && getValue(hasChildrenField, node) === false) {
1770
+ continue;
1771
+ }
1772
+ if (checkedSet[nodeIdStr]) {
1773
+ continue;
1774
+ }
1775
+ var descendants = [];
1776
+ var queue = childrenMap[nodeIdStr] ? childrenMap[nodeIdStr].slice() : [];
1777
+ var head = 0;
1778
+ while (head < queue.length) {
1779
+ var current = queue[head];
1780
+ head++;
1781
+ descendants.push(current);
1782
+ var kids = childrenMap[current];
1783
+ if (kids) {
1784
+ for (var j = 0; j < kids.length; j++) {
1785
+ queue.push(kids[j]);
1786
+ }
1787
+ }
1788
+ }
1789
+ if (descendants.length === 0) {
1790
+ continue;
1791
+ }
1792
+ var checkedDescendantCount = 0;
1793
+ for (var j = 0; j < descendants.length; j++) {
1794
+ if (checkedSet[descendants[j]]) {
1795
+ checkedDescendantCount++;
1796
+ }
1797
+ }
1798
+ if (checkedDescendantCount > 0 && checkedDescendantCount < descendants.length &&
1799
+ indeterminateNodes.indexOf(nodeIdStr) === -1) {
1800
+ indeterminateNodes.push(nodeIdStr);
1801
+ }
1802
+ }
1803
+ this.treeObj.filterCheckedNodes = checkedNodes;
1804
+ this.treeObj.filterIndeterminateNodes = indeterminateNodes;
1805
+ };
1685
1806
  /* To render the popup element */
1686
1807
  DropDownTree.prototype.renderPopup = function () {
1687
1808
  var _this = this;
@@ -1982,6 +2103,7 @@ var DropDownTree = /** @class */ (function (_super) {
1982
2103
  this.isFilterRestore = false;
1983
2104
  }
1984
2105
  }
2106
+ this.updateIndeterminateNodes();
1985
2107
  };
1986
2108
  DropDownTree.prototype.restoreFilterSelection = function () {
1987
2109
  if (this.treeObj.checkedNodes) {
@@ -2264,6 +2386,21 @@ var DropDownTree = /** @class */ (function (_super) {
2264
2386
  this.triggerChangeEvent(this.keyEventArgs);
2265
2387
  this.isValueChange = false;
2266
2388
  }
2389
+ if (!this.isRemoteData && !this.treeSettings.loadOnDemand) {
2390
+ var treeData = this.treeObj.getTreeData();
2391
+ if (this.showCheckBox && this.treeSettings.autoCheck &&
2392
+ treeData.length > 0 && this.treeData && this.treeData.length > 0) {
2393
+ for (var i = 0; i < treeData.length; i++) {
2394
+ for (var j = 0; j < this.treeData.length; j++) {
2395
+ if (treeData[i][this.fields.value] === this.treeData[j][this.fields.value]) {
2396
+ this.treeData[j].selected = treeData[i].selected !== undefined ?
2397
+ treeData[i].selected : false;
2398
+ }
2399
+ }
2400
+ }
2401
+ }
2402
+ }
2403
+ this.updateIndeterminateNodes();
2267
2404
  };
2268
2405
  DropDownTree.prototype.beforeCheck = function (args) {
2269
2406
  if (args.isInteracted) {
@@ -2580,9 +2717,35 @@ var DropDownTree = /** @class */ (function (_super) {
2580
2717
  })
2581
2718
  .map(function (childNode) { return childNode.id.toString(); });
2582
2719
  };
2720
+ DropDownTree.prototype.restoreRootParentValues = function () {
2721
+ var _this = this;
2722
+ var treeData = this.getFilteredTreeData();
2723
+ treeData.forEach(function (node) {
2724
+ if (isNOU(node) || isNOU(node.id)) {
2725
+ return;
2726
+ }
2727
+ if (isNOU(node.pid)) {
2728
+ var rootId = node.id.toString();
2729
+ var currentValues_1 = _this.value.map(function (item) {
2730
+ return item.toString();
2731
+ });
2732
+ if (currentValues_1.indexOf(rootId) === -1) {
2733
+ var childValues = [];
2734
+ _this.getChildren(rootId, childValues);
2735
+ var hasSelectedChild = childValues.some(function (childId) { return currentValues_1.indexOf(childId) !== -1; });
2736
+ if (hasSelectedChild) {
2737
+ _this.value.push(rootId);
2738
+ }
2739
+ }
2740
+ }
2741
+ });
2742
+ };
2583
2743
  DropDownTree.prototype.updateFilteredAutoCheckValues = function () {
2584
2744
  var _this = this;
2585
2745
  var treeData = this.getFilteredTreeData();
2746
+ if (!this.isNodeChecked && Array.isArray(this.value) && this.value.length > 0 && this.showCheckBox) {
2747
+ this.restoreRootParentValues();
2748
+ }
2586
2749
  var currentValues = Array.isArray(this.value) ? this.value.map(function (item) { return item.toString(); }) : [];
2587
2750
  var removeParent = function (parentId) {
2588
2751
  _this.value = _this.value.filter(function (value) { return value.toString() !== parentId; });
@@ -2673,26 +2836,44 @@ var DropDownTree = /** @class */ (function (_super) {
2673
2836
  this.value = this.value.filter(function (value) { return removeValues.indexOf(value.toString()) === -1; });
2674
2837
  currentValues = this.value.map(function (item) { return item.toString(); });
2675
2838
  }
2676
- treeData.forEach(function (node) {
2677
- if (isNOU(node) || isNOU(node.id)) {
2678
- return;
2679
- }
2680
- if (!node.haschild) {
2681
- return;
2682
- }
2683
- var parentId = node.id.toString();
2684
- if (currentValues.indexOf(parentId) === -1) {
2685
- return;
2686
- }
2687
- var hasDirectChild = treeData.some(function (childNode) {
2688
- return !isNOU(childNode) && !isNOU(childNode.pid) && !isNOU(childNode.id) && childNode.pid.toString() === parentId &&
2689
- currentValues.indexOf(childNode.id.toString()) !== -1;
2839
+ var stabilized = false;
2840
+ var valueBeforeReconciliation = this.value.slice();
2841
+ var iterationCount = 0;
2842
+ var maxIterations = treeData.length + 1;
2843
+ while (!stabilized && iterationCount < maxIterations) {
2844
+ stabilized = true;
2845
+ iterationCount++;
2846
+ treeData.forEach(function (node) {
2847
+ if (isNOU(node) || isNOU(node.id)) {
2848
+ return;
2849
+ }
2850
+ if (!node.haschild) {
2851
+ return;
2852
+ }
2853
+ var parentId = node.id.toString();
2854
+ var directChildren = _this.getDirectChildren(parentId);
2855
+ if (!directChildren.length) {
2856
+ return;
2857
+ }
2858
+ var allDirectChildrenChecked = directChildren.every(function (childId) { return currentValues.indexOf(childId) !== -1; });
2859
+ if (allDirectChildrenChecked) {
2860
+ if (currentValues.indexOf(parentId) === -1) {
2861
+ _this.value.push(parentId);
2862
+ currentValues = _this.value.map(function (item) { return item.toString(); });
2863
+ stabilized = false;
2864
+ }
2865
+ }
2866
+ else if (currentValues.indexOf(parentId) !== -1) {
2867
+ removeParent(parentId);
2868
+ currentValues = _this.value.map(function (item) { return item.toString(); });
2869
+ stabilized = false;
2870
+ }
2690
2871
  });
2691
- if (!hasDirectChild) {
2692
- removeParent(parentId);
2693
- currentValues = _this.value.map(function (item) { return item.toString(); });
2694
- }
2695
- });
2872
+ }
2873
+ if ((valueBeforeReconciliation.length > 0 && this.value.length === 0) ||
2874
+ iterationCount >= maxIterations) {
2875
+ this.value = valueBeforeReconciliation;
2876
+ }
2696
2877
  };
2697
2878
  DropDownTree.prototype.updateSelectedValues = function () {
2698
2879
  var _this = this;
@@ -2709,7 +2890,8 @@ var DropDownTree = /** @class */ (function (_super) {
2709
2890
  if (!this.isFilteredData) {
2710
2891
  this.selectedData = [];
2711
2892
  }
2712
- if (this.treeSettings.autoCheck && this.isFilteredData && !isNOU(this.value)) {
2893
+ if (!this.isRemoteData && !this.treeSettings.loadOnDemand && this.treeSettings.autoCheck &&
2894
+ this.isFilteredData && !isNOU(this.value)) {
2713
2895
  this.updateFilteredAutoCheckValues();
2714
2896
  }
2715
2897
  if (!isNOU(this.value)) {
@@ -2788,6 +2970,7 @@ var DropDownTree = /** @class */ (function (_super) {
2788
2970
  else {
2789
2971
  this.inputWrapper.setAttribute('aria-label', this.getModuleName());
2790
2972
  }
2973
+ this.updateIndeterminateNodes();
2791
2974
  };
2792
2975
  DropDownTree.prototype.setChipValues = function (text, value) {
2793
2976
  if (!this.inputWrapper.contains(this.chipWrapper)) {
@@ -2094,7 +2094,7 @@ var ListBox = /** @class */ (function (_super) {
2094
2094
  };
2095
2095
  ListBox.prototype.KeyUp = function (e) {
2096
2096
  var _this = this;
2097
- if (this.allowFiltering && e.ctrlKey && e.keyCode === 65) {
2097
+ if (this.allowFiltering && ((e.ctrlKey && e.keyCode === 65) || e.keyCode === 16)) {
2098
2098
  e.preventDefault();
2099
2099
  return;
2100
2100
  }
@@ -2102,7 +2102,7 @@ var ListBox = /** @class */ (function (_super) {
2102
2102
  var isBracketKey = e.keyCode === 219 || e.keyCode === 220 || e.keyCode === 221 || e.keyCode === 222;
2103
2103
  var isNumericKeyPadSpecialKey = e.keyCode === 107 || e.keyCode === 109 || e.keyCode === 111;
2104
2104
  var isWordCharacter = e.key && e.key.match(/\w/);
2105
- var isWordAccentCharacter = e.key && e.key.match(/[A-Za-z0-9\u00C0-\u024F ,>/:;\-+=[\]\\ ']/);
2105
+ var isWordAccentCharacter = e.key && e.key.match(/[A-Za-z0-9\u00C0-\u024F ,>/:;\-+=[\]\\ '@!#$%^&*()]/);
2106
2106
  if (!isNullOrUndefined(isWordCharacter) || !isNullOrUndefined(isWordAccentCharacter)
2107
2107
  || isSpecialKey || isBracketKey || isNumericKeyPadSpecialKey) {
2108
2108
  this.isValidKey = true;
@@ -178,3 +178,7 @@ $list-border: 1px !default;
178
178
  $zero-border: 0 !default;
179
179
  $zero-width: 0% !default;
180
180
  $list-box-tool-tail-radius: $radius-8 !default;
181
+
182
+ .e-listbox-wrapper.e-wrapper li.e-list-item.e-focused {
183
+ background-color: $listbox-item-hover-bg;
184
+ }
@@ -72,6 +72,10 @@
72
72
  /* 5em */
73
73
 
74
74
 
75
+ .e-listbox-wrapper.e-wrapper li.e-list-item.e-focused {
76
+ background-color: var(--color-sf-content-bg-color-hover);
77
+ }
78
+
75
79
  .e-listbox-tool .e-moveup::before {
76
80
  content: "\e776";
77
81
  }
@@ -2114,6 +2114,10 @@ ejs-multiselect {
2114
2114
  color: var(--color-sf-content-text-color-alt1);
2115
2115
  }
2116
2116
 
2117
+ .e-listbox-wrapper.e-wrapper li.e-list-item.e-focused {
2118
+ background-color: var(--color-sf-content-bg-color-hover);
2119
+ }
2120
+
2117
2121
  .e-listbox-tool .e-moveup::before {
2118
2122
  content: "\e776";
2119
2123
  }
@@ -2652,6 +2652,10 @@ ejs-multiselect {
2652
2652
  height: 30px;
2653
2653
  }
2654
2654
 
2655
+ .e-listbox-wrapper.e-wrapper li.e-list-item.e-focused {
2656
+ background-color: var(--color-sf-content-bg-color-hover);
2657
+ }
2658
+
2655
2659
  .e-listbox-tool .e-moveup::before {
2656
2660
  content: "\e776";
2657
2661
  }