@ui5/webcomponents-fiori 0.0.0-a3eca7ade → 0.0.0-a8a75c830

package/dist/UserMenu.js

@@ -0,0 +1,374 @@
+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;
+};
+var UserMenu_1;
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import { customElement, slotStrict as slot, eventStrict as event, property, } from "@ui5/webcomponents-base/dist/decorators.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+import query from "@ui5/webcomponents-base/dist/decorators/query.js";
+import DOMReferenceConverter from "@ui5/webcomponents-base/dist/converters/DOMReference.js";
+import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
+import { isInstanceOfMenuItem } from "@ui5/webcomponents/dist/MenuItem.js";
+import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
+import UserMenuTemplate from "./UserMenuTemplate.js";
+import UserMenuCss from "./generated/themes/UserMenu.css.js";
+// Texts
+import { USER_MENU_OTHER_ACCOUNT_BUTTON_TXT, USER_MENU_MANAGE_ACCOUNT_BUTTON_TXT, USER_MENU_SIGN_OUT_BUTTON_TXT, USER_MENU_POPOVER_ACCESSIBLE_NAME, USER_MENU_EDIT_AVATAR_TXT, USER_MENU_EDIT_ACCOUNTS_TXT, USER_MENU_CLOSE_DIALOG_BUTTON, USER_MENU_POPOVER_ACCESSIBLE_ACCOUNT_SELECTED_TXT, USER_MENU_CURRENT_INFORMATION_TXT, USER_MENU_ACTIONS_TXT, } from "./generated/i18n/i18n-defaults.js";
+/**
+ * @class
+ * ### Overview
+ *
+ * The `ui5-user-menu` is an SAP Fiori specific web component that is used in `ui5-shellbar`
+ * and allows the user to easily see information and settings for the current user and all other logged in accounts.
+ *
+ * ### ES6 Module Import
+ * `import "@ui5/webcomponents-fiori/dist/UserMenu.js";`
+ *
+ * `import "@ui5/webcomponents-fiori/dist/UserMenuItem.js";` (for `ui5-user-menu-item`)
+ *
+ * @constructor
+ * @extends UI5Element
+ * @public
+ * @since 2.5.0
+ */
+let UserMenu = UserMenu_1 = class UserMenu extends UI5Element {
+    constructor() {
+        super(...arguments);
+        /**
+         * Defines if the User Menu is opened.
+         *
+         * @default false
+         * @public
+         */
+        this.open = false;
+        /**
+         * Defines if the User Menu shows the Manage Account option.
+         *
+         * @default false
+         * @public
+         */
+        this.showManageAccount = false;
+        /**
+         * Defines if the User Menu shows the Other Accounts option.
+         *
+         * @default false
+         * @public
+         */
+        this.showOtherAccounts = false;
+        /**
+         * Defines if the User Menu shows the Edit Accounts option.
+         *
+         * @default false
+         * @public
+         */
+        this.showEditAccounts = false;
+        /**
+         * Defines if the User menu shows edit button.
+         *
+         * @default false
+         * @public
+         * @since 2.7.0
+         */
+        this.showEditButton = false;
+        /**
+         * @default false
+         * @private
+         */
+        this._titleMovedToHeader = false;
+        /**
+         * @default false
+         * @private
+         */
+        this._isScrolled = false;
+    }
+    onBeforeRendering() {
+        this._selectedAccount = this.accounts.find(account => account.selected) || this.accounts[0];
+        const siblingsWithIcon = this._menuItems.some(menuItem => !!menuItem.icon);
+        this._menuItems.forEach(item => {
+            item._siblingsWithIcon = siblingsWithIcon;
+        });
+    }
+    onAfterRendering() {
+        if (this._responsivePopover) {
+            const observerOptions = {
+                threshold: [0.15],
+            };
+            this._observer?.disconnect();
+            this._observer = new IntersectionObserver(entries => this._handleIntersection(entries), observerOptions);
+            if (this._selectedAccountTitleEl) {
+                this._observer.observe(this._selectedAccountTitleEl);
+            }
+            if (this._selectedAccountManageBtn) {
+                this._observer.observe(this._selectedAccountManageBtn);
+            }
+        }
+    }
+    get _isPhone() {
+        return isPhone();
+    }
+    _handleScroll(e) {
+        this._isScrolled = e.detail.scrollTop > 0;
+    }
+    _handleIntersection(entries) {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                if (entry.target.id === "selected-account-title") {
+                    this._titleMovedToHeader = false;
+                }
+                return;
+            }
+            if (entry.target.id === "selected-account-title") {
+                this._titleMovedToHeader = true;
+            }
+        }, this);
+    }
+    _handleAvatarClick(e) {
+        if (e.type === "click") {
+            // TOFIX: Discuss this check: Fire the custom UserMenu#avatar-click only for Avatar#click (not for Avatar#ui5-click as well).
+            this.fireDecoratorEvent("avatar-click");
+        }
+    }
+    _handleManageAccountClick() {
+        this.fireDecoratorEvent("manage-account-click");
+    }
+    _handleEditAccountsClick() {
+        this.fireDecoratorEvent("edit-accounts-click");
+    }
+    _handleAccountSwitch(e) {
+        const item = e.detail.item;
+        const eventPrevented = !this.fireDecoratorEvent("change-account", {
+            prevSelectedAccount: this._selectedAccount,
+            selectedAccount: item.associatedAccount,
+        });
+        if (eventPrevented) {
+            return;
+        }
+        this._selectedAccount.selected = false;
+        item.associatedAccount.selected = true;
+    }
+    _handleSignOutClick() {
+        const eventPrevented = !this.fireDecoratorEvent("sign-out-click");
+        if (eventPrevented) {
+            return;
+        }
+        this._closeUserMenu();
+    }
+    _handleMenuItemClick(e) {
+        const item = e.detail.item; // imrove: improve this ideally without "as" cating
+        item._updateCheckedState();
+        if (!item._popover) {
+            const eventPrevented = !this.fireDecoratorEvent("item-click", {
+                "item": item,
+            });
+            if (!eventPrevented) {
+                item.fireEvent("close-menu");
+            }
+        }
+        else {
+            this._openItemSubMenu(item);
+        }
+    }
+    _handleMenuItemClose() {
+        this._closeUserMenu();
+    }
+    _handlePopoverAfterOpen() {
+        this.fireDecoratorEvent("open");
+    }
+    _handlePopoverAfterClose() {
+        this.open = false;
+        this.fireDecoratorEvent("close");
+    }
+    _openItemSubMenu(item) {
+        if (!item._popover || item._popover.open) {
+            return;
+        }
+        item._popover.opener = item;
+        item._popover.open = true;
+        item.selected = true;
+    }
+    _closeUserMenu() {
+        this.open = false;
+    }
+    get _otherAccounts() {
+        return this.accounts;
+    }
+    get _manageAccountButtonText() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_MANAGE_ACCOUNT_BUTTON_TXT);
+    }
+    get _otherAccountsButtonText() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_OTHER_ACCOUNT_BUTTON_TXT);
+    }
+    get _signOutButtonText() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_SIGN_OUT_BUTTON_TXT);
+    }
+    get _editAvatarTooltip() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_EDIT_AVATAR_TXT);
+    }
+    get _editAccountsTooltip() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_EDIT_ACCOUNTS_TXT);
+    }
+    get _closeDialogAriaLabel() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_CLOSE_DIALOG_BUTTON);
+    }
+    get accessibleNameText() {
+        if (!this._selectedAccount) {
+            return "";
+        }
+        return `${UserMenu_1.i18nBundle.getText(USER_MENU_POPOVER_ACCESSIBLE_NAME)} ${this._selectedAccount.titleText}`;
+    }
+    get _ariaLabelledByAccountInformationText() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_CURRENT_INFORMATION_TXT);
+    }
+    get _ariaLabelledByActions() {
+        return UserMenu_1.i18nBundle.getText(USER_MENU_ACTIONS_TXT);
+    }
+    get _hasCustomFooter() {
+        return this.footer.length > 0 && this.footer[0]?.innerHTML.trim() !== "";
+    }
+    get _showDefaultFooter() {
+        return this.footer.length === 0;
+    }
+    getAccountDescriptionText(account) {
+        return `${account.subtitleText} ${account.description} ${account.selected ? UserMenu_1.i18nBundle.getText(USER_MENU_POPOVER_ACCESSIBLE_ACCOUNT_SELECTED_TXT) : ""}`;
+    }
+    getAccountByRefId(refId) {
+        return this.accounts.find(account => account._id === refId);
+    }
+    captureRef(ref) {
+        if (ref) {
+            ref.associatedAccount = this;
+        }
+    }
+    get _menuItems() {
+        return this.menuItems.filter(isInstanceOfMenuItem);
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "open", void 0);
+__decorate([
+    property({ converter: DOMReferenceConverter })
+], UserMenu.prototype, "opener", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "showManageAccount", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "showOtherAccounts", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "showEditAccounts", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "showEditButton", void 0);
+__decorate([
+    slot({
+        type: HTMLElement,
+        "default": true,
+    })
+], UserMenu.prototype, "menuItems", void 0);
+__decorate([
+    slot({
+        type: HTMLElement,
+        invalidateOnChildChange: {
+            properties: true,
+            slots: false,
+        },
+    })
+], UserMenu.prototype, "accounts", void 0);
+__decorate([
+    slot()
+], UserMenu.prototype, "footer", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "_titleMovedToHeader", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenu.prototype, "_isScrolled", void 0);
+__decorate([
+    query("#user-menu-rp")
+], UserMenu.prototype, "_responsivePopover", void 0);
+__decorate([
+    query("#selected-account-title")
+], UserMenu.prototype, "_selectedAccountTitleEl", void 0);
+__decorate([
+    query("#selected-account-manage-btn")
+], UserMenu.prototype, "_selectedAccountManageBtn", void 0);
+__decorate([
+    i18n("@ui5/webcomponents-fiori")
+], UserMenu, "i18nBundle", void 0);
+UserMenu = UserMenu_1 = __decorate([
+    customElement({
+        tag: "ui5-user-menu",
+        languageAware: true,
+        renderer: jsxRenderer,
+        template: UserMenuTemplate,
+        styles: [UserMenuCss],
+    })
+    /**
+     * Fired when the account avatar is selected.
+     * @public
+     */
+    ,
+    event("avatar-click")
+    /**
+     * Fired when the "Manage Account" button is selected.
+     * @public
+     */
+    ,
+    event("manage-account-click")
+    /**
+     * Fired when the "Edit Accounts" button is selected.
+     * @public
+     */
+    ,
+    event("edit-accounts-click")
+    /**
+     * Fired when the account is switched to a different one.
+     * @param {UserMenuAccount} prevSelectedAccount The previously selected account.
+     * @param {UserMenuAccount} selectedAccount The selected account.
+     * @public
+     */
+    ,
+    event("change-account", {
+        cancelable: true,
+    })
+    /**
+     * Fired when a menu item is selected.
+     * @param {UserMenuItem} item The selected `user menu item`.
+     * @public
+     */
+    ,
+    event("item-click", {
+        cancelable: true,
+    })
+    /**
+     * Fired when a user menu is open.
+     * @public
+     * @since 2.6.0
+     */
+    ,
+    event("open")
+    /**
+     * Fired when a user menu is close.
+     * @public
+     * @since 2.6.0
+     */
+    ,
+    event("close")
+    /**
+     * Fired when the "Sign Out" button is selected.
+     * @public
+     * @since 2.6.0
+     */
+    ,
+    event("sign-out-click", {
+        cancelable: true,
+    })
+], UserMenu);
+UserMenu.define();
+export default UserMenu;
+//# sourceMappingURL=UserMenu.js.map

