@sapudex/web-components 0.111.0

package/src/features/SearchSuggestionsPopover.ts

@@ -0,0 +1,252 @@
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element";
+import { registerFeature } from "@ui5/webcomponents-base/dist/FeaturesRegistry.js";
+import Button from "@ui5/webcomponents/dist/Button.js";
+import Popover from "@ui5/webcomponents/dist/Popover.js";
+
+interface SuggestionComponent extends UI5Element {
+  open: boolean;
+  value?: string;
+  suggestionItems?: string;
+}
+
+type SearchInputSuggestion = {
+  handleSelectItem: () => void;
+  text: string;
+}
+
+/**
+ * A class to manage the <code>Search</code suggestion items.
+ *
+ * @class
+ * @private
+ * @author SAP SE
+ */
+class Suggestion {
+  component: SuggestionComponent;
+  popover?: Popover | null;
+  selectedItemIndex: number;
+  focusabledList?: HTMLUListElement;
+  lists?: Array<HTMLUListElement>;
+
+  constructor(component: SuggestionComponent) {
+    this.component = component;
+    this._getSuggestionPopover();
+    this.selectedItemIndex = -1;
+  }
+
+  _getComponent(): SuggestionComponent {
+    return this.component;
+  }
+
+  async _getSuggestionPopover() {
+    if (this.popover) {
+      return this.popover;
+    }
+
+    const staticAreaItem = await this._getComponent().getStaticAreaItemDomRef();
+    this.popover = staticAreaItem!.querySelector<Popover>("[ui5-popover]");
+    return this.popover;
+  }
+
+  _getItems() {
+    return this.popover ? [...this.popover?.querySelectorAll("[ui5-button]")] : [];
+  }
+
+  open(): void {
+    this._getComponent().open = true;
+    this.popover!.showAt(this._getComponent());
+    this.initLists();
+  }
+
+  initLists(): void {
+    const list = this.popover?.querySelectorAll("ul") ? this.popover?.querySelectorAll("ul") : [];
+    this.lists = Array.from(list);
+  }
+
+  close(): void {
+    this._getComponent().open = false;
+    this.popover?.close(true);
+    this.selectedItemIndex = -1;
+  }
+
+  resetFocusState() {
+    this.lists = [];
+    this.selectedItemIndex = -1;
+    this.focusabledList = undefined;
+  }
+
+  onFocusInput(): void {
+    this.component.shadowRoot?.querySelector("input")?.focus();
+  }
+
+  onEnter(e: KeyboardEvent) {
+    e.preventDefault();
+    if (this.selectedItemIndex >= 0) {
+      this.component.value = this._getItems()[this.selectedItemIndex].getAttribute("title")?.replace(/<[^>]*>?/gm, "");
+    }
+  }
+
+  onTab(e: KeyboardEvent) {
+    if (this.lists?.length && this._getComponent().open) {
+      e.preventDefault();
+      if (this.focusabledList && this.selectedItemIndex === -1) {
+        this.focusabledList.focus();
+        return true;
+      }
+      if (this.focusabledList && this.selectedItemIndex >= 0) {
+        const focusabledItems = this.getFocusableItems();
+        const button = focusabledItems[this.selectedItemIndex].querySelector("[ui5-button]") as UI5Element;
+
+        button.focus();
+        return true;
+      }
+
+      this.focusabledList = this.lists[0];
+      this.focusabledList.focus();
+    }
+  }
+
+  getFocusableItems() {
+    const items = this.focusabledList?.children ? this.focusabledList?.children : [];
+    return Array.from(items);
+  }
+
+  onEscape(e: KeyboardEvent) {
+    e.preventDefault();
+    this.close();
+    this.onFocusInput();
+  }
+
+  onKeyTabList(e: KeyboardEvent) {
+    e.preventDefault();
+    if (this.lists?.length === 2) {
+      if (this.focusabledList === this.lists[1]) {
+        (this.component?.shadowRoot?.querySelector("[ui5-button]") as UI5Element).focus();
+      }
+      if (this.focusabledList === this.lists[0]) {
+        this.focusabledList = this.lists[1];
+        this.focusabledList.focus();
+        this.selectedItemIndex = -1;
+      }
+    }
+    if (this.lists?.length === 1) {
+      (this.component?.shadowRoot?.querySelector("[ui5-button]") as UI5Element).focus();
+    }
+  }
+
+  onPrevKeyTabList(e: KeyboardEvent) {
+    e.preventDefault();
+    if (this.lists?.length === 2) {
+      if (this.focusabledList === this.lists[0]) {
+        this.onFocusInput();
+      }
+      if (this.focusabledList === this.lists[1]) {
+        this.focusabledList = this.lists[0];
+        this.focusabledList.focus();
+        this.selectedItemIndex = -1;
+      }
+    }
+    if (this.lists?.length === 1) {
+      this.onFocusInput();
+    }
+  }
+
+  onKeyDown(e: KeyboardEvent) {
+    e.preventDefault();
+    const nextSelectedIdx = this.selectedItemIndex;
+    const focusabledItems = this.getFocusableItems();
+    const itemCount = focusabledItems.length - 1;
+
+    if (this.lists?.length) {
+      if (nextSelectedIdx === -1) {
+        const item = focusabledItems[0];
+        const button = item.querySelector("[ui5-button]") as UI5Element;
+
+        item.setAttribute("aria-selected", "true");
+        button.focus();
+        this.selectedItemIndex = 0;
+        this.focusabledList?.setAttribute("aria-activedescendant", item.id);
+        return true;
+      }
+      if (nextSelectedIdx >= 0 && nextSelectedIdx !== itemCount) {
+        const item = focusabledItems[nextSelectedIdx + 1];
+        const button = item.querySelector("[ui5-button]") as UI5Element;
+
+        focusabledItems[nextSelectedIdx].removeAttribute("aria-selected");
+        item.setAttribute("aria-selected", "true");
+        button.focus();
+        this.selectedItemIndex = nextSelectedIdx + 1;
+        this.focusabledList?.setAttribute("aria-activedescendant", item.id);
+        return true;
+      }
+      if (nextSelectedIdx === itemCount && this.focusabledList === this.lists[0] && this.lists.length === 2) {
+        focusabledItems[nextSelectedIdx].removeAttribute("aria-selected");
+        this.focusabledList?.removeAttribute("aria-activedescendant");
+        this.focusabledList = this.lists[1];
+        this.focusabledList.focus();
+        this.selectedItemIndex = -1;
+        return true;
+      }
+    }
+  }
+
+  onKeyUp(e: KeyboardEvent) {
+    e.preventDefault();
+    const focusabledItems = this.getFocusableItems();
+    const itemCount = focusabledItems.length - 1;
+    const previousSelectedIdx = this.selectedItemIndex;
+
+    if (this.lists?.length) {
+      if (previousSelectedIdx === -1) {
+        const item = focusabledItems[0];
+        const button = item.querySelector("[ui5-button]") as UI5Element;
+
+        item.setAttribute("aria-selected", "true");
+        button.focus();
+        this.selectedItemIndex = 0;
+        this.focusabledList?.setAttribute("aria-activedescendant", item.id);
+        return true;
+      }
+      if (previousSelectedIdx > 0 && previousSelectedIdx <= itemCount) {
+        const item = focusabledItems[previousSelectedIdx - 1];
+        const button = item.querySelector("[ui5-button]") as UI5Element;
+
+        focusabledItems[previousSelectedIdx].removeAttribute("aria-selected");
+        item.setAttribute("aria-selected", "true");
+        button.focus();
+        this.selectedItemIndex = previousSelectedIdx - 1;
+        this.focusabledList?.setAttribute("aria-activedescendant", item.id);
+        return true;
+      }
+      if (previousSelectedIdx === 0 && this.lists.length === 2 && this.focusabledList === this.lists[1]) {
+        focusabledItems[previousSelectedIdx].removeAttribute("aria-selected");
+        this.focusabledList?.removeAttribute("aria-activedescendant");
+        this.focusabledList = this.lists[0];
+        this.focusabledList.focus();
+        this.selectedItemIndex = -1;
+        return true;
+      }
+    }
+  }
+
+  handlePrevTabResset(e: KeyboardEvent) {
+    e.preventDefault();
+    this.focusabledList?.focus();
+  }
+
+  static get dependencies() {
+    return [
+      Popover,
+      Button,
+    ];
+  }
+}
+
+registerFeature("SearchInputSuggestion", Suggestion);
+
+export default Suggestion;
+
+export type {
+  SuggestionComponent,
+  SearchInputSuggestion,
+};

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

