@sapudex/web-components 0.226.0 → 2.1.0

package/src/WizardStep.ts

@@ -1,6 +1,6 @@
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import WizardStep from "@ui5/webcomponents-fiori/dist/WizardStep.js";
 
 // Styles
@@ -25,7 +25,7 @@ import wizardStepCss from "@ui5/webcomponents-fiori/dist/generated/themes/Wizard
  */
 @customElement({
   tag: "udex-wizard-step",
-  renderer: litRender,
+  renderer: jsxRenderer,
   styles: wizardStepCss,
 })
 class UDExWizardStep extends WizardStep {

package/src/WizardTab.ts

@@ -1,18 +1,12 @@
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import UI5WizardTab from "@ui5/webcomponents-fiori/dist/WizardTab.js";
 
 // Styles
 import wizardTabCss from "@ui5/webcomponents-fiori/dist/generated/themes/WizardTab.css.js";
 import WizardTabCss from "./generated/themes/WizardTab.css.js";
-
-export enum WindowSize {
-  S = "S",
-  M = "M",
-  L = "L",
-  XL = "XL"
-}
+import { UDExWindowSize } from "./types/common.js";
 
 /**
  * @class
@@ -35,7 +29,7 @@ export enum WindowSize {
  */
 @customElement({
   tag: "udex-wizard-tab",
-  renderer: litRender,
+  renderer: jsxRenderer,
   styles: [wizardTabCss, WizardTabCss],
 })
 class UDExWizardTab extends UI5WizardTab {
@@ -45,8 +39,16 @@ class UDExWizardTab extends UI5WizardTab {
    * @default "L"
    * @public
    */
-  @property({ type: WindowSize, defaultValue: WindowSize.L })
-    breakpoint!: `${WindowSize}`;
+  @property()
+    breakpoint: `${UDExWindowSize}` = UDExWindowSize.L;
+  /**
+   * Determines if the step is completed.
+   *
+   * @default false
+   * @public
+   */
+  @property({ type: Boolean })
+    completed: boolean = false;
 }
 
 UDExWizardTab.define();

package/src/WizardTemplate.tsx

@@ -0,0 +1,61 @@
+import type UDExWizard from "./Wizard.js";
+import UDExWizardTab from "./WizardTab.js";
+
+export default function WizardTemplate(this: UDExWizard) {
+  return (
+    <div
+      class={this.classes.root}
+      aria-label={this.ariaLabelText}
+      role="region"
+      part="ui5-wiz-root">
+      <nav class="ui5-wiz-nav" part="navigator" aria-label={this.navAriaLabelText} tabindex={-1}>
+        <div class="ui5-wiz-nav-list" role="list" aria-label={this.listAriaLabelText} aria-describedby="wiz-nav-descr">
+          {this.stepsInfo.map(headerStep =>
+            <UDExWizardTab
+              completed={headerStep.completed}
+              titleText={headerStep.titleText}
+              subtitleText={headerStep.subtitleText}
+              icon={headerStep.icon}
+              number={String(headerStep.number)}
+              disabled={headerStep.disabled}
+              selected={headerStep.selected}
+              hideSeparator={headerStep.hideSeparator}
+              activeSeparator={headerStep.activeSeparator}
+              branchingSeparator={headerStep.branchingSeparator}
+              _wizardTabAccInfo={headerStep.accInfo}
+              breakpoint={this._breakpoint}
+              data-ui5-content-ref-id={headerStep.refStepId}
+              data-ui5-index={headerStep.pos}
+              onSelectionChangeRequested={this.onSelectionChangeRequested}
+              onFocused={this.onStepInHeaderFocused}
+              onClick={this._onGroupedTabClick}
+              style={headerStep.styles}>
+            </UDExWizardTab>
+          )}
+        </div>
+      </nav>
+
+      <span id="wiz-nav-descr" class="ui5-hidden-text">{this.navAriaDescribedbyText}</span>
+
+      <div id={`${this._id}-wiz-content`} class="ui5-wiz-content" onScroll={this.onScroll}>
+        {this._steps.map(step =>
+          <div
+            class={{
+              "ui5-wiz-content-item": true,
+              "ui5-wiz-content-item-stretch": step.stretch,
+              "ui5-wiz-content-item-selected": step.selected,
+            }}
+            hidden={step.disabled}
+            part="step-content"
+            aria-label={step.stepContentAriaLabel}
+            role="region"
+            data-ui5-content-item-ref-id={step._id}>
+            <div class="ui5-wiz-content-item-wrapper">
+              <slot name={step._individualSlot}></slot>
+            </div>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}

package/src/features/SearchSuggestionsPopover.ts

@@ -3,7 +3,8 @@ import { registerFeature } from "@ui5/webcomponents-base/dist/FeaturesRegistry.j
 import Button from "@ui5/webcomponents/dist/Button.js";
 import Popover from "@ui5/webcomponents/dist/Popover.js";
 import isLetterKey from "../utils/isLetterKeyPressed.js";
-import UDExFirstLetterFocusHandler, { UDExListWithFirstLetterFocus } from "../utils/ListWithFirstLetterFocus.js";
+import type { UDExListWithFirstLetterFocus } from "../utils/ListWithFirstLetterFocus.js";
+import UDExFirstLetterFocusHandler from "../utils/ListWithFirstLetterFocus.js";
 
 interface SuggestionComponent extends UI5Element {
   open: boolean;
@@ -41,13 +42,12 @@ class Suggestion {
     return this.component;
   }
 
-  async _getSuggestionPopover() {
+  _getSuggestionPopover() {
     if (this.popover) {
       return this.popover;
     }
 
-    const staticAreaItem = await this._getComponent().getStaticAreaItemDomRef();
-    this.popover = staticAreaItem!.querySelector<Popover>("[ui5-popover]");
+    this.popover = this._getComponent().shadowRoot!.querySelector<Popover>("#suggestions-popover");
     return this.popover;
   }
 
@@ -56,6 +56,7 @@ class Suggestion {
   }
 
   open(): void {
+    this._getSuggestionPopover();
     this._getComponent().open = true;
     this.popover!.opener = this._getComponent();
     this.popover!.open = true;
@@ -78,6 +79,7 @@ class Suggestion {
   }
 
   close(): void {
+    this._getSuggestionPopover();
     this._getComponent().open = false;
     this.popover!.open = false;
     this.selectedItemIndex = -1;

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

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

package/src/generated/json-imports/Themes-fetch.ts

@@ -0,0 +1,21 @@
+// @ts-nocheck
+import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
+
+const loadThemeProperties = async (themeName) => {
+	switch (themeName) {
+		case "sap_fiori_3": return (await fetch(new URL("../assets/themes/sap_fiori_3/parameters-bundle.css.json", import.meta.url))).json();
+		case "sap_horizon": return (await fetch(new URL("../assets/themes/sap_horizon/parameters-bundle.css.json", import.meta.url))).json();
+		default: throw "unknown theme"
+	}
+};
+
+const loadAndCheck = async (themeName) => {
+	const data = await loadThemeProperties(themeName);
+	if (typeof data === "string" && data.endsWith(".json")) {
+		throw new Error(`[themes] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build. Check the "Assets" documentation for more information.`);
+	}
+	return data;
+};
+
+["sap_fiori_3", "sap_horizon"]
+  .forEach(themeName => registerThemePropertiesLoader("@sapudex/web-components", themeName, loadAndCheck));

package/src/generated/json-imports/Themes.ts

@@ -12,7 +12,7 @@ const loadThemeProperties = async (themeName) => {
 const loadAndCheck = async (themeName) => {
 	const data = await loadThemeProperties(themeName);
 	if (typeof data === "string" && data.endsWith(".json")) {
-		throw new Error(`[themes] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build or use 'import ".../Assets-static.js"'. Check the "Assets" documentation for more information.`);
+		throw new Error(`[themes] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build. Check the "Assets" documentation for more information.`);
 	}
 	return data;
 };

package/src/generated/json-imports/i18n-fetch.ts

@@ -0,0 +1,85 @@
+// @ts-nocheck
+import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registries/i18n.js";
+
+const importMessageBundle = async (localeId) => {
+	switch (localeId) {
+				case "ar": return (await fetch(new URL("../assets/i18n/messagebundle_ar.json", import.meta.url))).json();
+		case "bg": return (await fetch(new URL("../assets/i18n/messagebundle_bg.json", import.meta.url))).json();
+		case "cs": return (await fetch(new URL("../assets/i18n/messagebundle_cs.json", import.meta.url))).json();
+		case "da": return (await fetch(new URL("../assets/i18n/messagebundle_da.json", import.meta.url))).json();
+		case "de": return (await fetch(new URL("../assets/i18n/messagebundle_de.json", import.meta.url))).json();
+		case "el": return (await fetch(new URL("../assets/i18n/messagebundle_el.json", import.meta.url))).json();
+		case "en": return (await fetch(new URL("../assets/i18n/messagebundle_en.json", import.meta.url))).json();
+		case "es": return (await fetch(new URL("../assets/i18n/messagebundle_es.json", import.meta.url))).json();
+		case "et": return (await fetch(new URL("../assets/i18n/messagebundle_et.json", import.meta.url))).json();
+		case "fi": return (await fetch(new URL("../assets/i18n/messagebundle_fi.json", import.meta.url))).json();
+		case "fr": return (await fetch(new URL("../assets/i18n/messagebundle_fr.json", import.meta.url))).json();
+		case "hr": return (await fetch(new URL("../assets/i18n/messagebundle_hr.json", import.meta.url))).json();
+		case "hu": return (await fetch(new URL("../assets/i18n/messagebundle_hu.json", import.meta.url))).json();
+		case "it": return (await fetch(new URL("../assets/i18n/messagebundle_it.json", import.meta.url))).json();
+		case "iw": return (await fetch(new URL("../assets/i18n/messagebundle_iw.json", import.meta.url))).json();
+		case "ko": return (await fetch(new URL("../assets/i18n/messagebundle_ko.json", import.meta.url))).json();
+		case "lt": return (await fetch(new URL("../assets/i18n/messagebundle_lt.json", import.meta.url))).json();
+		case "lv": return (await fetch(new URL("../assets/i18n/messagebundle_lv.json", import.meta.url))).json();
+		case "nl": return (await fetch(new URL("../assets/i18n/messagebundle_nl.json", import.meta.url))).json();
+		case "no": return (await fetch(new URL("../assets/i18n/messagebundle_no.json", import.meta.url))).json();
+		case "pl": return (await fetch(new URL("../assets/i18n/messagebundle_pl.json", import.meta.url))).json();
+		case "pt": return (await fetch(new URL("../assets/i18n/messagebundle_pt.json", import.meta.url))).json();
+		case "ro": return (await fetch(new URL("../assets/i18n/messagebundle_ro.json", import.meta.url))).json();
+		case "ru": return (await fetch(new URL("../assets/i18n/messagebundle_ru.json", import.meta.url))).json();
+		case "sk": return (await fetch(new URL("../assets/i18n/messagebundle_sk.json", import.meta.url))).json();
+		case "sl": return (await fetch(new URL("../assets/i18n/messagebundle_sl.json", import.meta.url))).json();
+		case "sr": return (await fetch(new URL("../assets/i18n/messagebundle_sr.json", import.meta.url))).json();
+		case "sv": return (await fetch(new URL("../assets/i18n/messagebundle_sv.json", import.meta.url))).json();
+		case "tr": return (await fetch(new URL("../assets/i18n/messagebundle_tr.json", import.meta.url))).json();
+		case "uk": return (await fetch(new URL("../assets/i18n/messagebundle_uk.json", import.meta.url))).json();
+		case "zh_CN": return (await fetch(new URL("../assets/i18n/messagebundle_zh_CN.json", import.meta.url))).json();
+		case "zh_TW": return (await fetch(new URL("../assets/i18n/messagebundle_zh_TW.json", import.meta.url))).json();
+		default: throw "unknown locale"
+	}
+}
+
+const importAndCheck = async (localeId) => {
+	const data = await importMessageBundle(localeId);
+	if (typeof data === "string" && data.endsWith(".json")) {
+		throw new Error(`[i18n] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build. Check the "Assets" documentation for more information.`);
+	}
+	return data;
+}
+
+const localeIds = ["ar",
+	"bg",
+	"cs",
+	"da",
+	"de",
+	"el",
+	"en",
+	"es",
+	"et",
+	"fi",
+	"fr",
+	"hr",
+	"hu",
+	"it",
+	"iw",
+	"ko",
+	"lt",
+	"lv",
+	"nl",
+	"no",
+	"pl",
+	"pt",
+	"ro",
+	"ru",
+	"sk",
+	"sl",
+	"sr",
+	"sv",
+	"tr",
+	"uk",
+	"zh_CN",
+	"zh_TW",];
+
+localeIds.forEach(localeId => {
+	registerI18nLoader("@sapudex/web-components", localeId, importAndCheck);
+});

package/src/generated/json-imports/i18n.ts

@@ -1,9 +1,9 @@
 // @ts-nocheck
 import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registries/i18n.js";
 
-	const importMessageBundle = async (localeId) => {
-		switch (localeId) {
-			case "ar": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-ar" */ "../assets/i18n/messagebundle_ar.json")).default;
+const importMessageBundle = async (localeId) => {
+	switch (localeId) {
+				case "ar": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-ar" */ "../assets/i18n/messagebundle_ar.json")).default;
 		case "bg": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-bg" */ "../assets/i18n/messagebundle_bg.json")).default;
 		case "cs": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-cs" */ "../assets/i18n/messagebundle_cs.json")).default;
 		case "da": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-da" */ "../assets/i18n/messagebundle_da.json")).default;
@@ -35,19 +35,19 @@ import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registrie
 		case "uk": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-uk" */ "../assets/i18n/messagebundle_uk.json")).default;
 		case "zh_CN": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-zh_CN" */ "../assets/i18n/messagebundle_zh_CN.json")).default;
 		case "zh_TW": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-zh_TW" */ "../assets/i18n/messagebundle_zh_TW.json")).default;
-			default: throw "unknown locale"
-		}
+		default: throw "unknown locale"
 	}
+}
 
-	const importAndCheck = async (localeId) => {
-		const data = await importMessageBundle(localeId);
-		if (typeof data === "string" && data.endsWith(".json")) {
-			throw new Error(`[i18n] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build or use 'import ".../Assets-static.js"'. Check the "Assets" documentation for more information.`);
-		}
-		return data;
+const importAndCheck = async (localeId) => {
+	const data = await importMessageBundle(localeId);
+	if (typeof data === "string" && data.endsWith(".json")) {
+		throw new Error(`[i18n] Invalid bundling detected - dynamic JSON imports bundled as URLs. Switch to inlining JSON files from the build. Check the "Assets" documentation for more information.`);
 	}
+	return data;
+}
 
-	const localeIds = ["ar",
+const localeIds = ["ar",
 	"bg",
 	"cs",
 	"da",
@@ -80,7 +80,6 @@ import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registrie
 	"zh_CN",
 	"zh_TW",];
 
-	localeIds.forEach(localeId => {
-		registerI18nLoader("@sapudex/web-components", localeId, importAndCheck);
-	});
-	
+localeIds.forEach(localeId => {
+	registerI18nLoader("@sapudex/web-components", localeId, importAndCheck);
+});

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type AccordionItem from "../../AccordionItem.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type AccordionItem from "../../AccordionItem.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: AccordionItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button id="udex-accordion-item__${ifDefined(this._id)}" type="button" class="udex-accordion-item__header" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" @focus="${this.focusHandler}" @click="${this.itemClickHandler}" @keydown="${this.keydownHandler}"><div class="udex-accordion-item__icon-wrapper"><${scopeTag("ui5-icon", tags, suffix)} class="udex-accordion-item__icon" name="slim-arrow-right"></${scopeTag("ui5-icon", tags, suffix)}></div><span class="udex-accordion-item__title">${ifDefined(this.title)}${ this.numberBadge ? block1.call(this, context, tags, suffix) : undefined }</span></button><div id="udex-accordion-item__${ifDefined(this._id)}-content" class="udex-accordion-item__content" aria-labelledby="udex-accordion-item__${ifDefined(this._id)}" @keydown="${this.contentKeydown}" role="region"><slot></slot></div>` : html`<button id="udex-accordion-item__${ifDefined(this._id)}" type="button" class="udex-accordion-item__header" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" @focus="${this.focusHandler}" @click="${this.itemClickHandler}" @keydown="${this.keydownHandler}"><div class="udex-accordion-item__icon-wrapper"><ui5-icon class="udex-accordion-item__icon" name="slim-arrow-right"></ui5-icon></div><span class="udex-accordion-item__title">${ifDefined(this.title)}${ this.numberBadge ? block1.call(this, context, tags, suffix) : undefined }</span></button><div id="udex-accordion-item__${ifDefined(this._id)}-content" class="udex-accordion-item__content" aria-labelledby="udex-accordion-item__${ifDefined(this._id)}" @keydown="${this.contentKeydown}" role="region"><slot></slot></div>`;}
-function block1 (this: AccordionItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-accordion-item__badge" number-design="Blue" type="Number" size="Large">${ifDefined(this.numberBadge)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-accordion-item__badge" number-design="Blue" type="Number" size="Large">${ifDefined(this.numberBadge)}</udex-badge>`;}
+function block0 (this: AccordionItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button id="udex-accordion-item__${ifDefined(this._id)}" type="button" class="udex-accordion-item__header" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" @focus="${this.focusHandler}" @click="${this.itemClickHandler}" @keydown="${this.keydownHandler}"><div class="udex-accordion-item__icon-wrapper"><${scopeTag("ui5-icon", tags, suffix)} class="udex-accordion-item__icon" name="slim-arrow-right" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}></div><span class="udex-accordion-item__title">${ifDefined(this.label)}${ this.numberBadge ? block1.call(this, context, tags, suffix) : undefined }</span></button><div id="udex-accordion-item__${ifDefined(this._id)}-content" class="udex-accordion-item__content" aria-labelledby="udex-accordion-item__${ifDefined(this._id)}" @keydown="${this.contentKeydown}" role="region"><slot></slot></div>` : html`<button id="udex-accordion-item__${ifDefined(this._id)}" type="button" class="udex-accordion-item__header" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" @focus="${this.focusHandler}" @click="${this.itemClickHandler}" @keydown="${this.keydownHandler}"><div class="udex-accordion-item__icon-wrapper"><ui5-icon class="udex-accordion-item__icon" name="slim-arrow-right" mode="Decorative"></ui5-icon></div><span class="udex-accordion-item__title">${ifDefined(this.label)}${ this.numberBadge ? block1.call(this, context, tags, suffix) : undefined }</span></button><div id="udex-accordion-item__${ifDefined(this._id)}-content" class="udex-accordion-item__content" aria-labelledby="udex-accordion-item__${ifDefined(this._id)}" @keydown="${this.contentKeydown}" role="region"><slot></slot></div>`;}
+function block1 (this: AccordionItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-accordion-item__badge" number-design="Blue" type="Number" size="Medium">${ifDefined(this.numberBadge)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-accordion-item__badge" number-design="Blue" type="Number" size="Medium">${ifDefined(this.numberBadge)}</udex-badge>`;}
 
-
-export default block0;
+function template(this: AccordionItem) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Accordion from "../../Accordion.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Accordion from "../../Accordion.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-accordion" @keydown="${this.keydownHandler}" @ui5-accordion-item-focus="${ifDefined(this.itemFocusHandler)}"><div class="udex-accordion__head" part="head"><h3 class="udex-accordion__headline">${ifDefined(this.headlineText)}</h3><${scopeTag("udex-button", tags, suffix)} class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</${scopeTag("udex-button", tags, suffix)}></div><div class="udex-accordion__content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></div>` : html`<div class="udex-accordion" @keydown="${this.keydownHandler}" @ui5-accordion-item-focus="${ifDefined(this.itemFocusHandler)}"><div class="udex-accordion__head" part="head"><h3 class="udex-accordion__headline">${ifDefined(this.headlineText)}</h3><udex-button class="udex-accordion__btn" size="Large" design="Tertiary" @click="${this.toggleAllHandler}" @keydown="${this.toggleKeyAllHandler}" accessible-name="${ifDefined(this.toggleAllText)}">${ifDefined(this.toggleAllText)}</udex-button></div><div class="udex-accordion__content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></div>`;}
 function block1 (this: Accordion, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item.item._individualSlot)}"></slot>`;}
 
-
-export default block0;
+function template(this: Accordion) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,12 +1,13 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Avatar from "../../Avatar.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Avatar from "../../Avatar.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Avatar, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-avatar", tags, suffix)} class="${ifDefined(this.udexAvatarClass)}" ?disabled="${this.disabled}" initials="${ifDefined(this.initials)}" ?interactive="${this.interactive}" accessible-name="${ifDefined(this.avatarAccessibleName)}" color-scheme="${ifDefined(this.getUI5AvatarColorScheme)}" fallback-icon="${ifDefined(this.fallbackIcon)}" icon="${ifDefined(this.icon)}" shape="${ifDefined(this.shape)}" size="${ifDefined(this.size)}" @click="${this.handleClick}">${ this.imageSlot ? block1.call(this, context, tags, suffix) : undefined }${ this.badgeSlot ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag("ui5-avatar", tags, suffix)}>` : html`<ui5-avatar class="${ifDefined(this.udexAvatarClass)}" ?disabled="${this.disabled}" initials="${ifDefined(this.initials)}" ?interactive="${this.interactive}" accessible-name="${ifDefined(this.avatarAccessibleName)}" color-scheme="${ifDefined(this.getUI5AvatarColorScheme)}" fallback-icon="${ifDefined(this.fallbackIcon)}" icon="${ifDefined(this.icon)}" shape="${ifDefined(this.shape)}" size="${ifDefined(this.size)}" @click="${this.handleClick}">${ this.imageSlot ? block1.call(this, context, tags, suffix) : undefined }${ this.badgeSlot ? block2.call(this, context, tags, suffix) : undefined }</ui5-avatar>`;}
+function block0 (this: Avatar, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-avatar", tags, suffix)} class="${ifDefined(this.udexAvatarClass)}" ?disabled="${this.disabled}" initials="${ifDefined(this.initials)}" ?interactive="${this.interactive}" accessible-name="${ifDefined(this.avatarAccessibleName)}" color-scheme="${ifDefined(this.getUDExAvatarColorScheme)}" fallback-icon="${ifDefined(this.fallbackIcon)}" icon="${ifDefined(this.icon)}" shape="${ifDefined(this.shape)}" size="${ifDefined(this.size)}" @click="${this.handleClick}">${ this.imageSlot ? block1.call(this, context, tags, suffix) : undefined }${ this.badgeSlot ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag("ui5-avatar", tags, suffix)}>` : html`<ui5-avatar class="${ifDefined(this.udexAvatarClass)}" ?disabled="${this.disabled}" initials="${ifDefined(this.initials)}" ?interactive="${this.interactive}" accessible-name="${ifDefined(this.avatarAccessibleName)}" color-scheme="${ifDefined(this.getUDExAvatarColorScheme)}" fallback-icon="${ifDefined(this.fallbackIcon)}" icon="${ifDefined(this.icon)}" shape="${ifDefined(this.shape)}" size="${ifDefined(this.size)}" @click="${this.handleClick}">${ this.imageSlot ? block1.call(this, context, tags, suffix) : undefined }${ this.badgeSlot ? block2.call(this, context, tags, suffix) : undefined }</ui5-avatar>`;}
 function block1 (this: Avatar, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot></slot>`;}
 function block2 (this: Avatar, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot name="badge" slot="badge"></slot>`;}
 
-
-export default block0;
+function template(this: Avatar) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,12 +1,13 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Badge from "../../Badge.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Badge from "../../Badge.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.badgeClasses)}">${ this.startIcon ? block1.call(this, context, tags, suffix) : undefined }<slot></slot>${ this.endIcon ? block2.call(this, context, tags, suffix) : undefined }</div>`;}
 function block1 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-badge__icon udex-badge__icon--start" name="${ifDefined(this.icon)}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-badge__icon udex-badge__icon--start" name="${ifDefined(this.icon)}"></ui5-icon>`;}
 function block2 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-badge__icon udex-badge__icon--end" name="${ifDefined(this.icon)}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-badge__icon udex-badge__icon--end" name="${ifDefined(this.icon)}"></ui5-icon>`;}
 
-
-export default block0;
+function template(this: Badge) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,15 +1,16 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	type BreadcrumbsPopover = any;
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+type BreadcrumbsPopover = any;
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-breadcrumbs__popover" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement-type="Bottom" horizontal-align="Left" @after-open="${this._afterDropdownOpen}" @after-close="${this._afterDropdownClose}" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<udex-dropdown id="udex-${ifDefined(this._id)}-breadcrumbs__popover" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement-type="Bottom" horizontal-align="Left" @after-open="${this._afterDropdownOpen}" @after-close="${this._afterDropdownClose}" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></udex-dropdown>`;}
+function block0 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-breadcrumbs__popover" opener="udex-${ifDefined(this._id)}-breadcrumbs__opener" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement="Bottom" horizontal-align="Start" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<udex-dropdown id="udex-${ifDefined(this._id)}-breadcrumbs__popover" opener="udex-${ifDefined(this._id)}-breadcrumbs__opener" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement="Bottom" horizontal-align="Start" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></udex-dropdown>`;}
 function block1 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.icon ? block2.call(this, context, tags, suffix, item, index) : block3.call(this, context, tags, suffix, item, index) }`;}
-function block2 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--${index} udex-breadcrumbs__item--with-icon" icon="${ifDefined(item.icon)}" icon-placement="Start" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--${index} udex-breadcrumbs__item--with-icon" icon="${ifDefined(item.icon)}" icon-placement="Start" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
+function block2 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--with-icon udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" icon="${ifDefined(item.icon)}" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--with-icon udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" icon="${ifDefined(item.icon)}" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
 function block3 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item._isCurrentPageItem ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }`;}
-function block4 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<span id="${ifDefined(item._id)}-li" class="udex-breadcrumbs__item udex-breadcrumb__item--current udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</span>`;}
-function block5 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
+function block4 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<span id="${ifDefined(item._id)}-li" class="udex-breadcrumbs__item udex-breadcrumb__item--current udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</span>`;}
+function block5 (this: BreadcrumbsPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
 
-
-export default block0;
+function template(this: BreadcrumbsPopover) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,12 +1,18 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Breadcrumbs from "../../Breadcrumbs.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Breadcrumbs from "../../Breadcrumbs.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<nav class="udex-breadcrumbs ui5-breadcrumbs-root" aria-label="${ifDefined(this._accessibleNameText)}"><ol @focusin="${this._onfocusin}"><li class="udex-breadcrumbs__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper"><button @click="${this._toggleDropdown}" class="udex-breadcrumbs__trigger ${ifDefined(this._triggerClass)}" accessible-role="button" aria-label="${ifDefined(this._dropdownArrowAccessibleNameText)}" aria-haspopup="true"><${scopeTag("ui5-icon", tags, suffix)} name="slim-arrow-down" title="${ifDefined(this._dropdownArrowAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></button></li>${ repeat(this._linksData, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ol></nav>` : html`<nav class="udex-breadcrumbs ui5-breadcrumbs-root" aria-label="${ifDefined(this._accessibleNameText)}"><ol @focusin="${this._onfocusin}"><li class="udex-breadcrumbs__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper"><button @click="${this._toggleDropdown}" class="udex-breadcrumbs__trigger ${ifDefined(this._triggerClass)}" accessible-role="button" aria-label="${ifDefined(this._dropdownArrowAccessibleNameText)}" aria-haspopup="true"><ui5-icon name="slim-arrow-down" title="${ifDefined(this._dropdownArrowAccessibleNameText)}"></ui5-icon></button></li>${ repeat(this._linksData, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ol></nav>`;}
+function block0 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<nav class="udex-breadcrumbs ui5-breadcrumbs-root" aria-label="${ifDefined(this._accessibleNameText)}"><ol @focusin="${this._onfocusin}"><li class="udex-breadcrumbs__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper"><button id="udex-${ifDefined(this._id)}-breadcrumbs__opener" @click="${this._toggleDropdown}" class="udex-breadcrumbs__trigger ${ifDefined(this._triggerClass)}" accessible-role="button" aria-label="${ifDefined(this._dropdownArrowAccessibleNameText)}" aria-haspopup="true"><${scopeTag("ui5-icon", tags, suffix)} name="slim-arrow-down" mode="Decorative" title="${ifDefined(this._dropdownArrowAccessibleNameText)}"></${scopeTag("ui5-icon", tags, suffix)}></button></li>${ repeat(this._linksData, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ol></nav><${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-breadcrumbs__popover" opener="udex-${ifDefined(this._id)}-breadcrumbs__opener" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement="Bottom" horizontal-align="Start" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<nav class="udex-breadcrumbs ui5-breadcrumbs-root" aria-label="${ifDefined(this._accessibleNameText)}"><ol @focusin="${this._onfocusin}"><li class="udex-breadcrumbs__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper"><button id="udex-${ifDefined(this._id)}-breadcrumbs__opener" @click="${this._toggleDropdown}" class="udex-breadcrumbs__trigger ${ifDefined(this._triggerClass)}" accessible-role="button" aria-label="${ifDefined(this._dropdownArrowAccessibleNameText)}" aria-haspopup="true"><ui5-icon name="slim-arrow-down" mode="Decorative" title="${ifDefined(this._dropdownArrowAccessibleNameText)}"></ui5-icon></button></li>${ repeat(this._linksData, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ol></nav><udex-dropdown id="udex-${ifDefined(this._id)}-breadcrumbs__popover" opener="udex-${ifDefined(this._id)}-breadcrumbs__opener" class="udex-breadcrumbs__popover ui5-breadcrumbs-popover" placement="Bottom" horizontal-align="Start" @keydown="${this._handleKeydown}"><div class="udex-breadcrumbs__popover-content">${ repeat(this._dropdownItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></udex-dropdown>`;}
 function block1 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-breadcrumbs__link-wrapper ui5-breadcrumbs-link-wrapper" id="${ifDefined(item._id)}-link-wrapper">${ !item._isCurrentPageItem ? block2.call(this, context, tags, suffix, item, index) : undefined }</li>`;}
-function block2 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<span class="udex-breadcrumbs__separator" aria-hidden="true"></span><${scopeTag("udex-link", tags, suffix)} @ui5-click="${ifDefined(this._onLinkPress)}" class="udex-breadcrumbs__item" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" id="${ifDefined(item._id)}-link" accessible-name="${ifDefined(item._accessibleNameText)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.innerText)}</${scopeTag("udex-link", tags, suffix)}>` : html`<span class="udex-breadcrumbs__separator" aria-hidden="true"></span><udex-link @ui5-click="${ifDefined(this._onLinkPress)}" class="udex-breadcrumbs__item" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" id="${ifDefined(item._id)}-link" accessible-name="${ifDefined(item._accessibleNameText)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.innerText)}</udex-link>`;}
+function block2 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<span class="udex-breadcrumbs__separator" aria-hidden="true"></span><${scopeTag("udex-link", tags, suffix)} @ui5-click="${ifDefined(this._onLinkPress)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--visible" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" id="${ifDefined(item._id)}-link" accessible-name="${ifDefined(item._accessibleNameText)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.innerText)}</${scopeTag("udex-link", tags, suffix)}>` : html`<span class="udex-breadcrumbs__separator" aria-hidden="true"></span><udex-link @ui5-click="${ifDefined(this._onLinkPress)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--visible" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" id="${ifDefined(item._id)}-link" accessible-name="${ifDefined(item._accessibleNameText)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.innerText)}</udex-link>`;}
+function block3 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.icon ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }`;}
+function block4 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--with-icon udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" icon="${ifDefined(item.icon)}" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--with-icon udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" icon="${ifDefined(item.icon)}" accessible-name="${ifDefined(item.textContent)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
+function block5 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item._isCurrentPageItem ? block6.call(this, context, tags, suffix, item, index) : block7.call(this, context, tags, suffix, item, index) }`;}
+function block6 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<span id="${ifDefined(item._id)}-li" class="udex-breadcrumbs__item udex-breadcrumb__item--current udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</span>`;}
+function block7 (this: Breadcrumbs, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link index="${index}" id="${ifDefined(item._id)}-li" @ui5-click="${ifDefined(this._onDropdownLinkPress)}" href="${ifDefined(item.href)}" target="${ifDefined(item.target)}" class="udex-breadcrumbs__item udex-breadcrumbs__item--hidden udex-breadcrumbs__item--${index}" accessible-name="${ifDefined(item.accessibleName)}" data-ui5-stable="${ifDefined(item.stableDomRef)}">${ifDefined(item.textContent)}</udex-link>`;}
 
-
-export default block0;
+function template(this: Breadcrumbs) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;