package/dist/UserMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserMenu.js","sourceRoot":"","sources":["../src/UserMenu.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AAEpE,OAAO,EACN,aAAa,EAAE,UAAU,IAAI,IAAI,EAAE,WAAW,IAAI,KAAK,EAAE,QAAQ,GACjE,MAAM,4CAA4C,CAAC;AACpD,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,KAAK,MAAM,kDAAkD,CAAC;AACrE,OAAO,qBAAqB,MAAM,yDAAyD,CAAC;AAQ5F,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,OAAO,EAAE,MAAM,wCAAwC,CAAC;AAGjE,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,WAAW,MAAM,oCAAoC,CAAC;AAE7D,QAAQ;AACR,OAAO,EACN,kCAAkC,EAClC,mCAAmC,EACnC,6BAA6B,EAC7B,iCAAiC,EACjC,yBAAyB,EACzB,2BAA2B,EAC3B,6BAA6B,EAC7B,iDAAiD,EACjD,iCAAiC,EACjC,qBAAqB,GACrB,MAAM,mCAAmC,CAAC;AAW3C;;;;;;;;;;;;;;;;GAgBG;AAqEH,IAAM,QAAQ,gBAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QAYC;;;;;WAKG;QAEH,SAAI,GAAG,KAAK,CAAC;QAYb;;;;;WAKG;QAEH,sBAAiB,GAAG,KAAK,CAAC;QAE1B;;;;;WAKG;QAEH,sBAAiB,GAAG,KAAK,CAAC;QAE1B;;;;;WAKG;QAEH,qBAAgB,GAAG,KAAK,CAAC;QAEzB;;;;;;WAMG;QAEH,mBAAc,GAAG,KAAK,CAAC;QAyCvB;;;WAGG;QAEH,wBAAmB,GAAG,KAAK,CAAC;QAE5B;;;WAGG;QAEH,gBAAW,GAAG,KAAK,CAAC;IAwOrB,CAAC;IA1MA,iBAAiB;QAChB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QAC5F,MAAM,gBAAgB,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QAE3E,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC9B,IAAI,CAAC,iBAAiB,GAAG,gBAAgB,CAAC;QAC3C,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,gBAAgB;QACf,IAAI,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC7B,MAAM,eAAe,GAAG;gBACvB,SAAS,EAAE,CAAC,IAAI,CAAC;aACjB,CAAC;YAEF,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,CAAC;YAC7B,IAAI,CAAC,SAAS,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,eAAe,CAAC,CAAC;YAEzG,IAAI,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAClC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;YACtD,CAAC;YAED,IAAI,IAAI,CAAC,yBAAyB,EAAE,CAAC;gBACpC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;YACxD,CAAC;QACF,CAAC;IACF,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,OAAO,EAAE,CAAC;IAClB,CAAC;IAED,aAAa,CAAC,CAAsC;QACnD,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC;IAC3C,CAAC;IAED,mBAAmB,CAAC,OAAoC;QACvD,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACvB,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;gBAC1B,IAAI,KAAK,CAAC,MAAM,CAAC,EAAE,KAAK,wBAAwB,EAAE,CAAC;oBAClD,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;gBAClC,CAAC;gBACD,OAAO;YACR,CAAC;YAED,IAAI,KAAK,CAAC,MAAM,CAAC,EAAE,KAAK,wBAAwB,EAAE,CAAC;gBAClD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;YACjC,CAAC;QACF,CAAC,EAAE,IAAI,CAAC,CAAC;IACV,CAAC;IAED,kBAAkB,CAAC,CAAc;QAChC,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACxB,6HAA6H;YAC7H,IAAI,CAAC,kBAAkB,CAAC,cAAc,CAAC,CAAC;QACzC,CAAC;IACF,CAAC;IAED,yBAAyB;QACxB,IAAI,CAAC,kBAAkB,CAAC,sBAAsB,CAAC,CAAC;IACjD,CAAC;IAED,wBAAwB;QACvB,IAAI,CAAC,kBAAkB,CAAC,qBAAqB,CAAC,CAAC;IAChD,CAAC;IAED,oBAAoB,CAAC,CAAwC;QAC5D,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAA6D,CAAC;QACpF,MAAM,cAAc,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,gBAAgB,EAAE;YACjE,mBAAmB,EAAE,IAAI,CAAC,gBAAgB;YAC1C,eAAe,EAAE,IAAI,CAAC,iBAAiB;SACvC,CAAC,CAAC;QACH,IAAI,cAAc,EAAE,CAAC;YACpB,OAAO;QACR,CAAC;QACD,IAAI,CAAC,gBAAgB,CAAC,QAAQ,GAAG,KAAK,CAAC;QACvC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC;IACxC,CAAC;IAED,mBAAmB;QAClB,MAAM,cAAc,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;QAElE,IAAI,cAAc,EAAE,CAAC;YACpB,OAAO;QACR,CAAC;QAED,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,oBAAoB,CAAC,CAAwC;QAC5D,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAoB,CAAC,CAAC,mDAAmD;QAE/F,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAE3B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACpB,MAAM,cAAc,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,YAAY,EAAE;gBAC7D,MAAM,EAAE,IAAI;aACZ,CAAC,CAAC;YAEH,IAAI,CAAC,cAAc,EAAE,CAAC;gBACrB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;YAC9B,CAAC;QACF,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QAC7B,CAAC;IACF,CAAC;IAED,oBAAoB;QACnB,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,uBAAuB;QACtB,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;IAED,wBAAwB;QACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;IAED,gBAAgB,CAAC,IAAkB;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;YAC1C,OAAO;QACR,CAAC;QAED,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACtB,CAAC;IAED,cAAc;QACb,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACnB,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACtB,CAAC;IAED,IAAI,wBAAwB;QAC3B,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,mCAAmC,CAAC,CAAC;IACzE,CAAC;IAED,IAAI,wBAAwB;QAC3B,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,kCAAkC,CAAC,CAAC;IACxE,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,6BAA6B,CAAC,CAAC;IACnE,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,yBAAyB,CAAC,CAAC;IAC/D,CAAC;IAED,IAAI,oBAAoB;QACvB,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,2BAA2B,CAAC,CAAC;IACjE,CAAC;IAED,IAAI,qBAAqB;QACxB,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,6BAA6B,CAAC,CAAC;IACnE,CAAC;IAED,IAAI,kBAAkB;QACrB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC5B,OAAO,EAAE,CAAC;QACX,CAAC;QACD,OAAO,GAAG,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,iCAAiC,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC;IAC/G,CAAC;IAED,IAAI,qCAAqC;QACxC,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,iCAAiC,CAAC,CAAC;IACvE,CAAC;IAED,IAAI,sBAAsB;QACzB,OAAO,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,gBAAgB;QACnB,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;IAC1E,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC;IACjC,CAAC;IAED,yBAAyB,CAAC,OAAwB;QACjD,OAAO,GAAG,OAAO,CAAC,YAAY,IAAI,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,iDAAiD,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;IACnK,CAAC;IAED,iBAAiB,CAAC,KAAa;QAC9B,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,KAAK,KAAK,CAAE,CAAC;IAC9D,CAAC;IAED,UAAU,CAAC,GAA2D;QACrE,IAAI,GAAG,EAAE,CAAC;YACT,GAAG,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAC9B,CAAC;IACF,CAAC;IAED,IAAI,UAAU;QACb,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;IACpD,CAAC;CACD,CAAA;AA5UA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCACf;AAUb;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAC;wCACV;AASrC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDACF;AAS1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDACF;AAS1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDACH;AAUzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDACL;AAUvB;IAJC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,IAAI;KACf,CAAC;2CACoC;AAgBtC;IAPC,IAAI,CAAC;QACL,IAAI,EAAE,WAAW;QACjB,uBAAuB,EAAE;YACxB,UAAU,EAAE,IAAI;YAChB,KAAK,EAAE,KAAK;SACZ;KACD,CAAC;0CAC+B;AAUjC;IADC,IAAI,EAAE;wCACoB;AAU3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qDACA;AAO5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACR;AAgBpB;IADC,KAAK,CAAC,eAAe,CAAC;oDACgB;AAMvC;IADC,KAAK,CAAC,yBAAyB,CAAC;yDACD;AAMhC;IADC,KAAK,CAAC,8BAA8B,CAAC;2DACH;AA1C5B;IADN,IAAI,CAAC,0BAA0B,CAAC;kCACH;AAzGzB,QAAQ;IAnEb,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,WAAW;QACrB,QAAQ,EAAE,gBAAgB;QAC1B,MAAM,EAAE,CAAC,WAAW,CAAC;KACrB,CAAC;IAEF;;;OAGG;;IACF,KAAK,CAAC,cAAc,CAAC;IAEtB;;;OAGG;;IACF,KAAK,CAAC,sBAAsB,CAAC;IAE9B;;;OAGG;;IACF,KAAK,CAAC,qBAAqB,CAAC;IAE7B;;;;;OAKG;;IACF,KAAK,CAAC,gBAAgB,EAAE;QACxB,UAAU,EAAE,IAAI;KAChB,CAAC;IAEF;;;;OAIG;;IACF,KAAK,CAAC,YAAY,EAAE;QACpB,UAAU,EAAE,IAAI;KAChB,CAAC;IAEF;;;;OAIG;;IACF,KAAK,CAAC,MAAM,CAAC;IAEd;;;;OAIG;;IACF,KAAK,CAAC,OAAO,CAAC;IAEf;;;;OAIG;;IACF,KAAK,CAAC,gBAAgB,EAAE;QACxB,UAAU,EAAE,IAAI;KAChB,CAAC;GACI,QAAQ,CA+Vb;AAED,QAAQ,CAAC,MAAM,EAAE,CAAC;AAElB,eAAe,QAAQ,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport {\n\tcustomElement, slotStrict as slot, eventStrict as event, property,\n} from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport DOMReferenceConverter from \"@ui5/webcomponents-base/dist/converters/DOMReference.js\";\nimport type Title from \"@ui5/webcomponents/dist/Title.js\";\nimport type Button from \"@ui5/webcomponents/dist/Button.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\nimport type ListItemBase from \"@ui5/webcomponents/dist/ListItemBase.js\";\nimport type ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { PopupScrollEventDetail } from \"@ui5/webcomponents/dist/Popup.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { isInstanceOfMenuItem } from \"@ui5/webcomponents/dist/MenuItem.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type UserMenuAccount from \"./UserMenuAccount.js\";\nimport type UserMenuItem from \"./UserMenuItem.js\";\nimport UserMenuTemplate from \"./UserMenuTemplate.js\";\nimport UserMenuCss from \"./generated/themes/UserMenu.css.js\";\n\n// Texts\nimport {\n\tUSER_MENU_OTHER_ACCOUNT_BUTTON_TXT,\n\tUSER_MENU_MANAGE_ACCOUNT_BUTTON_TXT,\n\tUSER_MENU_SIGN_OUT_BUTTON_TXT,\n\tUSER_MENU_POPOVER_ACCESSIBLE_NAME,\n\tUSER_MENU_EDIT_AVATAR_TXT,\n\tUSER_MENU_EDIT_ACCOUNTS_TXT,\n\tUSER_MENU_CLOSE_DIALOG_BUTTON,\n\tUSER_MENU_POPOVER_ACCESSIBLE_ACCOUNT_SELECTED_TXT,\n\tUSER_MENU_CURRENT_INFORMATION_TXT,\n\tUSER_MENU_ACTIONS_TXT,\n} from \"./generated/i18n/i18n-defaults.js\";\n\ntype UserMenuItemClickEventDetail = {\n\titem: UserMenuItem;\n}\n\ntype UserMenuOtherAccountClickEventDetail = {\n\tprevSelectedAccount: UserMenuAccount;\n\tselectedAccount: UserMenuAccount;\n}\n\n/**\n * @class\n * ### Overview\n *\n * The `ui5-user-menu` is an SAP Fiori specific web component that is used in `ui5-shellbar`\n * and allows the user to easily see information and settings for the current user and all other logged in accounts.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserMenu.js\";`\n *\n * `import \"@ui5/webcomponents-fiori/dist/UserMenuItem.js\";` (for `ui5-user-menu-item`)\n *\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.5.0\n */\n\n@customElement({\n\ttag: \"ui5-user-menu\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: UserMenuTemplate,\n\tstyles: [UserMenuCss],\n})\n\n/**\n * Fired when the account avatar is selected.\n * @public\n */\n@event(\"avatar-click\")\n\n/**\n * Fired when the \"Manage Account\" button is selected.\n * @public\n */\n@event(\"manage-account-click\")\n\n/**\n * Fired when the \"Edit Accounts\" button is selected.\n * @public\n */\n@event(\"edit-accounts-click\")\n\n/**\n * Fired when the account is switched to a different one.\n * @param {UserMenuAccount} prevSelectedAccount The previously selected account.\n * @param {UserMenuAccount} selectedAccount The selected account.\n * @public\n */\n@event(\"change-account\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when a menu item is selected.\n * @param {UserMenuItem} item The selected `user menu item`.\n * @public\n */\n@event(\"item-click\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when a user menu is open.\n * @public\n * @since 2.6.0\n */\n@event(\"open\")\n\n/**\n * Fired when a user menu is close.\n * @public\n * @since 2.6.0\n */\n@event(\"close\")\n\n/**\n * Fired when the \"Sign Out\" button is selected.\n * @public\n * @since 2.6.0\n */\n@event(\"sign-out-click\", {\n\tcancelable: true,\n})\nclass UserMenu extends UI5Element {\n\teventDetails!: {\n\t\t\"avatar-click\": void;\n\t\t\"manage-account-click\": void;\n\t\t\"edit-accounts-click\": void;\n\t\t\"change-account\": UserMenuOtherAccountClickEventDetail;\n\t\t\"item-click\": UserMenuItemClickEventDetail;\n\t\t\"sign-out-click\": void;\n\t\t\"open\": void;\n\t\t\"close\": void;\n\n\t}\n\t/**\n\t * Defines if the User Menu is opened.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\topen = false;\n\n\t/**\n\t * Defines the ID or DOM Reference of the element at which the user menu is shown.\n\t * When using this attribute in a declarative way, you must only use the `id` (as a string) of the element at which you want to show the popover.\n\t * You can only set the `opener` attribute to a DOM Reference when using JavaScript.\n\t * @public\n\t * @default undefined\n\t */\n\t@property({ converter: DOMReferenceConverter })\n\topener?: HTMLElement | string | null;\n\n\t/**\n\t * Defines if the User Menu shows the Manage Account option.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowManageAccount = false;\n\n\t/**\n\t * Defines if the User Menu shows the Other Accounts option.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowOtherAccounts = false;\n\n\t/**\n\t * Defines if the User Menu shows the Edit Accounts option.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowEditAccounts = false;\n\n\t/**\n\t * Defines if the User menu shows edit button.\n\t *\n\t * @default false\n\t * @public\n\t * @since 2.7.0\n\t */\n\t@property({ type: Boolean })\n\tshowEditButton = false;\n\n\t/**\n\t * Defines the menu items.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\t\"default\": true,\n\t})\n\tmenuItems!: DefaultSlot<UserMenuItem>;\n\n\t/**\n\t * Defines the user accounts.\n\t *\n\t * **Note:** If one item is used, it will be shown as the selected one. If more than one item is used, the first one will be shown as selected unless\n\t * there is an item with `selected` property set to `true`.\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: false,\n\t\t},\n\t})\n\taccounts!: Slot<UserMenuAccount>;\n\n\t/**\n\t * Defines custom footer content.\n\t *\n\t * **Note:** When provided, replaces the default \"Sign Out\" button. Use an empty element to hide the footer completely.\n\t * @public\n\t * @since 2.20.0\n\t */\n\t@slot()\n\tfooter!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_titleMovedToHeader = false;\n\n\t/**\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_isScrolled = false;\n\n\t/**\n\t * @private\n\t */\n\t_selectedAccount!: UserMenuAccount;\n\n\t/**\n\t * @private\n\t */\n\t_observer?: IntersectionObserver;\n\n\t/**\n\t * @private\n\t */\n\t@query(\"#user-menu-rp\")\n\t_responsivePopover?: ResponsivePopover;\n\n\t/**\n\t * @private\n\t */\n\t@query(\"#selected-account-title\")\n\t_selectedAccountTitleEl?: Title;\n\n\t/**\n\t * @private\n\t */\n\t@query(\"#selected-account-manage-btn\")\n\t_selectedAccountManageBtn?: Button;\n\n\tonBeforeRendering() {\n\t\tthis._selectedAccount = this.accounts.find(account => account.selected) || this.accounts[0];\n\t\tconst siblingsWithIcon = this._menuItems.some(menuItem => !!menuItem.icon);\n\n\t\tthis._menuItems.forEach(item => {\n\t\t\titem._siblingsWithIcon = siblingsWithIcon;\n\t\t});\n\t}\n\n\tonAfterRendering(): void {\n\t\tif (this._responsivePopover) {\n\t\t\tconst observerOptions = {\n\t\t\t\tthreshold: [0.15],\n\t\t\t};\n\n\t\t\tthis._observer?.disconnect();\n\t\t\tthis._observer = new IntersectionObserver(entries => this._handleIntersection(entries), observerOptions);\n\n\t\t\tif (this._selectedAccountTitleEl) {\n\t\t\t\tthis._observer.observe(this._selectedAccountTitleEl);\n\t\t\t}\n\n\t\t\tif (this._selectedAccountManageBtn) {\n\t\t\t\tthis._observer.observe(this._selectedAccountManageBtn);\n\t\t\t}\n\t\t}\n\t}\n\n\tget _isPhone() {\n\t\treturn isPhone();\n\t}\n\n\t_handleScroll(e: CustomEvent<PopupScrollEventDetail>) {\n\t\tthis._isScrolled = e.detail.scrollTop > 0;\n\t}\n\n\t_handleIntersection(entries: IntersectionObserverEntry[]) {\n\t\tentries.forEach(entry => {\n\t\t\tif (entry.isIntersecting) {\n\t\t\t\tif (entry.target.id === \"selected-account-title\") {\n\t\t\t\t\tthis._titleMovedToHeader = false;\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (entry.target.id === \"selected-account-title\") {\n\t\t\t\tthis._titleMovedToHeader = true;\n\t\t\t}\n\t\t}, this);\n\t}\n\n\t_handleAvatarClick(e: CustomEvent) {\n\t\tif (e.type === \"click\") {\n\t\t\t// TOFIX: Discuss this check: Fire the custom UserMenu#avatar-click only for Avatar#click (not for Avatar#ui5-click as well).\n\t\t\tthis.fireDecoratorEvent(\"avatar-click\");\n\t\t}\n\t}\n\n\t_handleManageAccountClick() {\n\t\tthis.fireDecoratorEvent(\"manage-account-click\");\n\t}\n\n\t_handleEditAccountsClick() {\n\t\tthis.fireDecoratorEvent(\"edit-accounts-click\");\n\t}\n\n\t_handleAccountSwitch(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst item = e.detail.item as ListItemBase & { associatedAccount: UserMenuAccount };\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"change-account\", {\n\t\t\tprevSelectedAccount: this._selectedAccount,\n\t\t\tselectedAccount: item.associatedAccount,\n\t\t});\n\t\tif (eventPrevented) {\n\t\t\treturn;\n\t\t}\n\t\tthis._selectedAccount.selected = false;\n\t\titem.associatedAccount.selected = true;\n\t}\n\n\t_handleSignOutClick() {\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"sign-out-click\");\n\n\t\tif (eventPrevented) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._closeUserMenu();\n\t}\n\n\t_handleMenuItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst item = e.detail.item as UserMenuItem; // imrove: improve this ideally without \"as\" cating\n\n\t\titem._updateCheckedState();\n\n\t\tif (!item._popover) {\n\t\t\tconst eventPrevented = !this.fireDecoratorEvent(\"item-click\", {\n\t\t\t\t\"item\": item,\n\t\t\t});\n\n\t\t\tif (!eventPrevented) {\n\t\t\t\titem.fireEvent(\"close-menu\");\n\t\t\t}\n\t\t} else {\n\t\t\tthis._openItemSubMenu(item);\n\t\t}\n\t}\n\n\t_handleMenuItemClose() {\n\t\tthis._closeUserMenu();\n\t}\n\n\t_handlePopoverAfterOpen() {\n\t\tthis.fireDecoratorEvent(\"open\");\n\t}\n\n\t_handlePopoverAfterClose() {\n\t\tthis.open = false;\n\t\tthis.fireDecoratorEvent(\"close\");\n\t}\n\n\t_openItemSubMenu(item: UserMenuItem) {\n\t\tif (!item._popover || item._popover.open) {\n\t\t\treturn;\n\t\t}\n\n\t\titem._popover.opener = item;\n\t\titem._popover.open = true;\n\t\titem.selected = true;\n\t}\n\n\t_closeUserMenu() {\n\t\tthis.open = false;\n\t}\n\n\tget _otherAccounts() {\n\t\treturn this.accounts;\n\t}\n\n\tget _manageAccountButtonText() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_MANAGE_ACCOUNT_BUTTON_TXT);\n\t}\n\n\tget _otherAccountsButtonText() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_OTHER_ACCOUNT_BUTTON_TXT);\n\t}\n\n\tget _signOutButtonText() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_SIGN_OUT_BUTTON_TXT);\n\t}\n\n\tget _editAvatarTooltip() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_EDIT_AVATAR_TXT);\n\t}\n\n\tget _editAccountsTooltip() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_EDIT_ACCOUNTS_TXT);\n\t}\n\n\tget _closeDialogAriaLabel() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_CLOSE_DIALOG_BUTTON);\n\t}\n\n\tget accessibleNameText() {\n\t\tif (!this._selectedAccount) {\n\t\t\treturn \"\";\n\t\t}\n\t\treturn `${UserMenu.i18nBundle.getText(USER_MENU_POPOVER_ACCESSIBLE_NAME)} ${this._selectedAccount.titleText}`;\n\t}\n\n\tget _ariaLabelledByAccountInformationText() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_CURRENT_INFORMATION_TXT);\n\t}\n\n\tget _ariaLabelledByActions() {\n\t\treturn UserMenu.i18nBundle.getText(USER_MENU_ACTIONS_TXT);\n\t}\n\n\tget _hasCustomFooter(): boolean {\n\t\treturn this.footer.length > 0 && this.footer[0]?.innerHTML.trim() !== \"\";\n\t}\n\n\tget _showDefaultFooter(): boolean {\n\t\treturn this.footer.length === 0;\n\t}\n\n\tgetAccountDescriptionText(account: UserMenuAccount) {\n\t\treturn `${account.subtitleText} ${account.description} ${account.selected ? UserMenu.i18nBundle.getText(USER_MENU_POPOVER_ACCESSIBLE_ACCOUNT_SELECTED_TXT) : \"\"}`;\n\t}\n\n\tgetAccountByRefId(refId: string) {\n\t\treturn this.accounts.find(account => account._id === refId)!;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { associatedAccount?: UI5Element} | null) {\n\t\tif (ref) {\n\t\t\tref.associatedAccount = this;\n\t\t}\n\t}\n\n\tget _menuItems() {\n\t\treturn this.menuItems.filter(isInstanceOfMenuItem);\n\t}\n}\n\nUserMenu.define();\n\nexport default UserMenu;\nexport type {\n\tUserMenuItemClickEventDetail,\n\tUserMenuOtherAccountClickEventDetail,\n};\n"]}

