@ui5/webcomponents-fiori 2.26.0 → 2.27.0-rc.0

package/src/UserMenuItemTemplate.tsx

@@ -1,17 +1,163 @@
 import type UserMenuItem from "./UserMenuItem.js";
 import MenuItemTemplate from "@ui5/webcomponents/dist/MenuItemTemplate.js";
 import type { MenuItemHooks } from "@ui5/webcomponents/dist/MenuItemTemplate.js";
+import ListItemTemplate from "@ui5/webcomponents/dist/ListItemTemplate.js";
+import type { ListItemHooks } from "@ui5/webcomponents/dist/ListItemTemplate.js";
+import ResponsivePopover from "@ui5/webcomponents/dist/ResponsivePopover.js";
+import Button from "@ui5/webcomponents/dist/Button.js";
+import List from "@ui5/webcomponents/dist/List.js";
+import BusyIndicator from "@ui5/webcomponents/dist/BusyIndicator.js";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
+import PopoverPlacement from "@ui5/webcomponents/dist/types/PopoverPlacement.js";
+import navBackIcon from "@ui5/webcomponents-icons/dist/nav-back.js";
+import declineIcon from "@ui5/webcomponents-icons/dist/decline.js";
+import checkIcon from "@ui5/webcomponents-icons/dist/accept.js";
+import slimArrowRight from "@ui5/webcomponents-icons/dist/slim-arrow-right.js";
 
 export default function UserMenuItemTemplate(this: UserMenuItem) {
-	const hooks: Partial<MenuItemHooks> = {};
+	if (this.isPhone) {
+		return phoneTemplate.call(this);
+	}
 
+	const hooks: Partial<MenuItemHooks> = {};
 	if (this.showSelection) {
 		hooks.menuItemTextContent = userMenuItemTextContent;
 	}
-
 	return [MenuItemTemplate.call(this, hooks)];
 }
 
