@sapudex/web-components 2.9.0 → 2.10.0

package/src/TextField.ts

@@ -7,6 +7,7 @@ import Icon from "@ui5/webcomponents/dist/Icon.js";
 import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import { getAllAccessibleNameRefTexts } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js";
 import {
   VALUE_STATE_SUCCESS,
   VALUE_STATE_INFORMATION,
@@ -24,7 +25,7 @@ import TextFieldTemplate from "./generated/templates/TextFieldTemplate.lit.js";
 // Styles
 import TextFieldCss from "./generated/themes/TextField.css.js";
 
-type AccInfo = {
+export type AccInfo = {
   ariaInvalid?: string;
   ariaDescribedBy?: string;
   ariaLabelledBy?: string;
@@ -338,62 +339,39 @@ class UDExTextField extends UI5Element {
   @property({ type: Boolean })
     _isTouched!: boolean;
 
+  /**
+   * Determines Combobox role for the button.
+   * @default false
+   * @private
+   */
+  @property({ type: Boolean })
+    _isComboboxRole?: boolean;
+
   @i18n("@sapudex/web-components")
   static i18nBundle: I18nBundle;
 
-  get valueStateTypeMappings(): Record<string, string> {
-    return {
-      "Success": UDExTextField.i18nBundle.getText(VALUE_STATE_SUCCESS),
-      "Standard": UDExTextField.i18nBundle.getText(VALUE_STATE_INFORMATION),
-      "Error": UDExTextField.i18nBundle.getText(VALUE_STATE_ERROR),
-      "Warning": UDExTextField.i18nBundle.getText(VALUE_STATE_WARNING),
-    };
-  }
-
-  get hasValueState(): boolean {
-    return this.valueState !== UDExValueState.Standard;
-  }
-
-  get valueStateText(): string | undefined {
-    return this.valueState !== UDExValueState.Standard ? this.valueStateTypeMappings[this.valueState] : undefined;
-  }
-
-  get readOnlyStateText(): string {
-    return UDExTextField.i18nBundle.getText(READ_ONLY);
-  }
-
-  get ariaDescribedById(): string {
-    return `${this.supportingTextId} ${this.valueStateTextId} ${this.readOnlyStateTextId}`.trim();
-  }
-
-  get supportingTextId(): string {
-    return this.supportingText ? `${this._id}-supportingTextDesc` : "";
-  }
-
-  get valueStateTextId(): string {
-    return this.hasValueState ? `${this._id}-valueStateDesc` : "";
-  }
+  onBeforeRendering(): void {
+    if ((this.value || this.active) && this.labelActiveClass === "") {
+      this.labelActiveClass = this._labelActiveClassName;
+    } else if (!this.active && !this.value && this.labelActiveClass.length) {
+      this.labelActiveClass = "";
+    }
 
-  get readOnlyStateTextId(): string {
-    return this.readonly ? `${this._id}-stateReadOnlyDesc` : "";
-  }
+    this.isInputReadonly = this.readonly || this.displayonly;
 
-  get accInfo(): AccInfo {
-    return {
-      "ariaInvalid": this.valueState === UDExValueState.Error ? "true" : undefined,
-      "ariaDescribedBy": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,
-      "ariaLabelledBy": this.accessibleNameRef || undefined,
-      "ariaLabel": this.accessibleName || undefined,
-      "ariaHasPopup": this._ariaHasPopup || undefined,
-    };
+    this.labelClasses = `udex-text-field__label ${this.labelActiveClass}`;
   }
 
-  get inputRole(): string | undefined {
-    return this.isAutoCompleteDisabled ? "presentation" : undefined;
-  }
+  onAfterRendering(): void {
+    const directionStyles: string = window
+      .getComputedStyle(this)
+      .getPropertyValue("direction");
 
-  get isAutoCompleteDisabled(): boolean {
-    return this.autocomplete === "off" || this.autocomplete === "new-password";
+    if (!directionStyles) {
+      this.direction = "ltr";
+    } else {
+      this.direction = directionStyles;
+    }
   }
 
   handleKeydown(e: KeyboardEvent): void {
@@ -437,33 +415,76 @@ class UDExTextField extends UI5Element {
     this.fireDecoratorEvent("click-icon");
   }
 
-  onBeforeRendering(): void {
-    if ((this.value || this.active) && this.labelActiveClass === "") {
-      this.labelActiveClass = this._labelActiveClassName;
-    } else if (!this.active && !this.value && this.labelActiveClass.length) {
-      this.labelActiveClass = "";
-    }
+  get _inputHolder(): HTMLElement {
+    return this.shadowRoot!.querySelector<HTMLElement>(".udex-text-field__wrap")!;
+  }
 
-    this.isInputReadonly = this.readonly || this.displayonly;
+  get valueStateTypeMappings(): Record<string, string> {
+    return {
+      "Success": UDExTextField.i18nBundle.getText(VALUE_STATE_SUCCESS),
+      "Standard": UDExTextField.i18nBundle.getText(VALUE_STATE_INFORMATION),
+      "Error": UDExTextField.i18nBundle.getText(VALUE_STATE_ERROR),
+      "Warning": UDExTextField.i18nBundle.getText(VALUE_STATE_WARNING),
+    };
+  }
 
-    this.labelClasses = `udex-text-field__label ${this.labelActiveClass}`;
+  get hasValueState(): boolean {
+    return this.valueState !== UDExValueState.Standard;
   }
 
-  onAfterRendering(): void {
-    const directionStyles: string = window
-      .getComputedStyle(this)
-      .getPropertyValue("direction");
+  get valueStateText(): string {
+    return this.valueState !== UDExValueState.Standard ? this.valueStateTypeMappings[this.valueState] : "";
+  }
 
-    if (!directionStyles) {
-      this.direction = "ltr";
-    } else {
-      this.direction = directionStyles;
-    }
+  get readOnlyStateText(): string {
+    return UDExTextField.i18nBundle.getText(READ_ONLY);
+  }
+
+  get ariaDescribedById(): string {
+    return `${this.supportingTextId} ${this.valueStateTextId} ${this.readOnlyStateTextId}`.trim();
+  }
+
+  get supportingTextId(): string {
+    return this.supportingText ? `${this._id}-supportingTextDesc` : "";
+  }
+
+  get valueStateTextId(): string {
+    return this.hasValueState ? `${this._id}-valueStateDesc` : "";
+  }
+
+  get readOnlyStateTextId(): string {
+    return this.readonly ? `${this._id}-stateReadOnlyDesc` : "";
+  }
+
+  get accInfo(): AccInfo {
+    return {
+      "ariaInvalid": this.valueState === UDExValueState.Error ? "true" : undefined,
+      "ariaDescribedBy": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,
+      "ariaLabel": getAllAccessibleNameRefTexts(this) || this.accessibleName || undefined,
+      "ariaHasPopup": this._ariaHasPopup || undefined,
+    };
+  }
+
+  get inputRole(): string | undefined {
+    return this.isAutoCompleteDisabled ? "presentation" : undefined;
+  }
+
+  get isAutoCompleteDisabled(): boolean {
+    return this.autocomplete === "off" || this.autocomplete === "new-password";
   }
 
   get readonlyNotDisabled(): boolean {
     return this.isInputReadonly && !this.disabled;
   }
+
+  get buttonAccessibleName(): string {
+    return this._isComboboxRole ? this.label : this.accessibleIconName || this.icon;
+  }
+
+  get buttonAccessibleDescription(): string {
+    const label = this._isComboboxRole ? this.value : "";
+    return `${label} ${this.supportingText || ""} ${this.valueStateText}`;
+  }
 }
 
 UDExTextField.define();

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

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

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

@@ -5,9 +5,8 @@ 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)}"><div id="udex-${ifDefined(this._id)}-country-selector__opener" class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" @click="${this.handleTriggerClick}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("udex-text-field", tags, suffix)} label="${ifDefined(this.effectiveAriaLabel)}" id="udexTextField" class="udex-country-selector__text" value="${ifDefined(this.selectedCountryName)}" value-state="${ifDefined(this.valueState)}" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name="${ifDefined(this.supportingText)}" 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}" @ui5-click-icon="${ifDefined(this.handleTriggerClick)}" @mousedown="${this.handleInputMouseDown}" icon="${ifDefined(this.triggerIcon)}" accessible-icon-name="${ifDefined(this.effectiveAriaLabel)}" maxlength="0"></${scopeTag("udex-text-field", tags, suffix)}></div><${scopeTag("udex-dropdown", tags, suffix)} id="dropdown" opener="udex-${ifDefined(this._id)}-country-selector__opener" horizontal-align="Start" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownClose)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-search-keydown="${ifDefined(this.handleKeyDownSearch)}" @keydown="${this.handleKeyDownDropdown}">${ifDefined(this.searchableList)}</${scopeTag("udex-dropdown", tags, suffix)}>${ this.supportingText ? block2.call(this, context, tags, suffix) : undefined }</div> ` : html`<div class="${ifDefined(this.countrySelectorClasses)}"><div id="udex-${ifDefined(this._id)}-country-selector__opener" class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" @click="${this.handleTriggerClick}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<udex-text-field label="${ifDefined(this.effectiveAriaLabel)}" id="udexTextField" class="udex-country-selector__text" value="${ifDefined(this.selectedCountryName)}" value-state="${ifDefined(this.valueState)}" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name="${ifDefined(this.supportingText)}" 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}" @ui5-click-icon="${ifDefined(this.handleTriggerClick)}" @mousedown="${this.handleInputMouseDown}" icon="${ifDefined(this.triggerIcon)}" accessible-icon-name="${ifDefined(this.effectiveAriaLabel)}" maxlength="0"></udex-text-field></div><udex-dropdown id="dropdown" opener="udex-${ifDefined(this._id)}-country-selector__opener" horizontal-align="Start" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownClose)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-search-keydown="${ifDefined(this.handleKeyDownSearch)}" @keydown="${this.handleKeyDownDropdown}">${ifDefined(this.searchableList)}</udex-dropdown>${ this.supportingText ? block2.call(this, context, tags, suffix) : undefined }</div> `;}
+function block0 (this: CountrySelector, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this.countrySelectorClasses)}"><div id="udex-${ifDefined(this._id)}-country-selector__opener" class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" @click="${this.handleTriggerClick}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("udex-text-field", tags, suffix)} label="${ifDefined(this.effectiveAriaLabel)}" id="udexTextField" class="udex-country-selector__text" value="${ifDefined(this.selectedCountryName)}" value-state="${ifDefined(this.valueState)}" supporting-text="${ifDefined(this.supportingText)}" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name="${ifDefined(this.supportingText)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @ui5-click-icon="${ifDefined(this.handleTriggerClick)}" @mousedown="${this.handleInputMouseDown}" icon="${ifDefined(this.triggerIcon)}" accessible-icon-name="${ifDefined(this.effectiveAriaLabel)}" maxlength="0" _is-combobox-role></${scopeTag("udex-text-field", tags, suffix)}></div><${scopeTag("udex-dropdown", tags, suffix)} id="dropdown" opener="udex-${ifDefined(this._id)}-country-selector__opener" horizontal-align="Start" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownClose)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-search-keydown="${ifDefined(this.handleKeyDownSearch)}" @keydown="${this.handleKeyDownDropdown}">${ifDefined(this.searchableList)}</${scopeTag("udex-dropdown", tags, suffix)}></div> ` : html`<div class="${ifDefined(this.countrySelectorClasses)}"><div id="udex-${ifDefined(this._id)}-country-selector__opener" class="${ifDefined(this.countrySelectorTriggerClasses)}" ?disabled="${this.isOpenerDisabled}" @click="${this.handleTriggerClick}" slot="trigger">${ this.showFlagImages ? block1.call(this, context, tags, suffix) : undefined }<udex-text-field label="${ifDefined(this.effectiveAriaLabel)}" id="udexTextField" class="udex-country-selector__text" value="${ifDefined(this.selectedCountryName)}" value-state="${ifDefined(this.valueState)}" supporting-text="${ifDefined(this.supportingText)}" direction="left" aria-label="${ifDefined(this.effectiveAriaLabel)}" accessible-name="${ifDefined(this.supportingText)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" aria-controls="${ifDefined(this.ariaControls)}" aria-haspopup="true" aria-expanded="${ifDefined(this._open)}" ?required="${this.required}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?displayonly="${this.displayonly}" @ui5-click-icon="${ifDefined(this.handleTriggerClick)}" @mousedown="${this.handleInputMouseDown}" icon="${ifDefined(this.triggerIcon)}" accessible-icon-name="${ifDefined(this.effectiveAriaLabel)}" maxlength="0" _is-combobox-role></udex-text-field></div><udex-dropdown id="dropdown" opener="udex-${ifDefined(this._id)}-country-selector__opener" horizontal-align="Start" height="${ifDefined(this.height)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-before-open="${ifDefined(this._dropdownBeforeOpen)}" @ui5-open="${ifDefined(this._dropdownOpen)}" @ui5-before-close="${ifDefined(this._dropdownBeforeClose)}" @ui5-close="${ifDefined(this._dropdownClose)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-search-keydown="${ifDefined(this.handleKeyDownSearch)}" @keydown="${this.handleKeyDownDropdown}">${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" aria-label="${ifDefined(this.flagAriaLabel)}" 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("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message>`;}
 
 function template(this: CountrySelector) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

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

@@ -5,11 +5,10 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type DatePicker from "../../DatePicker.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-date-picker__container"><${scopeTag("udex-text-field", tags, suffix)} class="udex-date-picker__input" _aria-has-popup="grid" icon="appointment-2" value="${ifDefined(this.value)}" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.dateAccessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" @ui5-click-icon="${ifDefined(this.handleInputClick)}" @ui5-change="${ifDefined(this._onInputChange)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-text-field", tags, suffix)}>${ this.supportingText ? block1.call(this, context, tags, suffix) : undefined }</div><${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-calendar__popover" opener="udex-${ifDefined(this._id)}-calendar__opener" class="udex-date-picker__popover" placement="Bottom" horizontal-align="Start" @close="${this._afterDropdownClose}" @open="${this._afterDropdownOpen}"><${scopeTag("ui5-calendar", tags, suffix)} class="udex-date-picker__calendar" @ui5-selection-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ this.isRangeMode ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</${scopeTag("ui5-calendar", tags, suffix)}></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<div class="udex-date-picker__container"><udex-text-field class="udex-date-picker__input" _aria-has-popup="grid" icon="appointment-2" value="${ifDefined(this.value)}" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.dateAccessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" @ui5-click-icon="${ifDefined(this.handleInputClick)}" @ui5-change="${ifDefined(this._onInputChange)}" value-state="${ifDefined(this.valueState)}"></udex-text-field>${ this.supportingText ? block1.call(this, context, tags, suffix) : undefined }</div><udex-dropdown id="udex-${ifDefined(this._id)}-calendar__popover" opener="udex-${ifDefined(this._id)}-calendar__opener" class="udex-date-picker__popover" placement="Bottom" horizontal-align="Start" @close="${this._afterDropdownClose}" @open="${this._afterDropdownOpen}"><ui5-calendar class="udex-date-picker__calendar" @ui5-selection-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ this.isRangeMode ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</ui5-calendar></udex-dropdown>`;}
-function block1 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message>`;}
-function block2 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-date-range", tags, suffix)} start-value="${ifDefined(this.startValue)}" end-value="${ifDefined(this.endValue)}"></${scopeTag("ui5-date-range", tags, suffix)}>` : html`<ui5-date-range start-value="${ifDefined(this.startValue)}" end-value="${ifDefined(this.endValue)}"></ui5-date-range>`;}
-function block3 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this._calendarSelectedDates, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }`;}
-function block4 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("ui5-date", tags, suffix)} value="${ifDefined(item)}"></${scopeTag("ui5-date", tags, suffix)}>` : html`<ui5-date value="${ifDefined(item)}"></ui5-date>`;}
+function block0 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-text-field", tags, suffix)} class="udex-date-picker__input" _aria-has-popup="grid" icon="appointment-2" value="${ifDefined(this.value)}" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.dateAccessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" @ui5-click-icon="${ifDefined(this.handleInputClick)}" @ui5-change="${ifDefined(this._onInputChange)}" value-state="${ifDefined(this.valueState)}" supporting-text="${ifDefined(this.supportingText)}"></${scopeTag("udex-text-field", tags, suffix)}><${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-calendar__popover" opener="udex-${ifDefined(this._id)}-calendar__opener" class="udex-date-picker__popover" placement="Bottom" horizontal-align="Start" @close="${this._afterDropdownClose}" @open="${this._afterDropdownOpen}"><${scopeTag("ui5-calendar", tags, suffix)} class="udex-date-picker__calendar" @ui5-selection-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ this.isRangeMode ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</${scopeTag("ui5-calendar", tags, suffix)}></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<udex-text-field class="udex-date-picker__input" _aria-has-popup="grid" icon="appointment-2" value="${ifDefined(this.value)}" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.dateAccessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" @ui5-click-icon="${ifDefined(this.handleInputClick)}" @ui5-change="${ifDefined(this._onInputChange)}" value-state="${ifDefined(this.valueState)}" supporting-text="${ifDefined(this.supportingText)}"></udex-text-field><udex-dropdown id="udex-${ifDefined(this._id)}-calendar__popover" opener="udex-${ifDefined(this._id)}-calendar__opener" class="udex-date-picker__popover" placement="Bottom" horizontal-align="Start" @close="${this._afterDropdownClose}" @open="${this._afterDropdownOpen}"><ui5-calendar class="udex-date-picker__calendar" @ui5-selection-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ this.isRangeMode ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</ui5-calendar></udex-dropdown>`;}
+function block1 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-date-range", tags, suffix)} start-value="${ifDefined(this.startValue)}" end-value="${ifDefined(this.endValue)}"></${scopeTag("ui5-date-range", tags, suffix)}>` : html`<ui5-date-range start-value="${ifDefined(this.startValue)}" end-value="${ifDefined(this.endValue)}"></ui5-date-range>`;}
+function block2 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this._calendarSelectedDates, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }`;}
+function block3 (this: DatePicker, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("ui5-date", tags, suffix)} value="${ifDefined(item)}"></${scopeTag("ui5-date", tags, suffix)}>` : html`<ui5-date value="${ifDefined(item)}"></ui5-date>`;}
 
 function template(this: DatePicker) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

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

@@ -10,8 +10,8 @@ function block1 (this: FilterMenu, context: UI5Element, tags: string[], suffix:
 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.disabledButtons}" @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.disabledButtons}" @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}" ?disabled="${this.disabledButtons}" @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}" ?disabled="${this.disabledButtons}" @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" @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" @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>`;}
 
 function template(this: FilterMenu) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

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

@@ -36,7 +36,7 @@ function block27 (this: Footer, context: UI5Element, tags: string[], suffix: str
 function block28 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__site-information" data-id="${ifDefined(item.id)}" href="${ifDefined(item.url)}" @click="${this._onSiteInformationClick}">${ifDefined(item.title)}</a></li>`;}
 function block29 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-footer__copyright-chinese-text"><a href="${ifDefined(this.chineseIcpNumberLink)}" title="${ifDefined(this.chineseICPNumber)}" class="udex-footer__copyright-chinese-link" target="_blank">${ifDefined(this.chineseICPNumber)}</a>${ifDefined(this.chineseSecurityNetworkNumber)}</span>`;}
 function block30 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__social-container">${ repeat(this.socialLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block31.call(this, context, tags, suffix, item, index)) }</div>`;}