package/dist/UserMenuAccount.d.ts

@@ -0,0 +1,70 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type AvatarColorScheme from "@ui5/webcomponents/dist/types/AvatarColorScheme.js";
+declare class UserMenuAccount extends UI5Element {
+    /**
+     * Defines the avatar image url of the user.
+     *
+     * @default ""
+     * @public
+     */
+    avatarSrc?: string;
+    /**
+     * Defines the avatar initials of the user.
+     *
+     * @default undefined
+     * @public
+     */
+    avatarInitials?: string;
+    /**
+     * Defines the background color of the desired image.
+     * If `avatarColorScheme` is set to `Auto`, the avatar will be displayed with the `Accent6` color.
+     *
+     * @default "Auto"
+     * @public
+     */
+    avatarColorScheme: `${AvatarColorScheme}`;
+    /**
+     * Defines the title text of the user.
+     *
+     * @default ""
+     * @public
+     */
+    titleText: string;
+    /**
+     * Defines additional text of the user.
+     *
+     * @default ""
+     * @public
+     */
+    subtitleText: string;
+    /**
+     * Defines description of the user.
+     *
+     * @default ""
+     * @public
+     */
+    description: string;
+    /**
+     * Defines additional information for the user.
+     *
+     * @default ""
+     * @public
+     */
+    additionalInfo: string;
+    /**
+     * Defines if the user is selected.
+     *
+     * @default false
+     * @public
+     */
+    selected: boolean;
+    /**
+     * Indicates whether a loading indicator should be shown.
+     * @default false
+     * @public
+     * @since 2.9.0
+     */
+    loading: boolean;
+    get _initials(): string;
+}
+export default UserMenuAccount;

