@syncfusion/ej2-navigations 34.2.6 → 34.2.8

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 34.2.6
+*  version : 34.2.8
 *  Copyright Syncfusion Inc. 2001 - 2025. 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,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-navigations",
-  "version": "34.2.6",
+  "version": "34.2.8",
   "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",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -8,13 +8,13 @@
   "module": "./index.js",
   "es2015": "./dist/es6/ej2-navigations.es5.js",
   "dependencies": {
-    "@syncfusion/ej2-base": "~34.2.6",
-    "@syncfusion/ej2-buttons": "~34.2.6",
-    "@syncfusion/ej2-data": "~34.2.6",
-    "@syncfusion/ej2-inputs": "~34.2.6",
-    "@syncfusion/ej2-lists": "~34.2.6",
-    "@syncfusion/ej2-notifications": "~34.2.6",
-    "@syncfusion/ej2-popups": "~34.2.6"
+    "@syncfusion/ej2-base": "~34.2.8",
+    "@syncfusion/ej2-buttons": "~34.2.8",
+    "@syncfusion/ej2-data": "~34.2.8",
+    "@syncfusion/ej2-inputs": "~34.2.8",
+    "@syncfusion/ej2-lists": "~34.2.8",
+    "@syncfusion/ej2-notifications": "~34.2.8",
+    "@syncfusion/ej2-popups": "~34.2.8"
   },
   "devDependencies": {},
   "keywords": [

package/src/accordion/accordion.js

@@ -1307,6 +1307,9 @@ var Accordion = /** @class */ (function (_super) {
                                 var newVal = Object(newProp.items[parseInt(index.toString(), 10)])["" + property[parseInt(k.toString(), 10)]];
                                 var temp = property[parseInt(k.toString(), 10)];
                                 var content = select('.' + CLS_CTENT, item);
+                                if (temp === 'expanded' && !newVal && !isNOU(item) && item.classList.contains(CLS_ACTIVE)) {
+                                    this.expandItem(false, index);
+                                }
                                 if (temp === 'header' || temp === 'iconCss' || temp === 'expanded' || ((temp === 'content') && (oldVal === ''))) {
                                     this.updateItem(item, index);
                                 }

package/src/common/menu-base.js

@@ -1121,6 +1121,14 @@ var MenuBase = /** @class */ (function (_super) {
         var menuType = type;
         var observedElement;
         this.trigger('beforeOpen', eventArgs, function (observedOpenArgs) {
+            var wrapper = _this.getWrapper();
+            if (_this.isAngular && wrapper && _this.element.classList.contains('e-contextmenu')) {
+                var cdkPane = document.querySelector('.cdk-overlay-pane');
+                var popoverEl = document.querySelector('[popover]');
+                if (cdkPane && popoverEl) {
+                    cdkPane.appendChild(wrapper);
+                }
+            }
             switch (menuType) {
                 case 'menu':
                     if (!_this.hamburgerMode) {

package/src/sidebar/sidebar-model.d.ts

@@ -10,7 +10,7 @@ export interface SidebarModel extends ComponentModel{
     /**
      * Specifies the size of the Sidebar in dock state.
      * > For more details about dockSize refer to
-     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar/) documentation.
+     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar) documentation.
      *
      * @default 'auto'
      */
@@ -24,7 +24,7 @@ export interface SidebarModel extends ComponentModel{
      *   });
      * ```
      * > For more details about mediaQuery refer to
-     * [`Auto Close`](https://ej2.syncfusion.com/documentation/sidebar/auto-close/) documentation.
+     * [`Auto Close`](https://ej2.syncfusion.com/documentation/sidebar/auto-close) documentation.
      *
      * @default null
      * @aspType string
@@ -34,7 +34,7 @@ export interface SidebarModel extends ComponentModel{
     /**
      * Specifies the docking state of the component.
      * > For more details about enableDock refer to
-     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar/) documentation.
+     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar) documentation.
      *
      * @default false
      */
@@ -105,8 +105,6 @@ export interface SidebarModel extends ComponentModel{
 
     /**
      * Specifies the position of the Sidebar (Left/Right) corresponding to the main content.
-     * > For more details about SidebarPosition refer to
-     * [`position`](https://ej2.syncfusion.com/documentation/sidebar/getting-started/#position) documentation.
      *
      * @default 'Left'
      */
@@ -115,7 +113,7 @@ export interface SidebarModel extends ComponentModel{
     /**
      * Allows to place the sidebar inside the target element.
      * > For more details about target refer to
-     * [`Custom Context`](https://ej2.syncfusion.com/documentation/sidebar/custom-context/) documentation.
+     * [`Custom Context`](https://ej2.syncfusion.com/documentation/sidebar/custom-context) documentation.
      *
      * @default null
      */
@@ -123,8 +121,6 @@ export interface SidebarModel extends ComponentModel{
 
     /**
      * Specifies the whether to apply overlay options to main content when the Sidebar is in an open state.
-     * > For more details about showBackdrop refer to
-     * [`Backdrop`](https://ej2.syncfusion.com/documentation/sidebar/getting-started/#enable-backdrop) documentation.
      *
      * @default false
      */
@@ -138,7 +134,7 @@ export interface SidebarModel extends ComponentModel{
      * The main content area will not be adjusted within the screen width.
      * * `Auto` - Sidebar with `Over` type in mobile resolution and `Push` type in other higher resolutions.
      * > For more details about SidebarType refer to
-     * [`SidebarType`](../../sidebar/variations/) documentation.
+     * [`SidebarType`](../../sidebar/variations) documentation.
      *
      * @default 'Auto'
      */

package/src/sidebar/sidebar.d.ts

@@ -48,7 +48,7 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
     /**
      * Specifies the size of the Sidebar in dock state.
      * > For more details about dockSize refer to
-     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar/) documentation.
+     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar) documentation.
      *
      * @default 'auto'
      */
@@ -61,7 +61,7 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
      *   });
      * ```
      * > For more details about mediaQuery refer to
-     * [`Auto Close`](https://ej2.syncfusion.com/documentation/sidebar/auto-close/) documentation.
+     * [`Auto Close`](https://ej2.syncfusion.com/documentation/sidebar/auto-close) documentation.
      *
      * @default null
      * @aspType string
@@ -70,7 +70,7 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
     /**
      * Specifies the docking state of the component.
      * > For more details about enableDock refer to
-     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar/) documentation.
+     * [`Dock`](https://ej2.syncfusion.com/documentation/sidebar/docking-sidebar) documentation.
      *
      * @default false
      */
@@ -132,8 +132,6 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
     closeOnDocumentClick: boolean;
     /**
      * Specifies the position of the Sidebar (Left/Right) corresponding to the main content.
-     * > For more details about SidebarPosition refer to
-     * [`position`](https://ej2.syncfusion.com/documentation/sidebar/getting-started/#position) documentation.
      *
      * @default 'Left'
      */
@@ -141,15 +139,13 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
     /**
      * Allows to place the sidebar inside the target element.
      * > For more details about target refer to
-     * [`Custom Context`](https://ej2.syncfusion.com/documentation/sidebar/custom-context/) documentation.
+     * [`Custom Context`](https://ej2.syncfusion.com/documentation/sidebar/custom-context) documentation.
      *
      * @default null
      */
     target: HTMLElement | string;
     /**
      * Specifies the whether to apply overlay options to main content when the Sidebar is in an open state.
-     * > For more details about showBackdrop refer to
-     * [`Backdrop`](https://ej2.syncfusion.com/documentation/sidebar/getting-started/#enable-backdrop) documentation.
      *
      * @default false
      */
@@ -162,7 +158,7 @@ export declare class Sidebar extends Component<HTMLElement> implements INotifyPr
      * The main content area will not be adjusted within the screen width.
      * * `Auto` - Sidebar with `Over` type in mobile resolution and `Push` type in other higher resolutions.
      * > For more details about SidebarType refer to
-     * [`SidebarType`](../../sidebar/variations/) documentation.
+     * [`SidebarType`](../../sidebar/variations) documentation.
      *
      * @default 'Auto'
      */

package/src/tab/tab.d.ts

@@ -559,6 +559,7 @@ export declare class Tab extends Component<HTMLElement> implements INotifyProper
     protected render(): void;
     private renderContainer;
     private renderHeader;
+    private setTablistRole;
     private updatePopupIconAriaLabel;
     private createContentElement;
     private renderContent;

package/src/tab/tab.js

@@ -444,7 +444,6 @@ var Tab = /** @class */ (function (_super) {
         this.tbObj.isStringTemplate = true;
         this.tbObj.createElement = this.createElement;
         this.tbObj.appendTo(this.hdrEle);
-        attributes(this.hdrEle, { role: 'tablist' });
         if (!isNOU(this.element.getAttribute('aria-label'))) {
             this.hdrEle.setAttribute('aria-label', this.element.getAttribute('aria-label'));
             this.element.removeAttribute('aria-label');
@@ -453,6 +452,16 @@ var Tab = /** @class */ (function (_super) {
             this.hdrEle.setAttribute('aria-labelledby', this.element.getAttribute('aria-labelledby'));
             this.element.removeAttribute('aria-labelledby');
         }
+        var scrollContent = this.tbObj.element.querySelector('.' + (this.isVertical() ? CLS_VSCRCNT : CLS_HSCRCNT));
+        var popupContainer = select('.' + CLS_TB_POP, this.tbObj.element);
+        var isScrollableMode = this.overflowMode === 'Scrollable' || this.overflowMode === 'MultiRow';
+        var isPopupMode = this.overflowMode === 'Popup' || this.overflowMode === 'Extended';
+        if (isScrollableMode) {
+            this.setTablistRole(scrollContent);
+        }
+        else if (isPopupMode) {
+            this.setTablistRole(popupContainer);
+        }
         this.updatePopupIconAriaLabel();
         this.setCloseButton(this.showCloseButton);
         var toolbarHeader = this.tbObj.element.querySelector('.' + CLS_TB_ITEMS);
@@ -460,6 +469,14 @@ var Tab = /** @class */ (function (_super) {
             if (isNOU(toolbarHeader.id) || toolbarHeader.id === '') {
                 toolbarHeader.id = this.element.id + '_' + 'tab_header_items';
             }
+            if (isPopupMode || (isScrollableMode && isNOU(scrollContent))) {
+                this.setTablistRole(toolbarHeader);
+            }
+        }
+    };
+    Tab.prototype.setTablistRole = function (el) {
+        if (!isNOU(el)) {
+            attributes(el, { role: 'tablist' });
         }
     };
     Tab.prototype.updatePopupIconAriaLabel = function () {

package/src/treeview/treeview-model.d.ts

@@ -62,7 +62,7 @@ export interface FieldsSettingsModel {
     parentID?: string;
 
     /**
-     * Defines the external [`Query`](https://ej2.syncfusion.com/documentation/api/data/query/)
+     * Defines the external [`Query`](https://ej2.syncfusion.com/documentation/api/data/query)
      * that will execute along with data processing.
      *
      * @default null
@@ -161,7 +161,7 @@ export interface TreeViewModel extends ComponentModel{
      * desktop, hold the mouse on the node, drag it to the target node and drop the node by releasing
      * the mouse. For touch devices, drag and drop operation is performed by touch, touch move
      * and touch end. For more information on drag and drop nodes concept, refer to
-     * [Drag and Drop](../../treeview/drag-and-drop/).
+     * [Drag and Drop](../../treeview/drag-and-drop).
      *
      * @default false
      */
@@ -171,7 +171,7 @@ export interface TreeViewModel extends ComponentModel{
      * Enables or disables editing of the text in the TreeView node. When `allowEditing` property is set
      * to true, the TreeView allows you to edit the node by double clicking the node or by navigating to
      * the node and pressing **F2** key. For more information on node editing, refer
-     * to [Node Editing](../../treeview/node-editing/).
+     * to [Node Editing](../../treeview/node-editing).
      *
      * @default false
      */
@@ -184,7 +184,7 @@ export interface TreeViewModel extends ComponentModel{
      * and click the last node to select.
      *
      * For more information on multi-selection, refer to
-     * [Multi-Selection](../../treeview/multiple-selection/).
+     * [Multi-Selection](../../treeview/multiple-selection).
      *
      * @default false
      */
@@ -440,9 +440,9 @@ export interface TreeViewModel extends ComponentModel{
     /**
      * Specifies a template to render customized content for all the nodes. If the `nodeTemplate` property
      * is set, the template content overrides the displayed node text. The property accepts template string
-     * [template string](https://ej2.syncfusion.com/documentation/common/template-engine/)
+     * [template string](https://ej2.syncfusion.com/documentation/common/template-engine)
      * or HTML element ID holding the content. For more information on template concept, refer to
-     * [Template](../../treeview/template/).
+     * [Template](../../treeview/template).
      *
      * @default null
      * @angularType string | object
@@ -489,7 +489,7 @@ export interface TreeViewModel extends ComponentModel{
     /**
      * Indicates that the nodes will display CheckBoxes in the TreeView.
      * The CheckBox will be displayed next to the expand/collapse icon of the node. For more information on CheckBoxes, refer to
-     * [CheckBox](../../treeview/check-box/).
+     * [CheckBox](../../treeview/check-box).
      *
      * @default false
      */

package/src/treeview/treeview.d.ts

@@ -379,7 +379,7 @@ export declare class FieldsSettings extends ChildProperty<FieldsSettings> {
      */
     parentID: string;
     /**
-     * Defines the external [`Query`](https://ej2.syncfusion.com/documentation/api/data/query/)
+     * Defines the external [`Query`](https://ej2.syncfusion.com/documentation/api/data/query)
      * that will execute along with data processing.
      *
      * @default null
@@ -579,7 +579,7 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
      * desktop, hold the mouse on the node, drag it to the target node and drop the node by releasing
      * the mouse. For touch devices, drag and drop operation is performed by touch, touch move
      * and touch end. For more information on drag and drop nodes concept, refer to
-     * [Drag and Drop](../../treeview/drag-and-drop/).
+     * [Drag and Drop](../../treeview/drag-and-drop).
      *
      * @default false
      */
@@ -588,7 +588,7 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
      * Enables or disables editing of the text in the TreeView node. When `allowEditing` property is set
      * to true, the TreeView allows you to edit the node by double clicking the node or by navigating to
      * the node and pressing **F2** key. For more information on node editing, refer
-     * to [Node Editing](../../treeview/node-editing/).
+     * to [Node Editing](../../treeview/node-editing).
      *
      * @default false
      */
@@ -600,7 +600,7 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
      * and click the last node to select.
      *
      * For more information on multi-selection, refer to
-     * [Multi-Selection](../../treeview/multiple-selection/).
+     * [Multi-Selection](../../treeview/multiple-selection).
      *
      * @default false
      */
@@ -837,9 +837,9 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
     /**
      * Specifies a template to render customized content for all the nodes. If the `nodeTemplate` property
      * is set, the template content overrides the displayed node text. The property accepts template string
-     * [template string](https://ej2.syncfusion.com/documentation/common/template-engine/)
+     * [template string](https://ej2.syncfusion.com/documentation/common/template-engine)
      * or HTML element ID holding the content. For more information on template concept, refer to
-     * [Template](../../treeview/template/).
+     * [Template](../../treeview/template).
      *
      * @default null
      * @angularType string | object
@@ -883,7 +883,7 @@ export declare class TreeView extends Component<HTMLElement> implements INotifyP
     /**
      * Indicates that the nodes will display CheckBoxes in the TreeView.
      * The CheckBox will be displayed next to the expand/collapse icon of the node. For more information on CheckBoxes, refer to
-     * [CheckBox](../../treeview/check-box/).
+     * [CheckBox](../../treeview/check-box).
      *
      * @default false
      */