@syncfusion/ej2-navigations 34.2.4 → 34.2.6

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

@@ -3819,6 +3819,7 @@ let Toolbar = class Toolbar extends Component {
         super(options, element);
         this.resizeContext = this.resize.bind(this);
         this.orientationChangeContext = this.orientationChange.bind(this);
+        this.lastObservedWidth = 0;
         /**
          * Contains the keyboard configuration of the Toolbar.
          */
@@ -3850,6 +3851,10 @@ let Toolbar = class Toolbar extends Component {
             }
         });
         this.unwireEvents();
+        this.lastObservedWidth = 0;
+        if (this.resizeObserver && this.element.closest('.e-splitter')) {
+            this.resizeObserver.disconnect();
+        }
         this.tempId.forEach((ele) => {
             if (!isNullOrUndefined(this.element.querySelector(ele))) {
                 document.body.appendChild(this.element.querySelector(ele)).style.display = 'none';
@@ -4428,6 +4433,17 @@ let Toolbar = class Toolbar extends Component {
         this.scrollEvent = this.docEvent.bind(this);
         this.renderControl();
         this.wireEvents();
+        if (this.element.closest('.e-splitter')) {
+            this.lastObservedWidth = this.element.offsetWidth;
+            this.resizeObserver = new window.ResizeObserver(() => {
+                if (this.element.offsetWidth === this.lastObservedWidth) {
+                    return;
+                }
+                this.lastObservedWidth = this.element.offsetWidth;
+                this.refreshOverflow();
+            });
+            this.resizeObserver.observe(this.element);
+        }
         this.renderComplete();
         if (this.isReact && this.portals && this.portals.length > 0) {
             this.renderReactTemplates(() => {
@@ -10718,6 +10734,8 @@ let TreeView = TreeView_1 = class TreeView extends Component {
         this.virtualTreeDirty = false;
         this.virtualFocusedId = null;
         this.virtualSkipNextScrollRender = false;
+        this.filterCheckedNodes = [];
+        this.filterIndeterminateNodes = [];
     }
     /**
      * Get component name.
@@ -11012,6 +11030,11 @@ let TreeView = TreeView_1 = class TreeView extends Component {
             return false;
         }
     }
+    isRemoteDataLoadOnDemand() {
+        const remoteDataSource = (this.fields.dataSource instanceof DataManager) ||
+            (this.fields.child && this.fields.child.dataSource instanceof DataManager ? true : false);
+        return !remoteDataSource && !this.loadOnDemand;
+    }
     renderItems(isSorted) {
         if (this.enableVirtualization && !isNullOrUndefined(this.height)) {
             this.ulElement = this.createElement('ul', {
@@ -11200,7 +11223,9 @@ let TreeView = TreeView_1 = class TreeView extends Component {
                     if (this.checkedNodes.indexOf(childId) !== -1) {
                         count++;
                     }
-                    else if (this.element.classList.contains('e-filtering') && OldCheckedNodes.findIndex((e) => e['id'] === childId) !== -1) {
+                    else if (this.element.classList.contains('e-filtering') && (this.isRemoteDataLoadOnDemand() ?
+                        this.filterCheckedNodes.findIndex((id) => id === childId) !== -1 :
+                        OldCheckedNodes.findIndex((e) => e['id'] === childId) !== -1)) {
                         count++;
                     }
                 }
@@ -11513,6 +11538,23 @@ let TreeView = TreeView_1 = class TreeView extends Component {
                 }
             });
             let parentNodeChecked = false;
+            if (this.isRemoteDataLoadOnDemand() && this.element.classList.contains('e-filtering') && this.autoCheck) {
+                if (this.filterCheckedNodes.indexOf(dataUid) !== -1) {
+                    this.changeState(checkBoxEle, 'check', null, true, true);
+                }
+                else if (this.filterIndeterminateNodes.indexOf(dataUid) !== -1) {
+                    this.changeState(checkBoxEle, 'indeterminate', null, true, true);
+                }
+                else {
+                    this.changeState(checkBoxEle, 'uncheck', null, true, true);
+                }
+                const parentUL = closest(element, '.' + PARENTITEM);
+                if (!isNullOrUndefined(parentUL)) {
+                    const currentParent = closest(parentUL, '.' + LISTITEM);
+                    this.ensureParentCheckState(currentParent);
+                }
+                return;
+            }
             if (this.element.classList.contains('e-filtering')) {
                 const oldCheckedNodes = new DataManager(this.OldCheckedData).executeLocal(new Query().where('parentID', 'equal', dataUid, true));
                 checkedCount = oldCheckedNodes.length;
@@ -11618,7 +11660,7 @@ let TreeView = TreeView_1 = class TreeView extends Component {
             }
         });
     }
-    getAllChildNodes(data, parentId) {
+    getAllChildNodes(data, parentId, includeAllDescendants) {
         if (isNullOrUndefined(data) || isNullOrUndefined(parentId)) {
             return [];
         }
@@ -11637,15 +11679,53 @@ let TreeView = TreeView_1 = class TreeView extends Component {
             const parentFieldId = this.fields.id;
             const childField = this.fields.child.toString();
             const target = parentId.toString();
-            const node = data.find((n) => {
-                const idVal = getValue(parentFieldId, n);
-                return !isNullOrUndefined(idVal) && idVal.toString() === target;
-            });
+            const findNodeInTree = (nodes, id) => {
+                if (!Array.isArray(nodes)) {
+                    return undefined;
+                }
+                for (let i = 0; i < nodes.length; i++) {
+                    const n = nodes[parseInt(i.toString(), 10)];
+                    const idVal = getValue(parentFieldId, n);
+                    if (!isNullOrUndefined(idVal) && idVal.toString() === id) {
+                        return n;
+                    }
+                    const subs = getValue(childField, n);
+                    const found = findNodeInTree(subs, id);
+                    if (found) {
+                        return found;
+                    }
+                }
+                return undefined;
+            };
+            const node = findNodeInTree(data, target);
             if (!node) {
                 return [];
             }
             const children = getValue(childField, node);
-            return Array.isArray(children) ? children : [];
+            if (!Array.isArray(children)) {
+                return [];
+            }
+            if (!includeAllDescendants) {
+                return children;
+            }
+            const result = children.slice();
+            const collectNested = (nodes) => {
+                if (!Array.isArray(nodes)) {
+                    return;
+                }
+                for (let i = 0; i < nodes.length; i++) {
+                    const n = nodes[parseInt(i.toString(), 10)];
+                    const grandChildren = getValue(childField, n);
+                    if (Array.isArray(grandChildren) && grandChildren.length) {
+                        for (let j = 0; j < grandChildren.length; j++) {
+                            result.push(grandChildren[parseInt(j.toString(), 10)]);
+                        }
+                        collectNested(grandChildren);
+                    }
+                }
+            };
+            collectNested(children);
+            return result;
         }
         return [];
     }
@@ -13367,6 +13447,83 @@ let TreeView = TreeView_1 = class TreeView extends Component {
                 }
             }
         }
+        if (this.isRemoteDataLoadOnDemand() && this.element.classList.contains('e-filtering') && this.autoCheck) {
+            const nodeUid = li.getAttribute('data-uid');
+            if (isNullOrUndefined(nodeUid)) {
+                return;
+            }
+            const checkedIndex = this.filterCheckedNodes.indexOf(nodeUid);
+            const indeterminateIndex = this.filterIndeterminateNodes.indexOf(nodeUid);
+            const shouldCheck = !isCheck;
+            if (shouldCheck) {
+                if (checkedIndex === -1) {
+                    this.filterCheckedNodes.push(nodeUid);
+                }
+                if (indeterminateIndex !== -1) {
+                    this.filterIndeterminateNodes.splice(indeterminateIndex, 1);
+                }
+            }
+            else {
+                if (checkedIndex !== -1) {
+                    this.filterCheckedNodes.splice(checkedIndex, 1);
+                }
+            }
+            let parentLi = closest(closest(li, '.' + PARENTITEM), '.' + LISTITEM);
+            while (!isNullOrUndefined(parentLi)) {
+                const parentUid = parentLi.getAttribute('data-uid');
+                if (!isNullOrUndefined(parentUid)) {
+                    const parentChildren = this.getAllChildNodes(this.DDTTreeData, parentUid, true);
+                    if (parentChildren && parentChildren.length > 0) {
+                        let firstChildState;
+                        let mismatchFound = false;
+                        for (let i = 0; i < parentChildren.length; i++) {
+                            const childData = parentChildren[parseInt(i.toString(), 10)];
+                            const childId = childData && childData[this.fields.id]
+                                ? childData[this.fields.id].toString()
+                                : null;
+                            if (isNullOrUndefined(childId)) {
+                                continue;
+                            }
+                            const childCheckedState = this.filterIndeterminateNodes.indexOf(childId) !== -1
+                                ? null
+                                : this.filterCheckedNodes.indexOf(childId) !== -1;
+                            if (firstChildState === void 0) {
+                                firstChildState = childCheckedState;
+                            }
+                            else if (childCheckedState !== firstChildState) {
+                                mismatchFound = true;
+                                break;
+                            }
+                        }
+                        if (mismatchFound || firstChildState === null) {
+                            if (this.filterIndeterminateNodes.indexOf(parentUid) === -1) {
+                                this.filterIndeterminateNodes.push(parentUid);
+                            }
+                            const parentCheckedIndex = this.filterCheckedNodes.indexOf(parentUid);
+                            if (parentCheckedIndex !== -1) {
+                                this.filterCheckedNodes.splice(parentCheckedIndex, 1);
+                            }
+                        }
+                        else {
+                            const parentIndeterminateIndex = this.filterIndeterminateNodes.indexOf(parentUid);
+                            if (parentIndeterminateIndex !== -1) {
+                                this.filterIndeterminateNodes.splice(parentIndeterminateIndex, 1);
+                            }
+                            const parentCheckedIndex = this.filterCheckedNodes.indexOf(parentUid);
+                            if (firstChildState === true) {
+                                if (parentCheckedIndex === -1) {
+                                    this.filterCheckedNodes.push(parentUid);
+                                }
+                            }
+                            else if (parentCheckedIndex !== -1) {
+                                this.filterCheckedNodes.splice(parentCheckedIndex, 1);
+                            }
+                        }
+                    }
+                }
+                parentLi = closest(closest(parentLi, '.' + PARENTITEM), '.' + LISTITEM);
+            }
+        }
         this.changeState(checkWrap, isCheck ? 'uncheck' : 'check', e, true);
         this.updateActiveClass(li, isCheck);
         if (this.autoCheck) {