@sapudex/web-components 0.114.2 → 0.117.1

package/src/StatusBadge.ts

@@ -0,0 +1,129 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import Icon from "@ui5/webcomponents/dist/Icon.js";
+import "@ui5/webcomponents-icons/dist/error.js";
+import "@ui5/webcomponents-icons/dist/alert.js";
+import "@ui5/webcomponents-icons/dist/sys-enter-2.js";
+import "@ui5/webcomponents-icons/dist/edit.js";
+import "@ui5/webcomponents-icons/dist/information.js";
+import I18nBundle, { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import {
+  STATUS_BADGE_TEXT,
+  STATUS_BADGE_EDIT_TITLE,
+  STATUS_BADGE_INFORMATION_TITLE,
+  STATUS_BADGE_ERROR_TITLE,
+  STATUS_BADGE_SUCCESS_TITLE,
+  STATUS_BADGE_WARNING_TITLE,
+} from "./generated/i18n/i18n-defaults.js";
+
+import StatusBadgeTemplate from "./generated/templates/StatusBadgeTemplate.lit.js";
+
+// Styles
+import StatusBadgeCss from "./generated/themes/StatusBadge.css.js";
+
+export enum IconMapping {
+  Success = "sys-enter-2",
+  Error = "error",
+  Warning = "alert",
+  Edit = "edit",
+  Information = "information",
+}
+
+export enum BadgeSize {
+  XS = "XS",
+  S = "S",
+  M = "M",
+  L = "L",
+  XL = "XL",
+}
+
+/**
+ * @class
+ *
+ * <h3 class="comment-api-title">Overview</h3>
+ *
+ *
+ * <h3>Usage</h3>
+ *
+ * For the <code>udex-status-badge</code>
+ * <h3>ES6 Module Import</h3>
+ *
+ * <code>import "@udex/web-components/dist/StatusBadge.js";</code>
+ *
+ * @constructor
+ * @extends UI5Element
+ * @public
+ */
+@customElement({
+  tag: "udex-status-badge",
+  renderer: litRender,
+  styles: StatusBadgeCss,
+  template: StatusBadgeTemplate,
+  dependencies: [Icon],
+})
+class UDExStatusBadge extends UI5Element {
+  /**
+   * Defines the value state of the component.
+   *
+   * @default "Information"
+   * @public
+   */
+  @property({ type: IconMapping, defaultValue: IconMapping.Information })
+    valueState!: "Information" | "Warning" | "Error" | "Success" | "Edit";
+
+  /**
+   * Defines predefined size of the component.
+   *
+   * @default "S"
+   * @public
+   */
+  @property({ type: BadgeSize, defaultValue: BadgeSize.S })
+    size!: `${BadgeSize}`;
+
+    /**
+   * Defines the text alternative of the component.
+   *
+   * @default ""
+   * @public
+   */
+    @property({ type: String, defaultValue: "" })
+    accessibleName!: string;
+
+  static i18nBundle: I18nBundle;
+
+  static async onDefine(): Promise<void> {
+    UDExStatusBadge.i18nBundle = await getI18nBundle("sap-ui-webcomponents-bundle");
+  }
+
+  get iconFieldName(): string {
+    if (!IconMapping[this.valueState]) {
+      return IconMapping.Information;
+    }
+    return IconMapping[this.valueState];
+  }
+
+  get badgeAccessibleName(): string {
+    return `${this.accessibleName ? this.accessibleName : UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_TEXT)}`;
+  }
+
+  get ariaTitle() {
+    switch (IconMapping[this.valueState]) {
+    case IconMapping.Edit:
+      return UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_EDIT_TITLE);
+    case IconMapping.Information:
+      return UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_INFORMATION_TITLE);
+    case IconMapping.Success:
+      return UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_SUCCESS_TITLE);
+    case IconMapping.Error:
+      return UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_ERROR_TITLE);
+    case IconMapping.Warning:
+      return UDExStatusBadge.i18nBundle.getText(STATUS_BADGE_WARNING_TITLE);
+    }
+  }
+}
+
+UDExStatusBadge.define();
+
+export default UDExStatusBadge;

package/src/Tab.ts

@@ -279,7 +279,7 @@ class UDExTab extends UI5Element implements ITab {
   }
 
   get accessibleNameText() {
-    return this.accessibleName || (this.showAttentionBadge ? `, Attention badge ${UDExTab.i18nBundle.getText(ATTENTION_BADGE)}` : "");
+    return this.accessibleName || (this.showAttentionBadge ? `, ${UDExTab.i18nBundle.getText(ATTENTION_BADGE)}` : "");
   }
 
   static get headerTemplate() {

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

@@ -1,3 +1,3 @@
 import { 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 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 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 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: "Information Bar Close"};const MESSAGE_STRIP_INFORMATION: I18nText = {key: "MESSAGE_STRIP_INFORMATION", defaultText: "Information"};const MESSAGE_STRIP_SUCCESS: I18nText = {key: "MESSAGE_STRIP_SUCCESS", defaultText: "Success"};const MESSAGE_STRIP_WARNING: I18nText = {key: "MESSAGE_STRIP_WARNING", defaultText: "Warning"};const MESSAGE_STRIP_ERROR: I18nText = {key: "MESSAGE_STRIP_ERROR", defaultText: "Error"};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 button"};const DELETE_BUTTON: I18nText = {key: "DELETE_BUTTON", defaultText: "Delete button"};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 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 LOGOUT: I18nText = {key: "LOGOUT", defaultText: "Logout"};const COUNTRY_SELECT: I18nText = {key: "COUNTRY_SELECT", defaultText: "Country Select"};const OVERVIEW: I18nText = {key: "OVERVIEW", defaultText: "Overview"};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 AVATAR_TEXT: I18nText = {key: "AVATAR_TEXT", defaultText: "Avatar"};const DISABLED: I18nText = {key: "DISABLED", defaultText: "Disabled"};const CALENDAR_ICON: I18nText = {key: "CALENDAR_ICON", defaultText: "Employee start date"};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"};
