@ui5/webcomponents-fiori 0.0.0-e7dd012d7 → 0.0.0-ebd9a4db3

package/dist/ShellBarSearchTemplate.d.ts

@@ -0,0 +1,2 @@
+import type ShellBarSearch from "./ShellBarSearch.js";
+export default function ShellBarSearchTemplate(this: ShellBarSearch): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ShellBarSearchTemplate.js

@@ -0,0 +1,7 @@
+import { Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import SearchFieldTemplate from "./SearchFieldTemplate.js";
+import ShellBarSearchPopoverTemplate from "./ShellBarSearchPopoverTemplate.js";
+export default function ShellBarSearchTemplate() {
+    return (_jsxs(_Fragment, { children: [SearchFieldTemplate.call(this), ShellBarSearchPopoverTemplate.call(this)] }));
+}
+//# sourceMappingURL=ShellBarSearchTemplate.js.map

package/dist/ShellBarSearchTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShellBarSearchTemplate.js","sourceRoot":"","sources":["../src/ShellBarSearchTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAE3D,OAAO,6BAA6B,MAAM,oCAAoC,CAAC;AAE/E,MAAM,CAAC,OAAO,UAAU,sBAAsB;IAC7C,OAAO,CACN,8BACG,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC9B,6BAA6B,CAAC,IAAI,CAAC,IAAI,CAAC,IACxC,CACH,CAAC;AACH,CAAC","sourcesContent":["import SearchFieldTemplate from \"./SearchFieldTemplate.js\";\nimport type ShellBarSearch from \"./ShellBarSearch.js\";\nimport ShellBarSearchPopoverTemplate from \"./ShellBarSearchPopoverTemplate.js\";\n\nexport default function ShellBarSearchTemplate(this: ShellBarSearch) {\n\treturn (\n\t\t<>\n\t\t\t{ SearchFieldTemplate.call(this) }\n\t\t\t{ ShellBarSearchPopoverTemplate.call(this) }\n\t\t</>\n\t);\n}\n"]}

package/dist/ShellBarSpacer.d.ts

@@ -0,0 +1,17 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+/**
+ * @class
+ *
+ * ### Overview
+ * The `ui5-shellbar-spacer` is an element, used for visual separation between the two content parts of the `ui5-shellbar`.
+ * **Note:** The `ui5-shellbar-spacer` component is in an experimental state and is a subject to change.
+ * @constructor
+ * @extends UI5Element
+ * @since 2.7.0
+ * @abstract
+ * @public
+ */
+declare class ShellBarSpacer extends UI5Element {
+    visible: boolean;
+}
+export default ShellBarSpacer;

package/dist/ShellBarSpacer.js

@@ -0,0 +1,38 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+/**
+ * @class
+ *
+ * ### Overview
+ * The `ui5-shellbar-spacer` is an element, used for visual separation between the two content parts of the `ui5-shellbar`.
+ * **Note:** The `ui5-shellbar-spacer` component is in an experimental state and is a subject to change.
+ * @constructor
+ * @extends UI5Element
+ * @since 2.7.0
+ * @abstract
+ * @public
+ */
+let ShellBarSpacer = class ShellBarSpacer extends UI5Element {
+    constructor() {
+        super(...arguments);
+        this.visible = false;
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], ShellBarSpacer.prototype, "visible", void 0);
+ShellBarSpacer = __decorate([
+    customElement({
+        tag: "ui5-shellbar-spacer",
+    })
+], ShellBarSpacer);
+ShellBarSpacer.define();
+export default ShellBarSpacer;
+//# sourceMappingURL=ShellBarSpacer.js.map

package/dist/ShellBarSpacer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShellBarSpacer.js","sourceRoot":"","sources":["../src/ShellBarSpacer.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,UAAU,MAAM,4CAA4C,CAAC;AAEpE;;;;;;;;;;;GAWG;AAKH,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAEC,YAAO,GAAG,KAAK,CAAC;IACjB,CAAC;CAAA,CAAA;AADA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACZ;AAFX,cAAc;IAJnB,aAAa,CAAC;QACd,GAAG,EAAE,qBAAqB;KAC1B,CAAC;GAEI,cAAc,CAGnB;AAED,cAAc,CAAC,MAAM,EAAE,CAAC;AAExB,eAAe,cAAc,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\n\n/**\n * @class\n *\n * ### Overview\n * The `ui5-shellbar-spacer` is an element, used for visual separation between the two content parts of the `ui5-shellbar`.\n * **Note:** The `ui5-shellbar-spacer` component is in an experimental state and is a subject to change.\n * @constructor\n * @extends UI5Element\n * @since 2.7.0\n * @abstract\n * @public\n */\n@customElement({\n\ttag: \"ui5-shellbar-spacer\",\n})\n\nclass ShellBarSpacer extends UI5Element {\n\t@property({ type: Boolean })\n\tvisible = false;\n}\n\nShellBarSpacer.define();\n\nexport default ShellBarSpacer;\n"]}

