@sapudex/web-components 2.3.0 → 2.4.1

package/src/MastheadShell.ts

@@ -25,6 +25,7 @@ import type UDExMastheadProfileMenu from "./MastheadProfileMenu.js";
 import type UDExMastheadCountrySelector from "./MastheadCountrySelector.js";
 import MastheadShellTemplate from "./generated/templates/MastheadShellTemplate.lit.js";
 import { BreakpointUtils } from "./utils/Breakpoints.js";
+import AnalyticsName from "./types/AnalyticsName.js";
 
 // Styles
 import MastheadShellCss from "./generated/themes/MastheadShell.css.js";
@@ -35,6 +36,13 @@ type MastheadItemType = UDExMastheadItem | null | undefined;
 
 type UDExMastheadShellBaseEventDetail = {
   originalEvent: PointerEvent,
+  analyticsName: AnalyticsName,
+  sourceNode: HTMLElement,
+  item?: UDExMastheadItem,
+}
+
+type UDExMastheadShellAnalyticsNameEventDetail = {
+  analyticsName: AnalyticsName,
 }
 
 /**
@@ -155,10 +163,10 @@ type UDExMastheadShellBaseEventDetail = {
 
 class UDExMastheadShell extends UI5Element {
   eventDetails!: {
-    "mobile-menu-open": void,
-    "mobile-menu-close": void,
-    "search-opened": void,
-    "search-closed": void,
+    "mobile-menu-open": UDExMastheadShellAnalyticsNameEventDetail,
+    "mobile-menu-close": UDExMastheadShellAnalyticsNameEventDetail,
+    "search-opened": UDExMastheadShellAnalyticsNameEventDetail,
+    "search-closed": UDExMastheadShellAnalyticsNameEventDetail,
     "cart-click": UDExMastheadShellBaseEventDetail,
     "support-click": UDExMastheadShellBaseEventDetail,
     "profile-click": UDExMastheadShellBaseEventDetail,
@@ -498,37 +506,37 @@ class UDExMastheadShell extends UI5Element {
   }
 
   handleLogoClick(e: PointerEvent): void {
-    this.fireDecoratorEvent("logo-click", { originalEvent: e });
+    this.fireMastheadEvent("logo-click", e);
   }
 
   handleSiteLabelClick(e: PointerEvent): void {
-    this.fireDecoratorEvent("site-label-click", { originalEvent: e });
+    this.fireMastheadEvent("site-label-click", e);
   }
 
   handleSearchClick(e: PointerEvent): void {
     e.stopPropagation();
-    this.fireDecoratorEvent("search-click", { originalEvent: e });
+    this.fireMastheadEvent("search-click", e);
     this.openSearch();
   }
 
   handleCartClick(e: PointerEvent): void {
     e.stopPropagation();
-    this.fireDecoratorEvent("cart-click", { originalEvent: e });
+    this.fireMastheadEvent("cart-click", e);
   }
 
   handleProfileClick(e: PointerEvent): void {
     e.stopPropagation();
-    this.fireDecoratorEvent("profile-click", { originalEvent: e });
+    this.fireMastheadEvent("profile-click", e);
   }
 
   handleSupportClick(e: PointerEvent): void {
     e.stopPropagation();
-    this.fireDecoratorEvent("support-click", { originalEvent: e });
+    this.fireMastheadEvent("support-click", e);
   }
 
   handleCountrySelectorClick(e: PointerEvent): void {
     e.stopPropagation();
-    this.fireDecoratorEvent("country-selector-click", { originalEvent: e });
+    this.fireMastheadEvent("country-selector-click", e);
   }
 
   handleOpenMobileMenu(): void {
@@ -549,7 +557,7 @@ class UDExMastheadShell extends UI5Element {
 
   handleCloseSearch(e: PointerEvent): void {
     this._closeBtnClicked = true;
-    this.fireDecoratorEvent("search-close-click", { originalEvent: e });
+    this.fireMastheadEvent("search-close-click", e);
     this.closeSearch();
   }
 
@@ -736,13 +744,22 @@ class UDExMastheadShell extends UI5Element {
     });
   }
 
+  fireMastheadEvent(eventName: keyof this["eventDetails"], e?: PointerEvent): void {
+    const eventDetails = {
+      analyticsName: AnalyticsName.Header,
+      ...(e && { originalEvent: e }),
+      ...(e && { sourceNode: e.currentTarget as HTMLElement }),
+    } as this["eventDetails"][typeof eventName];
+    this.fireDecoratorEvent(eventName, eventDetails);
+  }
+
   /**
    * Close the search panel.
    * @public
    */
   closeSearch(): void {
     this._isSearchOpened = false;
-    this.fireDecoratorEvent("search-closed");
+    this.fireMastheadEvent("search-closed");
   }
 
   /**
@@ -766,7 +783,7 @@ class UDExMastheadShell extends UI5Element {
       this._searchOpener.selected = false;
     }
 
-    this.fireDecoratorEvent("search-opened");
+    this.fireMastheadEvent("search-opened");
   }
 
   /**

package/src/MessageStripTemplate.tsx

@@ -52,6 +52,7 @@ export default function MessageStripTemplate(this: UDExMessageStrip) {
           design="Tertiary"
           onClick={this._closeClick}
           tooltip={this._closeButtonText}
+          part="close-button"
         />
       )}
     </div>

package/src/SearchableListBase.ts

@@ -333,7 +333,12 @@ class UDExSearchableListBase extends UI5Element {
   }
 
   addSearchTermTag(text: string, str: string): string {
-    return text.replace(new RegExp(`(${str})`, "i"), "<b>$&</b>");
+    if (!str.length) {
+      return text;
+    }
+
+    const regex = new RegExp(`(${str})`, "i");
+    return text.replace(regex, "<b>$1</b>");
   }
 
   isIncludes(string: string, value: string): boolean {

package/src/SecondaryNavigation.ts

@@ -20,6 +20,8 @@ import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import { MORE } from "./generated/i18n/i18n-defaults.js";
 import SecondaryNavigationTemplate from "./generated/templates/SecondaryNavigationTemplate.lit.js";
 import { BreakpointUtils } from "./utils/Breakpoints.js";
+import parseArrayFromString from "./utils/parseArrayFromString.js";
+
 // Styles
 import SecondaryNavigationCss from "./generated/themes/SecondaryNavigation.css.js";
 
@@ -424,10 +426,6 @@ class UDExSecondaryNavigation extends UI5Element {
     });
   }
 
-  parseArrayFromString<T>(string: string): T[] {
-    return string ? JSON.parse(string) as T[] : [];
-  }
-
   resetTabIndex(): void {
     this.domNavItems.forEach((item, index) => {
       item._tabIndex = index === 0 ? "0" : "-1";
@@ -466,7 +464,7 @@ class UDExSecondaryNavigation extends UI5Element {
   }
 
   get parsedItems(): Array<NavItem> {
-    return this.parseArrayFromString<NavItem>(this.navItems);
+    return parseArrayFromString<NavItem>(this.navItems);
   }
 
   get visibleItems(): Array<NavItem> {

package/src/generated/i18n/i18n-defaults.ts

@@ -1,3 +1,3 @@
 import type { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";
-const COUNT: I18nText = {key: "COUNT", defaultText: "Count"};const OF: I18nText = {key: "OF", defaultText: "of"};const PAGINATION_PAGE: I18nText = {key: "PAGINATION_PAGE", defaultText: "Pagination page"};const SELECTED: I18nText = {key: "SELECTED", defaultText: "Selected"};const FIRST_PAGE: I18nText = {key: "FIRST_PAGE", defaultText: "First page"};const LAST_PAGE: I18nText = {key: "LAST_PAGE", defaultText: "Last page"};const PREVIOUS_PAGE: I18nText = {key: "PREVIOUS_PAGE", defaultText: "Previous page"};const NEXT_PAGE: I18nText = {key: "NEXT_PAGE", defaultText: "Next page"};const CURRENT_PAGE: I18nText = {key: "CURRENT_PAGE", defaultText: "Current page"};const ACTIVATE_PAGE: I18nText = {key: "ACTIVATE_PAGE", defaultText: "Activate page number"};const BUTTON_ARIA_TYPE_PRIMARY: I18nText = {key: "BUTTON_ARIA_TYPE_PRIMARY", defaultText: "Primary"};const BUTTON_ARIA_TYPE_SECONDARY: I18nText = {key: "BUTTON_ARIA_TYPE_SECONDARY", defaultText: "Secondary"};const BUTTON_ARIA_TYPE_TERTIARY: I18nText = {key: "BUTTON_ARIA_TYPE_TERTIARY", defaultText: "Tertiary"};const BUTTON_ARIA_TYPE_WARNING: I18nText = {key: "BUTTON_ARIA_TYPE_WARNING", defaultText: "Warning"};const BUTTON_ARIA_TYPE_POSITIVE: I18nText = {key: "BUTTON_ARIA_TYPE_POSITIVE", defaultText: "Positive"};const BUTTON_ARIA_TYPE_NEGATIVE: I18nText = {key: "BUTTON_ARIA_TYPE_NEGATIVE", defaultText: "Negative"};const BUTTON_ARIA_EMPHASIZED: I18nText = {key: "BUTTON_ARIA_EMPHASIZED", defaultText: "Emphasized"};const BUTTON_ARIA_DEFAULT: I18nText = {key: "BUTTON_ARIA_DEFAULT", defaultText: "Default"};const BUTTON_ARIA_TRANSPARENT: I18nText = {key: "BUTTON_ARIA_TRANSPARENT", defaultText: "Transparent"};const BUTTON_ARIA_ATTENTION: I18nText = {key: "BUTTON_ARIA_ATTENTION", defaultText: "Attention"};const TOGGLED: I18nText = {key: "TOGGLED", defaultText: "Toggled"};const SUGGESTED_TEXT: I18nText = {key: "SUGGESTED_TEXT", defaultText: "Suggested searches"};const ACCESSIBLE_NAME_RESET_ICON: I18nText = {key: "ACCESSIBLE_NAME_RESET_ICON", defaultText: "Clear"};const ACCESSIBLE_NAME_SEARCH_ICON: I18nText = {key: "ACCESSIBLE_NAME_SEARCH_ICON", defaultText: "Search"};const TOOLTIP_RESET_BUTTON: I18nText = {key: "TOOLTIP_RESET_BUTTON", defaultText: "Clear"};const TOOLTIP_VOICE_BUTTON: I18nText = {key: "TOOLTIP_VOICE_BUTTON", defaultText: "Voice"};const TOOLTIP_SUBMIT_BUTTON: I18nText = {key: "TOOLTIP_SUBMIT_BUTTON", defaultText: "Submit"};const LISTENING: I18nText = {key: "LISTENING", defaultText: "Listening"};const AVAILABLE_VALUES: I18nText = {key: "AVAILABLE_VALUES", defaultText: "Available Values"};const RECOMMENDED_TEXT: I18nText = {key: "RECOMMENDED_TEXT", defaultText: "Recommended pages"};const EXPAND_ALL: I18nText = {key: "EXPAND_ALL", defaultText: "Expand All"};const COLLAPSE_ALL: I18nText = {key: "COLLAPSE_ALL", defaultText: "Collapse All"};const MORE: I18nText = {key: "MORE", defaultText: "More"};const ATTENTION_BADGE: I18nText = {key: "ATTENTION_BADGE", defaultText: "Attention badge"};const REVIEWS: I18nText = {key: "REVIEWS", defaultText: "reviews"};const STARS: I18nText = {key: "STARS", defaultText: "stars"};const READ_MORE: I18nText = {key: "READ_MORE", defaultText: "Read more"};const READ_LESS: I18nText = {key: "READ_LESS", defaultText: "Read less"};const RATING_INDICATOR_TEXT: I18nText = {key: "RATING_INDICATOR_TEXT", defaultText: "Rating Indicator"};const RATING_INDICATOR_TOOLTIP_TEXT: I18nText = {key: "RATING_INDICATOR_TOOLTIP_TEXT", defaultText: "Rating"};const RATING_INDICATOR_ARIA_DESCRIPTION: I18nText = {key: "RATING_INDICATOR_ARIA_DESCRIPTION", defaultText: "Required"};const TOTAL: I18nText = {key: "TOTAL", defaultText: "Total"};const MESSAGE_STRIP_CLOSE_BUTTON: I18nText = {key: "MESSAGE_STRIP_CLOSE_BUTTON", defaultText: "Message Strip Close Button"};const MESSAGE_STRIP_INFORMATION: I18nText = {key: "MESSAGE_STRIP_INFORMATION", defaultText: "Information Bar"};const MESSAGE_STRIP_SUCCESS: I18nText = {key: "MESSAGE_STRIP_SUCCESS", defaultText: "Positive Bar"};const MESSAGE_STRIP_WARNING: I18nText = {key: "MESSAGE_STRIP_WARNING", defaultText: "Warning Bar"};const MESSAGE_STRIP_ERROR: I18nText = {key: "MESSAGE_STRIP_ERROR", defaultText: "Negative Bar"};const MESSAGE_STRIP_ACTION: I18nText = {key: "MESSAGE_STRIP_ACTION", defaultText: "Action Bar"};const ARIA_LABEL_LIST_MULTISELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_MULTISELECTABLE", defaultText: "Contains Multi-Selectable Items"};const ARIA_LABEL_LIST_SELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_SELECTABLE", defaultText: "Contains Selectable Items"};const UNSELECTED: I18nText = {key: "UNSELECTED", defaultText: "Unselected"};const INDETERMINATE: I18nText = {key: "INDETERMINATE", defaultText: "Indeterminate"};const EDIT_BUTTON: I18nText = {key: "EDIT_BUTTON", defaultText: "Edit"};const DELETE_BUTTON: I18nText = {key: "DELETE_BUTTON", defaultText: "Delete"};const TEXTAREA_CHARACTERS_LEFT: I18nText = {key: "TEXTAREA_CHARACTERS_LEFT", defaultText: "{0} characters remaining"};const VALUE_STATE_TYPE_ERROR: I18nText = {key: "VALUE_STATE_TYPE_ERROR", defaultText: "Field State Error"};const VALUE_STATE_TYPE_WARNING: I18nText = {key: "VALUE_STATE_TYPE_WARNING", defaultText: "Field State Warning"};const VALUE_STATE_TYPE_SUCCESS: I18nText = {key: "VALUE_STATE_TYPE_SUCCESS", defaultText: "Field State Success"};const VALUE_STATE_TYPE_STANDARD: I18nText = {key: "VALUE_STATE_TYPE_STANDARD", defaultText: "Field State Standard"};const TEXT_FIELD: I18nText = {key: "TEXT_FIELD", defaultText: "Text field"};const CAROUSEL_PREVIOUS_ARROW_TEXT: I18nText = {key: "CAROUSEL_PREVIOUS_ARROW_TEXT", defaultText: "Previous Page"};const CAROUSEL_NEXT_ARROW_TEXT: I18nText = {key: "CAROUSEL_NEXT_ARROW_TEXT", defaultText: "Next Page"};const SHOW_RESULTS: I18nText = {key: "SHOW_RESULTS", defaultText: "Show Results"};const RESET: I18nText = {key: "RESET", defaultText: "Reset"};const SELECT_OPTIONS: I18nText = {key: "SELECT_OPTIONS", defaultText: "Select Options"};const SELECT_ALL: I18nText = {key: "SELECT_ALL", defaultText: "Select All"};const BREADCRUMBS_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_ARIA_LABEL", defaultText: "Breadcrumb Trail"};const BREADCRUMBS_OVERFLOW_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_OVERFLOW_ARIA_LABEL", defaultText: "More"};const STEPINPUT_INC_ICON_TITLE: I18nText = {key: "STEPINPUT_INC_ICON_TITLE", defaultText: "Increase Quantity by"};const STEPINPUT_DEC_ICON_TITLE: I18nText = {key: "STEPINPUT_DEC_ICON_TITLE", defaultText: "Decrease Quantity by"};const NO_MATCHES_FOUND: I18nText = {key: "NO_MATCHES_FOUND", defaultText: "No matches found."};const VALUE_STATE_ERROR: I18nText = {key: "VALUE_STATE_ERROR", defaultText: "Invalid entry"};const VALUE_STATE_WARNING: I18nText = {key: "VALUE_STATE_WARNING", defaultText: "Warning issued"};const VALUE_STATE_INFORMATION: I18nText = {key: "VALUE_STATE_INFORMATION", defaultText: "Informative entry"};const VALUE_STATE_SUCCESS: I18nText = {key: "VALUE_STATE_SUCCESS", defaultText: "Entry successfully validated"};const READ_ONLY: I18nText = {key: "READ_ONLY", defaultText: "Read only"};const MAIN_LINKS: I18nText = {key: "MAIN_LINKS", defaultText: "main links"};const OPENS_IN_A_NEW_WINDOW: I18nText = {key: "OPENS_IN_A_NEW_WINDOW", defaultText: "opens in a new window"};const LOGOUT: I18nText = {key: "LOGOUT", defaultText: "Logout"};const PROFILE: I18nText = {key: "PROFILE", defaultText: "Profile"};const COUNTRY_SELECT: I18nText = {key: "COUNTRY_SELECT", defaultText: "Select country"};const OVERVIEW: I18nText = {key: "OVERVIEW", defaultText: "Overview"};const CART: I18nText = {key: "CART", defaultText: "Cart"};const COUNTRY_SELECTOR: I18nText = {key: "COUNTRY_SELECTOR", defaultText: "Country Selector"};const SUPPORT: I18nText = {key: "SUPPORT", defaultText: "Support"};const SHOW_HIDE_PASSWORD: I18nText = {key: "SHOW_HIDE_PASSWORD", defaultText: "Show/Hide Password Button"};const SOCIAL_LINK_ICON: I18nText = {key: "SOCIAL_LINK_ICON", defaultText: "Link Graphic"};const PHONE_NUMBER: I18nText = {key: "PHONE_NUMBER", defaultText: "Phone number"};const CONTACT_US: I18nText = {key: "CONTACT_US", defaultText: "Contact us"};const EMAIL: I18nText = {key: "EMAIL", defaultText: "Email"};const CHAT_WITH_US: I18nText = {key: "CHAT_WITH_US", defaultText: "Chat with us"};const QUICK_LINKS: I18nText = {key: "QUICK_LINKS", defaultText: "Quick Links"};const TRENDING: I18nText = {key: "TRENDING", defaultText: "Trending"};const ABOUT_SAP: I18nText = {key: "ABOUT_SAP", defaultText: "About SAP"};const SITE_INFORMATION: I18nText = {key: "SITE_INFORMATION", defaultText: "Site Information"};const SEE_COMPLETE_LIST: I18nText = {key: "SEE_COMPLETE_LIST", defaultText: "Or see our complete list of"};const LOCAL_COUNTRY_NAMES: I18nText = {key: "LOCAL_COUNTRY_NAMES", defaultText: "local country numbers"};const COPYRIGHT: I18nText = {key: "COPYRIGHT", defaultText: "© {0} SAP SE or an SAP affiliate company. All rights reserved."};const PUBLIC_SECURITY_NETWORK_NUMBER: I18nText = {key: "PUBLIC_SECURITY_NETWORK_NUMBER", defaultText: ""};const ICP_NUMBER: I18nText = {key: "ICP_NUMBER", defaultText: ""};const AVATAR_TEXT: I18nText = {key: "AVATAR_TEXT", defaultText: "Avatar"};const DISABLED: I18nText = {key: "DISABLED", defaultText: "Disabled"};const STATUS_BADGE_TEXT: I18nText = {key: "STATUS_BADGE_TEXT", defaultText: "Status Badge"};const STATUS_BADGE_EDIT_TITLE: I18nText = {key: "STATUS_BADGE_EDIT_TITLE", defaultText: "Click to edit profile"};const STATUS_BADGE_INFORMATION_TITLE: I18nText = {key: "STATUS_BADGE_INFORMATION_TITLE", defaultText: "Click to open profile information"};const STATUS_BADGE_WARNING_TITLE: I18nText = {key: "STATUS_BADGE_WARNING_TITLE", defaultText: "Warning, potential risk with the profile"};const STATUS_BADGE_ERROR_TITLE: I18nText = {key: "STATUS_BADGE_ERROR_TITLE", defaultText: "There is an error with the profile"};const STATUS_BADGE_SUCCESS_TITLE: I18nText = {key: "STATUS_BADGE_SUCCESS_TITLE", defaultText: "Successfully verified profile"};const CALENDAR_ICON: I18nText = {key: "CALENDAR_ICON", defaultText: "Open Calendar icon"};const DATEPICKER_DATE_DESCRIPTION: I18nText = {key: "DATEPICKER_DATE_DESCRIPTION", defaultText: "Date Input"};const TABLE_NO_DATA_FOUND: I18nText = {key: "TABLE_NO_DATA_FOUND", defaultText: "No data found"};const LIST_ITEM_EDIT_ICON: I18nText = {key: "LIST_ITEM_EDIT_ICON", defaultText: "Edit list item entry"};const LIST_ITEM_DELETE_ICON: I18nText = {key: "LIST_ITEM_DELETE_ICON", defaultText: "Delete list item entry"};const BACK_BUTTON_LABEL: I18nText = {key: "BACK_BUTTON_LABEL", defaultText: "back button label"};const TRIGGER: I18nText = {key: "TRIGGER", defaultText: "Dropdown trigger"};const UPLOADING_FILE_STATUS_TEXT: I18nText = {key: "UPLOADING_FILE_STATUS_TEXT", defaultText: "Uploading"};const TERMINATED_FILE_STATUS_TEXT: I18nText = {key: "TERMINATED_FILE_STATUS_TEXT", defaultText: "Terminated"};const REMOVE_FILE_TEXT: I18nText = {key: "REMOVE_FILE_TEXT", defaultText: "Remove file"};const UPLOAD_BUTTON_LABEL: I18nText = {key: "UPLOAD_BUTTON_LABEL", defaultText: "Upload file"};
-export {COUNT,OF,PAGINATION_PAGE,SELECTED,FIRST_PAGE,LAST_PAGE,PREVIOUS_PAGE,NEXT_PAGE,CURRENT_PAGE,ACTIVATE_PAGE,BUTTON_ARIA_TYPE_PRIMARY,BUTTON_ARIA_TYPE_SECONDARY,BUTTON_ARIA_TYPE_TERTIARY,BUTTON_ARIA_TYPE_WARNING,BUTTON_ARIA_TYPE_POSITIVE,BUTTON_ARIA_TYPE_NEGATIVE,BUTTON_ARIA_EMPHASIZED,BUTTON_ARIA_DEFAULT,BUTTON_ARIA_TRANSPARENT,BUTTON_ARIA_ATTENTION,TOGGLED,SUGGESTED_TEXT,ACCESSIBLE_NAME_RESET_ICON,ACCESSIBLE_NAME_SEARCH_ICON,TOOLTIP_RESET_BUTTON,TOOLTIP_VOICE_BUTTON,TOOLTIP_SUBMIT_BUTTON,LISTENING,AVAILABLE_VALUES,RECOMMENDED_TEXT,EXPAND_ALL,COLLAPSE_ALL,MORE,ATTENTION_BADGE,REVIEWS,STARS,READ_MORE,READ_LESS,RATING_INDICATOR_TEXT,RATING_INDICATOR_TOOLTIP_TEXT,RATING_INDICATOR_ARIA_DESCRIPTION,TOTAL,MESSAGE_STRIP_CLOSE_BUTTON,MESSAGE_STRIP_INFORMATION,MESSAGE_STRIP_SUCCESS,MESSAGE_STRIP_WARNING,MESSAGE_STRIP_ERROR,MESSAGE_STRIP_ACTION,ARIA_LABEL_LIST_MULTISELECTABLE,ARIA_LABEL_LIST_SELECTABLE,UNSELECTED,INDETERMINATE,EDIT_BUTTON,DELETE_BUTTON,TEXTAREA_CHARACTERS_LEFT,VALUE_STATE_TYPE_ERROR,VALUE_STATE_TYPE_WARNING,VALUE_STATE_TYPE_SUCCESS,VALUE_STATE_TYPE_STANDARD,TEXT_FIELD,CAROUSEL_PREVIOUS_ARROW_TEXT,CAROUSEL_NEXT_ARROW_TEXT,SHOW_RESULTS,RESET,SELECT_OPTIONS,SELECT_ALL,BREADCRUMBS_ARIA_LABEL,BREADCRUMBS_OVERFLOW_ARIA_LABEL,STEPINPUT_INC_ICON_TITLE,STEPINPUT_DEC_ICON_TITLE,NO_MATCHES_FOUND,VALUE_STATE_ERROR,VALUE_STATE_WARNING,VALUE_STATE_INFORMATION,VALUE_STATE_SUCCESS,READ_ONLY,MAIN_LINKS,OPENS_IN_A_NEW_WINDOW,LOGOUT,PROFILE,COUNTRY_SELECT,OVERVIEW,CART,COUNTRY_SELECTOR,SUPPORT,SHOW_HIDE_PASSWORD,SOCIAL_LINK_ICON,PHONE_NUMBER,CONTACT_US,EMAIL,CHAT_WITH_US,QUICK_LINKS,TRENDING,ABOUT_SAP,SITE_INFORMATION,SEE_COMPLETE_LIST,LOCAL_COUNTRY_NAMES,COPYRIGHT,PUBLIC_SECURITY_NETWORK_NUMBER,ICP_NUMBER,AVATAR_TEXT,DISABLED,STATUS_BADGE_TEXT,STATUS_BADGE_EDIT_TITLE,STATUS_BADGE_INFORMATION_TITLE,STATUS_BADGE_WARNING_TITLE,STATUS_BADGE_ERROR_TITLE,STATUS_BADGE_SUCCESS_TITLE,CALENDAR_ICON,DATEPICKER_DATE_DESCRIPTION,TABLE_NO_DATA_FOUND,LIST_ITEM_EDIT_ICON,LIST_ITEM_DELETE_ICON,BACK_BUTTON_LABEL,TRIGGER,UPLOADING_FILE_STATUS_TEXT,TERMINATED_FILE_STATUS_TEXT,REMOVE_FILE_TEXT,UPLOAD_BUTTON_LABEL};
+const COUNT: I18nText = {key: "COUNT", defaultText: "Count"};const OF: I18nText = {key: "OF", defaultText: "of"};const PAGINATION_PAGE: I18nText = {key: "PAGINATION_PAGE", defaultText: "Pagination page"};const SELECTED: I18nText = {key: "SELECTED", defaultText: "Selected"};const FIRST_PAGE: I18nText = {key: "FIRST_PAGE", defaultText: "First page"};const LAST_PAGE: I18nText = {key: "LAST_PAGE", defaultText: "Last page"};const PREVIOUS_PAGE: I18nText = {key: "PREVIOUS_PAGE", defaultText: "Previous page"};const NEXT_PAGE: I18nText = {key: "NEXT_PAGE", defaultText: "Next page"};const CURRENT_PAGE: I18nText = {key: "CURRENT_PAGE", defaultText: "Current page"};const ACTIVATE_PAGE: I18nText = {key: "ACTIVATE_PAGE", defaultText: "Activate page number"};const BUTTON_ARIA_TYPE_PRIMARY: I18nText = {key: "BUTTON_ARIA_TYPE_PRIMARY", defaultText: "Primary"};const BUTTON_ARIA_TYPE_SECONDARY: I18nText = {key: "BUTTON_ARIA_TYPE_SECONDARY", defaultText: "Secondary"};const BUTTON_ARIA_TYPE_TERTIARY: I18nText = {key: "BUTTON_ARIA_TYPE_TERTIARY", defaultText: "Tertiary"};const BUTTON_ARIA_TYPE_WARNING: I18nText = {key: "BUTTON_ARIA_TYPE_WARNING", defaultText: "Warning"};const BUTTON_ARIA_TYPE_POSITIVE: I18nText = {key: "BUTTON_ARIA_TYPE_POSITIVE", defaultText: "Positive"};const BUTTON_ARIA_TYPE_NEGATIVE: I18nText = {key: "BUTTON_ARIA_TYPE_NEGATIVE", defaultText: "Negative"};const BUTTON_ARIA_EMPHASIZED: I18nText = {key: "BUTTON_ARIA_EMPHASIZED", defaultText: "Emphasized"};const BUTTON_ARIA_DEFAULT: I18nText = {key: "BUTTON_ARIA_DEFAULT", defaultText: "Default"};const BUTTON_ARIA_TRANSPARENT: I18nText = {key: "BUTTON_ARIA_TRANSPARENT", defaultText: "Transparent"};const BUTTON_ARIA_ATTENTION: I18nText = {key: "BUTTON_ARIA_ATTENTION", defaultText: "Attention"};const TOGGLED: I18nText = {key: "TOGGLED", defaultText: "Toggled"};const SUGGESTED_TEXT: I18nText = {key: "SUGGESTED_TEXT", defaultText: "Suggested searches"};const ACCESSIBLE_NAME_RESET_ICON: I18nText = {key: "ACCESSIBLE_NAME_RESET_ICON", defaultText: "Clear"};const ACCESSIBLE_NAME_SEARCH_ICON: I18nText = {key: "ACCESSIBLE_NAME_SEARCH_ICON", defaultText: "Search"};const TOOLTIP_RESET_BUTTON: I18nText = {key: "TOOLTIP_RESET_BUTTON", defaultText: "Clear"};const TOOLTIP_VOICE_BUTTON: I18nText = {key: "TOOLTIP_VOICE_BUTTON", defaultText: "Voice"};const TOOLTIP_SUBMIT_BUTTON: I18nText = {key: "TOOLTIP_SUBMIT_BUTTON", defaultText: "Submit"};const LISTENING: I18nText = {key: "LISTENING", defaultText: "Listening"};const AVAILABLE_VALUES: I18nText = {key: "AVAILABLE_VALUES", defaultText: "Available Values"};const RECOMMENDED_TEXT: I18nText = {key: "RECOMMENDED_TEXT", defaultText: "Recommended pages"};const EXPAND_ALL: I18nText = {key: "EXPAND_ALL", defaultText: "Expand All"};const COLLAPSE_ALL: I18nText = {key: "COLLAPSE_ALL", defaultText: "Collapse All"};const MORE: I18nText = {key: "MORE", defaultText: "More"};const ATTENTION_BADGE: I18nText = {key: "ATTENTION_BADGE", defaultText: "Attention badge"};const REVIEWS: I18nText = {key: "REVIEWS", defaultText: "reviews"};const STARS: I18nText = {key: "STARS", defaultText: "stars"};const READ_MORE: I18nText = {key: "READ_MORE", defaultText: "Read more"};const READ_LESS: I18nText = {key: "READ_LESS", defaultText: "Read less"};const RATING_INDICATOR_TEXT: I18nText = {key: "RATING_INDICATOR_TEXT", defaultText: "Rating Indicator"};const RATING_INDICATOR_TOOLTIP_TEXT: I18nText = {key: "RATING_INDICATOR_TOOLTIP_TEXT", defaultText: "Rating"};const RATING_INDICATOR_ARIA_DESCRIPTION: I18nText = {key: "RATING_INDICATOR_ARIA_DESCRIPTION", defaultText: "Required"};const TOTAL: I18nText = {key: "TOTAL", defaultText: "Total"};const MESSAGE_STRIP_CLOSE_BUTTON: I18nText = {key: "MESSAGE_STRIP_CLOSE_BUTTON", defaultText: "Message Strip Close Button"};const MESSAGE_STRIP_INFORMATION: I18nText = {key: "MESSAGE_STRIP_INFORMATION", defaultText: "Information Bar"};const MESSAGE_STRIP_SUCCESS: I18nText = {key: "MESSAGE_STRIP_SUCCESS", defaultText: "Positive Bar"};const MESSAGE_STRIP_WARNING: I18nText = {key: "MESSAGE_STRIP_WARNING", defaultText: "Warning Bar"};const MESSAGE_STRIP_ERROR: I18nText = {key: "MESSAGE_STRIP_ERROR", defaultText: "Negative Bar"};const MESSAGE_STRIP_ACTION: I18nText = {key: "MESSAGE_STRIP_ACTION", defaultText: "Action Bar"};const ARIA_LABEL_LIST_MULTISELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_MULTISELECTABLE", defaultText: "Contains Multi-Selectable Items"};const ARIA_LABEL_LIST_SELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_SELECTABLE", defaultText: "Contains Selectable Items"};const UNSELECTED: I18nText = {key: "UNSELECTED", defaultText: "Unselected"};const INDETERMINATE: I18nText = {key: "INDETERMINATE", defaultText: "Indeterminate"};const EDIT_BUTTON: I18nText = {key: "EDIT_BUTTON", defaultText: "Edit"};const DELETE_BUTTON: I18nText = {key: "DELETE_BUTTON", defaultText: "Delete"};const TEXTAREA_CHARACTERS_LEFT: I18nText = {key: "TEXTAREA_CHARACTERS_LEFT", defaultText: "{0} characters remaining"};const VALUE_STATE_TYPE_ERROR: I18nText = {key: "VALUE_STATE_TYPE_ERROR", defaultText: "Field State Error"};const VALUE_STATE_TYPE_WARNING: I18nText = {key: "VALUE_STATE_TYPE_WARNING", defaultText: "Field State Warning"};const VALUE_STATE_TYPE_SUCCESS: I18nText = {key: "VALUE_STATE_TYPE_SUCCESS", defaultText: "Field State Success"};const VALUE_STATE_TYPE_STANDARD: I18nText = {key: "VALUE_STATE_TYPE_STANDARD", defaultText: "Field State Standard"};const TEXT_FIELD: I18nText = {key: "TEXT_FIELD", defaultText: "Text field"};const CAROUSEL_PREVIOUS_ARROW_TEXT: I18nText = {key: "CAROUSEL_PREVIOUS_ARROW_TEXT", defaultText: "Previous Page"};const CAROUSEL_NEXT_ARROW_TEXT: I18nText = {key: "CAROUSEL_NEXT_ARROW_TEXT", defaultText: "Next Page"};const SHOW_RESULTS: I18nText = {key: "SHOW_RESULTS", defaultText: "Show Results"};const RESET: I18nText = {key: "RESET", defaultText: "Reset"};const SELECT_OPTIONS: I18nText = {key: "SELECT_OPTIONS", defaultText: "Select Options"};const SELECT_ALL: I18nText = {key: "SELECT_ALL", defaultText: "Select All"};const BREADCRUMBS_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_ARIA_LABEL", defaultText: "Breadcrumb Trail"};const BREADCRUMBS_OVERFLOW_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_OVERFLOW_ARIA_LABEL", defaultText: "More"};const STEPINPUT_INC_ICON_TITLE: I18nText = {key: "STEPINPUT_INC_ICON_TITLE", defaultText: "Increase Quantity by"};const STEPINPUT_DEC_ICON_TITLE: I18nText = {key: "STEPINPUT_DEC_ICON_TITLE", defaultText: "Decrease Quantity by"};const NO_MATCHES_FOUND: I18nText = {key: "NO_MATCHES_FOUND", defaultText: "No matches found."};const VALUE_STATE_ERROR: I18nText = {key: "VALUE_STATE_ERROR", defaultText: "Invalid entry"};const VALUE_STATE_WARNING: I18nText = {key: "VALUE_STATE_WARNING", defaultText: "Warning issued"};const VALUE_STATE_INFORMATION: I18nText = {key: "VALUE_STATE_INFORMATION", defaultText: "Informative entry"};const VALUE_STATE_SUCCESS: I18nText = {key: "VALUE_STATE_SUCCESS", defaultText: "Entry successfully validated"};const READ_ONLY: I18nText = {key: "READ_ONLY", defaultText: "Read only"};const MAIN_LINKS: I18nText = {key: "MAIN_LINKS", defaultText: "main links"};const OPENS_IN_A_NEW_WINDOW: I18nText = {key: "OPENS_IN_A_NEW_WINDOW", defaultText: "opens in a new window"};const LOGOUT: I18nText = {key: "LOGOUT", defaultText: "Logout"};const PROFILE: I18nText = {key: "PROFILE", defaultText: "Profile"};const COUNTRY_SELECT: I18nText = {key: "COUNTRY_SELECT", defaultText: "Select country"};const OVERVIEW: I18nText = {key: "OVERVIEW", defaultText: "Overview"};const CART: I18nText = {key: "CART", defaultText: "Cart"};const COUNTRY_SELECTOR: I18nText = {key: "COUNTRY_SELECTOR", defaultText: "Country Selector"};const SUPPORT: I18nText = {key: "SUPPORT", defaultText: "Support"};const SEARCH: I18nText = {key: "SEARCH", defaultText: "Search"};const SHOW_HIDE_PASSWORD: I18nText = {key: "SHOW_HIDE_PASSWORD", defaultText: "Show/Hide Password Button"};const SOCIAL_LINK_ICON: I18nText = {key: "SOCIAL_LINK_ICON", defaultText: "Link Graphic"};const PHONE_NUMBER: I18nText = {key: "PHONE_NUMBER", defaultText: "Phone number"};const CONTACT_US: I18nText = {key: "CONTACT_US", defaultText: "Contact us"};const EMAIL: I18nText = {key: "EMAIL", defaultText: "Email"};const CHAT_WITH_US: I18nText = {key: "CHAT_WITH_US", defaultText: "Chat with us"};const QUICK_LINKS: I18nText = {key: "QUICK_LINKS", defaultText: "Quick Links"};const TRENDING: I18nText = {key: "TRENDING", defaultText: "Trending"};const ABOUT_SAP: I18nText = {key: "ABOUT_SAP", defaultText: "About SAP"};const SITE_INFORMATION: I18nText = {key: "SITE_INFORMATION", defaultText: "Site Information"};const SEE_COMPLETE_LIST: I18nText = {key: "SEE_COMPLETE_LIST", defaultText: "Or see our complete list of"};const LOCAL_COUNTRY_NAMES: I18nText = {key: "LOCAL_COUNTRY_NAMES", defaultText: "local country numbers"};const COPYRIGHT: I18nText = {key: "COPYRIGHT", defaultText: "© {0} SAP SE or an SAP affiliate company. All rights reserved."};const PUBLIC_SECURITY_NETWORK_NUMBER: I18nText = {key: "PUBLIC_SECURITY_NETWORK_NUMBER", defaultText: ""};const ICP_NUMBER: I18nText = {key: "ICP_NUMBER", defaultText: ""};const AVATAR_TEXT: I18nText = {key: "AVATAR_TEXT", defaultText: "Avatar"};const DISABLED: I18nText = {key: "DISABLED", defaultText: "Disabled"};const STATUS_BADGE_TEXT: I18nText = {key: "STATUS_BADGE_TEXT", defaultText: "Status Badge"};const STATUS_BADGE_EDIT_TITLE: I18nText = {key: "STATUS_BADGE_EDIT_TITLE", defaultText: "Click to edit profile"};const STATUS_BADGE_INFORMATION_TITLE: I18nText = {key: "STATUS_BADGE_INFORMATION_TITLE", defaultText: "Click to open profile information"};const STATUS_BADGE_WARNING_TITLE: I18nText = {key: "STATUS_BADGE_WARNING_TITLE", defaultText: "Warning, potential risk with the profile"};const STATUS_BADGE_ERROR_TITLE: I18nText = {key: "STATUS_BADGE_ERROR_TITLE", defaultText: "There is an error with the profile"};const STATUS_BADGE_SUCCESS_TITLE: I18nText = {key: "STATUS_BADGE_SUCCESS_TITLE", defaultText: "Successfully verified profile"};const CALENDAR_ICON: I18nText = {key: "CALENDAR_ICON", defaultText: "Open Calendar icon"};const DATEPICKER_DATE_DESCRIPTION: I18nText = {key: "DATEPICKER_DATE_DESCRIPTION", defaultText: "Date Input"};const TABLE_NO_DATA_FOUND: I18nText = {key: "TABLE_NO_DATA_FOUND", defaultText: "No data found"};const LIST_ITEM_EDIT_ICON: I18nText = {key: "LIST_ITEM_EDIT_ICON", defaultText: "Edit list item entry"};const LIST_ITEM_DELETE_ICON: I18nText = {key: "LIST_ITEM_DELETE_ICON", defaultText: "Delete list item entry"};const BACK_BUTTON_LABEL: I18nText = {key: "BACK_BUTTON_LABEL", defaultText: "back button label"};const TRIGGER: I18nText = {key: "TRIGGER", defaultText: "Dropdown trigger"};const UPLOADING_FILE_STATUS_TEXT: I18nText = {key: "UPLOADING_FILE_STATUS_TEXT", defaultText: "Uploading"};const TERMINATED_FILE_STATUS_TEXT: I18nText = {key: "TERMINATED_FILE_STATUS_TEXT", defaultText: "Terminated"};const REMOVE_FILE_TEXT: I18nText = {key: "REMOVE_FILE_TEXT", defaultText: "Remove file"};const UPLOAD_BUTTON_LABEL: I18nText = {key: "UPLOAD_BUTTON_LABEL", defaultText: "Upload file"};const COMPLETE_LIST_OF: I18nText = {key: "COMPLETE_LIST_OF", defaultText: "Complete list of"};const CALL_US_TODAY: I18nText = {key: "CALL_US_TODAY", defaultText: "Call us today!"};
+export {COUNT,OF,PAGINATION_PAGE,SELECTED,FIRST_PAGE,LAST_PAGE,PREVIOUS_PAGE,NEXT_PAGE,CURRENT_PAGE,ACTIVATE_PAGE,BUTTON_ARIA_TYPE_PRIMARY,BUTTON_ARIA_TYPE_SECONDARY,BUTTON_ARIA_TYPE_TERTIARY,BUTTON_ARIA_TYPE_WARNING,BUTTON_ARIA_TYPE_POSITIVE,BUTTON_ARIA_TYPE_NEGATIVE,BUTTON_ARIA_EMPHASIZED,BUTTON_ARIA_DEFAULT,BUTTON_ARIA_TRANSPARENT,BUTTON_ARIA_ATTENTION,TOGGLED,SUGGESTED_TEXT,ACCESSIBLE_NAME_RESET_ICON,ACCESSIBLE_NAME_SEARCH_ICON,TOOLTIP_RESET_BUTTON,TOOLTIP_VOICE_BUTTON,TOOLTIP_SUBMIT_BUTTON,LISTENING,AVAILABLE_VALUES,RECOMMENDED_TEXT,EXPAND_ALL,COLLAPSE_ALL,MORE,ATTENTION_BADGE,REVIEWS,STARS,READ_MORE,READ_LESS,RATING_INDICATOR_TEXT,RATING_INDICATOR_TOOLTIP_TEXT,RATING_INDICATOR_ARIA_DESCRIPTION,TOTAL,MESSAGE_STRIP_CLOSE_BUTTON,MESSAGE_STRIP_INFORMATION,MESSAGE_STRIP_SUCCESS,MESSAGE_STRIP_WARNING,MESSAGE_STRIP_ERROR,MESSAGE_STRIP_ACTION,ARIA_LABEL_LIST_MULTISELECTABLE,ARIA_LABEL_LIST_SELECTABLE,UNSELECTED,INDETERMINATE,EDIT_BUTTON,DELETE_BUTTON,TEXTAREA_CHARACTERS_LEFT,VALUE_STATE_TYPE_ERROR,VALUE_STATE_TYPE_WARNING,VALUE_STATE_TYPE_SUCCESS,VALUE_STATE_TYPE_STANDARD,TEXT_FIELD,CAROUSEL_PREVIOUS_ARROW_TEXT,CAROUSEL_NEXT_ARROW_TEXT,SHOW_RESULTS,RESET,SELECT_OPTIONS,SELECT_ALL,BREADCRUMBS_ARIA_LABEL,BREADCRUMBS_OVERFLOW_ARIA_LABEL,STEPINPUT_INC_ICON_TITLE,STEPINPUT_DEC_ICON_TITLE,NO_MATCHES_FOUND,VALUE_STATE_ERROR,VALUE_STATE_WARNING,VALUE_STATE_INFORMATION,VALUE_STATE_SUCCESS,READ_ONLY,MAIN_LINKS,OPENS_IN_A_NEW_WINDOW,LOGOUT,PROFILE,COUNTRY_SELECT,OVERVIEW,CART,COUNTRY_SELECTOR,SUPPORT,SEARCH,SHOW_HIDE_PASSWORD,SOCIAL_LINK_ICON,PHONE_NUMBER,CONTACT_US,EMAIL,CHAT_WITH_US,QUICK_LINKS,TRENDING,ABOUT_SAP,SITE_INFORMATION,SEE_COMPLETE_LIST,LOCAL_COUNTRY_NAMES,COPYRIGHT,PUBLIC_SECURITY_NETWORK_NUMBER,ICP_NUMBER,AVATAR_TEXT,DISABLED,STATUS_BADGE_TEXT,STATUS_BADGE_EDIT_TITLE,STATUS_BADGE_INFORMATION_TITLE,STATUS_BADGE_WARNING_TITLE,STATUS_BADGE_ERROR_TITLE,STATUS_BADGE_SUCCESS_TITLE,CALENDAR_ICON,DATEPICKER_DATE_DESCRIPTION,TABLE_NO_DATA_FOUND,LIST_ITEM_EDIT_ICON,LIST_ITEM_DELETE_ICON,BACK_BUTTON_LABEL,TRIGGER,UPLOADING_FILE_STATUS_TEXT,TERMINATED_FILE_STATUS_TEXT,REMOVE_FILE_TEXT,UPLOAD_BUTTON_LABEL,COMPLETE_LIST_OF,CALL_US_TODAY};

package/src/generated/templates/AccordionTemplate.lit.ts

@@ -5,8 +5,10 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type Accordion from "../../Accordion.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-accordion" @keydown="${this.keydownHandler}" @ui5-accordion-item-focus="${ifDefined(this.itemFocusHandler)}"><div class="udex-accordion__head" part="head"><h3 class="udex-accordion__headline">${ifDefined(this.headlineText)}</h3><${scopeTag("udex-button", tags, suffix)} class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</${scopeTag("udex-button", tags, suffix)}></div><div class="udex-accordion__content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></div>` : html`<div class="udex-accordion" @keydown="${this.keydownHandler}" @ui5-accordion-item-focus="${ifDefined(this.itemFocusHandler)}"><div class="udex-accordion__head" part="head"><h3 class="udex-accordion__headline">${ifDefined(this.headlineText)}</h3><udex-button class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</udex-button></div><div class="udex-accordion__content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></div>`;}
-function block1 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item.item._individualSlot)}"></slot>`;}
+function block0 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-accordion" @keydown="${this.keydownHandler}" @ui5-accordion-item-focus="${ifDefined(this.itemFocusHandler)}"><div class="udex-accordion__head" part="head">${ this.headline ? block1.call(this, context, tags, suffix) : undefined }${ !this.hideExpandButton ? block2.call(this, context, tags, suffix) : undefined }</div><div class="udex-accordion__content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></div>`;}
+function block1 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<h3 class="udex-accordion__headline">${ifDefined(this.headline)}</h3>`;}
+function block2 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</udex-button>`;}
+function block3 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item.item._individualSlot)}"></slot>`;}
 
 function template(this: Accordion) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

package/src/generated/templates/MastheadCountrySelectorTemplate.lit.ts

@@ -7,10 +7,10 @@ import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-country-selector" @keydown="${this.handleKeyDown}">${ this._isActiveRegionOpen ? block1.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) }</div>`;}
 function block1 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-country-selector__title">${ifDefined(this.countryTitle)}</span>${ !this.isSingleMode ? block2.call(this, context, tags, suffix) : undefined }<${scopeTag("udex-search", tags, suffix)} class="udex-masthead-country-selector__search" @ui5-handle-value-search="${ifDefined(this.handleSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleSearchReset)}" @ui5-submit-search-value="${ifDefined(this.handleSearch)}" language-voice="${ifDefined(this.languageVoice)}" label="${ifDefined(this.searchLabel)}" mode="${ifDefined(this.homeSearchMode)}" ?show-voice-button="${this.showSearchVoiceButton}" non-interactive-submit-button show-submit-button></${scopeTag("udex-search", tags, suffix)}><ul class="udex-masthead-country-selector__list udex-masthead-country-selector__list_countries" role="menu">${ repeat(this._activeCountries, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</ul>` : html`<span class="udex-masthead-country-selector__title">${ifDefined(this.countryTitle)}</span>${ !this.isSingleMode ? block2.call(this, context, tags, suffix) : undefined }<udex-search class="udex-masthead-country-selector__search" @ui5-handle-value-search="${ifDefined(this.handleSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleSearchReset)}" @ui5-submit-search-value="${ifDefined(this.handleSearch)}" language-voice="${ifDefined(this.languageVoice)}" label="${ifDefined(this.searchLabel)}" mode="${ifDefined(this.homeSearchMode)}" ?show-voice-button="${this.showSearchVoiceButton}" non-interactive-submit-button show-submit-button></udex-search><ul class="udex-masthead-country-selector__list udex-masthead-country-selector__list_countries" role="menu">${ repeat(this._activeCountries, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</ul>`;}
-function block2 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-country-selector__region-back-item" @click="${this.backToRegions}" label="${ifDefined(this._activeRegion?.title)}" type="Button" is-back icon-start></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-country-selector__region-back-item" @click="${this.backToRegions}" label="${ifDefined(this._activeRegion?.title)}" type="Button" is-back icon-start></udex-masthead-menu-item>`;}
-function block3 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries" @click="${this.fireEventCountryItemClick}" _country-code="${ifDefined(item.countryCode)}" url="${ifDefined(item.url)}" label="${ifDefined(item.displayTitle)}" index="${index}" is-nav-item></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li role="menuitem"><udex-masthead-menu-item class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries" @click="${this.fireEventCountryItemClick}" _country-code="${ifDefined(item.countryCode)}" url="${ifDefined(item.url)}" label="${ifDefined(item.displayTitle)}" index="${index}" is-nav-item></udex-masthead-menu-item></li>`;}
+function block2 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-country-selector__region-back-item" @click="${this.backToRegions}" label="${ifDefined(this._activeRegion?.title)}" type="Button" part="menu-item" is-back icon-start></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-country-selector__region-back-item" @click="${this.backToRegions}" label="${ifDefined(this._activeRegion?.title)}" type="Button" part="menu-item" is-back icon-start></udex-masthead-menu-item>`;}
+function block3 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries" @click="${this.fireEventCountryItemClick}" _country-code="${ifDefined(item.countryCode)}" url="${ifDefined(item.url)}" label="${ifDefined(item.displayTitle)}" index="${index}" part="menu-item" is-nav-item></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li role="menuitem"><udex-masthead-menu-item class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries" @click="${this.fireEventCountryItemClick}" _country-code="${ifDefined(item.countryCode)}" url="${ifDefined(item.url)}" label="${ifDefined(item.displayTitle)}" index="${index}" part="menu-item" is-nav-item></udex-masthead-menu-item></li>`;}
 function block4 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-country-selector__title">${ifDefined(this.regionTitle)}</span><ul class="udex-masthead-country-selector__list" role="menu">${ repeat(this.regionsData, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</ul>`;}
-function block5 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} id="${ifDefined(item._id)}" @click="${this.handleRegionClick}" index="${index}" class="udex-masthead-country-selector__item udex-masthead-country-selector__item_region" aria-has-popup="true" accessible-role="button" type="Button" is-nav-item has-border icon-end label="${ifDefined(item.title)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li role="menuitem"><udex-masthead-menu-item id="${ifDefined(item._id)}" @click="${this.handleRegionClick}" index="${index}" class="udex-masthead-country-selector__item udex-masthead-country-selector__item_region" aria-has-popup="true" accessible-role="button" type="Button" is-nav-item has-border icon-end label="${ifDefined(item.title)}"></udex-masthead-menu-item></li>`;}
+function block5 (this: MastheadCountrySelector, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} id="${ifDefined(item._id)}" @click="${this.handleRegionClick}" index="${index}" class="udex-masthead-country-selector__item udex-masthead-country-selector__item_region" aria-has-popup="true" accessible-role="button" type="Button" part="menu-item" is-nav-item has-border icon-end label="${ifDefined(item.title)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li role="menuitem"><udex-masthead-menu-item id="${ifDefined(item._id)}" @click="${this.handleRegionClick}" index="${index}" class="udex-masthead-country-selector__item udex-masthead-country-selector__item_region" aria-has-popup="true" accessible-role="button" type="Button" part="menu-item" is-nav-item has-border icon-end label="${ifDefined(item.title)}"></udex-masthead-menu-item></li>`;}
 
 function template(this: MastheadCountrySelector) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

package/src/generated/templates/MastheadItemTemplate.lit.ts

@@ -5,29 +5,32 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type MastheadItem from "../../MastheadItem.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasHref ? block1.call(this, context, tags, suffix) : block8.call(this, context, tags, suffix) } `;}
-function block1 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a id="${ifDefined(this._id)}" class="${ifDefined(this.additionalClass)}" tabindex="0" role="${ifDefined(this.accessibleRoleName)}" target="${ifDefined(this.target)}" href="${ifDefined(this.href)}" aria-label="${ifDefined(this.accessibleLabel)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" @click="${this.handleItemClick}">${ this.icon ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</a>${ this.isTargetBlank ? block7.call(this, context, tags, suffix) : undefined }`;}
+function block0 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasHref ? block1.call(this, context, tags, suffix) : block9.call(this, context, tags, suffix) } `;}
+function block1 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a id="${ifDefined(this._id)}" class="${ifDefined(this.additionalClass)}" tabindex="0" role="${ifDefined(this.accessibleRoleName)}" target="${ifDefined(this.target)}" href="${ifDefined(this.href)}" aria-label="${ifDefined(this.accessibleLabel)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" @click="${this.handleItemClick}">${ this.icon ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</a>${ this.isTargetBlank ? block8.call(this, context, tags, suffix) : undefined }`;}
 function block2 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></ui5-icon>`;}
-function block3 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }`;}
-function block4 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>`;}
-function block5 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block6.call(this, context, tags, suffix) : undefined }</span>`;}
-function block6 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
-function block7 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="new-win-desc" class="udex-masthead-hidden-text">${ifDefined(this.openInNewWindowText)}</span>`;}
-function block8 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isProfileBtn ? block9.call(this, context, tags, suffix) : block16.call(this, context, tags, suffix) }`;}
-function block9 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-controls="${ifDefined(this._id)}_dropdown" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleItemClick}">${ this.icon ? block10.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }</span>${ this.isDropdownOpened ? block15.call(this, context, tags, suffix) : undefined }`;}
-function block10 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></ui5-icon>`;}
-function block11 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block12.call(this, context, tags, suffix) : block13.call(this, context, tags, suffix) }`;}
-function block12 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>`;}
-function block13 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block14.call(this, context, tags, suffix) : undefined }</span>`;}
-function block14 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
-function block15 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
-function block16 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button role="${ifDefined(this.accessibleRoleName)}" id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-controls="${ifDefined(this._id)}_dropdown" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleItemClick}">${ this.icon ? block17.call(this, context, tags, suffix) : block18.call(this, context, tags, suffix) }</button>${ this.isDropdownOpened ? block22.call(this, context, tags, suffix) : undefined }`;}
-function block17 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></ui5-icon>`;}
-function block18 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block19.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }`;}
-function block19 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>`;}
-function block20 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block21.call(this, context, tags, suffix) : undefined }</span>`;}
-function block21 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
-function block22 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
+function block3 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block4.call(this, context, tags, suffix) : block6.call(this, context, tags, suffix) }`;}
+function block4 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" id="${ifDefined(this._id)}_image-alt" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>${ this.imageAlt ? block5.call(this, context, tags, suffix) : undefined }`;}
+function block5 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="image-desc" class="udex-masthead-hidden-text">${ifDefined(this.imageAlt)}</span>`;}
+function block6 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block7.call(this, context, tags, suffix) : undefined }</span>`;}
+function block7 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
+function block8 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="new-win-desc" class="udex-masthead-hidden-text">${ifDefined(this.openInNewWindowText)}</span>`;}
+function block9 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isProfileBtn ? block10.call(this, context, tags, suffix) : block18.call(this, context, tags, suffix) }`;}
+function block10 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-controls="${ifDefined(this._id)}_dropdown" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleItemClick}">${ this.icon ? block11.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }</span>${ this.isDropdownOpened ? block17.call(this, context, tags, suffix) : undefined }`;}
+function block11 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></ui5-icon>`;}
+function block12 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block13.call(this, context, tags, suffix) : block15.call(this, context, tags, suffix) }`;}
+function block13 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" id="${ifDefined(this._id)}_image-alt" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>${ this.imageAlt ? block14.call(this, context, tags, suffix) : undefined }`;}
+function block14 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="image-desc" class="udex-masthead-hidden-text">${ifDefined(this.imageAlt)}</span>`;}
+function block15 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block16.call(this, context, tags, suffix) : undefined }</span>`;}
+function block16 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
+function block17 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
+function block18 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button role="${ifDefined(this.accessibleRoleName)}" id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-controls="${ifDefined(this._id)}_dropdown" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleItemClick}">${ this.icon ? block19.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }</button>${ this.isDropdownOpened ? block25.call(this, context, tags, suffix) : undefined }`;}
+function block19 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}" mode="Decorative"></ui5-icon>`;}
+function block20 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.image ? block21.call(this, context, tags, suffix) : block23.call(this, context, tags, suffix) }`;}
+function block21 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-masthead-item__image" id="${ifDefined(this._id)}_image-alt" src="${ifDefined(this.image)}" alt="${ifDefined(this.imageAlt)}"/>${ this.imageAlt ? block22.call(this, context, tags, suffix) : undefined }`;}
+function block22 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="image-desc" class="udex-masthead-hidden-text">${ifDefined(this.imageAlt)}</span>`;}
+function block23 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block24.call(this, context, tags, suffix) : undefined }</span>`;}
+function block24 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down" mode="Decorative"></ui5-icon>`;}
+function block25 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
 
 function template(this: MastheadItem) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

package/src/generated/templates/MastheadMenuItemTemplate.lit.ts

@@ -14,7 +14,7 @@ function block5 (this: MastheadMenuItem, context: UI5Element, tags: string[], su
 function block6 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="new-win-desc" class="udex-masthead-hidden-text">${ifDefined(this.openInNewWindowText)}</span>`;}
 function block7 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} part="badge" class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge part="badge" class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</udex-badge>`;}
 function block8 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isButtonType ? block9.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }`;}
-function block9 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button _id="${ifDefined(this.id)}" class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item-button" aria-haspopup="${ifDefined(this.ariaHasPopup)}" role="button" tabindex="${ifDefined(this._tabIndex)}">${ this.iconStart ? block10.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block11.call(this, context, tags, suffix) : undefined }</button>`;}
+function block9 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button _id="${ifDefined(this.id)}" class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item-button" aria-haspopup="${ifDefined(this.ariaHasPopup)}" role="${ifDefined(this.accessibleRoleText)}" tabindex="${ifDefined(this._tabIndex)}">${ this.iconStart ? block10.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block11.call(this, context, tags, suffix) : undefined }</button>`;}
 function block10 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left" mode="Decorative"></ui5-icon>`;}
 function block11 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right" mode="Decorative"></ui5-icon>`;}
 function block12 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item">${ this.iconStart ? block13.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block14.call(this, context, tags, suffix) : undefined }</span>`;}

package/src/generated/templates/MastheadMenuTemplate.lit.ts

@@ -9,9 +9,9 @@ function block0 (this: MastheadMenu, context: UI5Element, tags: string[], suffix
 function block1 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-menu__title">${ifDefined(this.menuTitle)}</div>`;}
 function block2 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-masthead-menu__row">${ repeat(item.subMenuLinkItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div>`;}
 function block3 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-masthead-menu__column" part="column">${ item.category ? block4.call(this, context, tags, suffix, item, index) : undefined }<ul class="udex-masthead-menu__list" aria-labelledby="category-${ifDefined(item.categoryId)}" category="${ifDefined(item.category)}">${ repeat(item.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
-function block4 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<div class="udex-masthead-menu__header"><${scopeTag("udex-masthead-menu-item", tags, suffix)} id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></div>` : html`<div class="udex-masthead-menu__header"><udex-masthead-menu-item id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></udex-masthead-menu-item></div>`;}
+function block4 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<div class="udex-masthead-menu__header"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" exportparts="menu-item" id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></div>` : html`<div class="udex-masthead-menu__header"><udex-masthead-menu-item part="menu-item" exportparts="menu-item" id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></udex-masthead-menu-item></div>`;}
 function block5 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li>${ item.url ? block6.call(this, context, tags, suffix, item, index) : block7.call(this, context, tags, suffix, item, index) }</li>`;}
-function block6 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}"></udex-masthead-menu-item>`;}
+function block6 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" exportparts="menu-item" @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" exportparts="badge"></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" exportparts="menu-item" @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" exportparts="badge"></udex-masthead-menu-item>`;}
 function block7 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-divider", tags, suffix)} class="udex-masthead-menu__item-divider"></${scopeTag("udex-divider", tags, suffix)}>` : html`<udex-divider class="udex-masthead-menu__item-divider"></udex-divider>`;}
 
 function template(this: MastheadMenu) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }

package/src/generated/templates/MastheadMobileMenuTemplate.lit.ts

@@ -8,24 +8,24 @@ import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 function block0 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<nav class="udex-masthead-mobile-menu"><div class="udex-masthead-mobile-menu__nav-holder">${ this.hasSearchSlot ? block1.call(this, context, tags, suffix) : undefined }<ul class="udex-masthead-mobile-menu__list" role="menu" @keydown="${this.handlePressKey}">${ this.showNavigation ? block2.call(this, context, tags, suffix) : undefined }${ this._showCategories ? block6.call(this, context, tags, suffix) : undefined }${ this._showCategoryItems ? block16.call(this, context, tags, suffix) : undefined }</ul></div>${ this.showExploreBtn ? block20.call(this, context, tags, suffix) : undefined }</nav> `;}
 function block1 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-mobile-menu__list-search"><slot name="search"></slot></div>`;}
 function block2 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }`;}
-function block3 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem">${ item.subItems ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }</li>`;}
-function block4 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuItemClick}" label="${ifDefined(item.innerText)}" aria-has-popup="true" id="${ifDefined(item._id)}" type="Button" has-border icon-end first-level></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item @click="${this.handleMenuItemClick}" label="${ifDefined(item.innerText)}" aria-has-popup="true" id="${ifDefined(item._id)}" type="Button" has-border icon-end first-level></udex-masthead-menu-item>`;}
-function block5 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMobileItemEvent}" url="${ifDefined(item.href)}" label="${ifDefined(item.innerText)}" target="${ifDefined(item.target)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item @click="${this.handleMobileItemEvent}" url="${ifDefined(item.href)}" label="${ifDefined(item.innerText)}" target="${ifDefined(item.target)}" has-border></udex-masthead-menu-item>`;}
-function block6 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem">${ this._hideExploreSapBtn ? block7.call(this, context, tags, suffix) : block8.call(this, context, tags, suffix) }</li>${ this._clickedItem.href ? block11.call(this, context, tags, suffix) : undefined }${ repeat(this._categories, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block12.call(this, context, tags, suffix, item, index)) }`;}
-function block7 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-mobile-menu__back-item" @click="${this.handleExploreBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-explore-back></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-mobile-menu__back-item" @click="${this.handleExploreBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-explore-back></udex-masthead-menu-item>`;}
+function block3 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-masthead-mobile-menu__list-item" role="none">${ item.subItems ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }</li>`;}
+function block4 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMenuItemClick}" label="${ifDefined(item.innerText)}" aria-has-popup="true" id="${ifDefined(item._id)}" type="Button" has-border icon-end first-level></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" @click="${this.handleMenuItemClick}" label="${ifDefined(item.innerText)}" aria-has-popup="true" id="${ifDefined(item._id)}" type="Button" has-border icon-end first-level></udex-masthead-menu-item>`;}
+function block5 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMobileItemEvent}" url="${ifDefined(item.href)}" label="${ifDefined(item.innerText)}" target="${ifDefined(item.target)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" @click="${this.handleMobileItemEvent}" url="${ifDefined(item.href)}" label="${ifDefined(item.innerText)}" target="${ifDefined(item.target)}" has-border></udex-masthead-menu-item>`;}
+function block6 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li class="udex-masthead-mobile-menu__list-item" role="none">${ this._hideExploreSapBtn ? block7.call(this, context, tags, suffix) : block8.call(this, context, tags, suffix) }</li>${ this._clickedItem.href ? block11.call(this, context, tags, suffix) : undefined }${ repeat(this._categories, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block12.call(this, context, tags, suffix, item, index)) }`;}
+function block7 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleExploreBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-explore-back></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleExploreBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-explore-back></udex-masthead-menu-item>`;}
 function block8 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isNotMultipleMode ? block9.call(this, context, tags, suffix) : block10.call(this, context, tags, suffix) }`;}
-function block9 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-mobile-menu__heading" label="${ifDefined(this._clickedItem.innerText)}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-mobile-menu__heading" label="${ifDefined(this._clickedItem.innerText)}" type="Heading" has-border></udex-masthead-menu-item>`;}
-function block10 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-back-to-nav></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" type="Button" has-border icon-start is-back-to-nav></udex-masthead-menu-item>`;}
-function block11 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} url="${ifDefined(this._clickedItem.href)}" label="${ifDefined(this.overviewLinkText)}" @click="${this.handleMobileItemEvent}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item url="${ifDefined(this._clickedItem.href)}" label="${ifDefined(this.overviewLinkText)}" @click="${this.handleMobileItemEvent}" has-border></udex-masthead-menu-item></li>`;}
+function block9 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" class="udex-masthead-mobile-menu__heading" label="${ifDefined(this._clickedItem.innerText)}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" class="udex-masthead-mobile-menu__heading" label="${ifDefined(this._clickedItem.innerText)}" type="Heading" has-border></udex-masthead-menu-item>`;}
+function block10 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" aria-has-popup="true" type="Button" has-border icon-start is-back-to-nav></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToMenuItems}" label="${ifDefined(this._clickedItem.innerText)}" aria-has-popup="true" type="Button" has-border icon-start is-back-to-nav></udex-masthead-menu-item>`;}
+function block11 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" url="${ifDefined(this._clickedItem.href)}" label="${ifDefined(this.overviewLinkText)}" @click="${this.handleMobileItemEvent}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" url="${ifDefined(this._clickedItem.href)}" label="${ifDefined(this.overviewLinkText)}" @click="${this.handleMobileItemEvent}" has-border></udex-masthead-menu-item></li>`;}
 function block12 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.category ? block13.call(this, context, tags, suffix, item, index) : block14.call(this, context, tags, suffix, item, index) }`;}
-function block13 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuCategoryClick}" url="${ifDefined(item.url)}" id="${index}" label="${ifDefined(item.category)}" aria-has-popup="true" type="Button" second-level has-border icon-end></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item @click="${this.handleMenuCategoryClick}" url="${ifDefined(item.url)}" id="${index}" label="${ifDefined(item.category)}" aria-has-popup="true" type="Button" second-level has-border icon-end></udex-masthead-menu-item></li>`;}
+function block13 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMenuCategoryClick}" url="${ifDefined(item.url)}" id="${index}" label="${ifDefined(item.category)}" aria-has-popup="true" type="Button" second-level has-border icon-end></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" @click="${this.handleMenuCategoryClick}" url="${ifDefined(item.url)}" id="${index}" label="${ifDefined(item.category)}" aria-has-popup="true" type="Button" second-level has-border icon-end></udex-masthead-menu-item></li>`;}
 function block14 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ repeat(item.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block15.call(this, context, tags, suffix, item, index)) }`;}
-function block15 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMobileItemEvent}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item @click="${this.handleMobileItemEvent}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" has-border></udex-masthead-menu-item></li>`;}
-function block16 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToCategories}" label="${ifDefined(this._category.category)}" type="Button" has-border icon-start is-back-to-categories></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>${ this._category.url ? block17.call(this, context, tags, suffix) : undefined }${ repeat(this._category.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block18.call(this, context, tags, suffix, item, index)) }` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToCategories}" label="${ifDefined(this._category.category)}" type="Button" has-border icon-start is-back-to-categories></udex-masthead-menu-item></li>${ this._category.url ? block17.call(this, context, tags, suffix) : undefined }${ repeat(this._category.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block18.call(this, context, tags, suffix, item, index)) }`;}
-function block17 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMobileCategoryItemEvent}" url="${ifDefined(this._category.url)}" label="${ifDefined(this.overviewLinkText)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item @click="${this.handleMobileCategoryItemEvent}" url="${ifDefined(this._category.url)}" label="${ifDefined(this.overviewLinkText)}" has-border></udex-masthead-menu-item></li>`;}
+function block15 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMobileItemEvent}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" @click="${this.handleMobileItemEvent}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" has-border></udex-masthead-menu-item></li>`;}
+function block16 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToCategories}" label="${ifDefined(this._category.category)}" type="Button" aria-has-popup="true" has-border icon-start is-back-to-categories></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>${ this._category.url ? block17.call(this, context, tags, suffix) : undefined }${ repeat(this._category.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block18.call(this, context, tags, suffix, item, index)) }` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" class="udex-masthead-mobile-menu__back-item" @click="${this.handleBackToCategories}" label="${ifDefined(this._category.category)}" type="Button" aria-has-popup="true" has-border icon-start is-back-to-categories></udex-masthead-menu-item></li>${ this._category.url ? block17.call(this, context, tags, suffix) : undefined }${ repeat(this._category.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block18.call(this, context, tags, suffix, item, index)) }`;}
+function block17 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMobileCategoryItemEvent}" url="${ifDefined(this._category.url)}" label="${ifDefined(this.overviewLinkText)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" @click="${this.handleMobileCategoryItemEvent}" url="${ifDefined(this._category.url)}" label="${ifDefined(this.overviewLinkText)}" has-border></udex-masthead-menu-item></li>`;}
 function block18 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.url ? block19.call(this, context, tags, suffix, item, index) : undefined }`;}
-function block19 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMobileCategoryItemEvent}" label="${ifDefined(item.title)}" url="${ifDefined(item.url)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="menuitem"><udex-masthead-menu-item @click="${this.handleMobileCategoryItemEvent}" label="${ifDefined(item.title)}" url="${ifDefined(item.url)}" has-border></udex-masthead-menu-item></li>`;}
-function block20 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} class="udex-masthead-mobile-menu__explore-btn" id="${ifDefined(this.exploreItem._id)}" @click="${this.handleExploreSapClick}" @keydown="${this.handleLeftRightKeys}" accessible-role="button" type="Button" first-level icon-end is-explore label="${ifDefined(this.exploreItem.innerText)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item class="udex-masthead-mobile-menu__explore-btn" id="${ifDefined(this.exploreItem._id)}" @click="${this.handleExploreSapClick}" @keydown="${this.handleLeftRightKeys}" accessible-role="button" type="Button" first-level icon-end is-explore label="${ifDefined(this.exploreItem.innerText)}"></udex-masthead-menu-item>`;}
+function block19 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li class="udex-masthead-mobile-menu__list-item" role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" @click="${this.handleMobileCategoryItemEvent}" label="${ifDefined(item.title)}" url="${ifDefined(item.url)}" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li class="udex-masthead-mobile-menu__list-item" role="none"><udex-masthead-menu-item part="menu-item" @click="${this.handleMobileCategoryItemEvent}" label="${ifDefined(item.title)}" url="${ifDefined(item.url)}" has-border></udex-masthead-menu-item></li>`;}
+function block20 (this: MastheadMobileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-menu-item", tags, suffix)} part="menu-item" class="udex-masthead-mobile-menu__explore-btn" id="${ifDefined(this.exploreItem._id)}" @click="${this.handleExploreSapClick}" @keydown="${this.handleLeftRightKeys}" accessible-role-text="button" aria-has-popup="true" type="Button" first-level icon-end is-explore label="${ifDefined(this.exploreItem.innerText)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}>` : html`<udex-masthead-menu-item part="menu-item" class="udex-masthead-mobile-menu__explore-btn" id="${ifDefined(this.exploreItem._id)}" @click="${this.handleExploreSapClick}" @keydown="${this.handleLeftRightKeys}" accessible-role-text="button" aria-has-popup="true" type="Button" first-level icon-end is-explore label="${ifDefined(this.exploreItem.innerText)}"></udex-masthead-menu-item>`;}
 
 function template(this: MastheadMobileMenu) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

package/src/generated/templates/MastheadProfileMenuTemplate.lit.ts

@@ -5,7 +5,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type MastheadProfileMenu from "../../MastheadProfileMenu.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><${scopeTag("udex-masthead-menu", tags, suffix)} sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click="${ifDefined(this.handleProfileMenuItemClick)}"></${scopeTag("udex-masthead-menu", tags, suffix)}>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>` : html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><udex-masthead-menu sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click="${ifDefined(this.handleProfileMenuItemClick)}"></udex-masthead-menu>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>`;}
+function block0 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><${scopeTag("udex-masthead-menu", tags, suffix)} part="menu" exportparts="badge, menu-item" sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click="${ifDefined(this.handleProfileMenuItemClick)}"></${scopeTag("udex-masthead-menu", tags, suffix)}>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>` : html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><udex-masthead-menu part="menu" exportparts="badge, menu-item" sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click="${ifDefined(this.handleProfileMenuItemClick)}"></udex-masthead-menu>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>`;}
 function block1 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-avatar", tags, suffix)} aria-hidden="true" size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-avatar", tags, suffix)}><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>` : html`<udex-avatar aria-hidden="true" size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</udex-avatar><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>`;}
 function block2 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img src="${ifDefined(this.userData.avatarUrl)}" alt="avatar"/>`;}
 function block3 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-profile-menu__message"><slot name="message"></slot></div>`;}

package/src/generated/templates/MastheadShellTemplate.lit.ts

@@ -15,10 +15,10 @@ function block6 (this: MastheadShell, context: UI5Element, tags: string[], suffi
 function block7 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<nav class="udex-masthead-shell__nav" aria-label="${ifDefined(this.mainNavigationAriaLabel)}"><ul class="udex-masthead-shell__main-menu" aria-label="${ifDefined(this.mainNavigationAriaLabel)}">${ repeat(this.menuItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block8.call(this, context, tags, suffix, item, index)) }</ul></nav>`;}
 function block8 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-masthead-shell__item" @ui5-item-click="${ifDefined(this.setSelectedItem)}"><slot name="${ifDefined(item._individualSlot)}"></slot></li>`;}
 function block9 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__search-container" @ui5-search-keydown="${ifDefined(this.handleSearchKeyDown)}"><slot name="search"></slot></div>${ this._isSearchOpened ? block10.call(this, context, tags, suffix) : undefined }`;}
-function block10 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__btn-holder"><${scopeTag("udex-control-button", tags, suffix)} class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click="${this.handleCloseSearch}"></${scopeTag("udex-control-button", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__btn-holder"><udex-control-button class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click="${this.handleCloseSearch}"></udex-control-button></div>`;}
+function block10 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__btn-holder"><${scopeTag("udex-control-button", tags, suffix)} class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" part="search-close-button" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click="${this.handleCloseSearch}"></${scopeTag("udex-control-button", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__btn-holder"><udex-control-button class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" part="search-close-button" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click="${this.handleCloseSearch}"></udex-control-button></div>`;}
 function block11 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @ui5-item-click="${ifDefined(this.handleOpenMobileMenu)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @ui5-item-click="${ifDefined(this.handleOpenMobileMenu)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></udex-masthead-item>`;}
 function block12 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__explore" @ui5-item-click="${ifDefined(this.setSelectedItem)}"><slot name="exploreSAP"></slot></div>`;}
-function block13 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__search-icon udex-masthead-shell__item_icon"><${scopeTag("udex-masthead-item", tags, suffix)} class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></${scopeTag("udex-masthead-item", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__search-icon udex-masthead-shell__item_icon"><udex-masthead-item class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></udex-masthead-item></div>`;}
+function block13 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__search-icon udex-masthead-shell__item_icon"><${scopeTag("udex-masthead-item", tags, suffix)} class="udex-masthead-shell__search-btn" icon="search" part="search-button" @click="${this.handleSearchClick}" accessible-name="search"></${scopeTag("udex-masthead-item", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__search-icon udex-masthead-shell__item_icon"><udex-masthead-item class="udex-masthead-shell__search-btn" icon="search" part="search-button" @click="${this.handleSearchClick}" accessible-name="search"></udex-masthead-item></div>`;}
 function block14 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__cart udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleCartClick}"><slot name="cart"></slot></div>`;}
 function block15 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__support udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleSupportClick}"><slot name="support"></slot></div>`;}
 function block16 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__profile udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleProfileClick}"><slot name="profile"></slot></div>`;}