-function block31 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<a target="${ifDefined(item.target)}" href="${ifDefined(item.url)}" class="udex-footer__social-icon" data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" @click="${this._onSocialMediaLinkClick}"><img data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" alt="${ifDefined(item.name)}${ifDefined(this.socialIconAccessibleName)}" src="${ifDefined(item.iconUrl)}" loading="lazy" /></a>`;}
+function block31 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-social-media-button", tags, suffix)} type="${ifDefined(item.name)}" url="${ifDefined(item.url)}" target="${ifDefined(item.target)}" accessible-name="${ifDefined(item.accessibleName)}" data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" @ui5-click="${ifDefined(this._onSocialMediaLinkClick)}"></${scopeTag("udex-social-media-button", tags, suffix)}>` : html`<udex-social-media-button type="${ifDefined(item.name)}" url="${ifDefined(item.url)}" target="${ifDefined(item.target)}" accessible-name="${ifDefined(item.accessibleName)}" data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" @ui5-click="${ifDefined(this._onSocialMediaLinkClick)}"></udex-social-media-button>`;}
 
 function template(this: Footer) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

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

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

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

@@ -26,7 +26,7 @@ function block17 (this: MastheadShell, context: UI5Element, tags: string[], suff
 function block18 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__support udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleSupportClick}"><slot name="support"></slot></div>`;}
 function block19 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__profile udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleProfileClick}"><slot name="profile"></slot></div>`;}
 function block20 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__country-selector udex-masthead-shell__item_icon" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleCountrySelectorClick}"><slot name="countrySelector"></slot></div>`;}
-function block21 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.closeMobileMenu)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.closeMobileMenu)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></udex-masthead-item>`;}
+function block21 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.closeMobileMenu)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="${ifDefined(this.mobileCloseButtonAccessibleName)}" part="menu-close-btn" hide-active-border _is-menu-close-btn></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.closeMobileMenu)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="${ifDefined(this.mobileCloseButtonAccessibleName)}" part="menu-close-btn" hide-active-border _is-menu-close-btn></udex-masthead-item>`;}
 
 function template(this: MastheadShell) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
 export default template;

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

@@ -7,7 +7,7 @@ import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.showSearch ? block1.call(this, context, tags, suffix) : undefined }${ this.isListEmpty ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) } `;}
 function block1 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-search", tags, suffix)} slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></${scopeTag("udex-search", tags, suffix)}><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span>` : html`<udex-search slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></udex-search><span aria-live="polite" aria-atomic="true" class="hidden">${ifDefined(this._accSearchResultInfo)}</span>`;}
