@syncfusion/ej2-navigations 34.2.2 → 34.2.3

package/dist/es6/ej2-navigations.es5.js

@@ -1506,8 +1506,10 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
         if (!active) {
             return;
         }
+        var isInputElement = active.tagName === 'INPUT' || active.tagName === 'TEXTAREA' ||
+            active.contentEditable === 'true';
         var expanded = active.getAttribute('aria-expanded') === 'true';
-        if (!expanded) {
+        if (!expanded || isInputElement) {
             return;
         }
         var ul = this.element;
@@ -1621,13 +1623,19 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
         var cli = cul.children[fliIdx];
         fliIdx = this.isValidLI(cli, fliIdx, e.action);
         cul.children[fliIdx].classList.add(FOCUSED);
-        cul.children[fliIdx].focus();
+        var liToFocus = cul.children[fliIdx];
         if (closest(this.element, '.e-popup')) {
-            var focusedLiItem = cul.children[fliIdx];
-            var focusableChild = focusedLiItem.querySelector('[tabindex], span[tabindex], a, button, [tabindex]:not([tabindex="-1"])');
-            if (!focusableChild) {
-                cul.focus();
+            var focusableChild = liToFocus.querySelector('[tabindex], span[tabindex], a, button, [tabindex]:not([tabindex="-1"])');
+            var isSpreadsheet = this.element.id.includes('_cf_menu') && this.element.parentElement.classList.contains('e-cf-menu');
+            if (focusableChild && !isSpreadsheet) {
+                focusableChild.focus();
             }
+            else {
+                liToFocus.focus();
+            }
+        }
+        else {
+            liToFocus.focus();
         }
     };
     MenuBase.prototype.isValidLI = function (cli, index, action) {
@@ -12495,7 +12503,9 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
                     this.virtualIndeterminateNodesSet.delete(id);
                     this.virtualCheckedNodesSet.delete(id);
                     this.virtualFlatNodes[parseInt(actualIndex.toString(), 10)].isChecked = false;
-                    this.treeData[parseInt(id.toString(), 10) - 1].isChecked = false;
+                    if (this.treeData && this.fields && this.fields.isChecked) {
+                        setValue(this.fields.isChecked, false, this.treeData[parseInt(id.toString(), 10) - 1]);
+                    }
                     if (this.autoCheck && this.virtualFlatNodes[parseInt(actualIndex.toString(), 10)].hasChildren) {
                         this.setVirtualChildCheckState(id, false);
                     }
@@ -13444,6 +13454,13 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         if (!isNullOrUndefined(id) && this.selectedNodes.indexOf(id) === -1) {
             this.selectedNodes.push(id);
         }
+        if (this.enableVirtualization && !isNullOrUndefined(this.height)) {
+            this.virtualSelectedNodesSet.add(id);
+            var actualIndex = this.virtualNodeMap.get(id);
+            if (actualIndex && actualIndex > -1) {
+                this.virtualFlatNodes[parseInt(actualIndex.toString(), 10)].selected = true;
+            }
+        }
     };
     TreeView.prototype.removeSelect = function (liEle) {
         if (this.allowMultiSelection) {
@@ -13457,6 +13474,14 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         if (index > -1) {
             this.selectedNodes.splice(index, 1);
         }
+        if (this.enableVirtualization && !isNullOrUndefined(this.height)) {
+            var id = liEle.getAttribute('data-uid');
+            this.virtualSelectedNodesSet.delete(id);
+            var actualIndex = this.virtualNodeMap.get(id);
+            if (actualIndex && actualIndex > -1) {
+                this.virtualFlatNodes[parseInt(actualIndex.toString(), 10)].selected = false;
+            }
+        }
     };
     TreeView.prototype.removeSelectAll = function () {
         var selectedLI = this.element.querySelectorAll('.' + ACTIVE);
@@ -13471,6 +13496,15 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         }
         removeClass(selectedLI, ACTIVE);
         this.setProperties({ selectedNodes: [] }, true);
+        if (this.enableVirtualization && !isNullOrUndefined(this.height)) {
+            this.virtualSelectedNodesSet.clear();
+            for (var i = 0; i < this.virtualFlatNodes.length; i++) {
+                var node = this.virtualFlatNodes[parseInt(i.toString(), 10)];
+                if (node.selected) {
+                    node.selected = false;
+                }
+            }
+        }
     };
     TreeView.prototype.getSelectEvent = function (currLi, action, e) {
         var nodeData = this.getNodeData(currLi);
@@ -16453,6 +16487,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         var imageUrlFieldName = this.fields.imageUrl;
         var idFieldName = this.fields.id;
         var textFieldName = this.fields.text;
+        var selectedFieldName = this.fields.selected;
         var needsSorting = this.sortOrder !== 'None';
         var isDataTypeFlat = this.dataType === 1;
         var enableVirtualization = this.enableVirtualization;
@@ -16463,7 +16498,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
             // Use expandedNodes as the single source of truth.
             var inExpandedNodes = this.virtualExpandedNodesSet.has(id);
             var rawExpanded = !inExpandedNodes && getValue(expandedFieldName, raw) === true;
-            var isExpanded = inExpandedNodes || rawExpanded;
+            var expanded = inExpandedNodes || rawExpanded;
             if (rawExpanded && id) {
                 this.expandedNodes.push(id);
                 this.virtualExpandedNodesSet.add(id);
@@ -16490,24 +16525,32 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
                     }
                 }
             }