package/dist/ShellBarTemplate.d.ts

@@ -0,0 +1,2 @@
+import type ShellBar from "./ShellBar.js";
+export default function ShellBarTemplate(this: ShellBar): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ShellBarTemplate.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
+import Button from "@ui5/webcomponents/dist/Button.js";
+import ShellBarPopoverTemplate from "./ShellBarPopoverTemplate.js";
+import slimArrowDown from "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
+export default function ShellBarTemplate() {
+    return (_jsxs(_Fragment, { children: [_jsxs("header", { class: this.classes.wrapper, "aria-label": this._shellbarText, onKeyDown: this._onKeyDown, part: "root", children: [_jsxs("div", { class: "ui5-shellbar-overflow-container ui5-shellbar-overflow-container-left", children: [this.startButton.length > 0 && _jsx("slot", { name: "startButton" }), this.hasMenuItems && (_jsxs(_Fragment, { children: [!this.showLogoInMenuButton && this.hasLogo && singleLogo.call(this), this.showTitleInMenuButton && _jsx("h1", { class: "ui5-hidden-text", children: this.primaryTitle }), this.showMenuButton && (_jsxs(_Fragment, { children: [_jsxs("button", { class: {
+                                                    "ui5-shellbar-menu-button": true,
+                                                    ...this.classes.button,
+                                                }, onClick: this._headerPress, "aria-haspopup": "menu", "aria-expanded": this._menuPopoverExpanded, "aria-label": this._brandingText, "data-ui5-stable": "menu", tabIndex: 0, children: [this.showLogoInMenuButton && (_jsx("span", { class: "ui5-shellbar-logo", "aria-label": this._logoText, title: this._logoText, children: _jsx("slot", { name: "logo" }) })), this.showTitleInMenuButton && (_jsx("div", { class: "ui5-shellbar-menu-button-title", children: this.primaryTitle })), _jsx(Icon, { class: "ui5-shellbar-menu-button-arrow", name: slimArrowDown })] }), this.secondaryTitle && !this.isSBreakPoint && (_jsx("div", { style: { display: "block" }, class: "ui5-shellbar-secondary-title", "data-ui5-stable": "secondary-title", children: this.secondaryTitle }))] }))] })), !this.hasMenuItems && (_jsxs(_Fragment, { children: [this.isSBreakPoint && this.hasLogo && singleLogo.call(this), !this.isSBreakPoint && (_jsxs(_Fragment, { children: [combinedLogo.call(this), this.secondaryTitle && this.primaryTitle && (_jsx("h2", { class: "ui5-shellbar-secondary-title", "data-ui5-stable": "secondary-title", children: this.secondaryTitle }))] }))] }))] }), this.hasMidContent && (_jsx("div", { class: "ui5-shellbar-overflow-container ui5-shellbar-mid-content", children: _jsx("slot", { name: "midContent" }) })), _jsx("div", { class: "ui5-shellbar-overflow-container ui5-shellbar-overflow-container-right", children: _jsxs("div", { class: "ui5-shellbar-overflow-container-right-inner", children: [this.hasContentItems && (_jsxs("div", { class: "ui5-shellbar-content-items", role: this._contentItemsRole, "aria-label": this._contentItemsText, children: [this.showStartSeparator && (_jsx("div", { class: {
+                                                "ui5-shellbar-separator": true,
+                                                "ui5-shellbar-separator-start": true,
+                                            } })), this.startContent.map(item => {
+                                            const itemInfo = this._contentInfo.find(info => info.id === item._individualSlot);
+                                            return (_jsxs("div", { id: item._individualSlot, class: itemInfo?.classes, children: [this.shouldIncludeSeparator(itemInfo, this.startContentInfoSorted) && (
+                                                    // never displayed, only "packed" with last item that was hidden, used for measurement purposes
+                                                    _jsx("div", { class: {
+                                                            "ui5-shellbar-separator": true,
+                                                            "ui5-shellbar-separator-start": true,
+                                                        } })), _jsx("slot", { name: item._individualSlot })] }, item._individualSlot));
+                                        }), _jsx("div", { class: "ui5-shellbar-spacer" }), this.endContent.map(item => {
+                                            const itemInfo = this._contentInfo.find(info => info.id === item._individualSlot);
+                                            return (_jsxs("div", { id: item._individualSlot, class: itemInfo?.classes, children: [_jsx("slot", { name: item._individualSlot }), this.shouldIncludeSeparator(itemInfo, this.endContentInfoSorted) && (
+                                                    // never displayed, only "packed" with last item that was hidden, used for measurement purposes
+                                                    _jsx("div", { class: {
+                                                            "ui5-shellbar-separator": true,
+                                                            "ui5-shellbar-separator-end": true,
+                                                        } }))] }, item._individualSlot));
+                                        }), this.showEndSeparator && (_jsx("div", { class: {
+                                                "ui5-shellbar-separator": true,
+                                                "ui5-shellbar-separator-end": true,
+                                            } }))] })), !this.hasContentItems && _jsx("div", { class: "ui5-shellbar-spacer" }), _jsxs("div", { class: "ui5-shellbar-overflow-container-right-child", role: this._rightChildRole, children: [this.hasSearchField && (_jsxs(_Fragment, { children: [this.showFullWidthSearch && (_jsxs("div", { class: "ui5-shellbar-search-full-width-wrapper", style: this.styles.searchField, children: [_jsx("div", { class: "ui5-shellbar-search-full-field", children: _jsx("slot", { name: "searchField" }) }), _jsx(Button, { onClick: this._handleCancelButtonPress, class: "ui5-shellbar-button ui5-shellbar-cancel-button", "data-ui5-stable": "cancel-search", children: this._cancelBtnText })] })), _jsx("div", { id: this.hasSelfCollapsibleSearch ? `${this._id}-item-1` : undefined, class: this.classes.searchField, style: this.styles.searchField, children: _jsx("slot", { name: "searchField" }) }), !(this.hasSelfCollapsibleSearch || this.hideSearchButton) && (_jsx(Button, { id: `${this._id}-item-1`, class: {
+                                                        "ui5-shellbar-button": true,
+                                                        "ui5-shellbar-search-button": true,
+                                                        "ui5-shellbar-search-item-for-arrow-nav": true,
+                                                        ...this.classes.search,
+                                                    }, icon: "sap-icon://search", "data-ui5-text": "Search", "data-ui5-notifications-count": this.notificationsCount, "data-ui5-stable": "toggle-search", onClick: this._handleSearchIconPress, tooltip: this._searchBtnOpen, "aria-label": this._searchBtnOpen, "aria-expanded": this.showSearchField, accessibilityAttributes: this.accInfo.search.accessibilityAttributes }))] })), this.hasAssistant && (_jsx("div", { id: `${this._id}-assistant`, class: this.classes.assistant, children: _jsx("slot", { name: "assistant" }) })), this.showNotifications && (_jsx(Button, { id: `${this._id}-item-2`, class: {
+                                                "ui5-shellbar-button": true,
+                                                "ui5-shellbar-bell-button": true,
+                                                "ui5-shellbar-items-for-arrow-nav": true,
+                                                ...this.classes.notification,
+                                            }, icon: "sap-icon://bell", "data-ui5-text": "Notifications", "data-ui5-notifications-count": this.notificationsCount, onClick: this._handleNotificationsPress, tooltip: this._notificationsText, accessibilityAttributes: this.accInfo.notifications.accessibilityAttributes, "data-ui5-stable": "notifications" })), this.customItemsInfo.map(item => (_jsx(Button, { id: item.id, class: `${item.classes} ui5-shellbar-items-for-arrow-nav`, icon: item.icon, tooltip: item.tooltip, "data-count": item.count, "data-ui5-notifications-count": this.notificationsCount, "data-ui5-external-action-item-id": item.refItemid, "data-ui5-stable": item.stableDomRef, onClick: item.press, accessibilityAttributes: item.accessibilityAttributes, accessibleName: item.accessibleName }, item.id)))] })] }) }), _jsx(Button, { id: `${this._id}-item-5`, class: {
+                            "ui5-shellbar-button": true,
+                            "ui5-shellbar-overflow-button": true,
+                            "ui5-shellbar-items-for-arrow-nav": true,
+                            ...this.classes.overflow,
+                        }, icon: "sap-icon://overflow", "data-count": this._overflowNotifications, onClick: this._handleOverflowPress, tooltip: this._overflowText, accessibilityAttributes: this.accInfo.overflow.accessibilityAttributes, "data-ui5-stable": "overflow" }), this.hasProfile && profileButton.call(this), this.showProductSwitch && (_jsx(Button, { id: `${this._id}-item-4`, class: "ui5-shellbar-no-overflow-button ui5-shellbar-button ui5-shellbar-button-product-switch ui5-shellbar-items-for-arrow-nav", icon: "sap-icon://grid", "data-ui5-text": "Product Switch", onClick: this._handleProductSwitchPress, tooltip: this._productsText, "aria-label": this._productSwitchBtnText, "aria-haspopup": "dialog", "aria-expanded": this.accInfo.products.accessibilityAttributes.expanded, accessibilityAttributes: this.accInfo.products.accessibilityAttributes, "data-ui5-stable": "product-switch" }))] }), ShellBarPopoverTemplate.call(this)] }));
+}
+function profileButton() {
+    return (_jsx(Button, { "data-profile-btn": true, id: `${this._id}-item-3`, onClick: this._handleProfilePress, tooltip: this._profileText, class: "ui5-shellbar-button ui5-shellbar-image-button ui5-shellbar-no-overflow-button ui5-shellbar-items-for-arrow-nav", "aria-label": this.imageBtnText, "aria-haspopup": "dialog", accessibilityAttributes: this.accInfo.profile.accessibilityAttributes, "data-ui5-stable": "profile", children: _jsx("slot", { name: "profile" }) }));
+}
+function singleLogo() {
+    return (_jsx("span", { role: this.accLogoRole, class: "ui5-shellbar-logo", "aria-label": this._logoText, title: this._logoText, onClick: this._logoPress, onKeyDown: this._logoKeydown, onKeyUp: this._logoKeyup, tabIndex: 0, "data-ui5-stable": "logo", children: _jsx("slot", { name: "logo" }) }));
+}
+function combinedLogo() {
+    return (_jsxs("div", { role: this.accLogoRole, class: "ui5-shellbar-logo-area", onClick: this._logoPress, tabIndex: 0, onKeyDown: this._logoKeydown, onKeyUp: this._logoKeyup, "aria-label": this.accessibilityAttributes.branding?.name || this._logoAreaText, children: [this.hasLogo && (_jsx("span", { class: "ui5-shellbar-logo", title: this._logoText, onClick: this._logoPress, onKeyDown: this._logoKeydown, onKeyUp: this._logoKeyup, "data-ui5-stable": "logo", children: _jsx("slot", { name: "logo" }) })), _jsx("div", { class: "ui5-shellbar-headings", children: this.primaryTitle && (_jsx("h1", { class: "ui5-shellbar-title", children: _jsx("bdi", { children: this.primaryTitle }) })) })] }));
+}
+//# sourceMappingURL=ShellBarTemplate.js.map