@@ -0,0 +1,3 @@
+import { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+const COUNT: I18nText = {key: "COUNT", defaultText: "Count"};const OF: I18nText = {key: "OF", defaultText: "of"};const PAGINATION_PAGE: I18nText = {key: "PAGINATION_PAGE", defaultText: "Pagination page"};const SELECTED: I18nText = {key: "SELECTED", defaultText: "Selected"};const FIRST_PAGE: I18nText = {key: "FIRST_PAGE", defaultText: "First page"};const LAST_PAGE: I18nText = {key: "LAST_PAGE", defaultText: "Last page"};const PREVIOUS_PAGE: I18nText = {key: "PREVIOUS_PAGE", defaultText: "Previous page"};const NEXT_PAGE: I18nText = {key: "NEXT_PAGE", defaultText: "Next page"};const ACTIVATE_PAGE: I18nText = {key: "ACTIVATE_PAGE", defaultText: "Activate page number"};const BUTTON_ARIA_TYPE_PRIMARY: I18nText = {key: "BUTTON_ARIA_TYPE_PRIMARY", defaultText: "Primary"};const BUTTON_ARIA_TYPE_SECONDARY: I18nText = {key: "BUTTON_ARIA_TYPE_SECONDARY", defaultText: "Secondary"};const BUTTON_ARIA_TYPE_TERTIARY: I18nText = {key: "BUTTON_ARIA_TYPE_TERTIARY", defaultText: "Tertiary"};const BUTTON_ARIA_TYPE_WARNING: I18nText = {key: "BUTTON_ARIA_TYPE_WARNING", defaultText: "Warning"};const BUTTON_ARIA_TYPE_POSITIVE: I18nText = {key: "BUTTON_ARIA_TYPE_POSITIVE", defaultText: "Positive"};const BUTTON_ARIA_TYPE_NEGATIVE: I18nText = {key: "BUTTON_ARIA_TYPE_NEGATIVE", defaultText: "Negative"};const BUTTON_ARIA_EMPHASIZED: I18nText = {key: "BUTTON_ARIA_EMPHASIZED", defaultText: "Emphasized"};const BUTTON_ARIA_DEFAULT: I18nText = {key: "BUTTON_ARIA_DEFAULT", defaultText: "Default"};const BUTTON_ARIA_TRANSPARENT: I18nText = {key: "BUTTON_ARIA_TRANSPARENT", defaultText: "Transparent"};const BUTTON_ARIA_ATTENTION: I18nText = {key: "BUTTON_ARIA_ATTENTION", defaultText: "Attention"};const TOGGLED: I18nText = {key: "TOGGLED", defaultText: "Toggled"};const SUGGESTED_TEXT: I18nText = {key: "SUGGESTED_TEXT", defaultText: "Suggested searches"};const AVAILABLE_VALUES: I18nText = {key: "AVAILABLE_VALUES", defaultText: "Available Values"};const RECOMMENDED_TEXT: I18nText = {key: "RECOMMENDED_TEXT", defaultText: "Recommended pages"};const EXPAND_ALL: I18nText = {key: "EXPAND_ALL", defaultText: "Expand All"};const COLLAPSE_ALL: I18nText = {key: "COLLAPSE_ALL", defaultText: "Collapse All"};const MORE: I18nText = {key: "MORE", defaultText: "More"};const ATTENTION_BADGE: I18nText = {key: "ATTENTION_BADGE", defaultText: "Attention badge"};const READ_MORE: I18nText = {key: "READ_MORE", defaultText: "Read more"};const READ_LESS: I18nText = {key: "READ_LESS", defaultText: "Read less"};const RATING_INDICATOR_TEXT: I18nText = {key: "RATING_INDICATOR_TEXT", defaultText: "Rating Indicator"};const RATING_INDICATOR_TOOLTIP_TEXT: I18nText = {key: "RATING_INDICATOR_TOOLTIP_TEXT", defaultText: "Rating"};const RATING_INDICATOR_ARIA_DESCRIPTION: I18nText = {key: "RATING_INDICATOR_ARIA_DESCRIPTION", defaultText: "Required"};const TOTAL: I18nText = {key: "TOTAL", defaultText: "Total"};const MESSAGE_STRIP_CLOSE_BUTTON: I18nText = {key: "MESSAGE_STRIP_CLOSE_BUTTON", defaultText: "Information Bar Close"};const MESSAGE_STRIP_INFORMATION: I18nText = {key: "MESSAGE_STRIP_INFORMATION", defaultText: "Information"};const MESSAGE_STRIP_SUCCESS: I18nText = {key: "MESSAGE_STRIP_SUCCESS", defaultText: "Success"};const MESSAGE_STRIP_WARNING: I18nText = {key: "MESSAGE_STRIP_WARNING", defaultText: "Warning"};const MESSAGE_STRIP_ERROR: I18nText = {key: "MESSAGE_STRIP_ERROR", defaultText: "Error"};const ARIA_LABEL_LIST_MULTISELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_MULTISELECTABLE", defaultText: "Contains Multi-Selectable Items"};const ARIA_LABEL_LIST_SELECTABLE: I18nText = {key: "ARIA_LABEL_LIST_SELECTABLE", defaultText: "Contains Selectable Items"};const UNSELECTED: I18nText = {key: "UNSELECTED", defaultText: "Unselected"};const INDETERMINATE: I18nText = {key: "INDETERMINATE", defaultText: "Indeterminate"};const EDIT_BUTTON: I18nText = {key: "EDIT_BUTTON", defaultText: "Edit button"};const DELETE_BUTTON: I18nText = {key: "DELETE_BUTTON", defaultText: "Delete button"};const TEXTAREA_CHARACTERS_LEFT: I18nText = {key: "TEXTAREA_CHARACTERS_LEFT", defaultText: "{0} characters remaining"};const VALUE_STATE_TYPE_ERROR: I18nText = {key: "VALUE_STATE_TYPE_ERROR", defaultText: "Field State Error"};const VALUE_STATE_TYPE_WARNING: I18nText = {key: "VALUE_STATE_TYPE_WARNING", defaultText: "Field State Warning"};const VALUE_STATE_TYPE_SUCCESS: I18nText = {key: "VALUE_STATE_TYPE_SUCCESS", defaultText: "Field State Success"};const VALUE_STATE_TYPE_STANDARD: I18nText = {key: "VALUE_STATE_TYPE_STANDARD", defaultText: "Field State Standard"};const CAROUSEL_PREVIOUS_ARROW_TEXT: I18nText = {key: "CAROUSEL_PREVIOUS_ARROW_TEXT", defaultText: "Previous Page"};const CAROUSEL_NEXT_ARROW_TEXT: I18nText = {key: "CAROUSEL_NEXT_ARROW_TEXT", defaultText: "Next Page"};const SHOW_RESULTS: I18nText = {key: "SHOW_RESULTS", defaultText: "Show Results"};const RESET: I18nText = {key: "RESET", defaultText: "Reset"};const SELECT_OPTIONS: I18nText = {key: "SELECT_OPTIONS", defaultText: "Select Options"};const SELECT_ALL: I18nText = {key: "SELECT_ALL", defaultText: "Select All"};const BREADCRUMBS_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_ARIA_LABEL", defaultText: "Breadcrumb Trail"};const BREADCRUMBS_OVERFLOW_ARIA_LABEL: I18nText = {key: "BREADCRUMBS_OVERFLOW_ARIA_LABEL", defaultText: "More"};const STEPINPUT_INC_ICON_TITLE: I18nText = {key: "STEPINPUT_INC_ICON_TITLE", defaultText: "Increase Quantity by"};const STEPINPUT_DEC_ICON_TITLE: I18nText = {key: "STEPINPUT_DEC_ICON_TITLE", defaultText: "Decrease Quantity by"};const NO_MATCHES_FOUND: I18nText = {key: "NO_MATCHES_FOUND", defaultText: "No matches found."};const VALUE_STATE_ERROR: I18nText = {key: "VALUE_STATE_ERROR", defaultText: "Invalid entry"};const VALUE_STATE_WARNING: I18nText = {key: "VALUE_STATE_WARNING", defaultText: "Warning issued"};const VALUE_STATE_INFORMATION: I18nText = {key: "VALUE_STATE_INFORMATION", defaultText: "Informative entry"};const VALUE_STATE_SUCCESS: I18nText = {key: "VALUE_STATE_SUCCESS", defaultText: "Entry successfully validated"};const READ_ONLY: I18nText = {key: "READ_ONLY", defaultText: "Read only"};const LOGOUT: I18nText = {key: "LOGOUT", defaultText: "Logout"};const COUNTRY_SELECT: I18nText = {key: "COUNTRY_SELECT", defaultText: "Country Select"};const OVERVIEW: I18nText = {key: "OVERVIEW", defaultText: "Overview"};const SHOW_HIDE_PASSWORD: I18nText = {key: "SHOW_HIDE_PASSWORD", defaultText: "Show/Hide Password Button"};const SOCIAL_LINK_ICON: I18nText = {key: "SOCIAL_LINK_ICON", defaultText: "Link Graphic"};const PHONE_NUMBER: I18nText = {key: "PHONE_NUMBER", defaultText: "Phone number"};const CONTACT_US: I18nText = {key: "CONTACT_US", defaultText: "Contact us"};const EMAIL: I18nText = {key: "EMAIL", defaultText: "Email"};const CHAT_WITH_US: I18nText = {key: "CHAT_WITH_US", defaultText: "Chat with us"};const QUICK_LINKS: I18nText = {key: "QUICK_LINKS", defaultText: "Quick Links"};const TRENDING: I18nText = {key: "TRENDING", defaultText: "Trending"};const ABOUT_SAP: I18nText = {key: "ABOUT_SAP", defaultText: "About SAP"};const SITE_INFORMATION: I18nText = {key: "SITE_INFORMATION", defaultText: "Site Information"};const SEE_COMPLETE_LIST: I18nText = {key: "SEE_COMPLETE_LIST", defaultText: "Or see our complete list of"};const LOCAL_COUNTRY_NAMES: I18nText = {key: "LOCAL_COUNTRY_NAMES", defaultText: "local country numbers"};const AVATAR_TEXT: I18nText = {key: "AVATAR_TEXT", defaultText: "Avatar"};const DISABLED: I18nText = {key: "DISABLED", defaultText: "Disabled"};const CALENDAR_ICON: I18nText = {key: "CALENDAR_ICON", defaultText: "Employee start date"};const TABLE_NO_DATA_FOUND: I18nText = {key: "TABLE_NO_DATA_FOUND", defaultText: "No data found"};const LIST_ITEM_EDIT_ICON: I18nText = {key: "LIST_ITEM_EDIT_ICON", defaultText: "Edit list item entry"};const LIST_ITEM_DELETE_ICON: I18nText = {key: "LIST_ITEM_DELETE_ICON", defaultText: "Delete list item entry"};
+export {COUNT,OF,PAGINATION_PAGE,SELECTED,FIRST_PAGE,LAST_PAGE,PREVIOUS_PAGE,NEXT_PAGE,ACTIVATE_PAGE,BUTTON_ARIA_TYPE_PRIMARY,BUTTON_ARIA_TYPE_SECONDARY,BUTTON_ARIA_TYPE_TERTIARY,BUTTON_ARIA_TYPE_WARNING,BUTTON_ARIA_TYPE_POSITIVE,BUTTON_ARIA_TYPE_NEGATIVE,BUTTON_ARIA_EMPHASIZED,BUTTON_ARIA_DEFAULT,BUTTON_ARIA_TRANSPARENT,BUTTON_ARIA_ATTENTION,TOGGLED,SUGGESTED_TEXT,AVAILABLE_VALUES,RECOMMENDED_TEXT,EXPAND_ALL,COLLAPSE_ALL,MORE,ATTENTION_BADGE,READ_MORE,READ_LESS,RATING_INDICATOR_TEXT,RATING_INDICATOR_TOOLTIP_TEXT,RATING_INDICATOR_ARIA_DESCRIPTION,TOTAL,MESSAGE_STRIP_CLOSE_BUTTON,MESSAGE_STRIP_INFORMATION,MESSAGE_STRIP_SUCCESS,MESSAGE_STRIP_WARNING,MESSAGE_STRIP_ERROR,ARIA_LABEL_LIST_MULTISELECTABLE,ARIA_LABEL_LIST_SELECTABLE,UNSELECTED,INDETERMINATE,EDIT_BUTTON,DELETE_BUTTON,TEXTAREA_CHARACTERS_LEFT,VALUE_STATE_TYPE_ERROR,VALUE_STATE_TYPE_WARNING,VALUE_STATE_TYPE_SUCCESS,VALUE_STATE_TYPE_STANDARD,CAROUSEL_PREVIOUS_ARROW_TEXT,CAROUSEL_NEXT_ARROW_TEXT,SHOW_RESULTS,RESET,SELECT_OPTIONS,SELECT_ALL,BREADCRUMBS_ARIA_LABEL,BREADCRUMBS_OVERFLOW_ARIA_LABEL,STEPINPUT_INC_ICON_TITLE,STEPINPUT_DEC_ICON_TITLE,NO_MATCHES_FOUND,VALUE_STATE_ERROR,VALUE_STATE_WARNING,VALUE_STATE_INFORMATION,VALUE_STATE_SUCCESS,READ_ONLY,LOGOUT,COUNTRY_SELECT,OVERVIEW,SHOW_HIDE_PASSWORD,SOCIAL_LINK_ICON,PHONE_NUMBER,CONTACT_US,EMAIL,CHAT_WITH_US,QUICK_LINKS,TRENDING,ABOUT_SAP,SITE_INFORMATION,SEE_COMPLETE_LIST,LOCAL_COUNTRY_NAMES,AVATAR_TEXT,DISABLED,CALENDAR_ICON,TABLE_NO_DATA_FOUND,LIST_ITEM_EDIT_ICON,LIST_ITEM_DELETE_ICON};

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