+            if (this.initialRender && enableVirtualization && id && selectedFieldName && !this.virtualSelectedNodesSet.has(id)) {
+                var rawSelected = getValue(selectedFieldName, raw);
+                if (!isNullOrUndefined(rawSelected) && rawSelected.toString() === 'true') {
+                    this.virtualSelectedNodesSet.add(id);
+                    if (this.selectedNodes && this.selectedNodes.indexOf(id) === -1) {
+                        this.selectedNodes.push(id);
+                    }
+                }
+            }
             // Use cached Sets for O(1) lookup
-            var isSelected = this.virtualSelectedNodesSet.has(id);
+            var selected = this.virtualSelectedNodesSet.has(id);
             // Resolve checkbox state: indeterminate takes precedence over the checked set,
             // because a node can be in the indeterminate state without being in checkedNodes.
             var isChecked = (enableVirtualization && this.virtualIndeterminateNodesSet.has(id))
                 ? 'indeterminate'
                 : this.virtualCheckedNodesSet.has(id);
-            var isDisabled = false; // TODO: Check if any per-node disabled field exists
             var iconCssVal = raw[iconCssFieldName];
             var iconCss = isNullOrUndefined(iconCssVal) ? '' : iconCssVal.toString();
             var imageUrlVal = raw[imageUrlFieldName];
             var imageUrl = isNullOrUndefined(imageUrlVal) ? '' : imageUrlVal.toString();
             var node = {
-                id: id, text: text, level: level, parentId: parentId, hasChildren: hasChildren, isExpanded: isExpanded,
-                isSelected: isSelected, isChecked: isChecked, isDisabled: isDisabled, iconCss: iconCss, imageUrl: imageUrl, rawData: raw
+                id: id, text: text, level: level, parentId: parentId, hasChildren: hasChildren, expanded: expanded,
+                selected: selected, isChecked: isChecked, iconCss: iconCss, imageUrl: imageUrl
             };
             result.push(node);