package/dist/UserMenuAccount.js

@@ -0,0 +1,130 @@
+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 UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import { customElement, property } from "@ui5/webcomponents-base/dist/decorators.js";
+let UserMenuAccount = 
+/**
+ * @class
+ * ### Overview
+ *
+ * The `ui5-user-menu-account` represents an account in the `ui5-user-menu`.
+ *
+ * ### ES6 Module Import
+ * `import "@ui5/webcomponents-fiori/dist/UserMenuAccount.js";`
+ *
+ * @constructor
+ * @extends UI5Element
+ * @public
+ * @since 2.5.0
+ */
+class UserMenuAccount extends UI5Element {
+    constructor() {
+        super(...arguments);
+        /**
+         * Defines the background color of the desired image.
+         * If `avatarColorScheme` is set to `Auto`, the avatar will be displayed with the `Accent6` color.
+         *
+         * @default "Auto"
+         * @public
+         */
+        this.avatarColorScheme = "Auto";
+        /**
+         * Defines the title text of the user.
+         *
+         * @default ""
+         * @public
+         */
+        this.titleText = "";
+        /**
+         * Defines additional text of the user.
+         *
+         * @default ""
+         * @public
+         */
+        this.subtitleText = "";
+        /**
+         * Defines description of the user.
+         *
+         * @default ""
+         * @public
+         */
+        this.description = "";
+        /**
+         * Defines additional information for the user.
+         *
+         * @default ""
+         * @public
+         */
+        this.additionalInfo = "";
+        /**
+         * Defines if the user is selected.
+         *
+         * @default false
+         * @public
+         */
+        this.selected = false;
+        /**
+         * Indicates whether a loading indicator should be shown.
+         * @default false
+         * @public
+         * @since 2.9.0
+         */
+        this.loading = false;
+    }
+    get _initials() {
+        return this.avatarInitials || "undefined";
+    }
+};
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "avatarSrc", void 0);
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "avatarInitials", void 0);
+__decorate([
+    property()
+], UserMenuAccount.prototype, "avatarColorScheme", void 0);
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "titleText", void 0);
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "subtitleText", void 0);
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "description", void 0);
+__decorate([
+    property({ type: String })
+], UserMenuAccount.prototype, "additionalInfo", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenuAccount.prototype, "selected", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserMenuAccount.prototype, "loading", void 0);
+UserMenuAccount = __decorate([
+    customElement({
+        tag: "ui5-user-menu-account",
+    })
+    /**
+     * @class
+     * ### Overview
+     *
+     * The `ui5-user-menu-account` represents an account in the `ui5-user-menu`.
+     *
+     * ### ES6 Module Import
+     * `import "@ui5/webcomponents-fiori/dist/UserMenuAccount.js";`
+     *
+     * @constructor
+     * @extends UI5Element
+     * @public
+     * @since 2.5.0
+     */
+], UserMenuAccount);
+UserMenuAccount.define();
+export default UserMenuAccount;
+//# sourceMappingURL=UserMenuAccount.js.map