@@ -0,0 +1,22 @@
+// @ts-nocheck
+import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
+
+import sap_fiori_3 from "../assets/themes/sap_fiori_3/parameters-bundle.css.json";
+import sap_horizon from "../assets/themes/sap_horizon/parameters-bundle.css.json";
+
+const themeUrlsByName = {
+sap_fiori_3,
+sap_horizon
+};
+const isInlined = obj => typeof (obj) === "object";
+
+const loadThemeProperties = async (themeName) => {
+	if (typeof themeUrlsByName[themeName] === "object") {
+		// inlined from build
+		throw new Error("[themes] Inlined JSON not supported with static imports of assets. Use dynamic imports of assets or configure JSON imports as URLs");
+	}
+	return (await fetch(themeUrlsByName[themeName])).json();
+};
+
+["sap_fiori_3", "sap_horizon"]
+  .forEach(themeName => registerThemePropertiesLoader("@sapudex/web-components", themeName, loadThemeProperties));

package/src/generated/json-imports/Themes.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 import(/* webpackChunkName: "sapudex-web-components-sap-fiori_3-parameters-bundle" */"../assets/themes/sap_fiori_3/parameters-bundle.css.json")).default;
+		case "sap_horizon": return (await import(/* webpackChunkName: "sapudex-web-components-sap-horizon-parameters-bundle" */"../assets/themes/sap_horizon/parameters-bundle.css.json")).default;
+		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 or use 'import ".../Assets-static.js"'. 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/i18n-static.ts