-export {COUNT,OF,PAGINATION_PAGE,SELECTED,FIRST_PAGE,LAST_PAGE,PREVIOUS_PAGE,NEXT_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,AVAILABLE_VALUES,RECOMMENDED_TEXT,EXPAND_ALL,COLLAPSE_ALL,MORE,ATTENTION_BADGE,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,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,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,LOGOUT,COUNTRY_SELECT,OVERVIEW,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,AVATAR_TEXT,DISABLED,CALENDAR_ICON,TABLE_NO_DATA_FOUND,LIST_ITEM_EDIT_ICON,LIST_ITEM_DELETE_ICON};
+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 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 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 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: "Information Bar Close"};const MESSAGE_STRIP_INFORMATION: I18nText = {key: "MESSAGE_STRIP_INFORMATION", defaultText: "Information"};const MESSAGE_STRIP_SUCCESS: I18nText = {key: "MESSAGE_STRIP_SUCCESS", defaultText: "Success"};const MESSAGE_STRIP_WARNING: I18nText = {key: "MESSAGE_STRIP_WARNING", defaultText: "Warning"};const MESSAGE_STRIP_ERROR: I18nText = {key: "MESSAGE_STRIP_ERROR", defaultText: "Error"};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 button"};const DELETE_BUTTON: I18nText = {key: "DELETE_BUTTON", defaultText: "Delete button"};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 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 LOGOUT: I18nText = {key: "LOGOUT", defaultText: "Logout"};const COUNTRY_SELECT: I18nText = {key: "COUNTRY_SELECT", defaultText: "Country Select"};const OVERVIEW: I18nText = {key: "OVERVIEW", defaultText: "Overview"};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 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: "Employee start date"};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"};
+export {COUNT,OF,PAGINATION_PAGE,SELECTED,FIRST_PAGE,LAST_PAGE,PREVIOUS_PAGE,NEXT_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,AVAILABLE_VALUES,RECOMMENDED_TEXT,EXPAND_ALL,COLLAPSE_ALL,MORE,ATTENTION_BADGE,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,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,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,LOGOUT,COUNTRY_SELECT,OVERVIEW,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,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,TABLE_NO_DATA_FOUND,LIST_ITEM_EDIT_ICON,LIST_ITEM_DELETE_ICON,BACK_BUTTON_LABEL};

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

@@ -4,7 +4,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type CountrySelector from "../../CountrySelector.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this.countrySelectorClasses)}"><${scopeTag("udex-dropdown", tags, suffix)} id="dropdown" horizontal-align="Left" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><div class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" value="${ifDefined(this.selectedCountryName)}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("udex-text-field", tags, suffix)} label="${ifDefined(this.label)}" id="udexTextField" class="udex-country-selector__text" value-state="Standard" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" role="combobox" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @click-trigger="${this.handleKeyDown}" maxlength="0"></${scopeTag("udex-text-field", tags, suffix)}>${ !this.displayonly ? block2.call(this, context, tags, suffix) : undefined }</div>${ifDefined(this.searchableList)}</${scopeTag("udex-dropdown", tags, suffix)}></div> ` : html`<div class="${ifDefined(this.countrySelectorClasses)}"><udex-dropdown id="dropdown" horizontal-align="Left" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><div class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" value="${ifDefined(this.selectedCountryName)}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<udex-text-field label="${ifDefined(this.label)}" id="udexTextField" class="udex-country-selector__text" value-state="Standard" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" role="combobox" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @click-trigger="${this.handleKeyDown}" maxlength="0"></udex-text-field>${ !this.displayonly ? block2.call(this, context, tags, suffix) : undefined }</div>${ifDefined(this.searchableList)}</udex-dropdown></div> `;}
+function block0 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this.countrySelectorClasses)}"><${scopeTag("udex-dropdown", tags, suffix)} id="dropdown" horizontal-align="Left" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-handle-close-search="${ifDefined(this.handleCloseSearch)}"><div class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" value="${ifDefined(this.selectedCountryName)}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("udex-text-field", tags, suffix)} label="${ifDefined(this.label)}" id="udexTextField" class="udex-country-selector__text" value-state="Standard" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" role="combobox" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @click-trigger="${this.handleKeyDown}" maxlength="0"></${scopeTag("udex-text-field", tags, suffix)}>${ !this.displayonly ? block2.call(this, context, tags, suffix) : undefined }</div>${ifDefined(this.searchableList)}</${scopeTag("udex-dropdown", tags, suffix)}></div> ` : html`<div class="${ifDefined(this.countrySelectorClasses)}"><udex-dropdown id="dropdown" horizontal-align="Left" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-handle-close-search="${ifDefined(this.handleCloseSearch)}"><div class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" value="${ifDefined(this.selectedCountryName)}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<udex-text-field label="${ifDefined(this.label)}" id="udexTextField" class="udex-country-selector__text" value-state="Standard" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" role="combobox" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @click-trigger="${this.handleKeyDown}" maxlength="0"></udex-text-field>${ !this.displayonly ? block2.call(this, context, tags, suffix) : undefined }</div>${ifDefined(this.searchableList)}</udex-dropdown></div> `;}
 function block1 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img class="udex-country-selector__image" design="Default" icon="decline" tooltip="Reset Button" aria-label="${ifDefined(this.selectedCountryName)}" style="background-position-x: ${ifDefined(this.selectedCountryFlagX)}; background-position-y: ${ifDefined(this.selectedCountryFlagY)}">`;}
 function block2 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-country-selector__icon" name="navigation-down-arrow"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-country-selector__icon" name="navigation-down-arrow"></ui5-icon>`;}
 

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

