@syncfusion/ej2-navigations 26.1.39 → 26.1.41

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 26.1.39
+*  version : 26.1.41
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-navigations@*",
-  "_id": "@syncfusion/ej2-navigations@26.1.38",
+  "_id": "@syncfusion/ej2-navigations@26.1.40",
   "_inBundle": false,
-  "_integrity": "sha512-FkGUMW4JtCpN0UumB+XnLHMmEgBMTWK006RpqhtMnc4BHrZtvwEYbGn0OJcyKcNG/OeoVA2m0x5DkQO8Nk/ofw==",
+  "_integrity": "sha512-bNvzAXiKLPBSAqfAAuSU83QR22+MmChfjd4/Zo68LP5DmXA3C10ktVjZFInWidVM3YCHzZIPjl5yroIp3MEDzQ==",
   "_location": "/@syncfusion/ej2-navigations",
   "_phantomChildren": {},
   "_requested": {
@@ -39,8 +39,8 @@
     "/@syncfusion/ej2-spreadsheet",
     "/@syncfusion/ej2-vue-navigations"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-navigations/-/ej2-navigations-26.1.38.tgz",
-  "_shasum": "2932f699db17f0cbff75e916dbbea215013b3ebe",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-navigations/-/ej2-navigations-26.1.40.tgz",
+  "_shasum": "b8be523a6913f09ca49e23192f9dacec5d434972",
   "_spec": "@syncfusion/ej2-navigations@*",
   "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
   "author": {
@@ -52,11 +52,11 @@
   "bundleDependencies": false,
   "dependencies": {
     "@syncfusion/ej2-base": "~26.1.37",
-    "@syncfusion/ej2-buttons": "~26.1.35",
-    "@syncfusion/ej2-data": "~26.1.35",
-    "@syncfusion/ej2-inputs": "~26.1.39",
+    "@syncfusion/ej2-buttons": "~26.1.40",
+    "@syncfusion/ej2-data": "~26.1.41",
+    "@syncfusion/ej2-inputs": "~26.1.41",
     "@syncfusion/ej2-lists": "~26.1.35",
-    "@syncfusion/ej2-popups": "~26.1.38"
+    "@syncfusion/ej2-popups": "~26.1.41"
   },
   "deprecated": false,
   "description": "A package of Essential JS 2 navigation components such as Tree-view, Tab, Toolbar, Context-menu, and Accordion which is used to navigate from one page to another",
@@ -161,6 +161,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "26.1.39",
+  "version": "26.1.41",
   "sideEffects": false
 }

package/src/common/menu-base.js

@@ -703,7 +703,8 @@ var MenuBase = /** @class */ (function (_super) {
                     else if (isOpen && isNullOrUndefined(ulIndex) && _this.navIdx.length) {
                         _this.closeMenu(null, e);
                     }
-                    else if (isOpen && !_this.isMenu && !ulIndex && _this.navIdx.length === 0 && !_this.isMenusClosed && !_this.isCmenuHover) {
+                    else if (isOpen && !_this.isMenu && !ulIndex && _this.navIdx.length === 0 &&
+                        !_this.isMenusClosed && !_this.isCmenuHover) {
                         _this.isMenusClosed = true;
                         _this.closeMenu(0, e);
                     }

package/src/stepper/stepper.d.ts

@@ -291,6 +291,7 @@ export declare class Stepper extends StepperBase implements INotifyPropertyChang
     private updateAnimation;
     private updateStepType;
     private wireEvents;
+    private unWireEvents;
     private updateStepFocus;
     private updateStepperStatus;
     private updateStatusClass;
@@ -323,10 +324,36 @@ export declare class Stepper extends StepperBase implements INotifyPropertyChang
     private navigationHandler;
     private updateStepInteractions;
     private removeItemElements;
+    /**
+     * Move to next step from current step in Stepper.
+     *
+     * @returns {void}
+     */
     nextStep(): void;
+    /**
+     * Move to previous step from current step in Stepper.
+     *
+     * @returns {void}
+     */
     previousStep(): void;
+    /**
+     * Reset the state of the Stepper and move to the first step.
+     *
+     * @returns {void}
+     */
     reset(): void;
+    /**
+     * Refreshes the position of the progress bar programmatically when the dimensions of the parent container are changed.
+     *
+     * @returns {void}
+     */
+    refreshProgressbar(): void;
     private updateElementClassArray;
+    /**
+     * Destroy the stepper control.
+     *
+     * @returns {void}
+     */
     destroy(): void;
     private wireKeyboardEvent;
     private keyActionHandler;

package/src/stepper/stepper.js

@@ -258,9 +258,19 @@ var Stepper = /** @class */ (function (_super) {
             if (_this.stepperItemList && _this.progressbar && _this.element.classList.contains(HORIZSTEP)) {
                 _this.setProgressPosition(_this.element, true);
             }
+            _this.navigateToStep(_this.activeStep, null, null, false);
         }, this);
         EventHandler.add(window, 'click', function () { _this.updateStepFocus(); }, this);
     };
+    Stepper.prototype.unWireEvents = function () {
+        var _this = this;
+        EventHandler.remove(window, 'resize', function () {
+            if (_this.stepperItemList && _this.progressbar && _this.element.classList.contains(HORIZSTEP)) {
+                _this.setProgressPosition(_this.element, true);
+            }
+        });
+        EventHandler.remove(window, 'click', function () { _this.updateStepFocus(); });
+    };
     Stepper.prototype.updateStepFocus = function () {
         if (this.isKeyNavFocus) {
             this.isKeyNavFocus = false;
@@ -924,16 +934,31 @@ var Stepper = /** @class */ (function (_super) {
         }
         this.stepperItemElements = [];
     };
+    /**
+     * Move to next step from current step in Stepper.
+     *
+     * @returns {void}
+     */
     Stepper.prototype.nextStep = function () {
         if (this.activeStep !== this.steps.length - 1) {
             this.navigateToStep(this.activeStep + 1, null, null, false);
         }
     };
+    /**
+     * Move to previous step from current step in Stepper.
+     *
+     * @returns {void}
+     */
     Stepper.prototype.previousStep = function () {
         if (this.activeStep > 0) {
             this.navigateToStep(this.activeStep - 1, null, null, false);
         }
     };
+    /**
+     * Reset the state of the Stepper and move to the first step.
+     *
+     * @returns {void}
+     */
     Stepper.prototype.reset = function () {
         if (this.activeStep === 0) {
             this.updateStepInteractions();
@@ -943,18 +968,30 @@ var Stepper = /** @class */ (function (_super) {
             this.navigateToStep(isDisabled ? -1 : 0, null, null, false);
         }
     };
+    /**
+     * Refreshes the position of the progress bar programmatically when the dimensions of the parent container are changed.
+     *
+     * @returns {void}
+     */
+    Stepper.prototype.refreshProgressbar = function () {
+        if (this.stepperItemList && this.progressbar) {
+            this.setProgressPosition(this.element);
+        }
+        this.navigateToStep(this.activeStep, null, null, false);
+    };
     Stepper.prototype.updateElementClassArray = function () {
         var classArray = [RTL, READONLY, 'e-steps-focus', LABELAFTER, LABELBEFORE, 'e-label-top',
             'e-label-bottom', 'e-label-start', 'e-label-end', STEPINDICATOR, LABELINDICATOR, VERTICALSTEP, HORIZSTEP, LINEARSTEP];
         removeClass([this.element], classArray);
     };
+    /**
+     * Destroy the stepper control.
+     *
+     * @returns {void}
+     */
     Stepper.prototype.destroy = function () {
-        var _this = this;
         _super.prototype.destroy.call(this);
-        EventHandler.remove(window, 'resize', function () { if (_this.stepperItemList && _this.progressbar) {
-            _this.setProgressPosition(_this.element, true);
-        } });
-        EventHandler.remove(window, 'click', function () { _this.updateStepFocus(); });
+        this.unWireEvents();
         // unwires the events and detach the li elements
         this.removeItemElements();
         this.clearTemplate();

package/src/toolbar/toolbar.d.ts

@@ -253,6 +253,8 @@ export declare class Toolbar extends Component<HTMLElement> implements INotifyPr
     private isVertical;
     private tempId;
     private isExtendedOpen;
+    private clickEvent;
+    private scrollEvent;
     private resizeContext;
     private orientationChangeContext;
     /**

package/src/toolbar/toolbar.js

@@ -295,8 +295,10 @@ var Toolbar = /** @class */ (function (_super) {
         this.unwireKeyboardEvent();
         window.removeEventListener('resize', this.resizeContext);
         window.removeEventListener('orientationchange', this.orientationChangeContext);
-        EventHandler.remove(document, 'scroll', this.docEvent);
-        EventHandler.remove(document, 'click', this.docEvent);
+        document.removeEventListener('scroll', this.clickEvent);
+        document.removeEventListener('click', this.scrollEvent);
+        this.scrollEvent = null;
+        this.clickEvent = null;
     };
     Toolbar.prototype.clearProperty = function () {
         this.tbarEle = [];
@@ -695,6 +697,8 @@ var Toolbar = /** @class */ (function (_super) {
         this.initialize();
         this.renderControl();
         this.wireEvents();
+        this.clickEvent = this.docEvent.bind(this);
+        this.scrollEvent = this.docEvent.bind(this);
         this.renderComplete();
         if (this.isReact && this.portals && this.portals.length > 0) {
             this.renderReactTemplates(function () {
@@ -1080,8 +1084,8 @@ var Toolbar = /** @class */ (function (_super) {
                 popup.offsetX = 0;
             }
             popup.appendTo(ele);
-            EventHandler.add(document, 'scroll', this.docEvent.bind(this));
-            EventHandler.add(document, 'click ', this.docEvent.bind(this));
+            document.addEventListener('scroll', this.clickEvent);
+            document.addEventListener('click', this.scrollEvent);
             if (this.overflowMode !== 'Extended') {
                 popup.element.style.maxHeight = popup.element.offsetHeight + 'px';
             }

package/src/treeview/treeview.d.ts

@@ -546,6 +546,8 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
     private isRightClick;
     private mouseDownStatus;
     private isDropIn;
+    private DDTTreeData;
+    private OldCheckedData;
     /**
      * Indicates whether the TreeView allows drag and drop of nodes. To drag and drop a node in
      * desktop, hold the mouse on the node, drag it to the target node and drop the node by releasing
@@ -1105,6 +1107,7 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
     private selectGivenNodes;
     private clickHandler;
     private nodeCheckedEvent;
+    private updateOldCheckedData;
     private triggerClickEvent;
     private expandNode;
     private expandedNode;

package/src/treeview/treeview.js

@@ -68,7 +68,7 @@ var DISABLE = 'e-disable';
 var DROPCOUNT = 'e-drop-count';
 var CHECK = 'e-check';
 var INDETERMINATE = 'e-stop';
-var CHECKBOXWRAP = 'e-checkbox-wrapper';
+var CHECKBOXWRAP = 'e-treeview-checkbox';
 var CHECKBOXFRAME = 'e-frame';
 var CHECKBOXRIPPLE = 'e-ripple-container';
 var RIPPLE = 'e-ripple';
@@ -219,6 +219,7 @@ var TreeView = /** @class */ (function (_super) {
         _this.isRightClick = false;
         _this.mouseDownStatus = false;
         _this.isDropIn = false;
+        _this.OldCheckedData = [];
         return _this;
     }
     TreeView_1 = TreeView;
@@ -292,6 +293,7 @@ var TreeView = /** @class */ (function (_super) {
         this.expandChildren = [];
         this.index = 0;
         this.setTouchClass();
+        this.DDTTreeData = JSON.parse(JSON.stringify(this.fields.dataSource));
         if (isNOU(this.selectedNodes)) {
             this.setProperties({ selectedNodes: [] }, true);
         }
@@ -670,23 +672,38 @@ var TreeView = /** @class */ (function (_super) {
     TreeView.prototype.updateParentCheckState = function () {
         var indeterminate = selectAll('.' + INDETERMINATE, this.element);
         var childCheckedElement;
+        var data = this.treeData;
+        if (this.element.classList.contains('e-filtering')) {
+            data = this.DDTTreeData;
+        }
         for (var i = 0; i < indeterminate.length; i++) {
             var node = closest(indeterminate[parseInt(i.toString(), 10)], '.' + LISTITEM);
             var nodeId = node.getAttribute('data-uid').toString();
+            var OldCheckedNodes = void 0;
+            if (this.element.classList.contains('e-filtering')) {
+                OldCheckedNodes = new DataManager(this.OldCheckedData).executeLocal(new Query().where('parentID', 'equal', nodeId, true));
+            }
             if (this.dataType === 1) {
-                childCheckedElement = new DataManager(this.treeData).
+                childCheckedElement = new DataManager(data).
                     executeLocal(new Query().where(this.fields.parentID, 'equal', nodeId, true));
             }
             else {
-                childCheckedElement = this.getChildNodes(this.treeData, nodeId);
+                childCheckedElement = this.getChildNodes(data, nodeId);
             }
             var count = 0;
             if (childCheckedElement) {
-                for (var j = 0; j < childCheckedElement.length; j++) {
-                    var childId = childCheckedElement[parseInt(j.toString(), 10)][this.fields.id].toString();
-                    if (this.checkedNodes.indexOf(childId) !== -1) {
+                var _loop_1 = function (j) {
+                    var childId = childCheckedElement[parseInt(j.toString(), 10)][this_1.fields.id].toString();
+                    if (this_1.checkedNodes.indexOf(childId) !== -1) {
+                        count++;
+                    }
+                    else if (this_1.element.classList.contains('e-filtering') && OldCheckedNodes.findIndex(function (e) { return e['id'] === childId; }) !== -1) {
                         count++;
                     }
+                };
+                var this_1 = this;
+                for (var j = 0; j < childCheckedElement.length; j++) {
+                    _loop_1(j);
                 }
                 if (count === childCheckedElement.length) {
                     var nodeCheck = node.getAttribute('data-uid');
@@ -779,6 +796,7 @@ var TreeView = /** @class */ (function (_super) {
     TreeView.prototype.beforeNodeCreate = function (e) {
         if (this.showCheckBox) {
             var checkboxEle = createCheckBox(this.createElement, true, { cssClass: this.touchClass });
+            checkboxEle.classList.add(CHECKBOXWRAP);
             var icon = select('div.' + ICON, e.item);
             var id = e.item.getAttribute('data-uid');
             e.item.childNodes[0].insertBefore(checkboxEle, e.item.childNodes[0].childNodes[isNOU(icon) ? 0 : 1]);
@@ -965,13 +983,28 @@ var TreeView = /** @class */ (function (_super) {
             var indeterminateNodes = selectAll('.' + INDETERMINATE, ulElement);
             var nodes = selectAll('.' + LISTITEM, ulElement);
             var checkBoxEle = element.getElementsByClassName(CHECKBOXWRAP)[0];
-            if (nodes.length === checkedNodes.length) {
+            var count = nodes.length;
+            var checkedCount = checkedNodes.length;
+            var dataUid = element.getAttribute('data-uid');
+            if (this.element.classList.contains('e-filtering')) {
+                var oldCheckedNodes = new DataManager(this.OldCheckedData).executeLocal(new Query().where('parentID', 'equal', dataUid, true));
+                checkedCount = oldCheckedNodes.length;
+                var childItems = [];
+                if (this.dataType === 1) {
+                    childItems = new DataManager(this.DDTTreeData).executeLocal(new Query().where(this.fields.parentID, 'equal', dataUid, true));
+                }
+                else {
+                    childItems = this.getChildNodes(this.DDTTreeData, dataUid);
+                }
+                count = childItems.length;
+            }
+            if (count === checkedCount) {
                 this.changeState(checkBoxEle, 'check', null, true, true);
             }
-            else if (checkedNodes.length > 0 || indeterminateNodes.length > 0) {
+            else if (checkedCount > 0 || indeterminateNodes.length > 0) {
                 this.changeState(checkBoxEle, 'indeterminate', null, true, true);
             }
-            else if (checkedNodes.length === 0) {
+            else if (checkedCount === 0) {
                 this.changeState(checkBoxEle, 'uncheck', null, true, true);
             }
             var parentUL = closest(element, '.' + PARENTITEM);
@@ -1607,6 +1640,25 @@ var TreeView = /** @class */ (function (_super) {
         eventArgs.data = eventArgs.data.splice(0, eventArgs.data.length - 1);
         this.trigger('nodeChecked', eventArgs);
     };
+    TreeView.prototype.updateOldCheckedData = function (data) {
+        var dataManager = new DataManager(data);
+        var childItems = dataManager.executeLocal(new Query().where('isChecked', 'equal', 'true', true));
+        var uncheckedItems = dataManager.executeLocal(new Query().where('isChecked', 'equal', 'false', true));
+        if (uncheckedItems.length > 0) {
+            var index = this.OldCheckedData.findIndex(function (e) { return e['id'] === uncheckedItems[0]['id']; });
+            if (index !== -1) {
+                this.OldCheckedData.splice(index, 1);
+                return;
+            }
+        }
+        if (childItems.length > 0) {
+            var index = this.OldCheckedData.findIndex(function (e) { return e['id'] === childItems[0]['id']; });
+            if (index === -1) {
+                this.OldCheckedData.push(childItems[0]);
+                return;
+            }
+        }
+    };
     TreeView.prototype.triggerClickEvent = function (e, li) {
         var eventArgs = {
             event: e,
@@ -2460,6 +2512,7 @@ var TreeView = /** @class */ (function (_super) {
         this.changeState(checkWrap, isCheck ? 'uncheck' : 'check', e, true);
         if (this.autoCheck) {
             this.ensureChildCheckState(li);
+            this.updateOldCheckedData([this.getNodeData(li)]);
             this.ensureParentCheckState(closest(closest(li, '.' + PARENTITEM), '.' + LISTITEM));
             var doCheck = void 0;
             if (eventArgs.action === 'check') {
@@ -4835,6 +4888,9 @@ var TreeView = /** @class */ (function (_super) {
                     this.initialRender = true;
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     if (!this.isReact || this.isReact && !(this.fields.dataSource instanceof DataManager)) {
+                        if (!this.element.classList.contains('e-filtering')) {
+                            this.DDTTreeData = JSON.parse(JSON.stringify(this.fields.dataSource));
+                        }
                         this.reRenderNodes();
                     }
                     this.initialRender = false;