-function block2 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-no-result"><span>${ifDefined(this.getNoResultText)}&lrm;</span></div>`;}
+function block2 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-no-result"><span>${ifDefined(this.getNoResultText)}</span></div>`;}
 function block3 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.busy ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }`;}
 function block4 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-busy-indicator", tags, suffix)} class="udex-busy-indicator" size="M" delay="${ifDefined(this.busyDelay)}" active></${scopeTag("ui5-busy-indicator", tags, suffix)}>` : html`<ui5-busy-indicator class="udex-busy-indicator" size="M" delay="${ifDefined(this.busyDelay)}" active></ui5-busy-indicator>`;}
 function block5 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list", tags, suffix)} id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block6.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list", tags, suffix)}>` : html`<udex-list id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block6.call(this, context, tags, suffix, item, index)) }</udex-list>`;}

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

@@ -5,14 +5,14 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type SelectBox from "../../SelectBox.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-select-box__root"><div class="udex-text-field__container"><div class="udex-text-field__wrap"><div role="combobox" @click="${this.getHandleSingleSelectOpen}" class="udex-text-field__input" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @keydown="${this.handleKeyDownTrigger}" ?open="${this._open}" tabindex="${ifDefined(this.effectiveTabIndex)}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" ?disabled="${this.disabled}" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-labelledby="${ifDefined(this.accInfo.ariaLabelledBy)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this.tokenizerExpanded)}" aria-activedescendant>${ this.label ? block1.call(this, context, tags, suffix) : undefined }${ this.showSingleSelectedOption ? block3.call(this, context, tags, suffix) : undefined }${ this.showMultiSelectedOptions ? block4.call(this, context, tags, suffix) : undefined }${ this.showTrigger ? block7.call(this, context, tags, suffix) : undefined }</div></div>${ this.supportingText ? block8.call(this, context, tags, suffix) : undefined }</div><${scopeTag("ui5-popover", tags, suffix)} hide-arrow id="${ifDefined(this.popoverId)}" class="udex-select-box__dropdown" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-after-close="${ifDefined(this.handleDropdownAfterClose)}" @search-keydown="${this.handleKeyDownSearch}" horizontal-align="Start" placement="Bottom">${ this._showTagsDropdownContent ? block9.call(this, context, tags, suffix) : block10.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}></div>` : html`<div class="udex-select-box__root"><div class="udex-text-field__container"><div class="udex-text-field__wrap"><div role="combobox" @click="${this.getHandleSingleSelectOpen}" class="udex-text-field__input" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @keydown="${this.handleKeyDownTrigger}" ?open="${this._open}" tabindex="${ifDefined(this.effectiveTabIndex)}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" ?disabled="${this.disabled}" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-labelledby="${ifDefined(this.accInfo.ariaLabelledBy)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this.tokenizerExpanded)}" aria-activedescendant>${ this.label ? block1.call(this, context, tags, suffix) : undefined }${ this.showSingleSelectedOption ? block3.call(this, context, tags, suffix) : undefined }${ this.showMultiSelectedOptions ? block4.call(this, context, tags, suffix) : undefined }${ this.showTrigger ? block7.call(this, context, tags, suffix) : undefined }</div></div>${ this.supportingText ? block8.call(this, context, tags, suffix) : undefined }</div><ui5-popover hide-arrow id="${ifDefined(this.popoverId)}" class="udex-select-box__dropdown" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-after-close="${ifDefined(this.handleDropdownAfterClose)}" @search-keydown="${this.handleKeyDownSearch}" horizontal-align="Start" placement="Bottom">${ this._showTagsDropdownContent ? block9.call(this, context, tags, suffix) : block10.call(this, context, tags, suffix) }</ui5-popover></div>`;}
-function block1 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-single-label" class="${ifDefined(this.labelClass)}">${ifDefined(this.label)}${ this.required ? block2.call(this, context, tags, suffix) : undefined }</span>`;}
+function block0 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-select-box__root"><div class="udex-text-field__container"><div class="udex-text-field__wrap"><div role="combobox" @click="${this.getHandleSingleSelectOpen}" class="udex-text-field__input" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @keydown="${this.handleKeyDownTrigger}" ?open="${this._open}" tabindex="${ifDefined(this.effectiveTabIndex)}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" ?disabled="${this.disabled}" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this.tokenizerExpanded)}" aria-activedescendant>${ this.label ? block1.call(this, context, tags, suffix) : undefined }${ this.showSingleSelectedOption ? block3.call(this, context, tags, suffix) : undefined }${ this.showMultiSelectedOptions ? block4.call(this, context, tags, suffix) : undefined }${ this.showTrigger ? block7.call(this, context, tags, suffix) : undefined }</div></div>${ this.supportingText ? block8.call(this, context, tags, suffix) : undefined }</div><${scopeTag("ui5-popover", tags, suffix)} hide-arrow id="${ifDefined(this.popoverId)}" class="udex-select-box__dropdown" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-after-close="${ifDefined(this.handleDropdownAfterClose)}" @search-keydown="${this.handleKeyDownSearch}" horizontal-align="Start" placement="Bottom">${ this._showTagsDropdownContent ? block9.call(this, context, tags, suffix) : block10.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}></div>` : html`<div class="udex-select-box__root"><div class="udex-text-field__container"><div class="udex-text-field__wrap"><div role="combobox" @click="${this.getHandleSingleSelectOpen}" class="udex-text-field__input" @ui5-tag-icon-click="${ifDefined(this.handleRemoveTag)}" @keydown="${this.handleKeyDownTrigger}" ?open="${this._open}" tabindex="${ifDefined(this.effectiveTabIndex)}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" ?disabled="${this.disabled}" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-readonly="${ifDefined(this.isReadOrDisplayOnly)}" aria-disabled="${ifDefined(this.disabled)}" aria-haspopup="${ifDefined(this.listboxRole)}" aria-controls="${ifDefined(this.popoverId)}" aria-expanded="${ifDefined(this.tokenizerExpanded)}" aria-activedescendant>${ this.label ? block1.call(this, context, tags, suffix) : undefined }${ this.showSingleSelectedOption ? block3.call(this, context, tags, suffix) : undefined }${ this.showMultiSelectedOptions ? block4.call(this, context, tags, suffix) : undefined }${ this.showTrigger ? block7.call(this, context, tags, suffix) : undefined }</div></div>${ this.supportingText ? block8.call(this, context, tags, suffix) : undefined }</div><ui5-popover hide-arrow id="${ifDefined(this.popoverId)}" class="udex-select-box__dropdown" ?allow-target-overlap="${this.allowTargetOverlap}" @keydown="${this.handleKeyDownDropdown}" @ui5-select-all="${ifDefined(this.handleSelectAll)}" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleHeaderPress)}" @ui5-submit-search-value="${ifDefined(this.handleSubmitSearch)}" @ui5-handle-value-search="${ifDefined(this.handleValueSearch)}" @ui5-handle-value-reset="${ifDefined(this.handleResetSearch)}" @ui5-before-open="${ifDefined(this.handleDropdownBeforeOpen)}" @ui5-after-close="${ifDefined(this.handleDropdownAfterClose)}" @search-keydown="${this.handleKeyDownSearch}" horizontal-align="Start" placement="Bottom">${ this._showTagsDropdownContent ? block9.call(this, context, tags, suffix) : block10.call(this, context, tags, suffix) }</ui5-popover></div>`;}
+function block1 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="${ifDefined(this.labelClass)}">${ifDefined(this.label)}${ this.required ? block2.call(this, context, tags, suffix) : undefined }</span><span class="hidden" id="${ifDefined(this._id)}-single-label">${ifDefined(this.accInfo.ariaLabel)}</span></span>`;}
 function block2 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html` * `;}
-function block3 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__text-holder"><span class="udex-text-field__single-label">${unsafeHTML(this._singleSelectedOption)}</span></div>`;}
+function block3 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__text-holder"><span class="udex-text-field__single-label" aria-hidden="true">${unsafeHTML(this._singleSelectedOption)}</span></div>`;}
 function block4 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-tag-group", tags, suffix)} class="udex-tag-group" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" tooltip-placement="${ifDefined(this.tooltipPlacement)}" @ui5-tag-click="${ifDefined(this.handleTagClick)}" @ui5-show-more-tags="${ifDefined(this.getHandlerShowMoreItems)}" @ui5-tag-keydown="${ifDefined(this.handleKeyDownTag)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.selectedItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-tag-group", tags, suffix)}>` : html`<udex-tag-group class="udex-tag-group" ?displayonly="${this.displayonly}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" tooltip-placement="${ifDefined(this.tooltipPlacement)}" @ui5-tag-click="${ifDefined(this.handleTagClick)}" @ui5-show-more-tags="${ifDefined(this.getHandlerShowMoreItems)}" @ui5-tag-keydown="${ifDefined(this.handleKeyDownTag)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.selectedItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</udex-tag-group>`;}
 function block5 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ !item.isGroup ? block6.call(this, context, tags, suffix, item, index) : undefined }`;}
 function block6 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} text="${ifDefined(item.label)}" id="${ifDefined(item._id)}" icon="decline"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag text="${ifDefined(item.label)}" id="${ifDefined(item._id)}" icon="decline"></udex-tag>`;}