@@ -5,7 +5,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Dropdown, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-dropdown">${ this.hasTriggerSlot ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-popover", tags, suffix)} id="udex-dropdown" class="udex-dropdown__pane" ?allow-target-overlap="${this.disableAllowTargetOverlap}" hide-arrow placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-after-open=${ifDefined(this.afterDropdownOpen)} @ui5-before-open=${ifDefined(this.beforeDropdownOpen)} @ui5-after-close=${ifDefined(this.afterDropdownClose)} @ui5-before-close=${ifDefined(this.beforeDropdownClose)}>${ this.hasHeaderSlot ? block2.call(this, context, tags, suffix) : undefined }<slot></slot>${ this.hasFooterSlot ? block3.call(this, context, tags, suffix) : undefined }</${scopeTag("ui5-popover", tags, suffix)}></div>` : html`<div class="udex-dropdown">${ this.hasTriggerSlot ? block1.call(this, context, tags, suffix) : undefined }<ui5-popover id="udex-dropdown" class="udex-dropdown__pane" ?allow-target-overlap="${this.disableAllowTargetOverlap}" hide-arrow placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-after-open=${ifDefined(this.afterDropdownOpen)} @ui5-before-open=${ifDefined(this.beforeDropdownOpen)} @ui5-after-close=${ifDefined(this.afterDropdownClose)} @ui5-before-close=${ifDefined(this.beforeDropdownClose)}>${ this.hasHeaderSlot ? block2.call(this, context, tags, suffix) : undefined }<slot></slot>${ this.hasFooterSlot ? block3.call(this, context, tags, suffix) : undefined }</ui5-popover></div>`;}
-function block1 (this: Dropdown, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-dropdown__opener" aria-haspopup="true" aria-expanded="${ifDefined(this.open)}" aria-controls="udex-dropdown" @click="${this.onTriggerClick}"><slot slot="trigger" name="trigger"></slot></div>`;}
+function block1 (this: Dropdown, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-dropdown__opener" aria-haspopup="true" aria-controls="udex-dropdown" @click="${this.onTriggerClick}"><slot slot="trigger" name="trigger"></slot></div>`;}
 function block2 (this: Dropdown, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot slot="header" name="header"></slot>`;}
 function block3 (this: Dropdown, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot slot="footer" name="footer"></slot>`;}
 

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

@@ -4,13 +4,13 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type FilterMenu from "../../FilterMenu.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-dropdown", tags, suffix)} class="udex-filter-menu" ?disable-target-overlap="${this.disableTargetOverlap}" placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" height="${ifDefined(this.height)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><button aria-label="${ifDefined(this.accessibleName)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" slot="trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-icon", tags, suffix)} class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></span></button>${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-dropdown", tags, suffix)}> ` : html`<udex-dropdown class="udex-filter-menu" ?disable-target-overlap="${this.disableTargetOverlap}" placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" height="${ifDefined(this.height)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.handleTriggerClick}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><button aria-label="${ifDefined(this.accessibleName)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" slot="trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<ui5-icon class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></ui5-icon></span></button>${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</udex-dropdown> `;}
+function block0 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-dropdown", tags, suffix)} class="udex-filter-menu" ?disable-target-overlap="${this.disableTargetOverlap}" placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" height="${ifDefined(this.height)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.onDropdownClose}" @search-keydown="${this.handleKeyDownSearch}" @keydown="${this.handleKeyDownList}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><button aria-label="${ifDefined(this.accessibleName)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" slot="trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-icon", tags, suffix)} class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></span></button>${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-dropdown", tags, suffix)}> ` : html`<udex-dropdown class="udex-filter-menu" ?disable-target-overlap="${this.disableTargetOverlap}" placement-type="${ifDefined(this.placementType)}" horizontal-align="${ifDefined(this.horizontalAlign)}" height="${ifDefined(this.height)}" accessible-role="${ifDefined(this.accessibleRole)}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-after-open="${ifDefined(this._dropdownAfterOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-after-close="${ifDefined(this._dropdownAfterClose)}" @click-trigger="${this.onDropdownClose}" @search-keydown="${this.handleKeyDownSearch}" @keydown="${this.handleKeyDownList}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}"><button aria-label="${ifDefined(this.accessibleName)}" aria-expanded="${ifDefined(this._open)}" aria-haspopup="true" ?disabled="${this.disabled}" class="udex-filter-menu__trigger" slot="trigger" tabindex="0">${ this.hasFilterNamePrefix ? block1.call(this, context, tags, suffix) : undefined }<span class="udex-filter-menu__trigger-wrap" ?disabled="${this.disabled}"><span class="udex-filter-menu__trigger-name">${ifDefined(this.filterName)}</span>${ this.badgeValue ? block2.call(this, context, tags, suffix) : undefined }<ui5-icon class="udex-filter-menu__trigger-icon" name="navigation-down-arrow" accessible-name="${ifDefined(this._iconAccessibleNameText)}"></ui5-icon></span></button>${ifDefined(this.searchableList)}${ this.modeMultiSelect ? block3.call(this, context, tags, suffix) : undefined }</udex-dropdown> `;}
 function block1 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-filter-menu__trigger-prefix">${ifDefined(this.filterNamePrefix)}</span>`;}
 function block2 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-filter-menu__badge" type="Number" design="Info" size="Small">${ifDefined(this.badgeValue)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-filter-menu__badge" type="Number" design="Info" size="Small">${ifDefined(this.badgeValue)}</udex-badge>`;}
 function block3 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ !this.hideActionBar ? block4.call(this, context, tags, suffix) : undefined }`;}
 function block4 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-filter-menu__footer" slot="footer" name="footer">${ !this.hideResultBtn ? block5.call(this, context, tags, suffix) : undefined }${ !this.hideResetBtn ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
-function block5 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__result-btn" size="Medium" design="Primary" ?disabled="${this.disabledResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__result-btn" size="Medium" design="Primary" ?disabled="${this.disabledResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</udex-button>`;}
-function block6 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</udex-button>`;}
+function block5 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__result-btn" size="Medium" design="Primary" ?disabled="${this.disabledResultBtn}" @keydown="${this.handleKeyDownResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__result-btn" size="Medium" design="Primary" ?disabled="${this.disabledResultBtn}" @keydown="${this.handleKeyDownResultBtn}" @click="${this.handleResult}">${ifDefined(this.getResultLabelText)}</udex-button>`;}
+function block6 (this: FilterMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @keydown="${this.handleKeyDownResetBtn}" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-filter-menu__reset-btn" size="Medium" design="Tertiary" @keydown="${this.handleKeyDownResetBtn}" @click="${this.handleReset}">${ifDefined(this.getResetLabelText)}</udex-button>`;}
 
 
 export default block0;

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

@@ -4,13 +4,13 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type HeroBanner from "../../HeroBanner.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.heroBannerClasses)}" part="wrapper" style="background-color: ${ifDefined(this.wrapperBackgroundColor)}">${ this.hasCustomBackgroundPicture ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }${ this.hasBackgroundVideo ? block4.call(this, context, tags, suffix) : block6.call(this, context, tags, suffix) }</div> `;}
+function block0 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.heroBannerClasses)}" part="wrapper" style="background-color: ${ifDefined(this.wrapperBackgroundColor)}"><div class="udex-hero-banner__container">${ this.hasCustomBackgroundPicture ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }${ this.hasBackgroundVideo ? block4.call(this, context, tags, suffix) : block6.call(this, context, tags, suffix) }</div></div> `;}
 function block1 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot name="backgroundPicture"></slot>`;}
 function block2 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasBackgroundImage ? block3.call(this, context, tags, suffix) : undefined }`;}
 function block3 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<picture><img loading="${ifDefined(this.backgroundImageLoadingStrategy)}" src="${ifDefined(this.backgroundImage)}" part="background-image" class="udex-hero-banner__background-image" alt="${ifDefined(this.backgroundImageLabel)}" /></picture>`;}
 function block4 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-hero-banner__background-video-wrapper" tabindex="0" @keydown=${this._handleKeydown}><video ?autoplay="${this.shouldVideoAutoplay}" muted loop playsinline part="background-video" class="udex-hero-banner__background-video" alt="${ifDefined(this.backgroundVideoLabel)}"><source src="${ifDefined(this.backgroundVideo)}" type="video/mp4" /></video><div class="udex-hero-banner__background-video-overlay"></div><slot id="udex-hero-banner__content" name="content" part="content"></slot>${ this.hasAdditionalContent ? block5.call(this, context, tags, suffix) : undefined }<button class="udex-hero-banner__media-button" aria-label="Play / Pause button" role="button" @click=${this._toggleMediaButton}><${scopeTag("ui5-icon", tags, suffix)} name=${ifDefined(this.mediaButtonIconName)}></${scopeTag("ui5-icon", tags, suffix)}></button></div>` : html`<div class="udex-hero-banner__background-video-wrapper" tabindex="0" @keydown=${this._handleKeydown}><video ?autoplay="${this.shouldVideoAutoplay}" muted loop playsinline part="background-video" class="udex-hero-banner__background-video" alt="${ifDefined(this.backgroundVideoLabel)}"><source src="${ifDefined(this.backgroundVideo)}" type="video/mp4" /></video><div class="udex-hero-banner__background-video-overlay"></div><slot id="udex-hero-banner__content" name="content" part="content"></slot>${ this.hasAdditionalContent ? block5.call(this, context, tags, suffix) : undefined }<button class="udex-hero-banner__media-button" aria-label="Play / Pause button" role="button" @click=${this._toggleMediaButton}><ui5-icon name=${ifDefined(this.mediaButtonIconName)}></ui5-icon></button></div>`;}
 function block5 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot id="udex-hero-banner__additionalContent" name="additionalContent" part="additionalContent"></slot>`;}
-function block6 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot id="udex-hero-banner__content" name="content" part="content"></slot>${ this.hasAdditionalContent ? block7.call(this, context, tags, suffix) : undefined }`;}
+function block6 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-hero-banner__content-container"><slot id="udex-hero-banner__content" name="content" part="content"></slot>${ this.hasAdditionalContent ? block7.call(this, context, tags, suffix) : undefined }</div>`;}
 function block7 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot id="udex-hero-banner__additionalContent" name="additionalContent" part="additionalContent"></slot>`;}
 
 

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

@@ -4,12 +4,12 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type ListGroupHeader from "../../ListGroupHeader.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" class="udex-list__group"><ul class="udex-list__group-list" @ui5-item-press="${ifDefined(this.getHandleGroupItemsClick)}">${ this.modeMultiSelectOrRadioGroup ? block1.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }<slot></slot></ul></li> `;}
+function block0 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" class="udex-list__group" role="group" aria-labelledby="group-heading"><ul class="udex-list__group-list" @ui5-item-press="${ifDefined(this.getHandleGroupItemsClick)}">${ this.modeMultiSelectOrRadioGroup ? block1.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }<slot></slot></ul></li> `;}
 function block1 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isNonActiveHeader ? block2.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) }`;}
-function block2 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header class="udex-list__inactive-header" role="presentation"><span class="udex-list__header-title">${ifDefined(this.label)}</span>${ this.supportingText ? block3.call(this, context, tags, suffix) : undefined }</header>`;}
+function block2 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header id="group-heading" class="udex-list__inactive-header"><span class="udex-list__header-title">${ifDefined(this.label)}</span>${ this.supportingText ? block3.call(this, context, tags, suffix) : undefined }</header>`;}
 function block3 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-list__supporting-text ">${ifDefined(this.supportingText)}</span>`;}