+function phoneTemplate(this: UserMenuItem) {
+	const hooks: Partial<ListItemHooks> = {
+		iconBegin(this: UserMenuItem) {
+			if (this.hasIcon) {
+				return <Icon class="ui5-li-icon" name={this.icon} />;
+			}
+			if (this._siblingsWithIcon) {
+				return <div class="ui5-menu-item-dummy-icon"></div>;
+			}
+		},
+		listItemContent(this: UserMenuItem) {
+			return (<>
+				{this.showSelection ? (
+					<div class="ui5-user-menu-item-text-wrapper">
+						{this.text && <div class="ui5-menu-item-text">{this.text}</div>}
+						{this._selectedSubItemText &&
+							<div class="ui5-user-menu-item-selection-text">{this._selectedSubItemText}</div>
+						}
+					</div>
+				) : (
+					<>{this.text && <div class="ui5-menu-item-text">{this.text}</div>}</>
+				)}
+				{rightContent.call(this)}
+				{checkmarkContent.call(this)}
+			</>);
+		},
+	};
+
+	return [
+		ListItemTemplate.call(this, hooks),
+		phoneSubmenuPopover.call(this),
+	];
+}
+
+function checkmarkContent(this: UserMenuItem) {
+	return !this._markChecked ? "" : (
+		<div class="ui5-menu-item-checked">
+			<Icon name={checkIcon} class="ui5-menu-item-icon-checked" />
+		</div>
+	);
+}
+
+function rightContent(this: UserMenuItem) {
+	switch (true) {
+	case this.hasSubmenu:
+		return (
+			<div class="ui5-menu-item-submenu-icon">
+				<Icon part="subicon" name={slimArrowRight} class="ui5-menu-item-icon-end" />
+			</div>
+		);
+	case this.hasEndContent:
+		return (
+			<div class="ui5-menu-item-end-content" role="group" aria-label={this.endContentAccessibleName}>
+				<slot name="endContent" onKeyDown={this._endContentKeyDown}></slot>
+			</div>
+		);
+	case !!this.additionalText:
+		return (
+			<span part="additional-text" class="ui5-li-additional-text" aria-hidden={this._accInfo.ariaHidden}>
+				{this.additionalText}
+			</span>
+		);
+	}
+}
+
+function phoneSubmenuPopover(this: UserMenuItem) {
+	return this.hasSubmenu && <ResponsivePopover
+		id={`${this._id}-menu-rp`}
+		class="ui5-menu-rp ui5-menu-rp-sub-menu"
+		preventInitialFocus={true}
+		preventFocusRestore={true}
+		hideArrow={true}
+		allowTargetOverlap={true}
+		placement={PopoverPlacement.End}
+		verticalAlign="Top"
+		accessibleName={this.accessibleNameText}
+		onBeforeOpen={this._beforePopoverOpen}
+		onOpen={this._afterPopoverOpen}
+		onBeforeClose={this._beforePopoverClose}
+		onClose={this._afterPopoverClose}
+	>
+		<div slot="header" class="ui5-menu-dialog-header">
+			<Button
+				icon={navBackIcon}
+				class="ui5-menu-back-button"
+				design="Transparent"
+				aria-label={this.labelBack}
+				onClick={this._close}
+			/>
+			<div class="ui5-menu-dialog-title">
+				<div>{this.text}</div>
+			</div>
+			<Button
+				icon={declineIcon}
+				class="ui5-menu-close-button"
+				design="Transparent"
+				aria-label={this.labelCancel}
+				onClick={this._closeAll}
+			/>
+		</div>
+
+		<div
+			id={`${this._id}-menu-main`}
+			class={this.loading ? "menu-busy-indicator-main" : ""}
+			aria-busy={this.loading}
+		>
+			{this.items.length ? (
+				<List
+					id={`${this._id}-menu-list`}
+					selectionMode="None"
+					separators="None"
+					accessibleRole="Menu"
+					loading={this.loading}
+					loadingDelay={this.loadingDelay}
+					onMouseOver={this._itemMouseOver}
+					onKeyDown={this._itemKeyDown}
+					onKeyUp={this._itemKeyUp}
+					onui5-close-menu={this._close}
+					onui5-exit-end-content={this._navigateOutOfEndContent}
+				>
+					<slot></slot>
+				</List>
+			) : this.loading && <BusyIndicator
+				id={`${this._id}-menu-busy-indicator`}
+				delay={this.loadingDelay}
+				class="ui5-menu-busy-indicator"
+				active={true}
+			/>}
+		</div>
+	</ResponsivePopover>;
+}
+
 function userMenuItemTextContent(this: UserMenuItem) {
 	return (
 		<div class="ui5-user-menu-item-text-wrapper">

package/src/i18n/messagebundle_ar.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=تحديد المجال
 
 SEARCH_FIELD_LABEL=حقل البحث
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=بحث في: {0}
+
 SEARCH_FIELD_CLEAR_ICON=مسح البحث
 
 SEARCH_FIELD_SEARCH_ICON=بحث
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=إلغاء
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=لا توجد نتائج بحث
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=لا توجد نتائج بحث
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=تتوفر نتيجة واحدة
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS=يتوفر {0} من النتائج
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=تحرير الصورة الرمزية
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=إدارة الحساب

package/src/i18n/messagebundle_bg.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Избор на обхват
 
 SEARCH_FIELD_LABEL=Поле за търсене
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Търсене в: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Изчистване на търсенето
 
 SEARCH_FIELD_SEARCH_ICON=Търсене
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Отказ
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Няма резултати от търсене
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Няма резултати от търсенето
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=Налични резултати: 1
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS=Налични резултати: {0}
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Редактиране на аватар
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Управление на акаунт

package/src/i18n/messagebundle_ca.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Seleccionar abast
 
 SEARCH_FIELD_LABEL=Camp de cerca
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Cercar a: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Esborrar cerca
 
 SEARCH_FIELD_SEARCH_ICON=Cercar
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Cancel·lar
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Cap resultat de cerca
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Cap resultat de cerca
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 resultat disponible
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} resultats disponibles
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Editar avatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Gestionar compte

package/src/i18n/messagebundle_cnr.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Odaberi opseg
 
 SEARCH_FIELD_LABEL=Polje traženja
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Traži u: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Izbriši traženje
 
 SEARCH_FIELD_SEARCH_ICON=Traži
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Odustani
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Nema rezultata traženja
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Nema rezultata traženja
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 rezultat dostupan
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} rezultata je dostupno
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Uredi avatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Upravljaj nalogom