@@ -0,0 +1,31 @@
+// @ts-nocheck
+import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registries/i18n.js";
+
+import _de from "../assets/i18n/messagebundle_de.json";
+import _en from "../assets/i18n/messagebundle_en.json";
+import _es from "../assets/i18n/messagebundle_es.json";
+import _fr from "../assets/i18n/messagebundle_fr.json";
+
+const bundleMap = {
+	"de": _de,
+	"en": _en,
+	"es": _es,
+	"fr": _fr,
+};
+
+const fetchMessageBundle = async (localeId) => {
+	if (typeof bundleMap[localeId] === "object") {
+		// inlined from build
+		throw new Error("[i18n] Inlined JSON not supported with static imports of assets. Use dynamic imports of assets or configure JSON imports as URLs")
+	}
+	return (await fetch(bundleMap[localeId])).json()
+}
+
+const localeIds = ["de",
+	"en",
+	"es",
+	"fr",];
+
+localeIds.forEach(localeId => {
+	registerI18nLoader("@sapudex/web-components", localeId, fetchMessageBundle);
+});

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

@@ -0,0 +1,30 @@
+// @ts-nocheck
+import { registerI18nLoader } from "@ui5/webcomponents-base/dist/asset-registries/i18n.js";
+
+	const importMessageBundle = async (localeId) => {
+		switch (localeId) {
+			case "de": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-de" */ "../assets/i18n/messagebundle_de.json")).default;
+		case "en": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-en" */ "../assets/i18n/messagebundle_en.json")).default;
+		case "es": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-es" */ "../assets/i18n/messagebundle_es.json")).default;
+		case "fr": return (await import(/* webpackChunkName: "sapudex-web-components-messagebundle-fr" */ "../assets/i18n/messagebundle_fr.json")).default;
+			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 localeIds = ["de",
+	"en",
+	"es",
+	"fr",];
+
+	localeIds.forEach(localeId => {
+		registerI18nLoader("@sapudex/web-components", localeId, importAndCheck);
+	});
+	

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

@@ -0,0 +1,10 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type 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`<li class=${ifDefined(this.accordionItemsClass)} aria-expanded="${ifDefined(this.expanded)}" role="listitem" @keydown=${this.keydownHandler}><div class="udex-accordion-item__header-wrapper" aria-level="2" role="heading"><div role="button" class="udex-accordion-item__header" tabindex="0" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" aria-labelledby="${ifDefined(this.ariaLabelledby)}" @focus=${this.focusHandler} @click=${this.itemClickHandler}><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><h4 class="udex-accordion-item__title">${ifDefined(this.title)}</h4></div></div><div id="udex-accordion-item__${ifDefined(this._id)}-content" @keydown=${this.contentKeydown} class="udex-accordion-item__content"><slot></slot></div></li>` : html`<li class=${ifDefined(this.accordionItemsClass)} aria-expanded="${ifDefined(this.expanded)}" role="listitem" @keydown=${this.keydownHandler}><div class="udex-accordion-item__header-wrapper" aria-level="2" role="heading"><div role="button" class="udex-accordion-item__header" tabindex="0" aria-expanded="false" aria-controls="udex-accordion-item__${ifDefined(this._id)}-content" aria-labelledby="${ifDefined(this.ariaLabelledby)}" @focus=${this.focusHandler} @click=${this.itemClickHandler}><div class="udex-accordion-item__icon-wrapper"><ui5-icon class="udex-accordion-item__icon" name="slim-arrow-right"></ui5-icon></div><h4 class="udex-accordion-item__title">${ifDefined(this.title)}</h4></div></div><div id="udex-accordion-item__${ifDefined(this._id)}-content" @keydown=${this.contentKeydown} class="udex-accordion-item__content"><slot></slot></div></li>`;}
+
+
+export default block0;

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

@@ -0,0 +1,11 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type 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="${ifDefined(this.accordionClass)}" @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"><ul class="udex-accordion__list" role="list">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ul></div></div>` : html`<div class="${ifDefined(this.accordionClass)}" @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"><ul class="udex-accordion__list" role="list">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ul></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;

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

@@ -0,0 +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 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";
+	
+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 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;

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

@@ -0,0 +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 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";
+	
+function block0 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.textType ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }`;}
+function block1 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.textClasses)}"><slot></slot></div>`;}
+function block2 (this: Badge, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.numberClasses)}"><slot></slot></div>`;}
+
+
+export default block0;

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