-function block4 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} _additional-class-name="${ifDefined(this._additionalClassName)}" ?selected="${this.selected}" ?indeterminate="${this.indeterminate}" part="group-item" role="listitem" class="${ifDefined(this.className)}" mode="${ifDefined(this.mode)}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @click="${this.handleHeaderPress}" @keydown="${this.handleKeyDownPress}" type="${ifDefined(this.type)}" label="${ifDefined(this.label)}" _icon="${ifDefined(this._icon)}" size="${ifDefined(this.size)}"></${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item _additional-class-name="${ifDefined(this._additionalClassName)}" ?selected="${this.selected}" ?indeterminate="${this.indeterminate}" part="group-item" role="listitem" class="${ifDefined(this.className)}" mode="${ifDefined(this.mode)}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @click="${this.handleHeaderPress}" @keydown="${this.handleKeyDownPress}" type="${ifDefined(this.type)}" label="${ifDefined(this.label)}" _icon="${ifDefined(this._icon)}" size="${ifDefined(this.size)}"></udex-list-item>`;}
-function block5 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__group-content ${ifDefined(this.sizeClass)}" part="group-item">${ this.typeNumber ? block6.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block7.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__header" role="presentation"><span class="udex-list__header-title">${ifDefined(this.label)}</span>${ this.supportingText ? block9.call(this, context, tags, suffix) : undefined }</div></div>`;}
+function block4 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} id="group-heading" _additional-class-name="${ifDefined(this._additionalClassName)}" ?selected="${this.selected}" _tab-index="${ifDefined(this._effectiveTabIndex)}" ?indeterminate="${this.indeterminate}" part="group-item" role="none" class="${ifDefined(this.className)}" mode="${ifDefined(this.mode)}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @click="${this.handleHeaderPress}" @keydown="${this.handleKeyDownPress}" type="${ifDefined(this.type)}" label="${ifDefined(this.label)}" _icon="${ifDefined(this._icon)}" size="${ifDefined(this.size)}"></${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item id="group-heading" _additional-class-name="${ifDefined(this._additionalClassName)}" ?selected="${this.selected}" _tab-index="${ifDefined(this._effectiveTabIndex)}" ?indeterminate="${this.indeterminate}" part="group-item" role="none" class="${ifDefined(this.className)}" mode="${ifDefined(this.mode)}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @click="${this.handleHeaderPress}" @keydown="${this.handleKeyDownPress}" type="${ifDefined(this.type)}" label="${ifDefined(this.label)}" _icon="${ifDefined(this._icon)}" size="${ifDefined(this.size)}"></udex-list-item>`;}
+function block5 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__group-content ${ifDefined(this.sizeClass)}" part="group-item">${ this.typeNumber ? block6.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block7.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__header"><span id="group-heading" class="udex-list__header-title">${ifDefined(this.label)}</span>${ this.supportingText ? block9.call(this, context, tags, suffix) : undefined }</div></div>`;}
 function block6 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-list__number">${ifDefined(this.numberOfItem)}.</span>`;}
 function block7 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-list__circle">&#x2022;</span>`;}
 function block8 (this: ListGroupHeader, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-list__icon" name="${ifDefined(this._icon)}" accessible-role="presentation" aria-hidden="true" part="icon"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-list__icon" name="${ifDefined(this._icon)}" accessible-role="presentation" aria-hidden="true" part="icon"></ui5-icon>`;}

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

@@ -5,7 +5,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.modeSelected ? block1.call(this, context, tags, suffix) : undefined }${ this.modeSingleContent ? block16.call(this, context, tags, suffix) : undefined } `;}
-function block1 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" tabindex="${ifDefined(this._tabIndex)}" aria-disabled="${ifDefined(this._ariaDisabled)}" aria-labelledby="${ifDefined(this._accessibleNameRef)}" class="${ifDefined(this.className)}" @click="${this.handleItemClick}" @mousedown="${this.handleMouseDown}" @mouseup="${this.handleMouseUp}" @keyup="${this.handleKeyUp}" @keydown="${this.handleKeyDown}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" aria-selected="${ifDefined(this.selected)}" ?divider="${this.divider}" _id="${ifDefined(this._id)}">${ this.modeMultiSelect ? block2.call(this, context, tags, suffix) : undefined }${ this.modeRadioGroup ? block3.call(this, context, tags, suffix) : undefined }<div id="${ifDefined(this._id)}-content" class="udex-list__content-wrap">${ this.flag ? block4.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block5.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block6.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block7.call(this, context, tags, suffix) : undefined }${ this.image ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block9.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }</div></div></li>`;}
+function block1 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" tabindex="${ifDefined(this._effectiveTabIndex)}" aria-disabled="${ifDefined(this._ariaDisabled)}" aria-labelledby="${ifDefined(this._accessibleNameRef)}" class="${ifDefined(this.className)}" @click="${this.handleItemClick}" @mousedown="${this.handleMouseDown}" @mouseup="${this.handleMouseUp}" @keyup="${this.handleKeyUp}" @keydown="${this.handleKeyDown}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" aria-selected="${ifDefined(this.selected)}" aria-current="${ifDefined(this.selected)}" ?divider="${this.divider}" _id="${ifDefined(this._id)}">${ this.modeMultiSelect ? block2.call(this, context, tags, suffix) : undefined }${ this.modeRadioGroup ? block3.call(this, context, tags, suffix) : undefined }<div id="${ifDefined(this._id)}-content" class="udex-list__content-wrap">${ this.flag ? block4.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block5.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block6.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block7.call(this, context, tags, suffix) : undefined }${ this.image ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block9.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }</div></div></li>`;}
 function block2 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-checkbox", tags, suffix)} class="udex-list__checkbox" part="checkbox" tabindex="-1" ?aria-checked="${this.selected}" ?indeterminate="${this.indeterminate}" accessible-name="checkbox ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></${scopeTag("udex-checkbox", tags, suffix)}>` : html`<udex-checkbox class="udex-list__checkbox" part="checkbox" tabindex="-1" ?aria-checked="${this.selected}" ?indeterminate="${this.indeterminate}" accessible-name="checkbox ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></udex-checkbox>`;}
 function block3 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-radio-button", tags, suffix)} class="udex-list__radio" part="radio" tabindex="-1" ?aria-checked="${this.selected}" accessible-name="radio ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></${scopeTag("udex-radio-button", tags, suffix)}>` : html`<udex-radio-button class="udex-list__radio" part="radio" tabindex="-1" ?aria-checked="${this.selected}" accessible-name="radio ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></udex-radio-button>`;}
 function block4 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__flag-wrap"><span class="udex-list__flag" style="background-position: ${ifDefined(this.flagPosition)}"></span></div>`;}

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