package/src/i18n/messagebundle_cs.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Vybrat rozsah
 
 SEARCH_FIELD_LABEL=Vyhledávací pole
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Hledat v: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Vymazat hledání
 
 SEARCH_FIELD_SEARCH_ICON=Hledat
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Zrušit
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Žádné výsledky hledání
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Žádné výsledky hledání
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 výsledek k dispozici
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} výsled. k dispozici
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Upravit avatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Spravovat účet

package/src/i18n/messagebundle_cy.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Dewis Cwmpas
 
 SEARCH_FIELD_LABEL=Maes Chwilio
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Chwilio yn: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Clirio''r Chwiliad
 
 SEARCH_FIELD_SEARCH_ICON=Chwilio
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Canslo
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Dim canlyniadau chwilio
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Dim canlyniadau chwilio
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 canlyniad ar gael
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} canlyniad ar gael
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Golygu Afatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Rheoli Cyfrif

package/src/i18n/messagebundle_da.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Valgt omfang
 
 SEARCH_FIELD_LABEL=Søgefelt
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Søg i: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Ryd søgning
 
 SEARCH_FIELD_SEARCH_ICON=Søg
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Annuller
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Ingen søgeresultater
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Ingen søgeresultater
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 resultat tilgængeligt
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} resultater er tilgængelige
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Rediger avatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Administrer konto

package/src/i18n/messagebundle_de.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Umfang auswählen
 
 SEARCH_FIELD_LABEL=Suchfeld
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Suche in: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Suche zurücksetzen
 
 SEARCH_FIELD_SEARCH_ICON=Suche
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Abbrechen
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Keine Suchergebnisse
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Keine Suchergebnisse
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 Ergebnis verfügbar
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} Ergebnisse verfügbar
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Avatar bearbeiten
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Konto verwalten

package/src/i18n/messagebundle_el.properties

@@ -336,6 +336,8 @@ SEARCH_FIELD_SCOPE_SELECT_LABEL=Επιλογή Πεδίου Εφαρμογής
 
 SEARCH_FIELD_LABEL=Πεδίο Αναζήτησης
 
+SEARCH_FIELD_PLACEHOLDER_WITH_SCOPE=Αναζήτηση σε: {0}
+
 SEARCH_FIELD_CLEAR_ICON=Εκκαθάριση Αναζήτησης
 
 SEARCH_FIELD_SEARCH_ICON=Αναζήτηση
@@ -410,6 +412,12 @@ USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT=Ακύρωση
 
 USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT=Δεν υπάρχουν αποτελέσματα αναζήτησης
 
+USER_SETTINGS_DIALOG_SEARCH_NO_RESULTS=Δεν υπάρχουν αποτελέσματα αναζήτησης
+
+USER_SETTINGS_DIALOG_SEARCH_ONE_RESULT=1 αποτέλεσμα διαθέσιμο
+
+USER_SETTINGS_DIALOG_SEARCH_MORE_RESULTS={0} αποτελέσματα είναι διαθέσιμα
+
 USER_SETTINGS_ACCOUNT_EDIT_AVATAR_TXT=Επεξεργασία Avatar
 
 USER_SETTINGS_ACCOUNT_MANAGE_ACCOUNT_BUTTON_TXT=Διαχείριση Λογαριασμού