@ui5/webcomponents-fiori 1.21.0 → 1.22.0-rc.0

package/dist/SideNavigation.d.ts

@@ -1,5 +1,6 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import ResponsivePopover from "@ui5/webcomponents/dist/ResponsivePopover.js";
+import NavigationMenu from "@ui5/webcomponents/dist/NavigationMenu.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
@@ -21,6 +22,13 @@ type PopupClickEventDetail = {
         associatedItem: SideNavigationItemBase;
     };
 };
+type NavigationMenuClickEventDetail = {
+    detail: {
+        item: {
+            associatedItem: SideNavigationItemBase;
+        };
+    };
+};
 /**
  * @class
  *
@@ -57,12 +65,8 @@ type PopupClickEventDetail = {
  * <code>import "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";</code> (for <code>ui5-side-navigation-sub-item</code>)
  *
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.fiori.SideNavigation
- * @extends sap.ui.webc.base.UI5Element
- * @tagname ui5-side-navigation
+ * @extends UI5Element
  * @since 1.0.0-rc.8
- * @appenddocs sap.ui.webc.fiori.SideNavigationItem sap.ui.webc.fiori.SideNavigationSubItem
  * @public
  */
 declare class SideNavigation extends UI5Element {
@@ -70,9 +74,7 @@ declare class SideNavigation extends UI5Element {
      * Defines whether the <code>ui5-side-navigation</code> is expanded or collapsed.
      *
      * @public
-     * @type {boolean}
-     * @defaultvalue false
-     * @name sap.ui.webc.fiori.SideNavigation.prototype.collapsed
+     * @default false
      */
     collapsed: boolean;
     /**
@@ -81,9 +83,6 @@ declare class SideNavigation extends UI5Element {
      * inside the items.
      *
      * @public
-     * @type {sap.ui.webc.fiori.SideNavigationItem[]}
-     * @slot items
-     * @name sap.ui.webc.fiori.SideNavigation.prototype.default
      */
     items: Array<SideNavigationItem>;
     /**
@@ -93,10 +92,7 @@ declare class SideNavigation extends UI5Element {
      * <b>Note:</b> The header is displayed when the component is expanded - the property <code>collapsed</code> is false;
      *
      * @public
-     * @type {HTMLElement[]}
      * @since 1.0.0-rc.11
-     * @slot header
-     * @name sap.ui.webc.fiori.SideNavigation.prototype.header
      */
     header: Array<HTMLElement>;
     /**
@@ -106,9 +102,6 @@ declare class SideNavigation extends UI5Element {
      * <b>Note:</b> In order to achieve the best user experience, it is recommended that you keep the fixed items "flat" (do not pass sub-items)
      *
      * @public
-     * @type {sap.ui.webc.fiori.SideNavigationItem[]}
-     * @slot fixedItems
-     * @name sap.ui.webc.fiori.SideNavigation.prototype.fixedItems
      */
     fixedItems: Array<SideNavigationItem>;
     /**
@@ -116,17 +109,25 @@ declare class SideNavigation extends UI5Element {
      */
     _popoverContents: SideNavigationPopoverContents;
     _inPopover: boolean;
+    _isOverflow: boolean;
     _flexibleItemNavigation: ItemNavigation;
     _fixedItemNavigation: ItemNavigation;
+    _menuPopoverItems: Array<HTMLElement>;
     static i18nBundle: I18nBundle;
     constructor();
+    _handleResizeBound: () => void;
     _onAfterOpen(): Promise<void>;
     get accSideNavigationPopoverHiddenText(): string;
     get ariaRoleDescNavigationList(): string;
+    get overflowAccessibleName(): string;
     handlePopupItemClick(e: PopupClickEventDetail): void;
+    handleOverflowItemClick(e: NavigationMenuClickEventDetail): void;
+    getOverflowPopover(): Promise<NavigationMenu>;
     getPicker(): Promise<ResponsivePopover>;
     openPicker(opener: HTMLElement): Promise<void>;
+    openOverflowMenu(opener: HTMLElement): Promise<void>;
     closePicker(): Promise<void>;
+    closeMenu(): Promise<void>;
     getPickerTree(): Promise<SideNavigation>;
     get hasHeader(): boolean;
     get showHeader(): boolean;
@@ -146,11 +147,22 @@ declare class SideNavigation extends UI5Element {
     getEnabledItems(items: Array<SideNavigationItem>): Array<ITabbable>;
     focusItem(item: SideNavigationItemBase): void;
     onAfterRendering(): void;
+    onEnterDOM(): void;
+    onExitDOM(): void;
+    handleResize(): void;
+    _updateOverflowItems(): null | undefined;
     _findFocusedItem(items: Array<SideNavigationItem>): SideNavigationItemBase | undefined;
     _getWithNestedItems(items: Array<SideNavigationItem>, expandedOnly?: boolean): Array<SideNavigationItemBase>;
     _findSelectedItem(items: Array<SideNavigationItem>): SideNavigationItemBase | undefined;
     _handleItemClick(e: KeyboardEvent | PointerEvent, item: SideNavigationItemBase): void;
+    _handleOverflowClick(): void;
+    _getOverflowItems(): Array<SideNavigationItem>;
+    _afterMenuClose(): Promise<void>;
     _selectItem(item: SideNavigationItemBase): void;
+    get _overflowDom(): SideNavigationItem | null;
+    get isOverflow(): boolean;
+    _onkeydownOverflow(e: KeyboardEvent): void;
+    _onkeyupOverflow(e: KeyboardEvent): void;
     static onDefine(): Promise<void>;
 }
 export default SideNavigation;

package/dist/SideNavigation.js

@@ -9,12 +9,16 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
 import ResponsivePopover from "@ui5/webcomponents/dist/ResponsivePopover.js";
+import NavigationMenu from "@ui5/webcomponents/dist/NavigationMenu.js";
+import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
+import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import { isPhone, isTablet, isCombi, } from "@ui5/webcomponents-base/dist/Device.js";
+import { isSpace, isEnter, } from "@ui5/webcomponents-base/dist/Keys.js";
 import NavigationMode from "@ui5/webcomponents-base/dist/types/NavigationMode.js";
 import Icon from "@ui5/webcomponents/dist/Icon.js";
 import "@ui5/webcomponents-icons/dist/circle-task-2.js";
@@ -24,7 +28,7 @@ import SideNavigationItem from "./SideNavigationItem.js";
 import SideNavigationSubItem from "./SideNavigationSubItem.js";
 import SideNavigationTemplate from "./generated/templates/SideNavigationTemplate.lit.js";
 import SideNavigationPopoverTemplate from "./generated/templates/SideNavigationPopoverTemplate.lit.js";
-import { SIDE_NAVIGATION_POPOVER_HIDDEN_TEXT, SIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC, SIDE_NAVIGATION_LIST_ARIA_ROLE_DESC, } from "./generated/i18n/i18n-defaults.js";
+import { SIDE_NAVIGATION_POPOVER_HIDDEN_TEXT, SIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC, SIDE_NAVIGATION_LIST_ARIA_ROLE_DESC, SIDE_NAVIGATION_OVERFLOW_ACCESSIBLE_NAME, } from "./generated/i18n/i18n-defaults.js";
 // Styles
 import SideNavigationCss from "./generated/themes/SideNavigation.css.js";
 import SideNavigationPopoverCss from "./generated/themes/SideNavigationPopover.css.js";
@@ -65,12 +69,8 @@ const PAGE_UP_DOWN_SIZE = 10;
  * <code>import "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";</code> (for <code>ui5-side-navigation-sub-item</code>)
  *
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.fiori.SideNavigation
- * @extends sap.ui.webc.base.UI5Element
- * @tagname ui5-side-navigation
+ * @extends UI5Element
  * @since 1.0.0-rc.8
- * @appenddocs sap.ui.webc.fiori.SideNavigationItem sap.ui.webc.fiori.SideNavigationSubItem
  * @public
  */
 let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element {
@@ -86,6 +86,8 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
             navigationMode: NavigationMode.Vertical,
             getItemsCallback: () => this.getEnabledFixedItems(),
         });
+        this._handleResizeBound = this.handleResize.bind(this);
+        this._isOverflow = false;
     }
     async _onAfterOpen() {
         // as the tree/list inside the popover is never destroyed,
@@ -110,6 +112,9 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
         }
         return SideNavigation_1.i18nBundle.getText(key);
     }