package/dist/ShellBarTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShellBarTemplate.js","sourceRoot":"","sources":["../src/ShellBarTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport type ShellBar from \"./ShellBar.js\";\nimport ShellBarPopoverTemplate from \"./ShellBarPopoverTemplate.js\";\nimport slimArrowDown from \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\n\nexport default function ShellBarTemplate(this: ShellBar) {\n\treturn (\n\t\t<>\n\t\t\t<header\n\t\t\t\tclass={this.classes.wrapper}\n\t\t\t\taria-label={this._shellbarText}\n\t\t\t\tonKeyDown={this._onKeyDown}\n\t\t\t\tpart=\"root\">\n\t\t\t\t<div class=\"ui5-shellbar-overflow-container ui5-shellbar-overflow-container-left\">\n\t\t\t\t\t{this.startButton.length > 0 && <slot name=\"startButton\"></slot>}\n\n\t\t\t\t\t{this.hasMenuItems && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{!this.showLogoInMenuButton && this.hasLogo && singleLogo.call(this)}\n\t\t\t\t\t\t\t{this.showTitleInMenuButton && <h1 class=\"ui5-hidden-text\">{this.primaryTitle}</h1>}\n\t\t\t\t\t\t\t{this.showMenuButton && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-menu-button\": true,\n\t\t\t\t\t\t\t\t\t\t\t...this.classes.button,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tonClick={this._headerPress}\n\t\t\t\t\t\t\t\t\t\taria-haspopup=\"menu\"\n\t\t\t\t\t\t\t\t\t\taria-expanded={this._menuPopoverExpanded}\n\t\t\t\t\t\t\t\t\t\taria-label={this._brandingText}\n\t\t\t\t\t\t\t\t\t\tdata-ui5-stable=\"menu\"\n\t\t\t\t\t\t\t\t\t\ttabIndex={0}>\n\t\t\t\t\t\t\t\t\t\t{this.showLogoInMenuButton && (\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"ui5-shellbar-logo\" aria-label={this._logoText} title={this._logoText}>\n\t\t\t\t\t\t\t\t\t\t\t\t<slot name=\"logo\"></slot>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t{this.showTitleInMenuButton && (\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-shellbar-menu-button-title\">{this.primaryTitle}</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<Icon class=\"ui5-shellbar-menu-button-arrow\" name={slimArrowDown} />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t{this.secondaryTitle && !this.isSBreakPoint && (\n\t\t\t\t\t\t\t\t\t\t<div style={{ display: \"block\" }} class=\"ui5-shellbar-secondary-title\" data-ui5-stable=\"secondary-title\">\n\t\t\t\t\t\t\t\t\t\t\t{this.secondaryTitle}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{!this.hasMenuItems && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{this.isSBreakPoint && this.hasLogo && singleLogo.call(this)}\n\t\t\t\t\t\t\t{!this.isSBreakPoint && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{combinedLogo.call(this)}\n\t\t\t\t\t\t\t\t\t{this.secondaryTitle && this.primaryTitle && (\n\t\t\t\t\t\t\t\t\t\t<h2 class=\"ui5-shellbar-secondary-title\" data-ui5-stable=\"secondary-title\">\n\t\t\t\t\t\t\t\t\t\t\t{this.secondaryTitle}\n\t\t\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{this.hasMidContent && (\n\t\t\t\t\t<div class=\"ui5-shellbar-overflow-container ui5-shellbar-mid-content\">\n\t\t\t\t\t\t<slot name=\"midContent\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div class=\"ui5-shellbar-overflow-container ui5-shellbar-overflow-container-right\">\n\t\t\t\t\t<div class=\"ui5-shellbar-overflow-container-right-inner\">\n\t\t\t\t\t\t{this.hasContentItems && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"ui5-shellbar-content-items\"\n\t\t\t\t\t\t\t\trole={this._contentItemsRole}\n\t\t\t\t\t\t\t\taria-label={this._contentItemsText}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.showStartSeparator && (\n\t\t\t\t\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator\": true,\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator-start\": true,\n\t\t\t\t\t\t\t\t\t}}></div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{this.startContent.map(item => {\n\t\t\t\t\t\t\t\t\tconst itemInfo = this._contentInfo.find(info => info.id === item._individualSlot);\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div key={item._individualSlot} id={item._individualSlot} class={itemInfo?.classes}>\n\t\t\t\t\t\t\t\t\t\t\t{this.shouldIncludeSeparator(itemInfo, this.startContentInfoSorted) && (\n\t\t\t\t\t\t\t\t\t\t\t\t// never displayed, only \"packed\" with last item that was hidden, used for measurement purposes\n\t\t\t\t\t\t\t\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator-start\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t}}></div>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t<div class=\"ui5-shellbar-spacer\"></div>\n\t\t\t\t\t\t\t\t{this.endContent.map(item => {\n\t\t\t\t\t\t\t\t\tconst itemInfo = this._contentInfo.find(info => info.id === item._individualSlot);\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div key={item._individualSlot} id={item._individualSlot} class={itemInfo?.classes}>\n\t\t\t\t\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t\t\t\t\t\t{this.shouldIncludeSeparator(itemInfo, this.endContentInfoSorted) && (\n\t\t\t\t\t\t\t\t\t\t\t\t// never displayed, only \"packed\" with last item that was hidden, used for measurement purposes\n\t\t\t\t\t\t\t\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator-end\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t}}></div>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t{this.showEndSeparator && (\n\t\t\t\t\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator\": true,\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-separator-end\": true,\n\t\t\t\t\t\t\t\t\t}}></div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!this.hasContentItems && <div class=\"ui5-shellbar-spacer\"></div>}\n\t\t\t\t\t\t<div class=\"ui5-shellbar-overflow-container-right-child\" role={this._rightChildRole}>\n\t\t\t\t\t\t\t{this.hasSearchField && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{this.showFullWidthSearch && (\n\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-shellbar-search-full-width-wrapper\" style={this.styles.searchField}>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-shellbar-search-full-field\">\n\t\t\t\t\t\t\t\t\t\t\t\t<slot name=\"searchField\"></slot>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={this._handleCancelButtonPress}\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"ui5-shellbar-button ui5-shellbar-cancel-button\"\n\t\t\t\t\t\t\t\t\t\t\t\tdata-ui5-stable=\"cancel-search\">\n\t\t\t\t\t\t\t\t\t\t\t\t{this._cancelBtnText}\n\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t<div id={this.hasSelfCollapsibleSearch ? `${this._id}-item-1` : undefined} class={this.classes.searchField} style={this.styles.searchField}>\n\t\t\t\t\t\t\t\t\t\t<slot name=\"searchField\"></slot>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t{!(this.hasSelfCollapsibleSearch || this.hideSearchButton) && (\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tid={`${this._id}-item-1`}\n\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-button\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-search-button\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-search-item-for-arrow-nav\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t...this.classes.search,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\ticon=\"sap-icon://search\"\n\t\t\t\t\t\t\t\t\t\t\tdata-ui5-text=\"Search\"\n\t\t\t\t\t\t\t\t\t\t\tdata-ui5-notifications-count={this.notificationsCount}\n\t\t\t\t\t\t\t\t\t\t\tdata-ui5-stable=\"toggle-search\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={this._handleSearchIconPress}\n\t\t\t\t\t\t\t\t\t\t\ttooltip={this._searchBtnOpen}\n\t\t\t\t\t\t\t\t\t\t\taria-label={this._searchBtnOpen}\n\t\t\t\t\t\t\t\t\t\t\taria-expanded={this.showSearchField}\n\t\t\t\t\t\t\t\t\t\t\taccessibilityAttributes={this.accInfo.search.accessibilityAttributes}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this.hasAssistant && (\n\t\t\t\t\t\t\t\t<div id={`${this._id}-assistant`} class={this.classes.assistant}>\n\t\t\t\t\t\t\t\t\t<slot name=\"assistant\"></slot>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this.showNotifications && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tid={`${this._id}-item-2`}\n\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-button\": true,\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-bell-button\": true,\n\t\t\t\t\t\t\t\t\t\t\"ui5-shellbar-items-for-arrow-nav\": true,\n\t\t\t\t\t\t\t\t\t\t...this.classes.notification,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\ticon=\"sap-icon://bell\"\n\t\t\t\t\t\t\t\t\tdata-ui5-text=\"Notifications\"\n\t\t\t\t\t\t\t\t\tdata-ui5-notifications-count={this.notificationsCount}\n\t\t\t\t\t\t\t\t\tonClick={this._handleNotificationsPress}\n\t\t\t\t\t\t\t\t\ttooltip={this._notificationsText}\n\t\t\t\t\t\t\t\t\taccessibilityAttributes={this.accInfo.notifications.accessibilityAttributes}\n\t\t\t\t\t\t\t\t\tdata-ui5-stable=\"notifications\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{this.customItemsInfo.map(item => (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\t\t\tid={item.id}\n\t\t\t\t\t\t\t\t\tclass={`${item.classes} ui5-shellbar-items-for-arrow-nav`}\n\t\t\t\t\t\t\t\t\ticon={item.icon}\n\t\t\t\t\t\t\t\t\ttooltip={item.tooltip}\n\t\t\t\t\t\t\t\t\tdata-count={item.count}\n\t\t\t\t\t\t\t\t\tdata-ui5-notifications-count={this.notificationsCount}\n\t\t\t\t\t\t\t\t\tdata-ui5-external-action-item-id={item.refItemid}\n\t\t\t\t\t\t\t\t\tdata-ui5-stable={item.stableDomRef}\n\t\t\t\t\t\t\t\t\tonClick={item.press}\n\t\t\t\t\t\t\t\t\taccessibilityAttributes={item.accessibilityAttributes}\n\t\t\t\t\t\t\t\t\taccessibleName={item.accessibleName}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<Button\n\t\t\t\t\tid={`${this._id}-item-5`}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"ui5-shellbar-button\": true,\n\t\t\t\t\t\t\"ui5-shellbar-overflow-button\": true,\n\t\t\t\t\t\t\"ui5-shellbar-items-for-arrow-nav\": true,\n\t\t\t\t\t\t...this.classes.overflow,\n\t\t\t\t\t}}\n\t\t\t\t\ticon=\"sap-icon://overflow\"\n\t\t\t\t\tdata-count={this._overflowNotifications}\n\t\t\t\t\tonClick={this._handleOverflowPress}\n\t\t\t\t\ttooltip={this._overflowText}\n\t\t\t\t\taccessibilityAttributes={this.accInfo.overflow.accessibilityAttributes}\n\t\t\t\t\tdata-ui5-stable=\"overflow\"\n\t\t\t\t/>\n\t\t\t\t{this.hasProfile && profileButton.call(this)}\n\t\t\t\t{this.showProductSwitch && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tid={`${this._id}-item-4`}\n\t\t\t\t\t\tclass=\"ui5-shellbar-no-overflow-button ui5-shellbar-button ui5-shellbar-button-product-switch ui5-shellbar-items-for-arrow-nav\"\n\t\t\t\t\t\ticon=\"sap-icon://grid\"\n\t\t\t\t\t\tdata-ui5-text=\"Product Switch\"\n\t\t\t\t\t\tonClick={this._handleProductSwitchPress}\n\t\t\t\t\t\ttooltip={this._productsText}\n\t\t\t\t\t\taria-label={this._productSwitchBtnText}\n\t\t\t\t\t\taria-haspopup=\"dialog\"\n\t\t\t\t\t\taria-expanded={this.accInfo.products.accessibilityAttributes.expanded}\n\t\t\t\t\t\taccessibilityAttributes={this.accInfo.products.accessibilityAttributes}\n\t\t\t\t\t\tdata-ui5-stable=\"product-switch\"\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</header>\n\t\t\t{ShellBarPopoverTemplate.call(this)}\n\t\t</>\n\t);\n}\n\nfunction profileButton(this: ShellBar) {\n\treturn (\n\t\t<Button\n\t\t\tdata-profile-btn\n\t\t\tid={`${this._id}-item-3`}\n\t\t\tonClick={this._handleProfilePress}\n\t\t\ttooltip={this._profileText}\n\t\t\tclass=\"ui5-shellbar-button ui5-shellbar-image-button ui5-shellbar-no-overflow-button ui5-shellbar-items-for-arrow-nav\"\n\t\t\taria-label={this.imageBtnText}\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taccessibilityAttributes={this.accInfo.profile.accessibilityAttributes}\n\t\t\tdata-ui5-stable=\"profile\"\n\t\t>\n\t\t\t<slot name=\"profile\"></slot>\n\t\t</Button>\n\t);\n}\n\nfunction singleLogo(this: ShellBar) {\n\treturn (\n\t\t<span\n\t\t\trole={this.accLogoRole}\n\t\t\tclass=\"ui5-shellbar-logo\"\n\t\t\taria-label={this._logoText}\n\t\t\ttitle={this._logoText}\n\t\t\tonClick={this._logoPress}\n\t\t\tonKeyDown={this._logoKeydown}\n\t\t\tonKeyUp={this._logoKeyup}\n\t\t\ttabIndex={0}\n\t\t\tdata-ui5-stable=\"logo\">\n\t\t\t<slot name=\"logo\"></slot>\n\t\t</span>\n\t);\n}\n\nfunction combinedLogo(this: ShellBar) {\n\treturn (\n\t\t<div\n\t\t\trole={this.accLogoRole}\n\t\t\tclass=\"ui5-shellbar-logo-area\"\n\t\t\tonClick={this._logoPress}\n\t\t\ttabIndex={0}\n\t\t\tonKeyDown={this._logoKeydown}\n\t\t\tonKeyUp={this._logoKeyup}\n\t\t\taria-label={this.accessibilityAttributes.branding?.name || this._logoAreaText}>\n\t\t\t{this.hasLogo && (\n\t\t\t\t<span\n\t\t\t\t\tclass=\"ui5-shellbar-logo\"\n\t\t\t\t\ttitle={this._logoText}\n\t\t\t\t\tonClick={this._logoPress}\n\t\t\t\t\tonKeyDown={this._logoKeydown}\n\t\t\t\t\tonKeyUp={this._logoKeyup}\n\t\t\t\t\tdata-ui5-stable=\"logo\">\n\t\t\t\t\t<slot name=\"logo\"></slot>\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t<div class=\"ui5-shellbar-headings\">\n\t\t\t\t{this.primaryTitle && (\n\t\t\t\t\t<h1 class=\"ui5-shellbar-title\">\n\t\t\t\t\t\t<bdi>{this.primaryTitle}</bdi>\n\t\t\t\t\t</h1>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}