-function block7 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button role="combobox" aria-labelledby="${ifDefined(this._id)}-single-label" aria-expanded="${ifDefined(this.accessibilityAttributes.expanded)}" aria-controls="${ifDefined(this.accessibilityAttributes.controls)}" aria-haspopup="${ifDefined(this.accessibilityAttributes.hasPopup)}" aria-label="${ifDefined(this.accessibilityAttributes.ariaLabel)}" class="udex-text-field__trigger" tabindex="${ifDefined(this.triggerTabIndex)}" @keydown="${this.handleKeyDownTrigger}" @click="${this.getHandleMultiSelectOpen}"><${scopeTag("ui5-icon", tags, suffix)} name="navigation-down-arrow" accessible-name="${ifDefined(this.iconAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></button>` : html`<button role="combobox" aria-labelledby="${ifDefined(this._id)}-single-label" aria-expanded="${ifDefined(this.accessibilityAttributes.expanded)}" aria-controls="${ifDefined(this.accessibilityAttributes.controls)}" aria-haspopup="${ifDefined(this.accessibilityAttributes.hasPopup)}" aria-label="${ifDefined(this.accessibilityAttributes.ariaLabel)}" class="udex-text-field__trigger" tabindex="${ifDefined(this.triggerTabIndex)}" @keydown="${this.handleKeyDownTrigger}" @click="${this.getHandleMultiSelectOpen}"><ui5-icon name="navigation-down-arrow" accessible-name="${ifDefined(this.iconAccessibleNameText)}"></ui5-icon></button>`;}
+function block7 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button role="combobox" aria-labelledby="${ifDefined(this._id)}-single-label" aria-expanded="${ifDefined(this.accessibilityAttributes.expanded)}" aria-controls="${ifDefined(this.accessibilityAttributes.controls)}" aria-haspopup="${ifDefined(this.accessibilityAttributes.hasPopup)}" class="udex-text-field__trigger" tabindex="${ifDefined(this.triggerTabIndex)}" @keydown="${this.handleKeyDownTrigger}" @click="${this.getHandleMultiSelectOpen}"><${scopeTag("ui5-icon", tags, suffix)} name="navigation-down-arrow"></${scopeTag("ui5-icon", tags, suffix)}><span class="hidden">${ifDefined(this.accessibilityAttributes.ariaLabel)}</span></button>` : html`<button role="combobox" aria-labelledby="${ifDefined(this._id)}-single-label" aria-expanded="${ifDefined(this.accessibilityAttributes.expanded)}" aria-controls="${ifDefined(this.accessibilityAttributes.controls)}" aria-haspopup="${ifDefined(this.accessibilityAttributes.hasPopup)}" class="udex-text-field__trigger" tabindex="${ifDefined(this.triggerTabIndex)}" @keydown="${this.handleKeyDownTrigger}" @click="${this.getHandleMultiSelectOpen}"><ui5-icon name="navigation-down-arrow"></ui5-icon><span class="hidden">${ifDefined(this.accessibilityAttributes.ariaLabel)}</span></button>`;}
 function block8 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message>`;}
 function block9 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-truncatable-tag-content"><span class="udex-truncatable-tag-content__label">${ifDefined(this.truncatableTagLabel)}</span><${scopeTag("ui5-icon", tags, suffix)} @click="${this.handleRemoveTruncatableTag}" class="udex-truncatable-tag-content__icon" mode="Decorative" name="decline"></${scopeTag("ui5-icon", tags, suffix)}></div>` : html`<div class="udex-truncatable-tag-content"><span class="udex-truncatable-tag-content__label">${ifDefined(this.truncatableTagLabel)}</span><ui5-icon @click="${this.handleRemoveTruncatableTag}" class="udex-truncatable-tag-content__icon" mode="Decorative" name="decline"></ui5-icon></div>`;}
 function block10 (this: SelectBox, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ifDefined(this.searchableList)}`;}

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

@@ -5,10 +5,10 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type TextField from "../../TextField.js";
 import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__container">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__wrap"><input id="${ifDefined(this._id)}-input" class="udex-text-field__input" type="${ifDefined(this.type)}" .value="${ifDefined(this.value)}" @change="${this.handleChange}" @input="${this.handleInput}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${this.handleClick}" @keydown="${this.handleKeydown}" maxlength="${ifDefined(this.maxlength)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" autocomplete="${ifDefined(this.autocomplete)}" role="${ifDefined(this.inputRole)}" ?aria-disabled="${this.readonlyNotDisabled}" aria-invalid="${ifDefined(this.accInfo.ariaInvalid)}" aria-describedby="${ifDefined(this.accInfo.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.accInfo.ariaHasPopup)}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-labelledby="${ifDefined(this.accInfo.ariaLabelledBy)}" part="textfield-input" min="${ifDefined(this.min)}" max="${ifDefined(this.max)}" step="${ifDefined(this.step)}" />${ this.icon ? block3.call(this, context, tags, suffix) : undefined }</div>${ this.supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.supportingText ? block5.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block6.call(this, context, tags, suffix) : undefined }${ this.readonly ? block7.call(this, context, tags, suffix) : undefined }</div>`;}