+    get overflowAccessibleName() {
+        return SideNavigation_1.i18nBundle.getText(SIDE_NAVIGATION_OVERFLOW_ACCESSIBLE_NAME);
+    }
     handlePopupItemClick(e) {
         const associatedItem = e.target.associatedItem;
         associatedItem.fireEvent("click");
@@ -120,6 +125,27 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
         this._selectItem(associatedItem);
         this.closePicker();
     }
+    handleOverflowItemClick(e) {
+        const associatedItem = e.detail?.item.associatedItem;
+        associatedItem.fireEvent("click");
+        if (associatedItem.selected) {
+            this.closeMenu();
+            return;
+        }
+        this._selectItem(associatedItem);
+        // When subitem is selected in collapsed mode parent element should be focused
+        if (associatedItem.nodeName.toLowerCase() === "ui5-side-navigation-sub-item") {
+            const parent = associatedItem.parentElement;
+            this._flexibleItemNavigation.setCurrentItem(parent);
+        }
+        else {
+            this._flexibleItemNavigation.setCurrentItem(associatedItem);
+        }
+        this.closeMenu();
+    }
+    async getOverflowPopover() {
+        return (await this.getStaticAreaItemDomRef()).querySelector(".ui5-side-navigation-overflow-menu");
+    }
     async getPicker() {
         return (await this.getStaticAreaItemDomRef()).querySelector("[ui5-responsive-popover]");
     }
@@ -127,10 +153,19 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
         const responsivePopover = await this.getPicker();
         responsivePopover.showAt(opener);
     }
+    async openOverflowMenu(opener) {
+        const menu = await this.getOverflowPopover();
+        menu.showAt(opener);
+        menu.opener = opener;
+    }
     async closePicker() {
         const responsivePopover = await this.getPicker();
         responsivePopover.close();
     }
+    async closeMenu() {
+        const menu = await this.getOverflowPopover();
+        menu.close();
+    }
     async getPickerTree() {
         const picker = await this.getPicker();
         return picker.querySelector("[ui5-side-navigation]");
@@ -162,11 +197,18 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
         return this.getEnabledItems(this.fixedItems);
     }
     getEnabledFlexibleItems() {
-        return this.getEnabledItems(this.items);
+        if (!this._overflowDom) {
+            return this.getEnabledItems(this.items);
+        }
+        this._overflowDom._tabIndex = "0";
+        return [...this.getEnabledItems(this.items), this._overflowDom];
     }
     getEnabledItems(items) {
         let result = new Array();
         items.forEach(item => {
+            if (item.getDomRef()?.classList.contains("ui5-sn-item-hidden")) {
+                return;
+            }
             if (!item.disabled) {
                 result.push(item);
             }
@@ -212,6 +254,61 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
                 }
             }
         }
+        if (this.collapsed) {
+            this.handleResize();
+        }
+    }
+    onEnterDOM() {
+        ResizeHandler.register(this, this._handleResizeBound);
+    }
+    onExitDOM() {
+        ResizeHandler.deregister(this, this._handleResizeBound);
+    }
+    handleResize() {
+        const domRef = this.getDomRef(), overflowItemRef = domRef?.querySelector(".ui5-sn-item-overflow");
+        this._updateOverflowItems();
+        if (this._getOverflowItems().length > 0 && this.collapsed) {
+            overflowItemRef?.classList.remove("ui5-sn-item-hidden");
+        }
+        else {
+            overflowItemRef?.classList.add("ui5-sn-item-hidden");
+        }
+    }
+    _updateOverflowItems() {
+        const domRef = this.getDomRef();
+        if (!this.collapsed || !domRef) {
+            return null;
+        }
+        const overflowItemRef = domRef.querySelector(".ui5-sn-item-overflow");
+        const flexibleContentDomRef = domRef.querySelector(".ui5-sn-flexible");
+        if (!overflowItemRef) {
+            return null;
+        }
+        overflowItemRef.classList.add("ui5-sn-item-hidden");
+        const itemsRefs = [...domRef.querySelectorAll(".ui5-sn-flexible .ui5-sn-item-level1:not(.ui5-sn-item-overflow)")];
+        let itemsHeight = itemsRefs.reduce((sum, itemRef) => {
+            itemRef.classList.remove("ui5-sn-item-hidden");
+            return sum + itemRef.offsetHeight;
+        }, 0);
+        const { paddingTop, paddingBottom } = window.getComputedStyle(flexibleContentDomRef);
+        const listHeight = flexibleContentDomRef?.offsetHeight - parseInt(paddingTop) - parseInt(paddingBottom);
+        overflowItemRef.classList.remove("ui5-sn-item-hidden");
+        itemsHeight = overflowItemRef.offsetHeight;
+        const oSelectedItemRef = domRef.querySelector(".ui5-sn-item-selected");
+        if (oSelectedItemRef) {
+            const { marginTop, marginBottom } = window.getComputedStyle(oSelectedItemRef);
+            itemsHeight += oSelectedItemRef.offsetHeight + parseFloat(marginTop) + parseFloat(marginBottom);
+        }
+        itemsRefs.forEach(itemRef => {
+            if (itemRef === oSelectedItemRef) {
+                return;
+            }
+            const { marginTop, marginBottom } = window.getComputedStyle(itemRef);
+            itemsHeight += itemRef.offsetHeight + parseFloat(marginTop) + parseFloat(marginBottom);
+            if (itemsHeight >= listHeight) {
+                itemRef.classList.add("ui5-sn-item-hidden");
+            }
+        });
     }
     _findFocusedItem(items) {
         let focusedItem;
@@ -250,6 +347,7 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
         }
         if (this.collapsed && item instanceof SideNavigationItem && item.items.length) {
             e.preventDefault();
+            this._isOverflow = false;
             this._popoverContents = {
                 item,
                 subItems: item.items,
@@ -263,6 +361,26 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
             }
         }
     }
+    _handleOverflowClick() {
+        this._isOverflow = true;
+        this._menuPopoverItems = this._getOverflowItems();
+        this.openOverflowMenu(this._overflowDom);
+    }
+    _getOverflowItems() {
+        const overflowClass = "ui5-sn-item-hidden";
+        const result = [];
+        this.items.forEach(item => {
+            if (item.getDomRef().classList.contains(overflowClass)) {
+                result.push(item);
+            }
+        });
+        return result;
+    }
+    async _afterMenuClose() {
+        const selectedItem = this._findSelectedItem(this.items);
+        await renderFinished();
+        selectedItem.getDomRef().focus();
+    }
     _selectItem(item) {
         if (item.disabled) {
             return;
@@ -276,6 +394,28 @@ let SideNavigation = SideNavigation_1 = class SideNavigation extends UI5Element
             current.selected = false;
         });
         item.selected = true;