@@ -4,7 +4,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type ListSelectAll from "../../ListSelectAll.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: ListSelectAll, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<ul class="udex-list__group-list"><li part="item" class="udex-list__group"><ul class="${ifDefined(this.groupListClassName)}" @ui5-item-press="${ifDefined(this.handleSelectAllGroupItemsPress)}"><${scopeTag("udex-list-item", tags, suffix)} role="list" _additional-class-name="${ifDefined(this.additionalClassName)}" class="${ifDefined(this.className)}" ?selected="${this.selected}" aria-selected="${ifDefined(this.selected)}" ?indeterminate="${this.indeterminate}" mode="${ifDefined(this.multiselectMode)}" part="group-item" @click="${this.handleSelectAllPress}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @keydown="${this.handleKeyDownPress}" divider>${ifDefined(this.selectAllLabel)}</${scopeTag("udex-list-item", tags, suffix)}><slot></slot></ul></li></ul>` : html`<ul class="udex-list__group-list"><li part="item" class="udex-list__group"><ul class="${ifDefined(this.groupListClassName)}" @ui5-item-press="${ifDefined(this.handleSelectAllGroupItemsPress)}"><udex-list-item role="list" _additional-class-name="${ifDefined(this.additionalClassName)}" class="${ifDefined(this.className)}" ?selected="${this.selected}" aria-selected="${ifDefined(this.selected)}" ?indeterminate="${this.indeterminate}" mode="${ifDefined(this.multiselectMode)}" part="group-item" @click="${this.handleSelectAllPress}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @keydown="${this.handleKeyDownPress}" divider>${ifDefined(this.selectAllLabel)}</udex-list-item><slot></slot></ul></li></ul>`;}
+function block0 (this: ListSelectAll, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<ul class="udex-list__group-list"><li part="item" class="udex-list__group"><ul class="${ifDefined(this.groupListClassName)}" @ui5-item-press="${ifDefined(this.handleSelectAllGroupItemsPress)}"><${scopeTag("udex-list-item", tags, suffix)} _tab-index="${ifDefined(this._effectiveTabIndex)}" role="list" _additional-class-name="${ifDefined(this.additionalClassName)}" class="${ifDefined(this.className)}" ?selected="${this.selected}" aria-selected="${ifDefined(this.selected)}" ?indeterminate="${this.indeterminate}" mode="${ifDefined(this.multiselectMode)}" part="group-item" @click="${this.handleSelectAllPress}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @keydown="${this.handleKeyDownPress}" divider>${ifDefined(this.selectAllLabel)}</${scopeTag("udex-list-item", tags, suffix)}><slot></slot></ul></li></ul>` : html`<ul class="udex-list__group-list"><li part="item" class="udex-list__group"><ul class="${ifDefined(this.groupListClassName)}" @ui5-item-press="${ifDefined(this.handleSelectAllGroupItemsPress)}"><udex-list-item _tab-index="${ifDefined(this._effectiveTabIndex)}" role="list" _additional-class-name="${ifDefined(this.additionalClassName)}" class="${ifDefined(this.className)}" ?selected="${this.selected}" aria-selected="${ifDefined(this.selected)}" ?indeterminate="${this.indeterminate}" mode="${ifDefined(this.multiselectMode)}" part="group-item" @click="${this.handleSelectAllPress}" ?controlled="${this.controlled}" supporting-text="${ifDefined(this.supportingText)}" @keydown="${this.handleKeyDownPress}" divider>${ifDefined(this.selectAllLabel)}</udex-list-item><slot></slot></ul></li></ul>`;}
 
 
 export default block0;

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

@@ -4,7 +4,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type SearchSuggestions from "../../SearchSuggestions.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="suggestions-popover" aria-orientation="vertical" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="suggestions-popover" aria-orientation="vertical" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</ui5-popover>`;}
+function block0 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</ui5-popover>`;}
 function block1 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-search-suggestions__message">${ifDefined(this.noResultMessage)}</span>`;}
 function block2 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div role="tree">${ this.isShowSuggestedList ? block3.call(this, context, tags, suffix) : undefined }${ this.isShowRecommendedList ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
 function block3 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-search-suggestions__block" role="treeitem">${ this.suggestedHeading ? block4.call(this, context, tags, suffix) : undefined }<div class="udex-search-suggestions__list" role="listbox" aria-labelledby="suggested-heading" tabindex="0" @keydown="${this.handleKeyDownPopover}">${ repeat(this.suggestedList, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</div></div>`;}

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

@@ -6,8 +6,8 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	
 function block0 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-search__root ${ifDefined(this.classWithPrefix)}">${ this.isShowSearchHomePrefix ? block1.call(this, context, tags, suffix) : undefined }<form role="search" class="udex-search__container ${ifDefined(this.focusClasses)}${ifDefined(this.isNotEmptyClass)}">${ this.labelAnimationDisabled ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }<div class="udex-search__icons">${ this.isShowResetButton ? block5.call(this, context, tags, suffix) : undefined }${ this.isVoiceButton ? block6.call(this, context, tags, suffix) : undefined }${ this.showSubmitButton ? block7.call(this, context, tags, suffix) : undefined }</div></form></div>`;}
 function block1 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-search__prefix"><button type="button" aria-haspopup="true" aria-controls="udex-search-prefix" class="udex-search__prefix-button" @click="${this.handleDropdownClick}"><span class="udex-search__prefix-label">${ifDefined(this.labelPrefix)}</span><${scopeTag("ui5-icon", tags, suffix)} class="udex-search__prefix-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}></button><${scopeTag("ui5-popover", tags, suffix)} id="udex-search-prefix" class="udex-search__prefix-popover" hide-arrow placement-type="Bottom" horizontal-align="Left" style="${styleMap(this.prefixPopoverStyles)}" @after-close="${this.handleAfterClosePrefixPopover}"><slot></slot></${scopeTag("ui5-popover", tags, suffix)}></div>` : html`<div class="udex-search__prefix"><button type="button" aria-haspopup="true" aria-controls="udex-search-prefix" class="udex-search__prefix-button" @click="${this.handleDropdownClick}"><span class="udex-search__prefix-label">${ifDefined(this.labelPrefix)}</span><ui5-icon class="udex-search__prefix-icon" name="slim-arrow-down"></ui5-icon></button><ui5-popover id="udex-search-prefix" class="udex-search__prefix-popover" hide-arrow placement-type="Bottom" horizontal-align="Left" style="${styleMap(this.prefixPopoverStyles)}" @after-close="${this.handleAfterClosePrefixPopover}"><slot></slot></ui5-popover></div>`;}
-function block2 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<input id="search-input" type="search" name="search" class="udex-search__field" autocomplete="off" role="combobox" aria-controls="suggestions-popover" aria-expanded="false" aria-haspopup="${ifDefined(this.showSuggestedPopover)}" placeholder="${ifDefined(this.label)}" .value="${ifDefined(this.value)}" @input="${this.handleSearchChange}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @focusout="${this.handleFocusout}" @blur="${this.handleBlur}" @click="${this.handleInputClick}" />`;}
-function block3 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.label ? block4.call(this, context, tags, suffix) : undefined }<input id="search-input" type="search" name="search" class="udex-search__field" autocomplete="off" role="combobox" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-controls="suggestions-popover" aria-expanded="false" aria-haspopup="${ifDefined(this.showSuggestedPopover)}" .value="${ifDefined(this.value)}" @input="${this.handleSearchChange}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @focusout="${this.handleFocusout}" @blur="${this.handleBlur}" @click="${this.handleInputClick}" />`;}
+function block2 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<input id="search-input" type="search" name="search" class="udex-search__field" autocomplete="off" role="combobox" aria-controls="${ifDefined(this.getAriaControls)}" aria-expanded="false" aria-haspopup="${ifDefined(this.showSuggestedPopover)}" aria-label="Search" placeholder="${ifDefined(this.label)}" .value="${ifDefined(this.value)}" @input="${this.handleSearchChange}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @focusout="${this.handleFocusout}" @blur="${this.handleBlur}" @click="${this.handleInputClick}" />`;}
+function block3 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.label ? block4.call(this, context, tags, suffix) : undefined }<input id="search-input" type="search" name="search" class="udex-search__field" autocomplete="off" role="combobox" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-controls="${ifDefined(this.getAriaControls)}" aria-expanded="false" aria-haspopup="${ifDefined(this.showSuggestedPopover)}" .value="${ifDefined(this.value)}" @input="${this.handleSearchChange}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @focusout="${this.handleFocusout}" @blur="${this.handleBlur}" @click="${this.handleInputClick}" />`;}
 function block4 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label for="search-input" class="${ifDefined(this.labelClasses)}">${ifDefined(this.label)}</label>`;}
 function block5 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-button", tags, suffix)} id="reset-button" class="udex-search__button udex-search__reset-button" design="Default" icon="decline" tooltip="Reset Button" @click="${this.onReset}" @keydown="${this.handleKeyDownReset}"></${scopeTag("ui5-button", tags, suffix)}>` : html`<ui5-button id="reset-button" class="udex-search__button udex-search__reset-button" design="Default" icon="decline" tooltip="Reset Button" @click="${this.onReset}" @keydown="${this.handleKeyDownReset}"></ui5-button>`;}
 function block6 (this: Search, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-button", tags, suffix)} id="voice-button" class="udex-search__button udex-search__voice-button ${ifDefined(this.voiceActiveClass)}" design="Default" icon="microphone" tooltip="Voice Button" @click="${this.onVoice}"></${scopeTag("ui5-button", tags, suffix)}>` : html`<ui5-button id="voice-button" class="udex-search__button udex-search__voice-button ${ifDefined(this.voiceActiveClass)}" design="Default" icon="microphone" tooltip="Voice Button" @click="${this.onVoice}"></ui5-button>`;}

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

@@ -12,8 +12,8 @@ function block4 (this: SearchableListBase, context: UI5Element, tags: string[],
 function block5 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.item.isSelectAllHeader ? block6.call(this, context, tags, suffix, item, index) : block8.call(this, context, tags, suffix, item, index) }`;}
 function block6 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-select-all", tags, suffix)} _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block7.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-select-all", tags, suffix)}>` : html`<udex-list-select-all _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block7.call(this, context, tags, suffix, item, index)) }</udex-list-select-all>`;}
 function block7 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