+function block0 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__container">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__wrap"><input id="${ifDefined(this._id)}-input" class="udex-text-field__input" type="${ifDefined(this.type)}" .value="${ifDefined(this.value)}" @change="${this.handleChange}" @input="${this.handleInput}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${this.handleClick}" @keydown="${this.handleKeydown}" maxlength="${ifDefined(this.maxlength)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" autocomplete="${ifDefined(this.autocomplete)}" role="${ifDefined(this.inputRole)}" ?aria-disabled="${this.readonlyNotDisabled}" aria-invalid="${ifDefined(this.accInfo.ariaInvalid)}" aria-describedby="${ifDefined(this.accInfo.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.accInfo.ariaHasPopup)}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" part="textfield-input" min="${ifDefined(this.min)}" max="${ifDefined(this.max)}" step="${ifDefined(this.step)}" />${ this.icon ? block3.call(this, context, tags, suffix) : undefined }</div>${ this.supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.supportingText ? block5.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block6.call(this, context, tags, suffix) : undefined }${ this.readonly ? block7.call(this, context, tags, suffix) : undefined }</div>`;}
 function block1 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label for="${ifDefined(this._id)}-input" class="${ifDefined(this.labelClasses)}" part="label">${ifDefined(this.label)}${ this.required ? block2.call(this, context, tags, suffix) : undefined }</label>`;}
 function block2 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html` * `;}