package/dist/UserMenuAccount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserMenuAccount.js","sourceRoot":"","sources":["../src/UserMenuAccount.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AAoBrF,IAAM,eAAe;AAdrB;;;;;;;;;;;;;GAaG;AACH,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAmBC;;;;;;WAMG;QAEH,sBAAiB,GAA2B,MAAM,CAAC;QAEnD;;;;;WAKG;QAEH,cAAS,GAAG,EAAE,CAAC;QAEf;;;;;WAKG;QAEH,iBAAY,GAAG,EAAE,CAAC;QAElB;;;;;WAKG;QAEH,gBAAW,GAAG,EAAE,CAAC;QAEjB;;;;;WAKG;QAEH,mBAAc,GAAG,EAAE,CAAC;QAEpB;;;;;WAKG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;IAKjB,CAAC;IAHA,IAAI,SAAS;QACZ,OAAO,IAAI,CAAC,cAAc,IAAI,WAAW,CAAC;IAC3C,CAAC;CACD,CAAA;AA9EA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDACR;AASnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACH;AAUxB;IADC,QAAQ,EAAE;0DACwC;AASnD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDACZ;AASf;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDACT;AASlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDACV;AASjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACP;AASpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACX;AASjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDACZ;AAjFX,eAAe;IAjBpB,aAAa,CAAC;QACd,GAAG,EAAE,uBAAuB;KAC5B,CAAC;IACF;;;;;;;;;;;;;OAaG;GACG,eAAe,CAsFpB;AAED,eAAe,CAAC,MAAM,EAAE,CAAC;AAEzB,eAAe,eAAe,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport { customElement, property } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport type AvatarColorScheme from \"@ui5/webcomponents/dist/types/AvatarColorScheme.js\";\n\n@customElement({\n\ttag: \"ui5-user-menu-account\",\n})\n/**\n * @class\n * ### Overview\n *\n * The `ui5-user-menu-account` represents an account in the `ui5-user-menu`.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserMenuAccount.js\";`\n *\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.5.0\n */\nclass UserMenuAccount extends UI5Element {\n\t/**\n\t * Defines the avatar image url of the user.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property({ type: String })\n\tavatarSrc?: string;\n\n\t/**\n\t * Defines the avatar initials of the user.\n\t *\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ type: String })\n\tavatarInitials?: string;\n\n\t/**\n\t * Defines the background color of the desired image.\n\t * If `avatarColorScheme` is set to `Auto`, the avatar will be displayed with the `Accent6` color.\n\t *\n\t * @default \"Auto\"\n\t * @public\n\t */\n\t@property()\n\tavatarColorScheme: `${AvatarColorScheme}` = \"Auto\";\n\n\t/**\n\t * Defines the title text of the user.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property({ type: String })\n\ttitleText = \"\";\n\n\t/**\n\t * Defines additional text of the user.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property({ type: String })\n\tsubtitleText = \"\";\n\n\t/**\n\t * Defines description of the user.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property({ type: String })\n\tdescription = \"\";\n\n\t/**\n\t * Defines additional information for the user.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property({ type: String })\n\tadditionalInfo = \"\";\n\n\t/**\n\t * Defines if the user is selected.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tselected = false;\n\n\t/**\n\t * Indicates whether a loading indicator should be shown.\n\t * @default false\n\t * @public\n\t * @since 2.9.0\n\t */\n\t@property({ type: Boolean })\n\tloading = false;\n\n\tget _initials() {\n\t\treturn this.avatarInitials || \"undefined\";\n\t}\n}\n\nUserMenuAccount.define();\n\nexport default UserMenuAccount;\n"]}

package/dist/UserMenuItem.d.ts

@@ -0,0 +1,35 @@
+import MenuItem from "@ui5/webcomponents/dist/MenuItem.js";
+import type { DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * `ui5-user-menu-item` is the item to use inside a `ui5-user-menu`.
+ * An arbitrary hierarchy structure can be represented by recursively nesting menu items.
+ *
+ * ### Usage
+ *
+ * `ui5-user-menu-item` represents a node in a `ui5-user-menu`. The user menu itself is rendered as a list,
+ * and each `ui5-menu-item` is represented by a menu item in that menu. Therefore, you should only use
+ * `ui5-user-menu-item` directly in your apps. The `ui5-menu` menu item is internal for the menu, and not intended for public use.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents-fiori/dist/UserMenuItem.js";`
+ * @constructor
+ * @extends MenuItem
+ * @public
+ * @since 2.5.0
+ */
+declare class UserMenuItem extends MenuItem {
+    /**
+     * Defines the items of this component.
+     *
+     * **Note:** Use `ui5-user-menu-item` for the intended design.
+     * @public
+     */
+    items: DefaultSlot<UserMenuItem>;
+    get _menuItems(): UserMenuItem[];
+}
+export default UserMenuItem;