-function block8 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-group-header", tags, suffix)} _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-group-header", tags, suffix)}>` : html`<udex-list-group-header _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</udex-list-group-header>`;}
-function block9 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
+function block8 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-group-header", tags, suffix)} role="list" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-group-header", tags, suffix)}>` : html`<udex-list-group-header role="list" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</udex-list-group-header>`;}
+function block9 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
 function block10 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" label="${ifDefined(item.item.label)}">${unsafeHTML(item.item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" label="${ifDefined(item.item.label)}">${unsafeHTML(item.item.innerHTML)}</udex-list-item>`;}
 
 

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

@@ -0,0 +1,16 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type SecondaryNavigationItem from "../../SecondaryNavigationItem.js";
+	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+	
+function block0 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isLink ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) } `;}
+function block1 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a class="udex-secondary-navigation__item" role="${ifDefined(this.menuItemRole)}" ?active="${this.isActive}" href="${ifDefined(this.path)}" target="${ifDefined(this.target)}" @keydown="${this.handleItemLinkKeyDown}" @click="${this.onItemClick}">${ifDefined(this.label)}</a>`;}
+function block2 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button class="udex-secondary-navigation__item" role="${ifDefined(this.itemRole)}" ?active="${this.isActive}" aria-haspopup="${ifDefined(this.hasNestedItems)}" aria-expanded="${ifDefined(this.isOpen)}" aria-label="${ifDefined(this.ariaLabel)}" @keydown="${this.handleItemButtonKeyDown}" @click="${this.onItemClick}"><span class="udex-secondary-navigation__item-text-wrap">${ifDefined(this.label)}${ this._subTitle ? block3.call(this, context, tags, suffix) : undefined }${ this.hasNestedItems ? block4.call(this, context, tags, suffix) : undefined }</span></button>${ this.isOpen ? block5.call(this, context, tags, suffix) : undefined }`;}
+function block3 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-secondary-navigation__item-sub-title">${ifDefined(this._subTitle)}</span>`;}
+function block4 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-secondary-navigation__item-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-secondary-navigation__item-icon" name="slim-arrow-down"></ui5-icon>`;}
+function block5 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__dropdown" @keydown="${this.handleSubItemKeyDown}"><ul role="menu" class="udex-secondary-navigation__dropdown-list">${ repeat(this._processedItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block6.call(this, context, tags, suffix, item, index)) }</ul><slot></slot></div>`;}
+function block6 (this: SecondaryNavigationItem, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="none"><${scopeTag("udex-secondary-navigation-sub-item", tags, suffix)} index="${index}" @ui5-sub-item-click="${ifDefined(this.onSubItemClick)}" @ui5-back-item-click="${ifDefined(this.onBackClick)}" is-back="${ifDefined(item.isBack)}" label="${ifDefined(item.title)}" .nestedItems="${ifDefined(item.items)}" path="${ifDefined(item.path)}" target="${ifDefined(item.target)}" ?is-active="${item.active}"></${scopeTag("udex-secondary-navigation-sub-item", tags, suffix)}></li>` : html`<li role="none"><udex-secondary-navigation-sub-item index="${index}" @ui5-sub-item-click="${ifDefined(this.onSubItemClick)}" @ui5-back-item-click="${ifDefined(this.onBackClick)}" is-back="${ifDefined(item.isBack)}" label="${ifDefined(item.title)}" .nestedItems="${ifDefined(item.items)}" path="${ifDefined(item.path)}" target="${ifDefined(item.target)}" ?is-active="${item.active}"></udex-secondary-navigation-sub-item></li>`;}
+
+
+export default block0;

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

@@ -0,0 +1,14 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type SecondaryNavigationSubItem from "../../SecondaryNavigationSubItem.js";
+	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+	
+function block0 (this: SecondaryNavigationSubItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isBack ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) } `;}
+function block1 (this: SecondaryNavigationSubItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button @click="${this.onBackItemClick}" role="menuitem" aria-label="${ifDefined(this.backButtonLabel)}" aria-haspopup="true" is-back class="udex-secondary-navigation__dropdown-item"><${scopeTag("ui5-icon", tags, suffix)} class="udex-secondary-navigation__dropdown-icon udex-secondary-navigation__dropdown-icon_back" name="slim-arrow-left"></${scopeTag("ui5-icon", tags, suffix)}>${ifDefined(this.label)}</button>` : html`<button @click="${this.onBackItemClick}" role="menuitem" aria-label="${ifDefined(this.backButtonLabel)}" aria-haspopup="true" is-back class="udex-secondary-navigation__dropdown-item"><ui5-icon class="udex-secondary-navigation__dropdown-icon udex-secondary-navigation__dropdown-icon_back" name="slim-arrow-left"></ui5-icon>${ifDefined(this.label)}</button>`;}
+function block2 (this: SecondaryNavigationSubItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasItems ? block3.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) }`;}
+function block3 (this: SecondaryNavigationSubItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button @click="${this.onItemClick}" role="menuitem" aria-haspopup="true" ?sub-active="${this.isSubItemActive}" aria-label="${ifDefined(this.label)}" class="udex-secondary-navigation__dropdown-item">${ifDefined(this.label)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-secondary-navigation__dropdown-icon" name="slim-arrow-right"></${scopeTag("ui5-icon", tags, suffix)}></button>` : html`<button @click="${this.onItemClick}" role="menuitem" aria-haspopup="true" ?sub-active="${this.isSubItemActive}" aria-label="${ifDefined(this.label)}" class="udex-secondary-navigation__dropdown-item">${ifDefined(this.label)}<ui5-icon class="udex-secondary-navigation__dropdown-icon" name="slim-arrow-right"></ui5-icon></button>`;}
+function block4 (this: SecondaryNavigationSubItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a @click="${this.onItemClick}" role="menuitem" href="${ifDefined(this.path)}" target="${ifDefined(this.target)}" ?active="${this.isActive}" class="udex-secondary-navigation__dropdown-item">${ifDefined(this.label)}</a>`;}
+
+
+export default block0;

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

@@ -4,17 +4,14 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type SecondaryNavigation from "../../SecondaryNavigation.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this.rootClass)}">${ this.hasBreadcrumbsSlot ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-secondary-navigation__holder"><div class="udex-secondary-navigation__heading"><div class="udex-secondary-navigation__text-wrap"><span class="udex-secondary-navigation__title">${ifDefined(this.title)}</span><span class="udex-secondary-navigation__active-title">${ifDefined(this.activeItemText)}</span></div><button class="udex-secondary-navigation__mobile-opener" role="button" aria-expanded="${ifDefined(this._mobileBtnExpanded)}" aria-label="${ifDefined(this.mobileMenuOpenerAriaLabel)}" aria-haspopup="true" @click="${this.handleMobileOpen}"><${scopeTag("ui5-icon", tags, suffix)} class="udex-secondary-navigation__title-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}></button></div><div class="udex-secondary-navigation__wrap"><ul role="menubar" class="udex-secondary-navigation__list" @keydown="${this.handleKeyDown}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }${ this._showMoreButton ? block5.call(this, context, tags, suffix) : undefined }</ul>${ this.hasButtonsSlot ? block10.call(this, context, tags, suffix) : undefined }</div></div></div>` : html`<div class="${ifDefined(this.rootClass)}">${ this.hasBreadcrumbsSlot ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-secondary-navigation__holder"><div class="udex-secondary-navigation__heading"><div class="udex-secondary-navigation__text-wrap"><span class="udex-secondary-navigation__title">${ifDefined(this.title)}</span><span class="udex-secondary-navigation__active-title">${ifDefined(this.activeItemText)}</span></div><button class="udex-secondary-navigation__mobile-opener" role="button" aria-expanded="${ifDefined(this._mobileBtnExpanded)}" aria-label="${ifDefined(this.mobileMenuOpenerAriaLabel)}" aria-haspopup="true" @click="${this.handleMobileOpen}"><ui5-icon class="udex-secondary-navigation__title-icon" name="slim-arrow-down"></ui5-icon></button></div><div class="udex-secondary-navigation__wrap"><ul role="menubar" class="udex-secondary-navigation__list" @keydown="${this.handleKeyDown}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }${ this._showMoreButton ? block5.call(this, context, tags, suffix) : undefined }</ul>${ this.hasButtonsSlot ? block10.call(this, context, tags, suffix) : undefined }</div></div></div>`;}
+function block0 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-secondary-navigation__root">${ this.hasBreadcrumbsSlot ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-secondary-navigation__holder"><div class="udex-secondary-navigation__heading">${ this.titleHref.length ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</div><div class="udex-secondary-navigation__wrap"><ul role="menubar" class="udex-secondary-navigation__list" @keydown="${this.handleKeyDown}">${ repeat(this.visibleItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }${ this._showMoreButton ? block5.call(this, context, tags, suffix) : undefined }</ul>${ this.hasDesktopButtonsSlot ? block6.call(this, context, tags, suffix) : undefined }</div></div><${scopeTag("udex-secondary-navigation-item", tags, suffix)} class="udex-secondary-navigation__mobile-nav" role="button" aria-label="${ifDefined(this.mobileMenuOpenerAriaLabel)}" label="${ifDefined(this.title)}" @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" .subItems="${ifDefined(this.parsedItems)}">${ this.hasMobileButtonsSlot ? block7.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-secondary-navigation-item", tags, suffix)}></div> ` : html`<div class="udex-secondary-navigation__root">${ this.hasBreadcrumbsSlot ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-secondary-navigation__holder"><div class="udex-secondary-navigation__heading">${ this.titleHref.length ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</div><div class="udex-secondary-navigation__wrap"><ul role="menubar" class="udex-secondary-navigation__list" @keydown="${this.handleKeyDown}">${ repeat(this.visibleItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }${ this._showMoreButton ? block5.call(this, context, tags, suffix) : undefined }</ul>${ this.hasDesktopButtonsSlot ? block6.call(this, context, tags, suffix) : undefined }</div></div><udex-secondary-navigation-item class="udex-secondary-navigation__mobile-nav" role="button" aria-label="${ifDefined(this.mobileMenuOpenerAriaLabel)}" label="${ifDefined(this.title)}" @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" .subItems="${ifDefined(this.parsedItems)}">${ this.hasMobileButtonsSlot ? block7.call(this, context, tags, suffix) : undefined }</udex-secondary-navigation-item></div> `;}
 function block1 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__breadcrumbs"><slot name="breadcrumbs"></slot></div>`;}
-function block2 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li role="none" class="udex-secondary-navigation__list-item udex-secondary-navigation__link-btn-wrap" ?active="${item.active}">${ item.path ? block3.call(this, context, tags, suffix, item, index) : block4.call(this, context, tags, suffix, item, index) }</li>`;}
-function block3 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<a role="menuitem" class="udex-secondary-navigation__item udex-secondary-navigation__link-btn" href="${ifDefined(item.path)}" target="${ifDefined(item.target)}" @click="${this.handleNavigationClick}">${ifDefined(item.title)}</a>`;}
-function block4 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<button role="menuitem" class="udex-secondary-navigation__item udex-secondary-navigation__link-btn" @click="${this.handleNavigationClick}">${ifDefined(item.title)}</button>`;}
-function block5 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li role="none" class="${ifDefined(this.moreClass)} udex-secondary-navigation__link-btn-wrap" ?active="${this.moreIsActive}"><button role="menuitem" @click="${this.handleToggleDropdown}" aria-expanded="${ifDefined(this._dropdownMoreIsOpen)}" aria-label="${ifDefined(this.moreButtonText)}" aria-haspopup="true" class="udex-secondary-navigation__item udex-secondary-navigation__link-btn udex-secondary-navigation__link-btn-more">${ifDefined(this.moreButtonText)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-secondary-navigation__item-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}></button>${ this._dropdownMoreIsOpen ? block6.call(this, context, tags, suffix) : undefined }</li>` : html`<li role="none" class="${ifDefined(this.moreClass)} udex-secondary-navigation__link-btn-wrap" ?active="${this.moreIsActive}"><button role="menuitem" @click="${this.handleToggleDropdown}" aria-expanded="${ifDefined(this._dropdownMoreIsOpen)}" aria-label="${ifDefined(this.moreButtonText)}" aria-haspopup="true" class="udex-secondary-navigation__item udex-secondary-navigation__link-btn udex-secondary-navigation__link-btn-more">${ifDefined(this.moreButtonText)}<ui5-icon class="udex-secondary-navigation__item-icon" name="slim-arrow-down"></ui5-icon></button>${ this._dropdownMoreIsOpen ? block6.call(this, context, tags, suffix) : undefined }</li>`;}
-function block6 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__dropdown"><ul role="menu" class="udex-secondary-navigation__dropdown-list" @keydown="${this.handleKeyDownDropdown}">${ repeat(this._overflowItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block7.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
-function block7 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li role="none" ?active="${item.active}" class="udex-secondary-navigation__link-btn-wrap">${ item.path ? block8.call(this, context, tags, suffix, item, index) : block9.call(this, context, tags, suffix, item, index) }</li>`;}
-function block8 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<a role="menuitem" href="${ifDefined(item.path)}" target="${ifDefined(item.target)}" class="udex-secondary-navigation__dropdown-item udex-secondary-navigation__link-btn" @click="${this.handleNavigationClick}">${ifDefined(item.title)}</a>`;}
-function block9 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<button role="menuitem" class="udex-secondary-navigation__dropdown-item" @click="${this.handleNavigationClick}">${ifDefined(item.title)}</button>`;}
-function block10 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__buttons"><slot name="buttons"></slot></div>`;}
+function block2 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a class="udex-secondary-navigation__title" href="${ifDefined(this.titleHref)}">${ifDefined(this.title)}</a>`;}
+function block3 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-secondary-navigation__title">${ifDefined(this.title)}</span>`;}
+function block4 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="none" class="udex-secondary-navigation__list-item"><${scopeTag("udex-secondary-navigation-item", tags, suffix)} ?active="${item.active}" path="${ifDefined(item.path)}" label="${ifDefined(item.title)}" target="${ifDefined(item.target)}" .subItems="${ifDefined(item.items)}" @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" @ui5-nav-item-click="${ifDefined(this.handleItemClick)}"></${scopeTag("udex-secondary-navigation-item", tags, suffix)}></li>` : html`<li role="none" class="udex-secondary-navigation__list-item"><udex-secondary-navigation-item ?active="${item.active}" path="${ifDefined(item.path)}" label="${ifDefined(item.title)}" target="${ifDefined(item.target)}" .subItems="${ifDefined(item.items)}" @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" @ui5-nav-item-click="${ifDefined(this.handleItemClick)}"></udex-secondary-navigation-item></li>`;}
+function block5 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li role="none" class="udex-secondary-navigation__list-item"><${scopeTag("udex-secondary-navigation-item", tags, suffix)} @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" @ui5-nav-item-click="${ifDefined(this.handleItemClick)}" label="${ifDefined(this.moreButtonText)}" .subItems="${ifDefined(this._overflowItems)}"></${scopeTag("udex-secondary-navigation-item", tags, suffix)}></li>` : html`<li role="none" class="udex-secondary-navigation__list-item"><udex-secondary-navigation-item @ui5-sub-item-click="${ifDefined(this.handleSubItemClick)}" @ui5-nav-item-click="${ifDefined(this.handleItemClick)}" label="${ifDefined(this.moreButtonText)}" .subItems="${ifDefined(this._overflowItems)}"></udex-secondary-navigation-item></li>`;}
+function block6 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__buttons"><slot name="buttons"></slot></div>`;}
+function block7 (this: SecondaryNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-secondary-navigation__buttons"><slot name="buttons"></slot></div>`;}
 
 
 export default block0;