-function block3 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-control-button", tags, suffix)} accessible-name="${ifDefined(this.accessibleIconName)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></${scopeTag("udex-control-button", tags, suffix)}>` : html`<udex-control-button accessible-name="${ifDefined(this.accessibleIconName)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></udex-control-button>`;}
+function block3 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-control-button", tags, suffix)} accessible-name="${ifDefined(this.buttonAccessibleName)}" accessible-description="${ifDefined(this.buttonAccessibleDescription)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?_is-combobox-role="${ifDefined(this._isComboboxRole)}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></${scopeTag("udex-control-button", tags, suffix)}>` : html`<udex-control-button accessible-name="${ifDefined(this.buttonAccessibleName)}" accessible-description="${ifDefined(this.buttonAccessibleDescription)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?_is-combobox-role="${ifDefined(this._isComboboxRole)}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></udex-control-button>`;}
 function block4 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message>`;}
 function block5 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this.supportingText)}</span>`;}
 function block6 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-valueStateDesc" class="hidden-text">${ifDefined(this.valueStateText)}</span>`;}

package/src/generated/themes/DatePicker.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-date-picker-width: 354px;position:relative;font-family:var(--sapFontFamily)}.udex-date-picker__container{display:flex;flex-direction:column}.udex-date-picker__calendar{min-width:var(--udex-date-picker-width);background-color:var(--udexNeutralColorWhite, #ffffff);border-radius:8px}.udex-date-picker__input{--udex-input-padding: 9px 48px 9px 12px}
+export default `:host{--udex-date-picker-width: 354px;position:relative;font-family:var(--sapFontFamily)}.udex-date-picker__calendar{min-width:var(--udex-date-picker-width);background-color:var(--udexNeutralColorWhite, #ffffff);border-radius:8px}.udex-date-picker__input{--udex-input-padding: 9px 48px 9px 12px}
 `

package/src/generated/themes/Dropdown.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-dropdown-box-shadow: var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));--udex-dropdown-border-color-default: var(--sapField_BorderColor, var(--udexCoreBorderDefault));--udex-dropdown-border-radius: var(--udexRadiusM, 8px);--udex-dropdown-border-width: var(--sapElement_BorderWidth, 1px);--udex-dropdown-horizontal-distance: 0;--udex-dropdown-vertical-distance: 0;--udex-dropdown-pane-min-width: 320px;--udex-dropdown-left-offset: 0px;--udex-dropdown-pane-min-width-xs: calc(100% - var(--udex-dropdown-left-offset));--udex-dropdown-pane-max-width: 640px;--udex-dropdown-pane-max-width-xs: 100%;--udex-dropdown-pane-width: fit-content;--udex-dropdown-pane-max-height: none;--udex-dropdown-pane-overflow: visible;--udex-dropdown-pane-content-overflow: auto;--udex-dropdown-background-content: var(--sapBackgroundColor, #FFF)}:host{min-width:var(--udex-dropdown-pane-min-width);max-width:var(--udex-dropdown-pane-max-width);width:var(--udex-dropdown-pane-width);max-height:var(--udex-dropdown-pane-max-height);overflow:var(--udex-dropdown-pane-overflow);border:var(--udex-dropdown-border-width) solid var(--udex-dropdown-border-color-default);border-radius:var(--udex-dropdown-border-radius);box-shadow:var(--udex-dropdown-box-shadow);background:var(--udex-dropdown-background-content)}.ui5-popup-root.ui5-popover-root{margin:var(--udex-dropdown-vertical-distance) var(--udex-dropdown-horizontal-distance)}:host .ui5-popup-root .ui5-popup-content{padding:0;overflow:var(--udex-dropdown-pane-content-overflow)}:host .ui5-popup-root .ui5-popup-header-root,:host .ui5-popup-root .ui5-popup-footer-root{padding:var(--udexSpacer16, 16px) var(--udexSpacer12, 12px);background:none}:host .ui5-popup-root .ui5-popup-footer-root{justify-content:flex-start;border-color:var(--udex-dropdown-border-color-default)}::slotted(.udex-no-result){font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);color:var(--sapContent_TitleColor, #000000);padding:0 var(--udexSpacer16, 16px) var(--udexSpacer16, 16px)}@media (width < 640px){.ui5-popup-root.ui5-popover-root{min-width:var(--udex-dropdown-pane-min-width-xs);max-width:var(--udex-dropdown-pane-max-width-xs)}}
+export default `:host{--udex-dropdown-box-shadow: var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));--udex-dropdown-border-color-default: var(--sapField_BorderColor, var(--udexCoreBorderDefault));--udex-dropdown-border-radius: var(--udexRadiusM, 8px);--udex-dropdown-border-width: var(--sapElement_BorderWidth, 1px);--udex-dropdown-horizontal-distance: 0;--udex-dropdown-vertical-distance: 0;--udex-dropdown-pane-min-width: 320px;--udex-dropdown-left-offset: 0px;--udex-dropdown-pane-min-width-xs: calc(100% - var(--udex-dropdown-left-offset));--udex-dropdown-pane-max-width: 640px;--udex-dropdown-pane-max-width-xs: 100%;--udex-dropdown-pane-width: fit-content;--udex-dropdown-pane-max-height: none;--udex-dropdown-pane-overflow: visible;--udex-dropdown-pane-content-overflow: auto;--udex-dropdown-background-content: var(--sapBackgroundColor, #FFF)}:host{min-width:var(--udex-dropdown-pane-min-width);max-width:var(--udex-dropdown-pane-max-width);width:var(--udex-dropdown-pane-width);max-height:var(--udex-dropdown-pane-max-height);overflow:var(--udex-dropdown-pane-overflow);border:var(--udex-dropdown-border-width) solid var(--udex-dropdown-border-color-default);border-radius:var(--udex-dropdown-border-radius);box-shadow:var(--udex-dropdown-box-shadow);background:var(--udex-dropdown-background-content)}.ui5-popup-root.ui5-popover-root{margin:var(--udex-dropdown-vertical-distance) var(--udex-dropdown-horizontal-distance)}:host .ui5-popup-root .ui5-popup-content{padding:0;overflow:var(--udex-dropdown-pane-content-overflow)}:host .ui5-popup-root .ui5-popup-header-root,:host .ui5-popup-root .ui5-popup-footer-root{padding:var(--udexSpacer16, 16px) var(--udexSpacer12, 12px);background:none}:host .ui5-popup-root .ui5-popup-footer-root{justify-content:flex-start;border-color:var(--udex-dropdown-border-color-default)}::slotted(.udex-no-result){font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);color:var(--sapContent_TitleColor, #000000);padding:0 var(--udexSpacer12, 12px) var(--udexSpacer16, 16px)}@media (width < 640px){.ui5-popup-root.ui5-popover-root{min-width:var(--udex-dropdown-pane-min-width-xs);max-width:var(--udex-dropdown-pane-max-width-xs)}}
 `