+        if (this.collapsed && item.getDomRef()?.classList.contains("ui5-sn-item-hidden")) {
+            item.getDomRef().classList.remove("ui5-sn-item-hidden");
+        }
+    }
+    get _overflowDom() {
+        return this.shadowRoot.querySelector(".ui5-sn-item-overflow");
+    }
+    get isOverflow() {
+        return this._isOverflow;
+    }
+    _onkeydownOverflow(e) {
+        if (isSpace(e)) {
+            e.preventDefault();
+        }
+        if (isEnter(e)) {
+            this._handleOverflowClick();
+        }
+    }
+    _onkeyupOverflow(e) {
+        if (isSpace(e)) {
+            this._handleOverflowClick();
+        }
     }
     static async onDefine() {
         [SideNavigation_1.i18nBundle] = await Promise.all([
@@ -302,6 +442,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], SideNavigation.prototype, "_inPopover", void 0);
+__decorate([
+    property({ type: Object, multiple: true })
+], SideNavigation.prototype, "_menuPopoverItems", void 0);
 SideNavigation = SideNavigation_1 = __decorate([
     customElement({
         tag: "ui5-side-navigation",
@@ -316,19 +459,22 @@ SideNavigation = SideNavigation_1 = __decorate([
             SideNavigationItem,
             SideNavigationSubItem,
             Icon,
+            NavigationMenu,
         ],
     })
     /**
      * Fired when the selection has changed via user interaction
      *
-     * @event sap.ui.webc.fiori.SideNavigation#selection-change
-     * @param {sap.ui.webc.fiori.SideNavigationItemBase} item the clicked item.
+     * @param {SideNavigationItemBase} item the clicked item.
      * @allowPreventDefault
      * @public
      */
     ,
     event("selection-change", {
         detail: {
+            /**
+             * @public
+             */
             item: { type: HTMLElement },
         },
     })

package/dist/SideNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../src/SideNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport {\n\tisPhone,\n\tisTablet,\n\tisCombi,\n} from \"@ui5/webcomponents-base/dist/Device.js\";\nimport NavigationMode from \"@ui5/webcomponents-base/dist/types/NavigationMode.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/circle-task-2.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-right-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-down-arrow.js\";\nimport type SideNavigationItemBase from \"./SideNavigationItemBase.js\";\nimport SideNavigationItem from \"./SideNavigationItem.js\";\nimport SideNavigationSubItem from \"./SideNavigationSubItem.js\";\nimport SideNavigationTemplate from \"./generated/templates/SideNavigationTemplate.lit.js\";\nimport SideNavigationPopoverTemplate from \"./generated/templates/SideNavigationPopoverTemplate.lit.js\";\nimport {\n\tSIDE_NAVIGATION_POPOVER_HIDDEN_TEXT,\n\tSIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC,\n\tSIDE_NAVIGATION_LIST_ARIA_ROLE_DESC,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport SideNavigationCss from \"./generated/themes/SideNavigation.css.js\";\nimport SideNavigationPopoverCss from \"./generated/themes/SideNavigationPopover.css.js\";\n\nconst PAGE_UP_DOWN_SIZE = 10;\n\ntype SideNavigationPopoverContents = {\n\titem: SideNavigationItem,\n\tsubItems: Array<SideNavigationSubItem>,\n};\n\ntype SideNavigationSelectionChangeEventDetail = {\n\titem: SideNavigationItemBase;\n};\n\n// used for the inner side navigation used in the SideNavigationPopoverTemplate\ntype PopupClickEventDetail = {\n\ttarget: {\n\t\tassociatedItem: SideNavigationItemBase\n\t}\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>SideNavigation</code> is used as a standard menu in applications.\n * It consists of three containers: header (top-aligned), main navigation section (top-aligned) and the secondary section (bottom-aligned).\n * <ul>\n * <li>The header is meant for displaying user related information - profile data, avatar, etc.</li>\n * <li>The main navigation section is related to the user’s current work context</li>\n * <li>The secondary section is mostly used to link additional information that may be of interest (legal information, developer communities, external help, contact information and so on). </li>\n * </ul>\n *\n * <h3>Usage</h3>\n *\n * Use the available <code>ui5-side-navigation-item</code> and <code>ui5-side-navigation-sub-item</code> components to build your menu.\n * The items can consist of text only or an icon with text. The use or non-use of icons must be consistent for all items on one level.\n * You must not combine entries with and without icons on the same level. We strongly recommend that you do not use icons on the second level.\n *\n * <h3>Keyboard Handling</h3>\n *\n * <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down /  Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigation.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigationItem.js\";</code> (for <code>ui5-side-navigation-item</code>)\n * <br>\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js\";</code> (for <code>ui5-side-navigation-sub-item</code>)\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.fiori.SideNavigation\n * @extends sap.ui.webc.base.UI5Element\n * @tagname ui5-side-navigation\n * @since 1.0.0-rc.8\n * @appenddocs sap.ui.webc.fiori.SideNavigationItem sap.ui.webc.fiori.SideNavigationSubItem\n * @public\n */\n\n@customElement({\n\ttag: \"ui5-side-navigation\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\ttemplate: SideNavigationTemplate,\n\tstaticAreaTemplate: SideNavigationPopoverTemplate,\n\tstyles: SideNavigationCss,\n\tstaticAreaStyles: SideNavigationPopoverCss,\n\tdependencies: [\n\t\tResponsivePopover,\n\t\tSideNavigationItem,\n\t\tSideNavigationSubItem,\n\t\tIcon,\n\t],\n})\n/**\n * Fired when the selection has changed via user interaction\n *\n * @event sap.ui.webc.fiori.SideNavigation#selection-change\n * @param {sap.ui.webc.fiori.SideNavigationItemBase} item the clicked item.\n * @allowPreventDefault\n * @public\n */\n@event(\"selection-change\", {\n\tdetail: {\n\t\titem: { type: HTMLElement },\n\t},\n})\nclass SideNavigation extends UI5Element {\n\t/**\n\t * Defines whether the <code>ui5-side-navigation</code> is expanded or collapsed.\n\t *\n\t * @public\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @name sap.ui.webc.fiori.SideNavigation.prototype.collapsed\n\t */\n\t@property({ type: Boolean })\n\tcollapsed!: boolean;\n\n\t/**\n\t * Defines the main items of the <code>ui5-side-navigation</code>. Use the <code>ui5-side-navigation-item</code> component\n\t * for the top-level items, and the <code>ui5-side-navigation-sub-item</code> component for second-level items, nested\n\t * inside the items.\n\t *\n\t * @public\n\t * @type {sap.ui.webc.fiori.SideNavigationItem[]}\n\t * @slot items\n\t * @name sap.ui.webc.fiori.SideNavigation.prototype.default\n\t */\n\t@slot({ type: HTMLElement, invalidateOnChildChange: true, \"default\": true })\n\titems!: Array<SideNavigationItem>;\n\n\t/**\n\t * Defines the header of the <code>ui5-side-navigation</code>.\n\t *\n\t * <br><br>\n\t * <b>Note:</b> The header is displayed when the component is expanded - the property <code>collapsed</code> is false;\n\t *\n\t * @public\n\t * @type {HTMLElement[]}\n\t * @since 1.0.0-rc.11\n\t * @slot header\n\t * @name sap.ui.webc.fiori.SideNavigation.prototype.header\n\t */\n\t@slot()\n\theader!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the fixed items at the bottom of the <code>ui5-side-navigation</code>. Use the <code>ui5-side-navigation-item</code> component\n\t * for the fixed items, and optionally the <code>ui5-side-navigation-sub-item</code> component to provide second-level items inside them.\n\t *\n\t * <b>Note:</b> In order to achieve the best user experience, it is recommended that you keep the fixed items \"flat\" (do not pass sub-items)\n\t *\n\t * @public\n\t * @type {sap.ui.webc.fiori.SideNavigationItem[]}\n\t * @slot fixedItems\n\t * @name sap.ui.webc.fiori.SideNavigation.prototype.fixedItems\n\t */\n\t@slot({ type: HTMLElement, invalidateOnChildChange: true })\n\tfixedItems!: Array<SideNavigationItem>;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_popoverContents!: SideNavigationPopoverContents;\n\n\t@property({ type: Boolean })\n\t_inPopover!: boolean;\n\n\t_flexibleItemNavigation: ItemNavigation;\n\t_fixedItemNavigation: ItemNavigation;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._flexibleItemNavigation = new ItemNavigation(this, {\n\t\t\tskipItemsSize: PAGE_UP_DOWN_SIZE, // PAGE_UP and PAGE_DOWN will skip trough 10 items\n\t\t\tnavigationMode: NavigationMode.Vertical,\n\t\t\tgetItemsCallback: () => this.getEnabledFlexibleItems(),\n\t\t});\n\n\t\tthis._fixedItemNavigation = new ItemNavigation(this, {\n\t\t\tskipItemsSize: PAGE_UP_DOWN_SIZE, // PAGE_UP and PAGE_DOWN will skip trough 10 items\n\t\t\tnavigationMode: NavigationMode.Vertical,\n\t\t\tgetItemsCallback: () => this.getEnabledFixedItems(),\n\t\t});\n\t}\n\n\tasync _onAfterOpen() {\n\t\t// as the tree/list inside the popover is never destroyed,\n\t\t// item navigation index should be managed, because items are\n\t\t// dynamically recreated and tabIndexes are not updated\n\t\tconst tree = await this.getPickerTree();\n\t\tconst selectedItem = tree._findSelectedItem(tree.items);\n\t\tif (selectedItem) {\n\t\t\tselectedItem.focus();\n\t\t} else {\n\t\t\ttree.items[0]?.focus();\n\t\t}\n\t}\n\n\tget accSideNavigationPopoverHiddenText() {\n\t\treturn SideNavigation.i18nBundle.getText(SIDE_NAVIGATION_POPOVER_HIDDEN_TEXT);\n\t}\n\n\tget ariaRoleDescNavigationList() {\n\t\tlet key = SIDE_NAVIGATION_LIST_ARIA_ROLE_DESC;\n\t\tif (this.collapsed) {\n\t\t\tkey = SIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC;\n\t\t}\n\n\t\treturn SideNavigation.i18nBundle.getText(key);\n\t}\n\n\thandlePopupItemClick(e: PopupClickEventDetail) {\n\t\tconst associatedItem = e.target.associatedItem;\n\n\t\tassociatedItem.fireEvent(\"click\");\n\t\tif (associatedItem.selected) {\n\t\t\tthis.closePicker();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._selectItem(associatedItem);\n\t\tthis.closePicker();\n\t}\n\n\tasync getPicker() {\n\t\treturn (await this.getStaticAreaItemDomRef())!.querySelector<ResponsivePopover>(\"[ui5-responsive-popover]\")!;\n\t}\n\n\tasync openPicker(opener: HTMLElement) {\n\t\tconst responsivePopover = await this.getPicker();\n\t\tresponsivePopover.showAt(opener);\n\t}\n\n\tasync closePicker() {\n\t\tconst responsivePopover = await this.getPicker();\n\t\tresponsivePopover.close();\n\t}\n\n\tasync getPickerTree() {\n\t\tconst picker = await this.getPicker();\n\t\treturn picker.querySelector<SideNavigation>(\"[ui5-side-navigation]\")!;\n\t}\n\n\tget hasHeader() {\n\t\treturn !!this.header.length;\n\t}\n\n\tget showHeader() {\n\t\treturn this.hasHeader && !this.collapsed;\n\t}\n\n\tget hasFixedItems() {\n\t\treturn !!this.fixedItems.length;\n\t}\n\n\tget _rootRole() {\n\t\treturn this._inPopover ? \"none\" : undefined;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-sn-phone\": isPhone(),\n\t\t\t\t\"ui5-sn-tablet\": isTablet(),\n\t\t\t\t\"ui5-sn-combi\": isCombi(),\n\t\t\t\t\"ui5-sn-collapsed\": this.collapsed,\n\t\t\t\t\"ui5-sn-in-popover\": this._inPopover,\n\t\t\t},\n\t\t};\n\t}\n\n\tgetEnabledFixedItems() : Array<ITabbable> {\n\t\treturn this.getEnabledItems(this.fixedItems);\n\t}\n\n\tgetEnabledFlexibleItems() : Array<ITabbable> {\n\t\treturn this.getEnabledItems(this.items);\n\t}\n\n\tgetEnabledItems(items: Array<SideNavigationItem>) : Array<ITabbable> {\n\t\tlet result = new Array<ITabbable>();\n\n\t\titems.forEach(item => {\n\t\t\tif (!item.disabled) {\n\t\t\t\tresult.push(item);\n\t\t\t}\n\n\t\t\tif (!this.collapsed && item.expanded) {\n\t\t\t\tresult = result.concat(item.items.filter(el => !el.disabled));\n\t\t\t}\n\t\t});\n\n\t\treturn result;\n\t}\n\n\tfocusItem(item: SideNavigationItemBase) {\n\t\tif (item.isFixedItem) {\n\t\t\tthis._fixedItemNavigation.setCurrentItem(item);\n\t\t} else {\n\t\t\tthis._flexibleItemNavigation.setCurrentItem(item);\n\t\t}\n\t}\n\n\tonAfterRendering() {\n\t\tconst activeElement = this.shadowRoot!.activeElement;\n\t\tconst flexibleDom = this.shadowRoot!.querySelector(\".ui5-sn-flexible\")!;\n\t\tif (!flexibleDom.contains(activeElement)) {\n\t\t\tconst selectedItem = this._findSelectedItem(this.items);\n\t\t\tif (selectedItem) {\n\t\t\t\tthis._flexibleItemNavigation.setCurrentItem(selectedItem);\n\t\t\t} else {\n\t\t\t\tconst focusedItem = this._findFocusedItem(this.items);\n\t\t\t\tif (!focusedItem) {\n\t\t\t\t\tthis._flexibleItemNavigation.setCurrentItem(this.items[0]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst fixedDom = this.shadowRoot!.querySelector(\".ui5-sn-fixed\");\n\t\tif (!fixedDom?.contains(activeElement)) {\n\t\t\tconst selectedItem = this._findSelectedItem(this.fixedItems);\n\t\t\tif (selectedItem) {\n\t\t\t\tthis._fixedItemNavigation.setCurrentItem(selectedItem);\n\t\t\t} else {\n\t\t\t\tconst focusedItem = this._findFocusedItem(this.fixedItems);\n\t\t\t\tif (!focusedItem) {\n\t\t\t\t\tthis._fixedItemNavigation.setCurrentItem(this.fixedItems[0]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t_findFocusedItem(items: Array<SideNavigationItem>) : SideNavigationItemBase | undefined {\n\t\tlet focusedItem;\n\n\t\tif (this.collapsed) {\n\t\t\tfocusedItem = items.find(item => item._tabIndex === \"0\");\n\t\t} else {\n\t\t\tfocusedItem = this._getWithNestedItems(items, true).find(item => item._tabIndex === \"0\");\n\t\t}\n\n\t\treturn focusedItem;\n\t}\n\n\t_getWithNestedItems(items: Array<SideNavigationItem>, expandedOnly = false): Array<SideNavigationItemBase> {\n\t\tlet result = new Array<SideNavigationItemBase>();\n\n\t\titems.forEach(item => {\n\t\t\tresult.push(item);\n\n\t\t\tif (!expandedOnly || item.expanded) {\n\t\t\t\tresult = result.concat(item.items);\n\t\t\t}\n\t\t});\n\n\t\treturn result;\n\t}\n\n\t_findSelectedItem(items: Array<SideNavigationItem>) : SideNavigationItemBase | undefined {\n\t\tlet selectedItem;\n\n\t\tif (this.collapsed) {\n\t\t\tselectedItem = items.find(item => item._selected);\n\t\t} else {\n\t\t\tselectedItem = this._getWithNestedItems(items).find(current => current.selected);\n\t\t}\n\n\t\treturn selectedItem;\n\t}\n\n\t_handleItemClick(e: KeyboardEvent | PointerEvent, item: SideNavigationItemBase) {\n\t\tif (item.selected && !this.collapsed) {\n\t\t\titem.fireEvent(\"click\");\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.collapsed && item instanceof SideNavigationItem && item.items.length) {\n\t\t\te.preventDefault();\n\n\t\t\tthis._popoverContents = {\n\t\t\t\titem,\n\t\t\t\tsubItems: item.items,\n\t\t\t};\n\n\t\t\tthis.openPicker(item.getFocusDomRef() as HTMLElement);\n\t\t} else {\n\t\t\titem.fireEvent(\"click\");\n\n\t\t\tif (!item.selected) {\n\t\t\t\tthis._selectItem(item);\n\t\t\t}\n\t\t}\n\t}\n\n\t_selectItem(item: SideNavigationItemBase) {\n\t\tif (item.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this.fireEvent<SideNavigationSelectionChangeEventDetail>(\"selection-change\", { item }, true)) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet items = this._getWithNestedItems(this.items);\n\t\titems = items.concat(this._getWithNestedItems(this.fixedItems));\n\n\t\titems.forEach(current => {\n\t\t\tcurrent.selected = false;\n\t\t});\n\n\t\titem.selected = true;\n\t}\n\n\tstatic async onDefine() {\n\t\t[SideNavigation.i18nBundle] = await Promise.all([\n\t\t\tgetI18nBundle(\"@ui5/webcomponents-fiori\"),\n\t\t\tsuper.onDefine(),\n\t\t]);\n\t}\n}\n\nSideNavigation.define();\n\nexport default SideNavigation;\n\nexport type {\n\tSideNavigationSelectionChangeEventDetail,\n};\n"]}
+{"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../src/SideNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport NavigationMenu from \"@ui5/webcomponents/dist/NavigationMenu.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport {\n\tisPhone,\n\tisTablet,\n\tisCombi,\n} from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n\tisSpace,\n\tisEnter,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport NavigationMode from \"@ui5/webcomponents-base/dist/types/NavigationMode.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/circle-task-2.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-right-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-down-arrow.js\";\nimport type SideNavigationItemBase from \"./SideNavigationItemBase.js\";\nimport SideNavigationItem from \"./SideNavigationItem.js\";\nimport SideNavigationSubItem from \"./SideNavigationSubItem.js\";\nimport SideNavigationTemplate from \"./generated/templates/SideNavigationTemplate.lit.js\";\nimport SideNavigationPopoverTemplate from \"./generated/templates/SideNavigationPopoverTemplate.lit.js\";\n\nimport {\n\tSIDE_NAVIGATION_POPOVER_HIDDEN_TEXT,\n\tSIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC,\n\tSIDE_NAVIGATION_LIST_ARIA_ROLE_DESC,\n\tSIDE_NAVIGATION_OVERFLOW_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport SideNavigationCss from \"./generated/themes/SideNavigation.css.js\";\nimport SideNavigationPopoverCss from \"./generated/themes/SideNavigationPopover.css.js\";\n\nconst PAGE_UP_DOWN_SIZE = 10;\n\ntype SideNavigationPopoverContents = {\n\titem: SideNavigationItem,\n\tsubItems: Array<SideNavigationSubItem>,\n};\n\ntype SideNavigationSelectionChangeEventDetail = {\n\titem: SideNavigationItemBase;\n};\n\n// used for the inner side navigation used in the SideNavigationPopoverTemplate\ntype PopupClickEventDetail = {\n\ttarget: {\n\t\tassociatedItem: SideNavigationItemBase\n\t}\n};\n\n// used for the inner side navigation used in the SideNavigationPopoverTemplate\ntype NavigationMenuClickEventDetail = {\n\tdetail: {\n\t\titem: {\n\t\t\tassociatedItem: SideNavigationItemBase\n\t\t}\n\t}\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>SideNavigation</code> is used as a standard menu in applications.\n * It consists of three containers: header (top-aligned), main navigation section (top-aligned) and the secondary section (bottom-aligned).\n * <ul>\n * <li>The header is meant for displaying user related information - profile data, avatar, etc.</li>\n * <li>The main navigation section is related to the user’s current work context</li>\n * <li>The secondary section is mostly used to link additional information that may be of interest (legal information, developer communities, external help, contact information and so on). </li>\n * </ul>\n *\n * <h3>Usage</h3>\n *\n * Use the available <code>ui5-side-navigation-item</code> and <code>ui5-side-navigation-sub-item</code> components to build your menu.\n * The items can consist of text only or an icon with text. The use or non-use of icons must be consistent for all items on one level.\n * You must not combine entries with and without icons on the same level. We strongly recommend that you do not use icons on the second level.\n *\n * <h3>Keyboard Handling</h3>\n *\n * <h4>Fast Navigation</h4>\n * This component provides a build in fast navigation group which can be used via <code>F6 / Shift + F6</code> or <code> Ctrl + Alt(Option) + Down /  Ctrl + Alt(Option) + Up</code>.\n * In order to use this functionality, you need to import the following module:\n * <code>import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"</code>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigation.js\";</code>\n * <br>\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigationItem.js\";</code> (for <code>ui5-side-navigation-item</code>)\n * <br>\n * <code>import \"@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js\";</code> (for <code>ui5-side-navigation-sub-item</code>)\n *\n * @constructor\n * @extends UI5Element\n * @since 1.0.0-rc.8\n * @public\n */\n\n@customElement({\n\ttag: \"ui5-side-navigation\",\n\tfastNavigation: true,\n\trenderer: litRender,\n\ttemplate: SideNavigationTemplate,\n\tstaticAreaTemplate: SideNavigationPopoverTemplate,\n\tstyles: SideNavigationCss,\n\tstaticAreaStyles: SideNavigationPopoverCss,\n\tdependencies: [\n\t\tResponsivePopover,\n\t\tSideNavigationItem,\n\t\tSideNavigationSubItem,\n\t\tIcon,\n\t\tNavigationMenu,\n\t],\n})\n/**\n * Fired when the selection has changed via user interaction\n *\n * @param {SideNavigationItemBase} item the clicked item.\n * @allowPreventDefault\n * @public\n */\n@event(\"selection-change\", {\n\tdetail: {\n\t\t/**\n\t\t * @public\n\t\t */\n\t\titem: { type: HTMLElement },\n\t},\n})\nclass SideNavigation extends UI5Element {\n\t/**\n\t * Defines whether the <code>ui5-side-navigation</code> is expanded or collapsed.\n\t *\n\t * @public\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\tcollapsed!: boolean;\n\n\t/**\n\t * Defines the main items of the <code>ui5-side-navigation</code>. Use the <code>ui5-side-navigation-item</code> component\n\t * for the top-level items, and the <code>ui5-side-navigation-sub-item</code> component for second-level items, nested\n\t * inside the items.\n\t *\n\t * @public\n\t */\n\t@slot({ type: HTMLElement, invalidateOnChildChange: true, \"default\": true })\n\titems!: Array<SideNavigationItem>;\n\n\t/**\n\t * Defines the header of the <code>ui5-side-navigation</code>.\n\t *\n\t * <br><br>\n\t * <b>Note:</b> The header is displayed when the component is expanded - the property <code>collapsed</code> is false;\n\t *\n\t * @public\n\t * @since 1.0.0-rc.11\n\t */\n\t@slot()\n\theader!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the fixed items at the bottom of the <code>ui5-side-navigation</code>. Use the <code>ui5-side-navigation-item</code> component\n\t * for the fixed items, and optionally the <code>ui5-side-navigation-sub-item</code> component to provide second-level items inside them.\n\t *\n\t * <b>Note:</b> In order to achieve the best user experience, it is recommended that you keep the fixed items \"flat\" (do not pass sub-items)\n\t *\n\t * @public\n\t */\n\t@slot({ type: HTMLElement, invalidateOnChildChange: true })\n\tfixedItems!: Array<SideNavigationItem>;\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_popoverContents!: SideNavigationPopoverContents;\n\n\t@property({ type: Boolean })\n\t_inPopover!: boolean;\n\t_isOverflow!: boolean;\n\t_flexibleItemNavigation: ItemNavigation;\n\t_fixedItemNavigation: ItemNavigation;\n\n\t@property({ type: Object, multiple: true })\n\t_menuPopoverItems!: Array<HTMLElement>;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._flexibleItemNavigation = new ItemNavigation(this, {\n\t\t\tskipItemsSize: PAGE_UP_DOWN_SIZE, // PAGE_UP and PAGE_DOWN will skip trough 10 items\n\t\t\tnavigationMode: NavigationMode.Vertical,\n\t\t\tgetItemsCallback: () => this.getEnabledFlexibleItems(),\n\t\t});\n\n\t\tthis._fixedItemNavigation = new ItemNavigation(this, {\n\t\t\tskipItemsSize: PAGE_UP_DOWN_SIZE, // PAGE_UP and PAGE_DOWN will skip trough 10 items\n\t\t\tnavigationMode: NavigationMode.Vertical,\n\t\t\tgetItemsCallback: () => this.getEnabledFixedItems(),\n\t\t});\n\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t\tthis._isOverflow = false;\n\t}\n\n\t_handleResizeBound: () => void;\n\n\tasync _onAfterOpen() {\n\t\t// as the tree/list inside the popover is never destroyed,\n\t\t// item navigation index should be managed, because items are\n\t\t// dynamically recreated and tabIndexes are not updated\n\t\tconst tree = await this.getPickerTree();\n\t\tconst selectedItem = tree._findSelectedItem(tree.items);\n\t\tif (selectedItem) {\n\t\t\tselectedItem.focus();\n\t\t} else {\n\t\t\ttree.items[0]?.focus();\n\t\t}\n\t}\n\n\tget accSideNavigationPopoverHiddenText() {\n\t\treturn SideNavigation.i18nBundle.getText(SIDE_NAVIGATION_POPOVER_HIDDEN_TEXT);\n\t}\n\n\tget ariaRoleDescNavigationList() {\n\t\tlet key = SIDE_NAVIGATION_LIST_ARIA_ROLE_DESC;\n\t\tif (this.collapsed) {\n\t\t\tkey = SIDE_NAVIGATION_COLLAPSED_LIST_ARIA_ROLE_DESC;\n\t\t}\n\n\t\treturn SideNavigation.i18nBundle.getText(key);\n\t}\n\n\tget overflowAccessibleName() {\n\t\treturn SideNavigation.i18nBundle.getText(SIDE_NAVIGATION_OVERFLOW_ACCESSIBLE_NAME);\n\t}\n\n\thandlePopupItemClick(e: PopupClickEventDetail) {\n\t\tconst associatedItem = e.target.associatedItem;\n\n\t\tassociatedItem.fireEvent(\"click\");\n\t\tif (associatedItem.selected) {\n\t\t\tthis.closePicker();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._selectItem(associatedItem);\n\t\tthis.closePicker();\n\t}\n\n\thandleOverflowItemClick(e: NavigationMenuClickEventDetail) {\n\t\tconst associatedItem = e.detail?.item.associatedItem;\n\n\t\tassociatedItem.fireEvent(\"click\");\n\t\tif (associatedItem.selected) {\n\t\t\tthis.closeMenu();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._selectItem(associatedItem);\n\n\t\t// When subitem is selected in collapsed mode parent element should be focused\n\t\tif (associatedItem.nodeName.toLowerCase() === \"ui5-side-navigation-sub-item\") {\n\t\t\tconst parent = associatedItem.parentElement as SideNavigationItem;\n\t\t\tthis._flexibleItemNavigation.setCurrentItem(parent);\n\t\t} else {\n\t\t\tthis._flexibleItemNavigation.setCurrentItem(associatedItem);\n\t\t}\n\n\t\tthis.closeMenu();\n\t}\n\n\tasync getOverflowPopover() {\n\t\treturn (await this.getStaticAreaItemDomRef())!.querySelector<NavigationMenu>(\".ui5-side-navigation-overflow-menu\")!;\n\t}\n\n\tasync getPicker() {\n\t\treturn (await this.getStaticAreaItemDomRef())!.querySelector<ResponsivePopover>(\"[ui5-responsive-popover]\")!;\n\t}\n\n\tasync openPicker(opener: HTMLElement) {\n\t\tconst responsivePopover = await this.getPicker();\n\t\tresponsivePopover.showAt(opener);\n\t}\n\n\tasync openOverflowMenu(opener: HTMLElement) {\n\t\tconst menu = await this.getOverflowPopover();\n\t\tmenu.showAt(opener);\n\t\tmenu.opener = opener;\n\t}\n\n\tasync closePicker() {\n\t\tconst responsivePopover = await this.getPicker();\n\t\tresponsivePopover.close();\n\t}\n\n\tasync closeMenu() {\n\t\tconst menu = await this.getOverflowPopover();\n\t\tmenu.close();\n\t}\n\n\tasync getPickerTree() {\n\t\tconst picker = await this.getPicker();\n\t\treturn picker.querySelector<SideNavigation>(\"[ui5-side-navigation]\")!;\n\t}\n\n\tget hasHeader() {\n\t\treturn !!this.header.length;\n\t}\n\n\tget showHeader() {\n\t\treturn this.hasHeader && !this.collapsed;\n\t}\n\n\tget hasFixedItems() {\n\t\treturn !!this.fixedItems.length;\n\t}\n\n\tget _rootRole() {\n\t\treturn this._inPopover ? \"none\" : undefined;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-sn-phone\": isPhone(),\n\t\t\t\t\"ui5-sn-tablet\": isTablet(),\n\t\t\t\t\"ui5-sn-combi\": isCombi(),\n\t\t\t\t\"ui5-sn-collapsed\": this.collapsed,\n\t\t\t\t\"ui5-sn-in-popover\": this._inPopover,\n\t\t\t},\n\t\t};\n\t}\n\n\tgetEnabledFixedItems() : Array<ITabbable> {\n\t\treturn this.getEnabledItems(this.fixedItems);\n\t}\n\n\tgetEnabledFlexibleItems() : Array<ITabbable> {\n\t\tif (!this._overflowDom) {\n\t\t\treturn this.getEnabledItems(this.items);\n\t\t}\n\t\tthis._overflowDom._tabIndex = \"0\";\n\t\treturn [...this.getEnabledItems(this.items), this._overflowDom];\n\t}\n\n\tgetEnabledItems(items: Array<SideNavigationItem>) : Array<ITabbable> {\n\t\tlet result = new Array<ITabbable>();\n\n\t\titems.forEach(item => {\n\t\t\tif (item.getDomRef()?.classList.contains(\"ui5-sn-item-hidden\")) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (!item.disabled) {\n\t\t\t\tresult.push(item);\n\t\t\t}\n\n\t\t\tif (!this.collapsed && item.expanded) {\n\t\t\t\tresult = result.concat(item.items.filter(el => !el.disabled));\n\t\t\t}\n\t\t});\n\t\treturn result;\n\t}\n\n\tfocusItem(item: SideNavigationItemBase) {\n\t\tif (item.isFixedItem) {\n\t\t\tthis._fixedItemNavigation.setCurrentItem(item);\n\t\t} else {\n\t\t\tthis._flexibleItemNavigation.setCurrentItem(item);\n\t\t}\n\t}\n\n\tonAfterRendering() {\n\t\tconst activeElement = this.shadowRoot!.activeElement;\n\t\tconst flexibleDom = this.shadowRoot!.querySelector(\".ui5-sn-flexible\")!;\n\t\tif (!flexibleDom.contains(activeElement)) {\n\t\t\tconst selectedItem = this._findSelectedItem(this.items);\n\t\t\tif (selectedItem) {\n\t\t\t\tthis._flexibleItemNavigation.setCurrentItem(selectedItem);\n\t\t\t} else {\n\t\t\t\tconst focusedItem = this._findFocusedItem(this.items);\n\t\t\t\tif (!focusedItem) {\n\t\t\t\t\tthis._flexibleItemNavigation.setCurrentItem(this.items[0]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst fixedDom = this.shadowRoot!.querySelector(\".ui5-sn-fixed\");\n\t\tif (!fixedDom?.contains(activeElement)) {\n\t\t\tconst selectedItem = this._findSelectedItem(this.fixedItems);\n\t\t\tif (selectedItem) {\n\t\t\t\tthis._fixedItemNavigation.setCurrentItem(selectedItem);\n\t\t\t} else {\n\t\t\t\tconst focusedItem = this._findFocusedItem(this.fixedItems);\n\t\t\t\tif (!focusedItem) {\n\t\t\t\t\tthis._fixedItemNavigation.setCurrentItem(this.fixedItems[0]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tif (this.collapsed) {\n\t\t\tthis.handleResize();\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResizeBound);\n\t}\n\n\thandleResize() {\n\t\tconst domRef = this.getDomRef(),\n\t\t\toverflowItemRef = domRef?.querySelector(\".ui5-sn-item-overflow\");\n\n\t\tthis._updateOverflowItems();\n\n\t\tif (this._getOverflowItems().length > 0 && this.collapsed) {\n\t\t\toverflowItemRef?.classList.remove(\"ui5-sn-item-hidden\");\n\t\t} else {\n\t\t\toverflowItemRef?.classList.add(\"ui5-sn-item-hidden\");\n\t\t}\n\t}\n\n\t_updateOverflowItems() {\n\t\tconst domRef = this.getDomRef();\n\t\tif (!this.collapsed || !domRef) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst overflowItemRef:HTMLElement = domRef.querySelector(\".ui5-sn-item-overflow\")!;\n\t\tconst flexibleContentDomRef:HTMLElement = domRef.querySelector(\".ui5-sn-flexible\")!;\n\t\tif (!overflowItemRef) {\n\t\t\treturn null;\n\t\t}\n\n\t\toverflowItemRef.classList.add(\"ui5-sn-item-hidden\");\n\n\t\tconst itemsRefs = [...domRef.querySelectorAll<HTMLElement>(\".ui5-sn-flexible .ui5-sn-item-level1:not(.ui5-sn-item-overflow)\")];\n\n\t\tlet itemsHeight = itemsRefs.reduce<number>((sum, itemRef) => {\n\t\t\titemRef.classList.remove(\"ui5-sn-item-hidden\");\n\t\t\treturn sum + itemRef.offsetHeight;\n\t\t}, 0);\n\n\t\tconst { paddingTop, paddingBottom } = window.getComputedStyle(flexibleContentDomRef);\n\t\tconst listHeight = flexibleContentDomRef?.offsetHeight - parseInt(paddingTop) - parseInt(paddingBottom);\n\n\t\toverflowItemRef.classList.remove(\"ui5-sn-item-hidden\");\n\n\t\titemsHeight = overflowItemRef.offsetHeight;\n\t\tconst oSelectedItemRef = domRef.querySelector(\".ui5-sn-item-selected\") as HTMLElement;\n\t\tif (oSelectedItemRef) {\n\t\t\tconst { marginTop, marginBottom } = window.getComputedStyle(oSelectedItemRef);\n\n\t\t\titemsHeight += oSelectedItemRef.offsetHeight + parseFloat(marginTop) + parseFloat(marginBottom);\n\t\t}\n\n\t\titemsRefs.forEach(itemRef => {\n\t\t\tif (itemRef === oSelectedItemRef) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst { marginTop, marginBottom } = window.getComputedStyle(itemRef);\n\t\t\titemsHeight += itemRef.offsetHeight + parseFloat(marginTop) + parseFloat(marginBottom);\n\n\t\t\tif (itemsHeight >= listHeight) {\n\t\t\t\titemRef.classList.add(\"ui5-sn-item-hidden\");\n\t\t\t}\n\t\t});\n\t}\n\n\t_findFocusedItem(items: Array<SideNavigationItem>) : SideNavigationItemBase | undefined {\n\t\tlet focusedItem;\n\n\t\tif (this.collapsed) {\n\t\t\tfocusedItem = items.find(item => item._tabIndex === \"0\");\n\t\t} else {\n\t\t\tfocusedItem = this._getWithNestedItems(items, true).find(item => item._tabIndex === \"0\");\n\t\t}\n\n\t\treturn focusedItem;\n\t}\n\n\t_getWithNestedItems(items: Array<SideNavigationItem>, expandedOnly = false): Array<SideNavigationItemBase> {\n\t\tlet result = new Array<SideNavigationItemBase>();\n\n\t\titems.forEach(item => {\n\t\t\tresult.push(item);\n\n\t\t\tif (!expandedOnly || item.expanded) {\n\t\t\t\tresult = result.concat(item.items);\n\t\t\t}\n\t\t});\n\n\t\treturn result;\n\t}\n\n\t_findSelectedItem(items: Array<SideNavigationItem>) : SideNavigationItemBase | undefined {\n\t\tlet selectedItem;\n\n\t\tif (this.collapsed) {\n\t\t\tselectedItem = items.find(item => item._selected);\n\t\t} else {\n\t\t\tselectedItem = this._getWithNestedItems(items).find(current => current.selected);\n\t\t}\n\n\t\treturn selectedItem;\n\t}\n\n\t_handleItemClick(e: KeyboardEvent | PointerEvent, item: SideNavigationItemBase) {\n\t\tif (item.selected && !this.collapsed) {\n\t\t\titem.fireEvent(\"click\");\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.collapsed && item instanceof SideNavigationItem && item.items.length) {\n\t\t\te.preventDefault();\n\t\t\tthis._isOverflow = false;\n\n\t\t\tthis._popoverContents = {\n\t\t\t\titem,\n\t\t\t\tsubItems: item.items,\n\t\t\t};\n\n\t\t\tthis.openPicker(item.getFocusDomRef() as HTMLElement);\n\t\t} else {\n\t\t\titem.fireEvent(\"click\");\n\n\t\t\tif (!item.selected) {\n\t\t\t\tthis._selectItem(item);\n\t\t\t}\n\t\t}\n\t}\n\n\t_handleOverflowClick() {\n\t\tthis._isOverflow = true;\n\t\tthis._menuPopoverItems = this._getOverflowItems();\n\n\t\tthis.openOverflowMenu(this._overflowDom as HTMLElement);\n\t}\n\n\t_getOverflowItems(): Array<SideNavigationItem> {\n\t\tconst overflowClass = \"ui5-sn-item-hidden\";\n\t\tconst result: Array<SideNavigationItem> = [];\n\n\t\tthis.items.forEach(item => {\n\t\t\tif (item.getDomRef().classList.contains(overflowClass)) {\n\t\t\t\t result.push(item);\n\t\t\t}\n\t\t});\n\t\treturn result;\n\t}\n\n\tasync _afterMenuClose() {\n\t\tconst selectedItem = this._findSelectedItem(this.items)!;\n\n\t\tawait renderFinished();\n\t\tselectedItem.getDomRef().focus();\n\t}\n\n\t_selectItem(item: SideNavigationItemBase) {\n\t\tif (item.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (!this.fireEvent<SideNavigationSelectionChangeEventDetail>(\"selection-change\", { item }, true)) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet items = this._getWithNestedItems(this.items);\n\t\titems = items.concat(this._getWithNestedItems(this.fixedItems));\n\n\t\titems.forEach(current => {\n\t\t\tcurrent.selected = false;\n\t\t});\n\n\t\titem.selected = true;\n\n\t\tif (this.collapsed && item.getDomRef()?.classList.contains(\"ui5-sn-item-hidden\")) {\n\t\t\titem.getDomRef().classList.remove(\"ui5-sn-item-hidden\");\n\t\t}\n\t}\n\n\tget _overflowDom() {\n\t\treturn this.shadowRoot!.querySelector<SideNavigationItem>(\".ui5-sn-item-overflow\");\n\t}\n\n\tget isOverflow() {\n\t\treturn this._isOverflow;\n\t}\n\n\t_onkeydownOverflow(e: KeyboardEvent) {\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault();\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis._handleOverflowClick();\n\t\t}\n\t}\n\n\t_onkeyupOverflow(e: KeyboardEvent) {\n\t\tif (isSpace(e)) {\n\t\t\tthis._handleOverflowClick();\n\t\t}\n\t}\n\tstatic async onDefine() {\n\t\t[SideNavigation.i18nBundle] = await Promise.all([\n\t\t\tgetI18nBundle(\"@ui5/webcomponents-fiori\"),\n\t\t\tsuper.onDefine(),\n\t\t]);\n\t}\n}\n\nSideNavigation.define();\n\nexport default SideNavigation;\n\nexport type {\n\tSideNavigationSelectionChangeEventDetail,\n};\n"]}

package/dist/SideNavigationItem.d.ts

@@ -13,13 +13,9 @@ import type SideNavigationSubItem from "./SideNavigationSubItem.js";
  * <code>import "@ui5/webcomponents-fiori/dist/SideNavigationItem.js";</code>
  *
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.fiori.SideNavigationItem
- * @extends sap.ui.webc.fiori.SideNavigationItemBase
+ * @extends SideNavigationItemBase
  * @abstract
- * @tagname ui5-side-navigation-item
  * @public
- * @implements sap.ui.webc.fiori.ISideNavigationItem
  * @since 1.0.0-rc.8
  */
 declare class SideNavigationItem extends SideNavigationItemBase {
@@ -27,28 +23,21 @@ declare class SideNavigationItem extends SideNavigationItemBase {
      * Defines if the item is expanded
      *
      * @public
-     * @type {boolean}
-     * @defaultvalue false
-     * @name sap.ui.webc.fiori.SideNavigationItem.prototype.expanded
+     * @default false
      */
     expanded: boolean;
     /**
      * Defines if the item should be collapsible or not.
      * It is true, for example, for the items inside the Popover of the Side Navigation
      * @private
-     * @type {boolean}
-     * @defaultvalue false
-     * @name sap.ui.webc.fiori.SideNavigationItem.prototype._fixed
+     * @default false
      * @since 1.10.0
      */
     _fixed: boolean;
     /**
      * Defines nested items by passing <code>ui5-side-navigation-sub-item</code> to the default slot.
      *
-     * @type {sap.ui.webc.fiori.ISideNavigationSubItem[]}
      * @public
-     * @slot items
-     * @name sap.ui.webc.fiori.SideNavigationItem.prototype.default
      */
     items: Array<SideNavigationSubItem>;
     /**
@@ -57,9 +46,7 @@ declare class SideNavigationItem extends SideNavigationItemBase {
      * By default, only clicking the arrow icon will toggle the sub items.
      *
      * @public
-     * @type {boolean}
-     * @defaultvalue false
-     * @name sap.ui.webc.fiori.SideNavigationItem.prototype.wholeItemToggleable
+     * @default false
      * @since 1.0.0-rc.11
      */
     wholeItemToggleable: boolean;

package/dist/SideNavigationItem.js

@@ -22,13 +22,9 @@ import SideNavigationItemBase from "./SideNavigationItemBase.js";
  * <code>import "@ui5/webcomponents-fiori/dist/SideNavigationItem.js";</code>
  *
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.fiori.SideNavigationItem
- * @extends sap.ui.webc.fiori.SideNavigationItemBase
+ * @extends SideNavigationItemBase
  * @abstract
- * @tagname ui5-side-navigation-item
  * @public
- * @implements sap.ui.webc.fiori.ISideNavigationItem
  * @since 1.0.0-rc.8
  */
 let SideNavigationItem = class SideNavigationItem extends SideNavigationItemBase {