package/dist/SideNavigation.d.ts

@@ -0,0 +1,178 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type ResponsivePopover from "@ui5/webcomponents/dist/ResponsivePopover.js";
+import type NavigationMenu from "./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";
+import type SideNavigationItemBase from "./SideNavigationItemBase.js";
+import type SideNavigationSelectableItemBase from "./SideNavigationSelectableItemBase.js";
+import type SideNavigationItem from "./SideNavigationItem.js";
+import type SideNavigationSubItem from "./SideNavigationSubItem.js";
+import type SideNavigationGroup from "./SideNavigationGroup.js";
+type SideNavigationPopoverContents = {
+    item: SideNavigationItem;
+    subItems: Array<SideNavigationSubItem>;
+};
+type SideNavigationSelectionChangeEventDetail = {
+    item: SideNavigationItemBase;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `SideNavigation` is used as a standard menu in applications.
+ * It consists of three containers: header (top-aligned), main navigation section (top-aligned) and the secondary section (bottom-aligned).
+ *
+ *  - The header is meant for displaying user related information - profile data, avatar, etc.
+ *  - The main navigation section is related to the user’s current work context
+ *  - 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).
+ *
+ * ### Usage
+ *
+ * Use the available `ui5-side-navigation-group`, `ui5-side-navigation-item`
+ * and `ui5-side-navigation-sub-item` components to build your menu.
+ * 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.
+ * 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.
+ *
+ * The `ui5-side-navigation` component is intended for use within an `ui5-navigation-layout` component.
+ * While it can function independently, it is recommended to use it with
+ * the `ui5-navigation-layout` for optimal user experience.
+ *
+ * ### Keyboard Handling
+ *
+ * ### Fast Navigation
+ * This component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].
+ * In order to use this functionality, you need to import the following module:
+ * `import "@ui5/webcomponents-base/dist/features/F6Navigation.js"`
+ *
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents-fiori/dist/SideNavigation.js"`
+ *
+ * `import "@ui5/webcomponents-fiori/dist/SideNavigationGroup.js";` (for `ui5-side-navigation-group`)
+ *
+ * `import "@ui5/webcomponents-fiori/dist/SideNavigationItem.js";` (for `ui5-side-navigation-item`)
+ *
+ * `import "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";` (for `ui5-side-navigation-sub-item`)
+ * @constructor
+ * @extends UI5Element
+ * @since 1.0.0-rc.8
+ * @public
+ */
+declare class SideNavigation extends UI5Element {
+    eventDetails: {
+        "selection-change": SideNavigationSelectionChangeEventDetail;
+    };
+    /**
+     * Defines whether the `ui5-side-navigation` is expanded or collapsed.
+     *
+     * @public
+     * @default false
+     */
+    collapsed: boolean;
+    /**
+     * Defines the accessible ARIA name of the component.
+     * @default undefined
+     * @public
+     * @since 2.9.0
+     */
+    accessibleName?: string;
+    /**
+     * Defines the main items of the component.
+     *
+     * @public
+     */
+    items: Array<SideNavigationItemBase>;
+    /**
+     * Defines the fixed items at the bottom of the component.
+     *
+     * **Note:** In order to achieve the best user experience, it is recommended that you keep the fixed items "flat" (do not pass sub-items)
+     *
+     * @public
+     */
+    fixedItems: Array<SideNavigationItemBase>;
+    /**
+     * Defines the header of the `ui5-side-navigation`.
+     *
+     * **Note:** The header is displayed when the component is expanded - the property `collapsed` is false;
+     *
+     * @public
+     * @since 1.0.0-rc.11
+     */
+    header: Array<HTMLElement>;
+    /**
+     * @private
+     */
+    _popoverContents: SideNavigationPopoverContents;
+    inPopover: boolean;
+    _menuPopoverItems: Array<SideNavigationItem>;
+    /**
+     * Defines if the component is rendered on a mobile device.
+     * @private
+     */
+    isPhone: boolean;
+    _isOverflow: boolean;
+    _flexibleItemNavigation: ItemNavigation;
+    _fixedItemNavigation: ItemNavigation;
+    /**
+     * @private
+     */
+    isTouchDevice: boolean;
+    static i18nBundle: I18nBundle;
+    constructor();
+    _handleResizeBound: () => void;
+    onBeforeRendering(): void;
+    initGroupsSettings(items: Array<SideNavigationItemBase>): void;
+    _onAfterPopoverOpen(): void;
+    _onBeforePopoverOpen(): void;
+    _onBeforePopoverClose(): void;
+    _onBeforeMenuOpen(): void;
+    _onBeforeMenuClose(): void;
+    get accSideNavigationPopoverHiddenText(): string;
+    get ariaRoleDescNavigationList(): string;
+    get navigationMenuPrimaryHiddenText(): string;
+    get navigationMenuFooterHiddenText(): string;
+    get overflowAccessibleName(): string;
+    handlePopupItemClick(e: KeyboardEvent | PointerEvent): void;
+    getOverflowPopover(): NavigationMenu;
+    getPicker(): ResponsivePopover;
+    openPicker(opener: HTMLElement): void;
+    openOverflowMenu(opener: HTMLElement): void;
+    closePicker(): void;
+    closeMenu(): void;
+    getPickerTree(): SideNavigation;
+    get hasHeader(): boolean;
+    get showHeader(): boolean;
+    get hasFixedItems(): boolean;
+    get _rootRole(): "none" | undefined;
+    getEnabledFixedItems(): Array<ITabbable>;
+    getEnabledFlexibleItems(): Array<ITabbable>;
+    getEnabledItems(items: Array<SideNavigationItem | SideNavigationGroup>): Array<ITabbable>;
+    focusItem(item: SideNavigationItemBase): void;
+    onAfterRendering(): void;
+    onEnterDOM(): void;
+    onExitDOM(): void;
+    handleResize(): void;
+    _updateOverflowItems(): null | undefined;
+    _findFocusedItem(items: Array<SideNavigationItem | SideNavigationGroup>): SideNavigationItemBase | undefined;
+    _getSelectableItems(items: Array<SideNavigationItem | SideNavigationGroup>): Array<SideNavigationSelectableItemBase>;
+    _getFocusableItems(items: Array<SideNavigationItem | SideNavigationGroup>): Array<SideNavigationItemBase>;
+    _getAllItems(items: Array<SideNavigationItem | SideNavigationGroup>): Array<SideNavigationItemBase>;
+    _findSelectedItem(items: Array<SideNavigationItem | SideNavigationGroup>): SideNavigationSelectableItemBase | undefined;
+    get overflowItems(): Array<HTMLElement>;
+    _handleItemClick(e: KeyboardEvent | MouseEvent, item: SideNavigationSelectableItemBase): void;
+    _handleOverflowClick(): void;
+    _getOverflowItems(): Array<SideNavigationItem>;
+    _selectItem(item: SideNavigationSelectableItemBase): void;
+    get _overflowItem(): SideNavigationItem | null;
+    get isOverflow(): boolean;
+    _onkeydownOverflow(e: KeyboardEvent): void;
+    _onkeyupOverflow(e: KeyboardEvent): void;
+    captureRef(ref: HTMLElement & {
+        associatedItem?: UI5Element;
+    } | null): void;
+}
+export default SideNavigation;
+export type { SideNavigationSelectionChangeEventDetail, };