@@ -0,0 +1,15 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	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}"><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}"><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)} 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 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 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)} 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 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>`;}
+
+
+export default block0;

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

@@ -0,0 +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 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";
+	
+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 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>`;}
+
+
+export default block0;

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

@@ -0,0 +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 type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type Carousel from "../../Carousel.js";
+	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+	
+function block0 (this: Carousel, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="${ifDefined(this.carouselClass)}" @keydown=${this._onkeydown}>${ this.showNavigationButtons.top ? block1.call(this, context, tags, suffix) : undefined }<${scopeTag("ui5-carousel", tags, suffix)} id="carousel" hide-navigation-arrows arrows-placement="Navigation" accessible-name="${ifDefined(this.accessibleName)}" ?hide-page-indicator=${this._hidePageIndicator}>${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</${scopeTag("ui5-carousel", tags, suffix)}>${ this.showNavigationButtons.bottom ? block3.call(this, context, tags, suffix) : undefined }</div> ` : html`<div class="${ifDefined(this.carouselClass)}" @keydown=${this._onkeydown}>${ this.showNavigationButtons.top ? block1.call(this, context, tags, suffix) : undefined }<ui5-carousel id="carousel" hide-navigation-arrows arrows-placement="Navigation" accessible-name="${ifDefined(this.accessibleName)}" ?hide-page-indicator=${this._hidePageIndicator}>${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</ui5-carousel>${ this.showNavigationButtons.bottom ? block3.call(this, context, tags, suffix) : undefined }</div> `;}
+function block1 (this: Carousel, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-carousel__navigation-wrapper" part="navigation"><${scopeTag("udex-button", tags, suffix)} size="Large" design=${ifDefined(this.buttonDesign)} arrow-back class="udex-carousel__navigation-button" icon="slim-arrow-left" tooltip="${ifDefined(this.previousPageText)}" part="prev-button" @click=${this._prevButtonClick} ?disabled=${this.isPrevButtonDisabled}></${scopeTag("udex-button", tags, suffix)}><${scopeTag("udex-button", tags, suffix)} size="Large" design=${ifDefined(this.buttonDesign)} arrow-forward class="udex-carousel__navigation-button" icon="slim-arrow-right" tooltip="${ifDefined(this.nextPageText)}" part="next-button" @click=${this._nextButtonClick} ?disabled=${this.isNextButtonDisabled}></${scopeTag("udex-button", tags, suffix)}></div>` : html`<div class="udex-carousel__navigation-wrapper" part="navigation"><udex-button size="Large" design=${ifDefined(this.buttonDesign)} arrow-back class="udex-carousel__navigation-button" icon="slim-arrow-left" tooltip="${ifDefined(this.previousPageText)}" part="prev-button" @click=${this._prevButtonClick} ?disabled=${this.isPrevButtonDisabled}></udex-button><udex-button size="Large" design=${ifDefined(this.buttonDesign)} arrow-forward class="udex-carousel__navigation-button" icon="slim-arrow-right" tooltip="${ifDefined(this.nextPageText)}" part="next-button" @click=${this._nextButtonClick} ?disabled=${this.isNextButtonDisabled}></udex-button></div>`;}
+function block2 (this: Carousel, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item._individualSlot)}"></slot>`;}
+function block3 (this: Carousel, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-carousel__navigation-wrapper" part="navigation"><${scopeTag("udex-button", tags, suffix)} size="Large" design=${ifDefined(this.buttonDesign)} arrow-back class="udex-carousel__navigation-button" icon="slim-arrow-left" tooltip="${ifDefined(this.previousPageText)}" part="prev-button" @click=${this._prevButtonClick} ?disabled=${this.isPrevButtonDisabled}></${scopeTag("udex-button", tags, suffix)}><${scopeTag("udex-button", tags, suffix)} size="Large" design=${ifDefined(this.buttonDesign)} arrow-forward class="udex-carousel__navigation-button" icon="slim-arrow-right" tooltip="${ifDefined(this.nextPageText)}" part="next-button" @click=${this._nextButtonClick} ?disabled=${this.isNextButtonDisabled}></${scopeTag("udex-button", tags, suffix)}></div>` : html`<div class="udex-carousel__navigation-wrapper" part="navigation"><udex-button size="Large" design=${ifDefined(this.buttonDesign)} arrow-back class="udex-carousel__navigation-button" icon="slim-arrow-left" tooltip="${ifDefined(this.previousPageText)}" part="prev-button" @click=${this._prevButtonClick} ?disabled=${this.isPrevButtonDisabled}></udex-button><udex-button size="Large" design=${ifDefined(this.buttonDesign)} arrow-forward class="udex-carousel__navigation-button" icon="slim-arrow-right" tooltip="${ifDefined(this.nextPageText)}" part="next-button" @click=${this._nextButtonClick} ?disabled=${this.isNextButtonDisabled}></udex-button></div>`;}
+
+
+export default block0;

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

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

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

@@ -0,0 +1,11 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	type DatePickerPopover = any;
+	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+	
+function block0 (this: DatePickerPopover, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-dropdown", tags, suffix)} id="udex-${ifDefined(this._id)}-calendar__popover" class="udex-date-picker__popover" placement-type="Bottom" horizontal-align="Left" @after-close="${this._afterDropdownClose}" @after-open="${this._afterDropdownOpen}"><${scopeTag("ui5-calendar", tags, suffix)} class="udex-date-picker__calendar" @ui5-selected-dates-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ repeat(this._calendarSelectedDates, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</${scopeTag("ui5-calendar", tags, suffix)}></${scopeTag("udex-dropdown", tags, suffix)}>` : html`<udex-dropdown id="udex-${ifDefined(this._id)}-calendar__popover" class="udex-date-picker__popover" placement-type="Bottom" horizontal-align="Left" @after-close="${this._afterDropdownClose}" @after-open="${this._afterDropdownOpen}"><ui5-calendar class="udex-date-picker__calendar" @ui5-selected-dates-change="${ifDefined(this.handleCalendarChange)}" selection-mode="${ifDefined(this.selectionMode)}" min-date="${ifDefined(this.minDate)}" max-date="${ifDefined(this.maxDate)}" format-pattern="${ifDefined(this.formatPattern)}">${ repeat(this._calendarSelectedDates, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ui5-calendar></udex-dropdown>`;}
+function block1 (this: DatePickerPopover, 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>`;}
+
+
+export default block0;

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

@@ -0,0 +1,11 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type 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)} @click="${this.handleInputClick}" @mousedown="${this.handleInputMouseDown}" @keydown="${this.handleInputKeyDown}" class="udex-date-picker__input udex-date-picker__trigger" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" aria-haspopup="grid" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" value="${ifDefined(this.value)}" icon="appointment-2" tabindex="0" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-text-field", tags, suffix)}>${ this.supportingText ? block1.call(this, context, tags, suffix) : undefined }</div>` : html`<div class="udex-date-picker__container"><udex-text-field @click="${this.handleInputClick}" @mousedown="${this.handleInputMouseDown}" @keydown="${this.handleInputKeyDown}" class="udex-date-picker__input udex-date-picker__trigger" label="${ifDefined(this.label)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-icon-name="${ifDefined(this.accessibleIconName)}" aria-haspopup="grid" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" value="${ifDefined(this.value)}" icon="appointment-2" tabindex="0" value-state="${ifDefined(this.valueState)}"></udex-text-field>${ this.supportingText ? block1.call(this, context, tags, suffix) : undefined }</div>`;}
+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>`;}
+
+
+export default block0;

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

@@ -0,0 +1,10 @@
+/* eslint no-unused-vars: 0 */
+import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+	import type Divider from "../../Divider.js";
+	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+	
+function block0 (this: Divider, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-divider-wrapper" role="${ifDefined(this.effectiveAccRole)}"><span class="udex-divider"></span></div>`;}
+
+
+export default block0;

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

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