-            if (isExpanded && hasChildren) {
+            if (expanded && hasChildren) {
                 // Determine children list
                 var children = [];
                 if (isDataTypeFlat) {
@@ -16717,7 +16760,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
             targetUl.appendChild(li);
             liListBuf.push(li);
             // Register this node so its children in the same window can nest under it
-            if (node.isExpanded && node.hasChildren) {
+            if (node.expanded && node.hasChildren) {
                 renderedParentMap.set(node.id, { li: li, childUl: null });
             }
         }
@@ -16812,7 +16855,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         // Expand/collapse icon
         if (node.hasChildren) {
             var iconSpan = this.createElement('div', {
-                className: ICON + ' ' + (node.isExpanded ? COLLAPSIBLE : EXPANDABLE)
+                className: ICON + ' ' + (node.expanded ? COLLAPSIBLE : EXPANDABLE)
             });
             textWrap.appendChild(iconSpan);
         }
@@ -16851,8 +16894,16 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         });
         textWrap.appendChild(anchor);
         li.appendChild(textWrap);
+        // nodeTemplate
+        if (!isNullOrUndefined(this.nodeTemplateFn)) {
+            var rawData = this.findNodeInTreeData(node.id);
+            if (!isNullOrUndefined(rawData)) {
+                anchor.innerHTML = '';
+                this.renderNodeTemplate(rawData, anchor, node.id);
+            }
+        }
         // State classes
-        if (node.isExpanded) {
+        if (node.expanded) {
             li.classList.add(EXPANDED);
             li.setAttribute('aria-expanded', 'true');
         }
@@ -16860,14 +16911,10 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
             li.classList.add(NODECOLLAPSED);
             li.setAttribute('aria-expanded', 'false');
         }
-        if (node.isSelected) {
+        if (node.selected) {
             li.classList.add(ACTIVE);
             li.setAttribute('aria-selected', 'true');
         }
-        if (node.isDisabled) {
-            li.classList.add(DISABLED$1);
-            li.setAttribute('aria-disabled', 'true');
-        }
         if (node.hasChildren) {
             li.classList.add(CHILD);
         }
@@ -17170,6 +17217,44 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         this.virtualEndIndex = win.endIndex;
         this.renderVirtualItems();
     };
+    /**
+     * Recursively walks the treeData (and any nested `childFieldName` arrays) to
+     * find the node whose `idFieldName` matches the given `id` (compared as
+     * strings).  Used by the virtual-mode expand/collapse handlers so they can
+     * locate nodes at any depth — not just the root level — before writing the
+     * `expanded` flag back to the datasource.
+     *
+     * @param {string} id - The id (as a string) of the node to locate.
+     * @returns {Object | null} The matching raw datasource node, or null if not found.
+     * @private
+     */
+    TreeView.prototype.findNodeInTreeData = function (id) {
+        if (!this.treeData) {
+            return null;
+        }
+        var idFieldName = this.fields.id.toString();
+        var childFieldName = this.fields.child.toString();
+        var findRecursive = function (nodes) {
+            if (!nodes || nodes.length === 0) {
+                return null;
+            }
+            for (var i = 0; i < nodes.length; i++) {
+                var node = nodes[i];
+                if (node[idFieldName] && node[idFieldName].toString() === id) {
+                    return node;
+                }
+                var children = getValue(childFieldName, node);
+                if (children && Array.isArray(children)) {
+                    var found = findRecursive(children);
+                    if (found) {
+                        return found;
+                    }
+                }
+            }
+            return null;
+        };
+        return findRecursive(this.treeData);
+    };
     TreeView.prototype.handleVirtualExpand = function (id, isKeyboardNav) {
         // ── Cancel any pending scroll RAF ─────────────────────────────────────────
         // A scroll RAF queued before the expand click would run asynchronously after
@@ -17187,9 +17272,11 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         if (this.virtualExpandedNodesSet) {
             this.virtualExpandedNodesSet.add(id);
         }
-        if (this.rootData) {
-            var acutalRootData = this.rootData.find(function (item) { return item.id === parseInt(id, 10); });
-            acutalRootData.isExpanded = true;
+        if (this.treeData) {
+            var acutalRootData = this.findNodeInTreeData(id);
+            if (acutalRootData && this.fields && this.fields.expanded) {
+                setValue(this.fields.expanded, true, acutalRootData);
+            }
         }
         // ── Fix: Pin focused ID to the expanding node for keyboard navigation ──
         // When keyboard-triggered, the expanded node IS definitively the focused node
@@ -17268,9 +17355,11 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         if (this.virtualExpandedNodesSet) {
             this.virtualExpandedNodesSet.delete(id);
         }
-        if (this.rootData) {
-            var acutalRootData = this.rootData.find(function (item) { return item.id === parseInt(id, 10); });
-            acutalRootData.isExpanded = false;
+        if (this.treeData) {
+            var acutalRootData = this.findNodeInTreeData(id);
+            if (acutalRootData && this.fields && this.fields.expanded) {
+                setValue(this.fields.expanded, false, acutalRootData);
+            }
         }
         // ── Fix: Pin focused ID to the collapsing node for keyboard navigation ──
         // Same reasoning as handleVirtualExpand: when keyboard-triggered, `id` is
@@ -17324,14 +17413,14 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
      * Updates the selected state of a node in `virtualFlatNodes` and re-renders the window.
      *
      * @param {string} id - The `data-uid` of the target node.
-     * @param {boolean} isSelected - Whether the node is now selected.
+     * @param {boolean} selected - Whether the node is now selected.
      * @returns {void}
      * @private
      */
-    TreeView.prototype.updateVirtualNodeSelection = function (id, isSelected) {
+    TreeView.prototype.updateVirtualNodeSelection = function (id, selected) {
         var idx = this.virtualNodeMap.get(id);
         if (!isNullOrUndefined(idx)) {
-            this.virtualFlatNodes[parseInt(idx.toString(), 10)].isSelected = isSelected;
+            this.virtualFlatNodes[parseInt(idx.toString(), 10)].selected = selected;
             this.renderVirtualItems();
         }
     };
@@ -17699,7 +17788,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
                 }
                 for (var i = 0; i < nodes.length; i++) {
                     var node = nodes[parseInt(i.toString(), 10)];
-                    node['isExpanded'] = false;
+                    node['expanded'] = false;
                     var children = getValue(_this.fields.child.toString(), node);
                     if (children && Array.isArray(children)) {
                         setAllCollapsed_1(children);
@@ -17799,7 +17888,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
                     var nodeId = getValue(idFieldName_1, node);
                     if (node.hasChild) {
                         allParentIds_1.push(nodeId);
-                        node.isExpanded = true;
+                        node.expanded = true;
                     }
                 }
             };