@sapudex/web-components 2.24.0 → 2.25.1

package/dist/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../src/Breadcrumbs.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport { isTabNext, isTabPrevious, isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { LinkClickEventDetail } from \"@ui5/webcomponents/dist/Link.js\";\nimport NavigationMode from \"@ui5/webcomponents-base/dist/types/NavigationMode.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport UI5BreadcrumbsCss from \"@ui5/webcomponents/dist/generated/themes/Breadcrumbs.css.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport \"@ui5/webcomponents-icons/dist/home.js\";\nimport BreadcrumbsTemplate from \"./BreadcrumbsTemplate.js\";\nimport UDExBreadcrumbsItem from \"./BreadcrumbsItem.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExLink from \"./Link.js\";\nimport {\n  AVAILABLE_VALUES,\n  BREADCRUMBS_ARIA_LABEL,\n  BREADCRUMBS_OVERFLOW_ARIA_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport BreadcrumbsCss from \"./generated/themes/Breadcrumbs.css.js\";\nimport BreadcrumbsPopoverCss from \"./generated/themes/BreadcrumbsPopover.css.js\";\n\ntype UDExBreadcrumbsItemClickEventDetail = {\n  item: UDExBreadcrumbsItem;\n  altKey?: boolean;\n  ctrlKey?: boolean;\n  metaKey?: boolean;\n  shiftKey?: boolean;\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-breadcrumbs</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Breadcrumbs.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n  tag: \"udex-breadcrumbs\",\n  renderer: jsxRenderer,\n  styles: [UI5BreadcrumbsCss, BreadcrumbsCss, BreadcrumbsPopoverCss],\n  template: BreadcrumbsTemplate,\n  dependencies: [UDExBreadcrumbsItem, UDExLink, UDExDropdown, UI5Icon],\n})\n/**\n * @public\n * @param { UDExBreadcrumbsItem } item The clicked breadcrumb item\n * @param { boolean } altKey\n * @param { boolean } ctrlKey\n * @param { boolean } metaKey\n * @param { boolean } shiftKey\n */\n@event(\"item-click\", { cancelable: true, bubbles: true })\n\n/**\n * Fired after the dropdown is opened.\n *\n * @public\n */\n@event(\"open\", { bubbles: true })\n\n/**\n * Fired after the dropdown is closed.\n *\n * @public\n */\n@event(\"close\", { bubbles: true })\n\nclass UDExBreadcrumbs extends UI5Element {\n  eventDetails!: {\n    \"item-click\": UDExBreadcrumbsItemClickEventDetail,\n    \"open\": void,\n    \"close\": void,\n  };\n  /**\n   * Defines how many breadcrumb items should be visible\n   *\n   * @default 3\n   * @public\n   */\n  @property({ type: Number })\n    showItems: number = 3;\n\n  /**\n   * Indicates if dropdown is opened\n   *\n   * @default false\n   * @private\n   */\n  @property({ noAttribute: true, type: Boolean })\n    _dropdownOpened!: boolean;\n\n  /**\n   * Defines the component items.\n   *\n   * **Note:** Use the `udex-breadcrumbs-item` component to define the desired items.\n   * @public\n   */\n  @slot({ type: HTMLElement, invalidateOnChildChange: true, \"default\": true })\n    items!: Array<UDExBreadcrumbsItem>;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  _responsivePopover?: UDExDropdown;\n  _itemNavigation?: ItemNavigation;\n  _shouldFocusFirstVisibleItem!: boolean;\n  _rootClass: string;\n\n  constructor() {\n    super();\n    this._rootClass = \"udex-breadcrumbs\";\n  }\n\n  onBeforeRendering(): void {\n    this._preprocessItems();\n  }\n\n  onAfterRendering(): void {\n    this._responsivePopover = this._getResponsePopover();\n    this._initItemNavigation();\n    this._dropdownArrowLink.forcedTabIndex = \"0\";\n    this._handleOutsideClick();\n\n    if (this._shouldFocusFirstVisibleItem) {\n      this._getFocusableItems()[1].focus();\n      this._shouldFocusFirstVisibleItem = false;\n    }\n  }\n\n  _preprocessItems(): void {\n    this.items.forEach(item => {\n      item._getRealDomRef = () => this.getDomRef()!.querySelector(`[data-ui5-stable*=${item.stableDomRef}]`)!;\n    });\n  }\n\n  _getResponsePopover(): UDExDropdown {\n    return this.shadowRoot!.querySelector<UDExDropdown>(`#udex-${this.__id!}-breadcrumbs__popover`)!;\n  }\n\n  _getFocusableItems(): Array<UDExLink> {\n    const items = this._links;\n    items.unshift(this._dropdownArrowLink);\n\n    return items;\n  }\n\n  _initItemNavigation(): void {\n    if (!this._itemNavigation) {\n      this._itemNavigation = new ItemNavigation(this, {\n        navigationMode: NavigationMode.Horizontal,\n        getItemsCallback: () => this._getFocusableItems(),\n      });\n    }\n  }\n\n  _getItems(): Array<UDExBreadcrumbsItem> {\n    return this.getSlottedNodes<UDExBreadcrumbsItem>(\"items\");\n  }\n\n  _onDropdownLinkPress(e: CustomEvent<LinkClickEventDetail>): void {\n    const listItem = e.target as HTMLElement,\n      items = this._getItems(),\n      item = items.find(x => `${x._id}-li` === listItem.id)!;\n\n    if (item._isCurrentPageItem) {\n      return;\n    }\n\n    if (this.fireDecoratorEvent(\"item-click\", { item })) {\n      window.open(item.href, item.target || \"_self\", \"noopener,noreferrer\");\n      this._toggleDropdown();\n    }\n\n    this.setDropdownCloseState();\n  }\n\n  _onLinkPress(e: CustomEvent<LinkClickEventDetail>): void {\n    const link = e.target as UDExLink,\n      items = this._getItems(),\n      item = items.find(x => `${x._id}-link` === link.id)!,\n      {\n        altKey,\n        ctrlKey,\n        metaKey,\n        shiftKey,\n      } = e.detail;\n\n    if (!this.fireDecoratorEvent(\"item-click\", {\n      item,\n      altKey,\n      ctrlKey,\n      metaKey,\n      shiftKey,\n    })) {\n      e.preventDefault();\n    }\n\n    this.setDropdownCloseState();\n  }\n\n  _isItemVisible(item: UDExBreadcrumbsItem): boolean {\n    return !item.hidden;\n  }\n\n  _afterDropdownOpen(): void {\n    this._dropdownOpened = true;\n    this.fireDecoratorEvent(\"open\");\n  }\n\n  _afterDropdownClose(): void {\n    this._dropdownOpened = false;\n    this.fireDecoratorEvent(\"close\");\n  }\n\n  _toggleDropdown(): void {\n    if (this._responsivePopover) {\n      this._responsivePopover.open = !this._responsivePopover.open;\n      this._dropdownOpened = !this._dropdownOpened;\n    }\n  }\n\n  _onfocusin(e: FocusEvent): void {\n    const currentItem = e.target as UDExLink;\n\n    this._itemNavigation?.setCurrentItem(currentItem);\n  }\n\n  _handleKeydown(e: KeyboardEvent): void {\n    const itemIndex = (e.target as HTMLElement).getAttribute(\"data-index\");\n    const isLastItem = itemIndex === (this.items.length - 2).toString();\n    const isFirstItem = itemIndex === \"0\";\n\n    if (isTabNext(e) && isLastItem) {\n      this._shouldFocusFirstVisibleItem = true;\n      this._toggleDropdown();\n      return;\n    }\n\n    if ((isTabNext(e) && isLastItem) || (isTabPrevious(e) && isFirstItem) || isEscape(e)) {\n      this._toggleDropdown();\n    }\n  }\n\n  _handleOutsideClick(): void {\n    document.addEventListener(\"mousedown\", (e: Event) => {\n      if (e.target !== this) {\n        this.setDropdownCloseState();\n      }\n    });\n  }\n\n  setDropdownCloseState(): void {\n    if (this._responsivePopover) {\n      this._dropdownOpened = false;\n    }\n  }\n\n  /**\n   * Getter for the interactive element that opens the overflow\n   * @private\n   */\n  get _dropdownArrowLink(): UDExLink {\n    return this.shadowRoot!.querySelector<UDExLink>(\".udex-breadcrumbs__trigger\")!;\n  }\n\n  /**\n   * Getter for the list of links corresponding to the abstract breadcrumb items\n   */\n  get _links(): Array<UDExLink> {\n    return Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(\".udex-breadcrumbs__link-wrapper [udex-link]\"));\n  }\n\n  /**\n   * Getter for the list of abstract breadcrumb items to be rendered as links outside the overflow\n   */\n  get _linksData(): Array<UDExBreadcrumbsItem> {\n    const items = this._visibleItems;\n    const itemsCount = items.length;\n\n    return items\n      .map((item, index) => {\n        item._isCurrentPageItem = index === (itemsCount - 1);\n        return item;\n      });\n  }\n\n  get _visibleItems(): Array<UDExBreadcrumbsItem> {\n    const items = this._getItems();\n    const itemsLength = this.showItems ?? 0;\n\n    return this._getItems()\n      .slice(Math.max(items.length - itemsLength - 1, 0))\n      .filter(i => this._isItemVisible(i));\n  }\n\n  get _dropdownItems(): Array<UDExBreadcrumbsItem> {\n    return this._getItems().filter(i => this._isItemVisible(i));\n  }\n\n  get _triggerClass(): string {\n    const rootClass = \"udex-breadcrumbs\";\n    return this._dropdownOpened ? `${rootClass} ${rootClass}__trigger--opened` : rootClass;\n  }\n\n  get _breadcrumbsAccessibleNameText(): string {\n    return UDExBreadcrumbs.i18nBundle.getText(BREADCRUMBS_ARIA_LABEL);\n  }\n\n  get _dropdownArrowAccessibleNameText(): string {\n    return UDExBreadcrumbs.i18nBundle.getText(BREADCRUMBS_OVERFLOW_ARIA_LABEL);\n  }\n\n  get _dropdownAccessibleNameText(): string {\n    return UDExBreadcrumbs.i18nBundle.getText(AVAILABLE_VALUES);\n  }\n}\n\nUDExBreadcrumbs.define();\n\nexport default UDExBreadcrumbs;\nexport type { UDExBreadcrumbsItemClickEventDetail };\n"]}
+{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../src/Breadcrumbs.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport { isTabNext, isTabPrevious, isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { LinkClickEventDetail } from \"@ui5/webcomponents/dist/Link.js\";\nimport NavigationMode from \"@ui5/webcomponents-base/dist/types/NavigationMode.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport UI5BreadcrumbsCss from \"@ui5/webcomponents/dist/generated/themes/Breadcrumbs.css.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport \"@ui5/webcomponents-icons/dist/home.js\";\nimport BreadcrumbsTemplate from \"./BreadcrumbsTemplate.js\";\nimport UDExBreadcrumbsItem from \"./BreadcrumbsItem.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExLink from \"./Link.js\";\nimport {\n  AVAILABLE_VALUES,\n  BREADCRUMBS_ARIA_LABEL,\n  BREADCRUMBS_OVERFLOW_ARIA_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport translate from \"./utils/translate.js\";\n\n// Styles\nimport BreadcrumbsCss from \"./generated/themes/Breadcrumbs.css.js\";\nimport BreadcrumbsPopoverCss from \"./generated/themes/BreadcrumbsPopover.css.js\";\n\ntype UDExBreadcrumbsItemClickEventDetail = {\n  item: UDExBreadcrumbsItem;\n  altKey?: boolean;\n  ctrlKey?: boolean;\n  metaKey?: boolean;\n  shiftKey?: boolean;\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-breadcrumbs</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Breadcrumbs.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n  tag: \"udex-breadcrumbs\",\n  renderer: jsxRenderer,\n  styles: [UI5BreadcrumbsCss, BreadcrumbsCss, BreadcrumbsPopoverCss],\n  template: BreadcrumbsTemplate,\n  dependencies: [UDExBreadcrumbsItem, UDExLink, UDExDropdown, UI5Icon],\n})\n/**\n * @public\n * @param { UDExBreadcrumbsItem } item The clicked breadcrumb item\n * @param { boolean } altKey\n * @param { boolean } ctrlKey\n * @param { boolean } metaKey\n * @param { boolean } shiftKey\n */\n@event(\"item-click\", { cancelable: true, bubbles: true })\n\n/**\n * Fired after the dropdown is opened.\n *\n * @public\n */\n@event(\"open\", { bubbles: true })\n\n/**\n * Fired after the dropdown is closed.\n *\n * @public\n */\n@event(\"close\", { bubbles: true })\n\nclass UDExBreadcrumbs extends UI5Element {\n  eventDetails!: {\n    \"item-click\": UDExBreadcrumbsItemClickEventDetail,\n    \"open\": void,\n    \"close\": void,\n  };\n  /**\n   * Defines how many breadcrumb items should be visible\n   *\n   * @default 3\n   * @public\n   */\n  @property({ type: Number })\n    showItems: number = 3;\n\n  /**\n   * Indicates if dropdown is opened\n   *\n   * @default false\n   * @private\n   */\n  @property({ noAttribute: true, type: Boolean })\n    _dropdownOpened!: boolean;\n\n  /**\n   * Defines the component items.\n   *\n   * **Note:** Use the `udex-breadcrumbs-item` component to define the desired items.\n   * @public\n   */\n  @slot({ type: HTMLElement, invalidateOnChildChange: true, \"default\": true })\n    items!: Array<UDExBreadcrumbsItem>;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  _responsivePopover?: UDExDropdown;\n  _itemNavigation?: ItemNavigation;\n  _shouldFocusFirstVisibleItem!: boolean;\n  _rootClass: string;\n\n  constructor() {\n    super();\n    this._rootClass = \"udex-breadcrumbs\";\n  }\n\n  onBeforeRendering(): void {\n    this._preprocessItems();\n  }\n\n  onAfterRendering(): void {\n    this._responsivePopover = this._getResponsePopover();\n    this._initItemNavigation();\n    this._dropdownArrowLink.forcedTabIndex = \"0\";\n    this._handleOutsideClick();\n\n    if (this._shouldFocusFirstVisibleItem) {\n      this._getFocusableItems()[1].focus();\n      this._shouldFocusFirstVisibleItem = false;\n    }\n  }\n\n  _preprocessItems(): void {\n    this.items.forEach(item => {\n      item._getRealDomRef = () => this.getDomRef()!.querySelector(`[data-ui5-stable*=${item.stableDomRef}]`)!;\n    });\n  }\n\n  _getResponsePopover(): UDExDropdown {\n    return this.shadowRoot!.querySelector<UDExDropdown>(`#udex-${this.__id!}-breadcrumbs__popover`)!;\n  }\n\n  _getFocusableItems(): Array<UDExLink> {\n    const items = this._links;\n    items.unshift(this._dropdownArrowLink);\n\n    return items;\n  }\n\n  _initItemNavigation(): void {\n    if (!this._itemNavigation) {\n      this._itemNavigation = new ItemNavigation(this, {\n        navigationMode: NavigationMode.Horizontal,\n        getItemsCallback: () => this._getFocusableItems(),\n      });\n    }\n  }\n\n  _getItems(): Array<UDExBreadcrumbsItem> {\n    return this.getSlottedNodes<UDExBreadcrumbsItem>(\"items\");\n  }\n\n  _onDropdownLinkPress(e: CustomEvent<LinkClickEventDetail>): void {\n    const listItem = e.target as HTMLElement,\n      items = this._getItems(),\n      item = items.find(x => `${x._id}-li` === listItem.id)!;\n\n    if (item._isCurrentPageItem) {\n      return;\n    }\n\n    if (this.fireDecoratorEvent(\"item-click\", { item })) {\n      window.open(item.href, item.target || \"_self\", \"noopener,noreferrer\");\n      this._toggleDropdown();\n    }\n\n    this.setDropdownCloseState();\n  }\n\n  _onLinkPress(e: CustomEvent<LinkClickEventDetail>): void {\n    const link = e.target as UDExLink,\n      items = this._getItems(),\n      item = items.find(x => `${x._id}-link` === link.id)!,\n      {\n        altKey,\n        ctrlKey,\n        metaKey,\n        shiftKey,\n      } = e.detail;\n\n    if (!this.fireDecoratorEvent(\"item-click\", {\n      item,\n      altKey,\n      ctrlKey,\n      metaKey,\n      shiftKey,\n    })) {\n      e.preventDefault();\n    }\n\n    this.setDropdownCloseState();\n  }\n\n  _isItemVisible(item: UDExBreadcrumbsItem): boolean {\n    return !item.hidden;\n  }\n\n  _afterDropdownOpen(): void {\n    this._dropdownOpened = true;\n    this.fireDecoratorEvent(\"open\");\n  }\n\n  _afterDropdownClose(): void {\n    this._dropdownOpened = false;\n    this.fireDecoratorEvent(\"close\");\n  }\n\n  _toggleDropdown(): void {\n    if (this._responsivePopover) {\n      this._responsivePopover.open = !this._responsivePopover.open;\n      this._dropdownOpened = !this._dropdownOpened;\n    }\n  }\n\n  _onfocusin(e: FocusEvent): void {\n    const currentItem = e.target as UDExLink;\n\n    this._itemNavigation?.setCurrentItem(currentItem);\n  }\n\n  _handleKeydown(e: KeyboardEvent): void {\n    const itemIndex = (e.target as HTMLElement).getAttribute(\"data-index\");\n    const isLastItem = itemIndex === (this.items.length - 2).toString();\n    const isFirstItem = itemIndex === \"0\";\n\n    if (isTabNext(e) && isLastItem) {\n      this._shouldFocusFirstVisibleItem = true;\n      this._toggleDropdown();\n      return;\n    }\n\n    if ((isTabNext(e) && isLastItem) || (isTabPrevious(e) && isFirstItem) || isEscape(e)) {\n      this._toggleDropdown();\n    }\n  }\n\n  _handleOutsideClick(): void {\n    document.addEventListener(\"mousedown\", (e: Event) => {\n      if (e.target !== this) {\n        this.setDropdownCloseState();\n      }\n    });\n  }\n\n  setDropdownCloseState(): void {\n    if (this._responsivePopover) {\n      this._dropdownOpened = false;\n    }\n  }\n\n  /**\n   * Getter for the interactive element that opens the overflow\n   * @private\n   */\n  get _dropdownArrowLink(): UDExLink {\n    return this.shadowRoot!.querySelector<UDExLink>(\".udex-breadcrumbs__trigger\")!;\n  }\n\n  /**\n   * Getter for the list of links corresponding to the abstract breadcrumb items\n   */\n  get _links(): Array<UDExLink> {\n    return Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(\".udex-breadcrumbs__link-wrapper [udex-link]\"));\n  }\n\n  /**\n   * Getter for the list of abstract breadcrumb items to be rendered as links outside the overflow\n   */\n  get _linksData(): Array<UDExBreadcrumbsItem> {\n    const items = this._visibleItems;\n    const itemsCount = items.length;\n\n    return items\n      .map((item, index) => {\n        item._isCurrentPageItem = index === (itemsCount - 1);\n        return item;\n      });\n  }\n\n  get _visibleItems(): Array<UDExBreadcrumbsItem> {\n    const items = this._getItems();\n    const itemsLength = this.showItems ?? 0;\n\n    return this._getItems()\n      .slice(Math.max(items.length - itemsLength - 1, 0))\n      .filter(i => this._isItemVisible(i));\n  }\n\n  get _dropdownItems(): Array<UDExBreadcrumbsItem> {\n    return this._getItems().filter(i => this._isItemVisible(i));\n  }\n\n  get _triggerClass(): string {\n    const rootClass = \"udex-breadcrumbs\";\n    return this._dropdownOpened ? `${rootClass} ${rootClass}__trigger--opened` : rootClass;\n  }\n\n  get _breadcrumbsAccessibleNameText(): string {\n    return translate(UDExBreadcrumbs, BREADCRUMBS_ARIA_LABEL);\n  }\n\n  get _dropdownArrowAccessibleNameText(): string {\n    return translate(UDExBreadcrumbs, BREADCRUMBS_OVERFLOW_ARIA_LABEL);\n  }\n\n  get _dropdownAccessibleNameText(): string {\n    return translate(UDExBreadcrumbs, AVAILABLE_VALUES);\n  }\n}\n\nUDExBreadcrumbs.define();\n\nexport default UDExBreadcrumbs;\nexport type { UDExBreadcrumbsItemClickEventDetail };\n"]}

package/dist/Button.js

@@ -16,6 +16,7 @@ import UDExButtonSize from "./types/ButtonSize.js";
 import UDExButtonDesign from "./types/ButtonDesign.js";
 // Styles
 import ButtonCss from "./generated/themes/Button.css.js";
+import translate from "./utils/translate.js";
 /**
  * @class
  *
@@ -83,9 +84,9 @@ let UDExButton = UDExButton_1 = class UDExButton extends Button {
             || designValue === UDExButtonDesign.Warning || designValue === UDExButtonDesign.Attention;
         let typeText;
         if (designValue) {
-            typeText = shouldReadDesign ? UDExButton_1.i18nBundle.getText(UDExButton_1.typeTextMappings()[designValue]) : "";
+            typeText = shouldReadDesign ? translate(UDExButton_1, UDExButton_1.typeTextMappings()[designValue]) : "";
         }
-        return `${typeText} ${this.toggled ? UDExButton_1.i18nBundle.getText(TOGGLED) : ""}`.trim();
+        return `${typeText} ${this.toggled ? translate(UDExButton_1, TOGGLED) : ""}`.trim();
     }
     get designValue() {
         return this.getAttribute("design");

package/dist/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAGnE,OAAO,EACL,qBAAqB,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,yBAAyB,EAAE,yBAAyB,EAAE,wBAAwB,EAAE,0BAA0B,EAAE,yBAAyB,EAAE,wBAAwB,EAAE,OAAO,GACtQ,MAAM,mCAAmC,CAAC;AAC3C,OAAO,YAAY,MAAM,+CAA+C,CAAC;AACzE,OAAO,cAAc,MAAM,uBAAuB,CAAC;AACnD,OAAO,gBAAgB,MAAM,yBAAyB,CAAC;AAEvD,SAAS;AACT,OAAO,SAAS,MAAM,kCAAkC,CAAC;AAEzD;;;;;;;;;;;;;;;;;GAiBG;AAOH,IAAM,UAAU,kBAAhB,MAAM,UAAW,SAAQ,MAAM;IAA/B;;QACE;;;;;;;WAOG;QAED,SAAI,GAAwB,cAAc,CAAC,MAAM,CAAC;QAWpD;;;;WAIG;QAGD,WAAM,GAA0B,gBAAgB,CAAC,OAAO,CAAC;QAW3D;;;;;WAKG;QAED,iBAAY,GAAsB,YAAY,CAAC,IAAI,CAAC;IAuCxD,CAAC;IAlCC,MAAM,CAAC,gBAAgB;QACrB,OAAO;YACL,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,wBAAwB;YACpD,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAAE,0BAA0B;YACxD,CAAC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,yBAAyB;YACtD,CAAC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,yBAAyB;YACtD,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,wBAAwB;YACpD,CAAC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,yBAAyB;YACtD,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE,sBAAsB;YACrD,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,mBAAmB;YAC/C,CAAC,gBAAgB,CAAC,WAAW,CAAC,EAAE,uBAAuB;YACvD,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAAE,qBAAqB;SACpD,CAAC;IACJ,CAAC;IAED,IAAI,aAAa;QACf,OAAO,CAAC,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,OAAO,CAAC;IAC5C,CAAC;IAED,IAAI,cAAc;QAChB,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;QAC7B,MAAM,gBAAgB,GAAG,WAAW,KAAK,gBAAgB,CAAC,QAAQ,IAAI,WAAW,KAAK,gBAAgB,CAAC,QAAQ;eAC5G,WAAW,KAAK,gBAAgB,CAAC,OAAO,IAAI,WAAW,KAAK,gBAAgB,CAAC,SAAS,CAAC;QAE1F,IAAI,QAAQ,CAAC;QACb,IAAI,WAAW,EAAE,CAAC;YAChB,QAAQ,GAAG,gBAAgB,CAAC,CAAC,CAAC,YAAU,CAAC,UAAU,CAAC,OAAO,CAAC,YAAU,CAAC,gBAAgB,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAC/G,CAAC;QACD,OAAO,GAAG,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,YAAU,CAAC,UAAU,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,CAAC;IAC5F,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IACrC,CAAC;CACF,CAAA;AA3EG;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACyB;AASlD;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACR;AASlB;IAFD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;IAC3B,uBAAuB;0CACoC;AASzD;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACF;AASxB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAC2B;AAG/C;IADN,IAAI,CAAC,yBAAyB,CAAC;oCACF;AAjD1B,UAAU;IANf,aAAa,CAAC;QACb,GAAG,EAAE,aAAa;QAClB,QAAQ,EAAE,WAAW;QACrB,MAAM,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC;KACnC,CAAC;GAEI,UAAU,CAqFf;AAED,UAAU,CAAC,MAAM,EAAE,CAAC;AAEpB,eAAe,UAAU,CAAC","sourcesContent":["import jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  BUTTON_ARIA_ATTENTION, BUTTON_ARIA_DEFAULT, BUTTON_ARIA_EMPHASIZED, BUTTON_ARIA_TRANSPARENT, BUTTON_ARIA_TYPE_NEGATIVE, BUTTON_ARIA_TYPE_POSITIVE, BUTTON_ARIA_TYPE_PRIMARY, BUTTON_ARIA_TYPE_SECONDARY, BUTTON_ARIA_TYPE_TERTIARY, BUTTON_ARIA_TYPE_WARNING, TOGGLED,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport UDExButtonSize from \"./types/ButtonSize.js\";\nimport UDExButtonDesign from \"./types/ButtonDesign.js\";\n\n// Styles\nimport ButtonCss from \"./generated/themes/Button.css.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-button</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Button.js\";</code>\n *\n * @constructor\n * @extends Button\n * @tagname udex-button\n * @public\n */\n@customElement({\n  tag: \"udex-button\",\n  renderer: jsxRenderer,\n  styles: [Button.styles, ButtonCss],\n})\n\nclass UDExButton extends Button {\n  /**\n   * Defines the size of the component.\n   * <br><br>\n   * <b>Note:</b> There are three different sizes to choose from.\n   *\n   * @default \"Medium\"\n   * @public\n   */\n  @property({ type: String })\n    size: `${UDExButtonSize}` = UDExButtonSize.Medium;\n\n  /**\n   * Defines if button is in toggled state\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    toggled!: boolean;\n\n  /**\n   * Defines the component design.\n   * @default \"Primary\"\n   * @public\n   */\n  @property({ type: String })\n  /** @ts-expect-error */\n    design: `${UDExButtonDesign}` = UDExButtonDesign.Primary;\n\n  /**\n   * Defines if button is in pseudo-disabled state.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean })\n    _ariaDisabled!: boolean;\n\n  /**\n   * Defines if button should wrap text inside\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: String })\n    wrappingType: `${WrappingType}` = WrappingType.None;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  static typeTextMappings(): Record<string, I18nText> {\n    return {\n      [UDExButtonDesign.Primary]: BUTTON_ARIA_TYPE_PRIMARY,\n      [UDExButtonDesign.Secondary]: BUTTON_ARIA_TYPE_SECONDARY,\n      [UDExButtonDesign.Tertiary]: BUTTON_ARIA_TYPE_TERTIARY,\n      [UDExButtonDesign.Positive]: BUTTON_ARIA_TYPE_POSITIVE,\n      [UDExButtonDesign.Warning]: BUTTON_ARIA_TYPE_WARNING,\n      [UDExButtonDesign.Negative]: BUTTON_ARIA_TYPE_NEGATIVE,\n      [UDExButtonDesign.Emphasized]: BUTTON_ARIA_EMPHASIZED,\n      [UDExButtonDesign.Default]: BUTTON_ARIA_DEFAULT,\n      [UDExButtonDesign.Transparent]: BUTTON_ARIA_TRANSPARENT,\n      [UDExButtonDesign.Attention]: BUTTON_ARIA_ATTENTION,\n    };\n  }\n\n  get hasButtonType(): boolean {\n    return !!this.designValue || this.toggled;\n  }\n\n  get buttonTypeText(): string {\n    const { designValue } = this;\n    const shouldReadDesign = designValue === UDExButtonDesign.Positive || designValue === UDExButtonDesign.Negative\n    || designValue === UDExButtonDesign.Warning || designValue === UDExButtonDesign.Attention;\n\n    let typeText;\n    if (designValue) {\n      typeText = shouldReadDesign ? UDExButton.i18nBundle.getText(UDExButton.typeTextMappings()[designValue]) : \"\";\n    }\n    return `${typeText} ${this.toggled ? UDExButton.i18nBundle.getText(TOGGLED) : \"\"}`.trim();\n  }\n\n  get designValue(): string | null {\n    return this.getAttribute(\"design\");\n  }\n}\n\nUDExButton.define();\n\nexport default UDExButton;\n"]}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.ts"],"names":[],"mappings":"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","sourcesContent":["import jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  BUTTON_ARIA_ATTENTION, BUTTON_ARIA_DEFAULT, BUTTON_ARIA_EMPHASIZED, BUTTON_ARIA_TRANSPARENT, BUTTON_ARIA_TYPE_NEGATIVE, BUTTON_ARIA_TYPE_POSITIVE, BUTTON_ARIA_TYPE_PRIMARY, BUTTON_ARIA_TYPE_SECONDARY, BUTTON_ARIA_TYPE_TERTIARY, BUTTON_ARIA_TYPE_WARNING, TOGGLED,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport UDExButtonSize from \"./types/ButtonSize.js\";\nimport UDExButtonDesign from \"./types/ButtonDesign.js\";\n\n// Styles\nimport ButtonCss from \"./generated/themes/Button.css.js\";\nimport translate from \"./utils/translate.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-button</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Button.js\";</code>\n *\n * @constructor\n * @extends Button\n * @tagname udex-button\n * @public\n */\n@customElement({\n  tag: \"udex-button\",\n  renderer: jsxRenderer,\n  styles: [Button.styles, ButtonCss],\n})\n\nclass UDExButton extends Button {\n  /**\n   * Defines the size of the component.\n   * <br><br>\n   * <b>Note:</b> There are three different sizes to choose from.\n   *\n   * @default \"Medium\"\n   * @public\n   */\n  @property({ type: String })\n    size: `${UDExButtonSize}` = UDExButtonSize.Medium;\n\n  /**\n   * Defines if button is in toggled state\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    toggled!: boolean;\n\n  /**\n   * Defines the component design.\n   * @default \"Primary\"\n   * @public\n   */\n  @property({ type: String })\n  /** @ts-expect-error */\n    design: `${UDExButtonDesign}` = UDExButtonDesign.Primary;\n\n  /**\n   * Defines if button is in pseudo-disabled state.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean })\n    _ariaDisabled!: boolean;\n\n  /**\n   * Defines if button should wrap text inside\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: String })\n    wrappingType: `${WrappingType}` = WrappingType.None;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  static typeTextMappings(): Record<string, I18nText> {\n    return {\n      [UDExButtonDesign.Primary]: BUTTON_ARIA_TYPE_PRIMARY,\n      [UDExButtonDesign.Secondary]: BUTTON_ARIA_TYPE_SECONDARY,\n      [UDExButtonDesign.Tertiary]: BUTTON_ARIA_TYPE_TERTIARY,\n      [UDExButtonDesign.Positive]: BUTTON_ARIA_TYPE_POSITIVE,\n      [UDExButtonDesign.Warning]: BUTTON_ARIA_TYPE_WARNING,\n      [UDExButtonDesign.Negative]: BUTTON_ARIA_TYPE_NEGATIVE,\n      [UDExButtonDesign.Emphasized]: BUTTON_ARIA_EMPHASIZED,\n      [UDExButtonDesign.Default]: BUTTON_ARIA_DEFAULT,\n      [UDExButtonDesign.Transparent]: BUTTON_ARIA_TRANSPARENT,\n      [UDExButtonDesign.Attention]: BUTTON_ARIA_ATTENTION,\n    };\n  }\n\n  get hasButtonType(): boolean {\n    return !!this.designValue || this.toggled;\n  }\n\n  get buttonTypeText(): string {\n    const { designValue } = this;\n    const shouldReadDesign = designValue === UDExButtonDesign.Positive || designValue === UDExButtonDesign.Negative\n    || designValue === UDExButtonDesign.Warning || designValue === UDExButtonDesign.Attention;\n\n    let typeText;\n    if (designValue) {\n      typeText = shouldReadDesign ? translate(UDExButton, UDExButton.typeTextMappings()[designValue]) : \"\";\n    }\n    return `${typeText} ${this.toggled ? translate(UDExButton, TOGGLED) : \"\"}`.trim();\n  }\n\n  get designValue(): string | null {\n    return this.getAttribute(\"design\");\n  }\n}\n\nUDExButton.define();\n\nexport default UDExButton;\n"]}

package/dist/Carousel.d.ts

@@ -111,6 +111,7 @@ declare class UDExCarousel extends UI5Element {
     _prevButtonClick(e: UI5CustomEvent<UDExButton, "click">): void;
     _nextButtonClick(e: UI5CustomEvent<UDExButton, "click">): void;
     _onkeydown(e: KeyboardEvent): void;
+    _handleNavigate(): void;
     onAfterRendering(): void;
 }
 export default UDExCarousel;

package/dist/Carousel.js

@@ -14,6 +14,7 @@ import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import { isUp, isDown, isRight, isLeft, } from "@ui5/webcomponents-base/dist/Keys.js";
 import { CAROUSEL_NEXT_ARROW_TEXT, CAROUSEL_PREVIOUS_ARROW_TEXT } from "./generated/i18n/i18n-defaults.js";
 import redirectAttributes from "./utils/redirectAttributes.js";
+import translate from "./utils/translate.js";
 import CarouselTemplate from "./CarouselTemplate.js";
 // Styles
 import CarouselCss from "./generated/themes/Carousel.css.js";
@@ -93,10 +94,10 @@ let UDExCarousel = UDExCarousel_1 = class UDExCarousel extends UI5Element {
         this.accessibleName = "";
     }
     get nextPageText() {
-        return UDExCarousel_1.i18nBundle.getText(CAROUSEL_NEXT_ARROW_TEXT);
+        return translate(UDExCarousel_1, CAROUSEL_NEXT_ARROW_TEXT);
     }
     get previousPageText() {
-        return UDExCarousel_1.i18nBundle.getText(CAROUSEL_PREVIOUS_ARROW_TEXT);
+        return translate(UDExCarousel_1, CAROUSEL_PREVIOUS_ARROW_TEXT);
     }
     get carouselClass() {
         const classes = "udex-carousel";
@@ -131,20 +132,21 @@ let UDExCarousel = UDExCarousel_1 = class UDExCarousel extends UI5Element {
             return;
         }
         this._carousel?._navButtonClick(e);
-        this._calculateDisabledButtonsState();
     }
     _nextButtonClick(e) {
         if (this.isNextButtonDisabled) {
             return;
         }
         this._carousel?._navButtonClick(e);
-        this._calculateDisabledButtonsState();
     }
     _onkeydown(e) {
         if (isLeft(e) || isDown(e) || isRight(e) || isUp(e)) {
             this._calculateDisabledButtonsState();
         }
     }
+    _handleNavigate() {
+        this._calculateDisabledButtonsState();
+    }
     onAfterRendering() {
         redirectAttributes(this, "carousel");
         this._calculateDisabledButtonsState();

package/dist/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../src/Carousel.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  isUp, isDown, isRight, isLeft,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { CAROUSEL_NEXT_ARROW_TEXT, CAROUSEL_PREVIOUS_ARROW_TEXT } from \"./generated/i18n/i18n-defaults.js\";\nimport redirectAttributes from \"./utils/redirectAttributes.js\";\nimport type UI5Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport type Icon from \"@ui5/webcomponents/dist/Icon.js\";\n\nimport CarouselTemplate from \"./CarouselTemplate.js\";\n\n// Styles\nimport CarouselCss from \"./generated/themes/Carousel.css.js\";\nimport type CarouselPageIndicatorType from \"@ui5/webcomponents/dist/types/CarouselPageIndicatorType.js\";\nimport type UDExButton from \"./Button.js\";\n\nexport enum UDExCarouselNavigationPosition {\n  top = \"top\",\n  bottom = \"bottom\",\n}\n\nexport enum UDExCarouselButtonDesign {\n  Secondary = \"Secondary\",\n  Tertiary = \"Tertiary\",\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-carousel</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Carousel.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-carousel\n * @public\n */\n@customElement({\n  tag: \"udex-carousel\",\n  renderer: jsxRenderer,\n  styles: CarouselCss,\n  template: CarouselTemplate,\n})\n\nclass UDExCarousel extends UI5Element {\n  /**\n   * Defines the position of the navigation.\n   * <br><br>\n   * Available options are:\n   * <ul>\n   * <li><code>top</code> - the navigation button are placed above the component.</li>\n   * <li><code>bottom</code> - the navigation button arrows are placed below the component.</li>\n   * </ul>\n   *\n   * @public\n   */\n  @property()\n    navigationPlacement: `${UDExCarouselNavigationPosition}` = UDExCarouselNavigationPosition.top;\n\n  /**\n   * Defines the content of the component.\n   *\n   * @slot\n   * @public\n   */\n  @slot({ \"default\": true, type: HTMLElement, individualSlots: true })\n    items!: Array<HTMLElement>;\n\n  /**\n   * Defines the number of items per page depending on the carousel width.\n   *\n   * - 'S' for screens smaller than 600 pixels.\n   * - 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n   * - 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n   * - 'XL' for screens greater than or equal to 1440 pixels.\n   *\n   * One item per page is shown by default.\n   * @default \"S1 M1 L1 XL1\"\n   * @public\n   */\n  @property()\n    itemsPerPage = \"S1 M1 L1 XL1\";\n\n  /**\n   * Defines the style of the page indicator.\n   * Available options are:\n   *\n   * - `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)\n   * - `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)\n   * @since 1.10\n   * @default \"Default\"\n   * @public\n   */\n  @property()\n    pageIndicatorType: `${CarouselPageIndicatorType}` = \"Default\";\n\n  /**\n   * Defines the prev button is disabled\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isPrevButtonDisabled!: boolean;\n\n  /**\n   * Defines the next button is disabled\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isNextButtonDisabled!: boolean;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default ''\n   * @public\n   */\n  @property({ type: String })\n    accessibleName: string = \"\";\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  get nextPageText(): string {\n    return UDExCarousel.i18nBundle.getText(CAROUSEL_NEXT_ARROW_TEXT);\n  }\n\n  get previousPageText(): string {\n    return UDExCarousel.i18nBundle.getText(CAROUSEL_PREVIOUS_ARROW_TEXT);\n  }\n\n  get carouselClass(): string {\n    const classes = \"udex-carousel\";\n\n    return `${classes} udex-carousel__navigation--${this.navigationPlacement}`;\n  }\n\n  get buttonDesign(): UDExCarouselButtonDesign {\n    return this.navigationPlacement === UDExCarouselNavigationPosition.top\n      ? UDExCarouselButtonDesign.Secondary\n      : UDExCarouselButtonDesign.Tertiary;\n  }\n\n  get showNavigationButtons(): { top: boolean; bottom: boolean } {\n    return {\n      top: this.navigationPlacement === UDExCarouselNavigationPosition.top,\n      bottom: this.navigationPlacement === UDExCarouselNavigationPosition.bottom,\n    };\n  }\n\n  get _hidePageIndicator(): boolean {\n    return this.navigationPlacement === UDExCarouselNavigationPosition.top;\n  }\n\n  get _carousel(): UI5Carousel | null {\n    return this.shadowRoot!.querySelector<UI5Carousel>(\"[ui5-carousel]\");\n  }\n\n  get _ui5CarouselRoot(): HTMLElement | null | undefined {\n    return this._carousel?.shadowRoot?.querySelector(\".ui5-carousel-root\");\n  }\n\n  _calculateDisabledButtonsState() {\n    this.isPrevButtonDisabled = !this._carousel?.hasPrev;\n    this.isNextButtonDisabled = !this._carousel?.hasNext;\n  }\n\n  _prevButtonClick(e: UI5CustomEvent<UDExButton, \"click\">) {\n    if (this.isPrevButtonDisabled) {\n      return;\n    }\n\n    this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, \"click\">);\n    this._calculateDisabledButtonsState();\n  }\n\n  _nextButtonClick(e: UI5CustomEvent<UDExButton, \"click\">) {\n    if (this.isNextButtonDisabled) {\n      return;\n    }\n\n    this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, \"click\">);\n    this._calculateDisabledButtonsState();\n  }\n\n  _onkeydown(e: KeyboardEvent) {\n    if (isLeft(e) || isDown(e) || isRight(e) || isUp(e)) {\n      this._calculateDisabledButtonsState();\n    }\n  }\n\n  onAfterRendering() {\n    redirectAttributes(this, \"carousel\");\n\n    this._calculateDisabledButtonsState();\n  }\n}\n\nUDExCarousel.define();\n\nexport default UDExCarousel;\n"]}
+{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../src/Carousel.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  isUp, isDown, isRight, isLeft,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { CAROUSEL_NEXT_ARROW_TEXT, CAROUSEL_PREVIOUS_ARROW_TEXT } from \"./generated/i18n/i18n-defaults.js\";\nimport redirectAttributes from \"./utils/redirectAttributes.js\";\nimport type UI5Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport type Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport translate from \"./utils/translate.js\";\n\nimport CarouselTemplate from \"./CarouselTemplate.js\";\n\n// Styles\nimport CarouselCss from \"./generated/themes/Carousel.css.js\";\nimport type CarouselPageIndicatorType from \"@ui5/webcomponents/dist/types/CarouselPageIndicatorType.js\";\nimport type UDExButton from \"./Button.js\";\n\nexport enum UDExCarouselNavigationPosition {\n  top = \"top\",\n  bottom = \"bottom\",\n}\n\nexport enum UDExCarouselButtonDesign {\n  Secondary = \"Secondary\",\n  Tertiary = \"Tertiary\",\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-carousel</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Carousel.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-carousel\n * @public\n */\n@customElement({\n  tag: \"udex-carousel\",\n  renderer: jsxRenderer,\n  styles: CarouselCss,\n  template: CarouselTemplate,\n})\n\nclass UDExCarousel extends UI5Element {\n  /**\n   * Defines the position of the navigation.\n   * <br><br>\n   * Available options are:\n   * <ul>\n   * <li><code>top</code> - the navigation button are placed above the component.</li>\n   * <li><code>bottom</code> - the navigation button arrows are placed below the component.</li>\n   * </ul>\n   *\n   * @public\n   */\n  @property()\n    navigationPlacement: `${UDExCarouselNavigationPosition}` = UDExCarouselNavigationPosition.top;\n\n  /**\n   * Defines the content of the component.\n   *\n   * @slot\n   * @public\n   */\n  @slot({ \"default\": true, type: HTMLElement, individualSlots: true })\n    items!: Array<HTMLElement>;\n\n  /**\n   * Defines the number of items per page depending on the carousel width.\n   *\n   * - 'S' for screens smaller than 600 pixels.\n   * - 'M' for screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n   * - 'L' for screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n   * - 'XL' for screens greater than or equal to 1440 pixels.\n   *\n   * One item per page is shown by default.\n   * @default \"S1 M1 L1 XL1\"\n   * @public\n   */\n  @property()\n    itemsPerPage = \"S1 M1 L1 XL1\";\n\n  /**\n   * Defines the style of the page indicator.\n   * Available options are:\n   *\n   * - `Default` - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)\n   * - `Numeric` - The page indicator will display the current page and the total number of pages. (e.g. X of Y)\n   * @since 1.10\n   * @default \"Default\"\n   * @public\n   */\n  @property()\n    pageIndicatorType: `${CarouselPageIndicatorType}` = \"Default\";\n\n  /**\n   * Defines the prev button is disabled\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isPrevButtonDisabled!: boolean;\n\n  /**\n   * Defines the next button is disabled\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isNextButtonDisabled!: boolean;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default ''\n   * @public\n   */\n  @property({ type: String })\n    accessibleName: string = \"\";\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  get nextPageText(): string {\n    return translate(UDExCarousel, CAROUSEL_NEXT_ARROW_TEXT);\n  }\n\n  get previousPageText(): string {\n    return translate(UDExCarousel, CAROUSEL_PREVIOUS_ARROW_TEXT);\n  }\n\n  get carouselClass(): string {\n    const classes = \"udex-carousel\";\n\n    return `${classes} udex-carousel__navigation--${this.navigationPlacement}`;\n  }\n\n  get buttonDesign(): UDExCarouselButtonDesign {\n    return this.navigationPlacement === UDExCarouselNavigationPosition.top\n      ? UDExCarouselButtonDesign.Secondary\n      : UDExCarouselButtonDesign.Tertiary;\n  }\n\n  get showNavigationButtons(): { top: boolean; bottom: boolean } {\n    return {\n      top: this.navigationPlacement === UDExCarouselNavigationPosition.top,\n      bottom: this.navigationPlacement === UDExCarouselNavigationPosition.bottom,\n    };\n  }\n\n  get _hidePageIndicator(): boolean {\n    return this.navigationPlacement === UDExCarouselNavigationPosition.top;\n  }\n\n  get _carousel(): UI5Carousel | null {\n    return this.shadowRoot!.querySelector<UI5Carousel>(\"[ui5-carousel]\");\n  }\n\n  get _ui5CarouselRoot(): HTMLElement | null | undefined {\n    return this._carousel?.shadowRoot?.querySelector(\".ui5-carousel-root\");\n  }\n\n  _calculateDisabledButtonsState() {\n    this.isPrevButtonDisabled = !this._carousel?.hasPrev;\n    this.isNextButtonDisabled = !this._carousel?.hasNext;\n  }\n\n  _prevButtonClick(e: UI5CustomEvent<UDExButton, \"click\">) {\n    if (this.isPrevButtonDisabled) {\n      return;\n    }\n\n    this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, \"click\">);\n  }\n\n  _nextButtonClick(e: UI5CustomEvent<UDExButton, \"click\">) {\n    if (this.isNextButtonDisabled) {\n      return;\n    }\n\n    this._carousel?._navButtonClick(e as unknown as UI5CustomEvent<Icon, \"click\">);\n  }\n\n  _onkeydown(e: KeyboardEvent) {\n    if (isLeft(e) || isDown(e) || isRight(e) || isUp(e)) {\n      this._calculateDisabledButtonsState();\n    }\n  }\n\n  _handleNavigate(): void {\n    this._calculateDisabledButtonsState();\n  }\n\n  onAfterRendering() {\n    redirectAttributes(this, \"carousel\");\n\n    this._calculateDisabledButtonsState();\n  }\n}\n\nUDExCarousel.define();\n\nexport default UDExCarousel;\n"]}

package/dist/CarouselTemplate.js

@@ -6,7 +6,7 @@ import CarouselArrowsPlacement from "@ui5/webcomponents/dist/types/CarouselArrow
 import slimArrowLeft from "@ui5/webcomponents-icons/dist/slim-arrow-left.js";
 import slimArrowRight from "@ui5/webcomponents-icons/dist/slim-arrow-right.js";
 export default function CarouselTemplate() {
-    return (_jsxs("div", { className: this.carouselClass, onKeyDown: this._onkeydown, children: [this.showNavigationButtons.top && navigation.call(this), _jsx(UI5Carousel, { itemsPerPage: this.itemsPerPage, pageIndicatorType: this.pageIndicatorType, id: "carousel", hideNavigationArrows: true, arrowsPlacement: CarouselArrowsPlacement.Navigation, accessibleName: this.accessibleName, hidePageIndicator: this._hidePageIndicator, children: this.items.map(item => _jsx("slot", { name: item._individualSlot })) }), this.showNavigationButtons.bottom && navigation.call(this)] }));
+    return (_jsxs("div", { className: this.carouselClass, onKeyDown: this._onkeydown, children: [this.showNavigationButtons.top && navigation.call(this), _jsx(UI5Carousel, { itemsPerPage: this.itemsPerPage, pageIndicatorType: this.pageIndicatorType, id: "carousel", hideNavigationArrows: true, arrowsPlacement: CarouselArrowsPlacement.Navigation, accessibleName: this.accessibleName, hidePageIndicator: this._hidePageIndicator, onNavigate: this._handleNavigate, children: this.items.map(item => _jsx("slot", { name: item._individualSlot })) }), this.showNavigationButtons.bottom && navigation.call(this)] }));
 }
 function navigation() {
     const btnClassName = "udex-carousel__navigation-button";

package/dist/CarouselTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselTemplate.js","sourceRoot":"","sources":["../src/CarouselTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,WAAW,MAAM,qCAAqC,CAAC;AAC9D,OAAO,UAAU,MAAM,aAAa,CAAC;AACrC,OAAO,cAAc,MAAM,uBAAuB,CAAC;AAEnD,OAAO,uBAAuB,MAAM,0DAA0D,CAAC;AAC/F,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,cAAc,MAAM,mDAAmD,CAAC;AAE/E,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACtC,OAAO,CACL,eAAK,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,UAAU,aAC3D,IAAI,CAAC,qBAAqB,CAAC,GAAG,IAAI,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EACxD,KAAC,WAAW,IACV,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,EAAE,EAAC,UAAU,EACb,oBAAoB,QACpB,eAAe,EAAE,uBAAuB,CAAC,UAAU,EACnD,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,kBAAkB,YACzC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACrB,eAAM,IAAI,EAAG,IAAqB,CAAC,eAAe,GAAS,CAC5D,GACW,EACb,IAAI,CAAC,qBAAqB,CAAC,MAAM,IAAI,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IACvD,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU;IACjB,MAAM,YAAY,GAAG,kCAAkC,CAAC;IAExD,OAAO,CACL,eAAK,KAAK,EAAC,mCAAmC,EAAC,IAAI,EAAC,YAAY,aAC9D,KAAC,UAAU,iCAET,IAAI,EAAE,cAAc,CAAC,KAAK,EAC1B,QAAQ,EAAE,IAAI,CAAC,oBAAoB,EACnC,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE,aAAa,EACnB,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,aAAa,GACP,EACb,KAAC,UAAU,oCAET,IAAI,EAAE,cAAc,CAAC,KAAK,EAC1B,QAAQ,EAAE,IAAI,CAAC,oBAAoB,EACnC,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,aAAa,GACP,IACT,CACP,CAAC;AACJ,CAAC","sourcesContent":["import type Carousel from \"./Carousel.js\";\nimport UI5Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport UDExButton from \"./Button.js\";\nimport UDExButtonSize from \"./types/ButtonSize.js\";\nimport type SlottedChild from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport CarouselArrowsPlacement from \"@ui5/webcomponents/dist/types/CarouselArrowsPlacement.js\";\nimport slimArrowLeft from \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport slimArrowRight from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\n\nexport default function CarouselTemplate(this: Carousel) {\n  return (\n    <div className={this.carouselClass} onKeyDown={this._onkeydown}>\n      {this.showNavigationButtons.top && navigation.call(this)}\n      <UI5Carousel\n        itemsPerPage={this.itemsPerPage}\n        pageIndicatorType={this.pageIndicatorType}\n        id=\"carousel\"\n        hideNavigationArrows\n        arrowsPlacement={CarouselArrowsPlacement.Navigation}\n        accessibleName={this.accessibleName}\n        hidePageIndicator={this._hidePageIndicator}>\n        {this.items.map(item =>\n          <slot name={(item as SlottedChild)._individualSlot}></slot>\n        )}\n      </UI5Carousel>\n      {this.showNavigationButtons.bottom && navigation.call(this)}\n    </div>\n  );\n}\n\nfunction navigation(this: Carousel) {\n  const btnClassName = \"udex-carousel__navigation-button\";\n\n  return (\n    <div class=\"udex-carousel__navigation-wrapper\" part=\"navigation\">\n      <UDExButton\n        data-ui5-arrow-back\n        size={UDExButtonSize.Large}\n        disabled={this.isPrevButtonDisabled}\n        class={btnClassName}\n        icon={slimArrowLeft}\n        design={this.buttonDesign}\n        tooltip={this.previousPageText}\n        onClick={this._prevButtonClick}\n        part=\"prev-button\">\n      </UDExButton>\n      <UDExButton\n        data-ui5-arrow-forward\n        size={UDExButtonSize.Large}\n        disabled={this.isNextButtonDisabled}\n        class={btnClassName}\n        icon={slimArrowRight}\n        design={this.buttonDesign}\n        tooltip={this.nextPageText}\n        onClick={this._nextButtonClick}\n        part=\"next-button\">\n      </UDExButton>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"CarouselTemplate.js","sourceRoot":"","sources":["../src/CarouselTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,WAAW,MAAM,qCAAqC,CAAC;AAC9D,OAAO,UAAU,MAAM,aAAa,CAAC;AACrC,OAAO,cAAc,MAAM,uBAAuB,CAAC;AAEnD,OAAO,uBAAuB,MAAM,0DAA0D,CAAC;AAC/F,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,cAAc,MAAM,mDAAmD,CAAC;AAE/E,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACtC,OAAO,CACL,eAAK,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,UAAU,aAC3D,IAAI,CAAC,qBAAqB,CAAC,GAAG,IAAI,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EACxD,KAAC,WAAW,IACV,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,EAAE,EAAC,UAAU,EACb,oBAAoB,QACpB,eAAe,EAAE,uBAAuB,CAAC,UAAU,EACnD,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,kBAAkB,EAC1C,UAAU,EAAE,IAAI,CAAC,eAAe,YAC/B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACrB,eAAM,IAAI,EAAG,IAAqB,CAAC,eAAe,GAAS,CAC5D,GACW,EACb,IAAI,CAAC,qBAAqB,CAAC,MAAM,IAAI,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IACvD,CACP,CAAC;AACJ,CAAC;AAED,SAAS,UAAU;IACjB,MAAM,YAAY,GAAG,kCAAkC,CAAC;IAExD,OAAO,CACL,eAAK,KAAK,EAAC,mCAAmC,EAAC,IAAI,EAAC,YAAY,aAC9D,KAAC,UAAU,iCAET,IAAI,EAAE,cAAc,CAAC,KAAK,EAC1B,QAAQ,EAAE,IAAI,CAAC,oBAAoB,EACnC,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE,aAAa,EACnB,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,aAAa,GACP,EACb,KAAC,UAAU,oCAET,IAAI,EAAE,cAAc,CAAC,KAAK,EAC1B,QAAQ,EAAE,IAAI,CAAC,oBAAoB,EACnC,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE,cAAc,EACpB,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,aAAa,GACP,IACT,CACP,CAAC;AACJ,CAAC","sourcesContent":["import type Carousel from \"./Carousel.js\";\nimport UI5Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport UDExButton from \"./Button.js\";\nimport UDExButtonSize from \"./types/ButtonSize.js\";\nimport type SlottedChild from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport CarouselArrowsPlacement from \"@ui5/webcomponents/dist/types/CarouselArrowsPlacement.js\";\nimport slimArrowLeft from \"@ui5/webcomponents-icons/dist/slim-arrow-left.js\";\nimport slimArrowRight from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\n\nexport default function CarouselTemplate(this: Carousel) {\n  return (\n    <div className={this.carouselClass} onKeyDown={this._onkeydown}>\n      {this.showNavigationButtons.top && navigation.call(this)}\n      <UI5Carousel\n        itemsPerPage={this.itemsPerPage}\n        pageIndicatorType={this.pageIndicatorType}\n        id=\"carousel\"\n        hideNavigationArrows\n        arrowsPlacement={CarouselArrowsPlacement.Navigation}\n        accessibleName={this.accessibleName}\n        hidePageIndicator={this._hidePageIndicator}\n        onNavigate={this._handleNavigate}>\n        {this.items.map(item =>\n          <slot name={(item as SlottedChild)._individualSlot}></slot>\n        )}\n      </UI5Carousel>\n      {this.showNavigationButtons.bottom && navigation.call(this)}\n    </div>\n  );\n}\n\nfunction navigation(this: Carousel) {\n  const btnClassName = \"udex-carousel__navigation-button\";\n\n  return (\n    <div class=\"udex-carousel__navigation-wrapper\" part=\"navigation\">\n      <UDExButton\n        data-ui5-arrow-back\n        size={UDExButtonSize.Large}\n        disabled={this.isPrevButtonDisabled}\n        class={btnClassName}\n        icon={slimArrowLeft}\n        design={this.buttonDesign}\n        tooltip={this.previousPageText}\n        onClick={this._prevButtonClick}\n        part=\"prev-button\">\n      </UDExButton>\n      <UDExButton\n        data-ui5-arrow-forward\n        size={UDExButtonSize.Large}\n        disabled={this.isNextButtonDisabled}\n        class={btnClassName}\n        icon={slimArrowRight}\n        design={this.buttonDesign}\n        tooltip={this.nextPageText}\n        onClick={this._nextButtonClick}\n        part=\"next-button\">\n      </UDExButton>\n    </div>\n  );\n}\n"]}

package/dist/Checkbox.js

@@ -15,6 +15,7 @@ import { VALUE_STATE_ERROR, VALUE_STATE_SUCCESS } from "./generated/i18n/i18n-de
 import UDExCheckboxValueState from "./types/Checkbox.js";
 import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import WrappingType from "@ui5/webcomponents/dist/types/WrappingType.js";
+import translate from "./utils/translate.js";
 // Styles
 import CheckboxCss from "./generated/themes/Checkbox.css.js";
 const LABEL_TEXT_HEIGHT = 18.5;
@@ -70,8 +71,8 @@ let UDExCheckbox = UDExCheckbox_1 = class UDExCheckbox extends CheckBox {
     }
     valueStateMappings() {
         return {
-            [UDExCheckboxValueState.Error]: UDExCheckbox_1.i18nBundle.getText(VALUE_STATE_ERROR),
-            [UDExCheckboxValueState.Success]: UDExCheckbox_1.i18nBundle.getText(VALUE_STATE_SUCCESS),
+            [UDExCheckboxValueState.Error]: translate(UDExCheckbox_1, VALUE_STATE_ERROR),
+            [UDExCheckboxValueState.Success]: translate(UDExCheckbox_1, VALUE_STATE_SUCCESS),
         };
     }
     _handleResize() {

package/dist/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport CheckBox from \"@ui5/webcomponents/dist/CheckBox.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { VALUE_STATE_ERROR, VALUE_STATE_SUCCESS } from \"./generated/i18n/i18n-defaults.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport UDExCheckboxValueState from \"./types/Checkbox.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport type Label from \"@ui5/webcomponents/dist/Label.js\";\n\n// Styles\nimport CheckboxCss from \"./generated/themes/Checkbox.css.js\";\n\nconst LABEL_TEXT_HEIGHT = 18.5;\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-checkbox</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Checkbox.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends CheckBox\n * @tagname udex-checkbox\n * @public\n */\n@customElement({\n  tag: \"udex-checkbox\",\n  renderer: jsxRenderer,\n  styles: [CheckBox.styles, CheckboxCss],\n})\n\nclass UDExCheckbox extends CheckBox {\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"None\"\n   * @public\n   */\n  @property()\n  /** @ts-expect-error */\n    valueState: `${UDExCheckboxValueState}` = UDExCheckboxValueState.None;\n\n  /**\n   * Defines whether the component text wraps when there is not enough space..\n   *\n   * @default \"None\"\n   * @public\n   */\n  @property()\n    wrappingType: `${WrappingType}` = WrappingType.None;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  _handleResizeBound: ResizeObserverCallback;\n\n  constructor() {\n    super();\n    this._handleResizeBound = this._handleResize.bind(this);\n  }\n\n  onEnterDOM(): void {\n    ResizeHandler.register(this, this._handleResizeBound);\n    if (isDesktop()) {\n      this.setAttribute(\"desktop\", \"\");\n    }\n  }\n\n  onAfterRendering() {\n    this.shadowRoot?.querySelector(\".ui5-checkbox-label\")?.removeAttribute(\"required\");\n  }\n\n  onExitDOM(): void {\n    ResizeHandler.deregister(this, this._handleResizeBound);\n  }\n\n  valueStateMappings(): Record<string, string> {\n    return {\n      [UDExCheckboxValueState.Error]: UDExCheckbox.i18nBundle.getText(VALUE_STATE_ERROR),\n      [UDExCheckboxValueState.Success]: UDExCheckbox.i18nBundle.getText(VALUE_STATE_SUCCESS),\n    };\n  }\n\n  _handleResize(): void {\n    const labelOverflows = this.labelHeight > LABEL_TEXT_HEIGHT;\n\n    if (labelOverflows && this.wrappingType === WrappingType.Normal) {\n      this.label?.classList.add(\"udex-checkbox__label-multiline\");\n    } else {\n      this.label?.classList.remove(\"udex-checkbox__label-multiline\");\n    }\n  }\n\n  get valueStateText(): string | undefined {\n    if (this.valueState !== UDExCheckboxValueState.None) {\n      return this.valueStateMappings()[this.valueState];\n    }\n  }\n\n  get label(): Label | null {\n    return this.shadowRoot!.querySelector<Label>(\"[ui5-label]\");\n  }\n\n  get labelHeight(): number {\n    return this.label?.getBoundingClientRect().height || 0;\n  }\n}\n\nUDExCheckbox.define();\n\nexport default UDExCheckbox;\n"]}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport CheckBox from \"@ui5/webcomponents/dist/CheckBox.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { VALUE_STATE_ERROR, VALUE_STATE_SUCCESS } from \"./generated/i18n/i18n-defaults.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport UDExCheckboxValueState from \"./types/Checkbox.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport WrappingType from \"@ui5/webcomponents/dist/types/WrappingType.js\";\nimport type Label from \"@ui5/webcomponents/dist/Label.js\";\nimport translate from \"./utils/translate.js\";\n\n// Styles\nimport CheckboxCss from \"./generated/themes/Checkbox.css.js\";\n\nconst LABEL_TEXT_HEIGHT = 18.5;\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-checkbox</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Checkbox.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends CheckBox\n * @tagname udex-checkbox\n * @public\n */\n@customElement({\n  tag: \"udex-checkbox\",\n  renderer: jsxRenderer,\n  styles: [CheckBox.styles, CheckboxCss],\n})\n\nclass UDExCheckbox extends CheckBox {\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"None\"\n   * @public\n   */\n  @property()\n  /** @ts-expect-error */\n    valueState: `${UDExCheckboxValueState}` = UDExCheckboxValueState.None;\n\n  /**\n   * Defines whether the component text wraps when there is not enough space..\n   *\n   * @default \"None\"\n   * @public\n   */\n  @property()\n    wrappingType: `${WrappingType}` = WrappingType.None;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  _handleResizeBound: ResizeObserverCallback;\n\n  constructor() {\n    super();\n    this._handleResizeBound = this._handleResize.bind(this);\n  }\n\n  onEnterDOM(): void {\n    ResizeHandler.register(this, this._handleResizeBound);\n    if (isDesktop()) {\n      this.setAttribute(\"desktop\", \"\");\n    }\n  }\n\n  onAfterRendering() {\n    this.shadowRoot?.querySelector(\".ui5-checkbox-label\")?.removeAttribute(\"required\");\n  }\n\n  onExitDOM(): void {\n    ResizeHandler.deregister(this, this._handleResizeBound);\n  }\n\n  valueStateMappings(): Record<string, string> {\n    return {\n      [UDExCheckboxValueState.Error]: translate(UDExCheckbox, VALUE_STATE_ERROR),\n      [UDExCheckboxValueState.Success]: translate(UDExCheckbox, VALUE_STATE_SUCCESS),\n    };\n  }\n\n  _handleResize(): void {\n    const labelOverflows = this.labelHeight > LABEL_TEXT_HEIGHT;\n\n    if (labelOverflows && this.wrappingType === WrappingType.Normal) {\n      this.label?.classList.add(\"udex-checkbox__label-multiline\");\n    } else {\n      this.label?.classList.remove(\"udex-checkbox__label-multiline\");\n    }\n  }\n\n  get valueStateText(): string | undefined {\n    if (this.valueState !== UDExCheckboxValueState.None) {\n      return this.valueStateMappings()[this.valueState];\n    }\n  }\n\n  get label(): Label | null {\n    return this.shadowRoot!.querySelector<Label>(\"[ui5-label]\");\n  }\n\n  get labelHeight(): number {\n    return this.label?.getBoundingClientRect().height || 0;\n  }\n}\n\nUDExCheckbox.define();\n\nexport default UDExCheckbox;\n"]}

package/dist/Contact.js

@@ -14,6 +14,7 @@ import ContactTemplate from "./ContactTemplate.js";
 import parseArrayFromString from "./utils/parseArrayFromString.js";
 import { LOCAL_COUNTRY_NAMES, COMPLETE_LIST_OF, CALL_US_TODAY, CONTACT_US, } from "./generated/i18n/i18n-defaults.js";
 import i18n from "@ui5/webcomponents-base/decorators/i18n.js";
+import translate from "./utils/translate.js";
 // Styles
 import ContactCss from "./generated/themes/Contact.css.js";
 import { BreakpointUtils } from "./utils/Breakpoints.js";
@@ -94,16 +95,16 @@ let UDExContact = UDExContact_1 = class UDExContact extends UI5Element {
         return this.shadowRoot.querySelector(".udex-contact__popover");
     }
     get _completeListTitle() {
-        return `${UDExContact_1.i18nBundle.getText(COMPLETE_LIST_OF)} `;
+        return `${translate(UDExContact_1, COMPLETE_LIST_OF)} `;
     }
     get _localCountryTitle() {
-        return UDExContact_1.i18nBundle.getText(LOCAL_COUNTRY_NAMES);
+        return translate(UDExContact_1, LOCAL_COUNTRY_NAMES);
     }
     get _numbersTitle() {
-        return UDExContact_1.i18nBundle.getText(CALL_US_TODAY);
+        return translate(UDExContact_1, CALL_US_TODAY);
     }
     get _contactUsTitle() {
-        return UDExContact_1.i18nBundle.getText(CONTACT_US);
+        return translate(UDExContact_1, CONTACT_US);
     }
     get _hasNumbersList() {
         return this._contactNumbersArray.length > 0;

package/dist/Contact.js.map

@@ -1 +1 @@
-{"version":3,"file":"Contact.js","sourceRoot":"","sources":["../src/Contact.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport ContactTemplate from \"./ContactTemplate.js\";\nimport type UDExContactItem from \"./ContactItem.js\";\nimport type UI5ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport parseArrayFromString from \"./utils/parseArrayFromString.js\";\nimport {\n  LOCAL_COUNTRY_NAMES, COMPLETE_LIST_OF, CALL_US_TODAY, CONTACT_US,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport i18n from \"@ui5/webcomponents-base/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/i18nBundle.js\";\n\n// Styles\nimport ContactCss from \"./generated/themes/Contact.css.js\";\nimport { BreakpointUtils } from \"./utils/Breakpoints.js\";\n\nexport type ContactNumber = {\n  number: string;\n  country: string;\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-contact</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Contact.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-contact\n * @public\n */\n@customElement({\n  tag: \"udex-contact\",\n  renderer: jsxRenderer,\n  styles: ContactCss,\n  template: ContactTemplate,\n})\n\nclass UDExContact extends UI5Element {\n  /**\n   * Defines the <code>text</code> for the contact button.\n   *\n   * @public\n   */\n  @property({ type: String })\n    buttonText!: string;\n\n  /**\n   * List of the contact numbers\n   *\n   * @default \"[]\"\n   * @public\n   */\n  @property({ type: String })\n    contactNumbers: string = \"\";\n\n  /**\n   * Defines the local country numbers link's href\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    localCountryNumbersLink: string = \"\";\n\n  /**\n   * Defines if the initial focus should be prevented.\n   * @public\n   */\n  @property({ type: Boolean })\n    preventInitialFocus!: boolean;\n\n  /**\n   * Defines if the focus should be returned to the previously focused element.\n   * @public\n   */\n  @property({ type: Boolean })\n    preventFocusRestore!: boolean;\n\n  /**\n   * Defines the accessible name of the component.\n   * @default undefined\n   * @public\n   */\n  @property({ type: String })\n    accessibleName?: string;\n\n  /**\n   * Defines the IDs of the elements that label the component.\n   * @default undefined\n   * @public\n   */\n  @property({ type: String })\n    accessibleNameRef?: string;\n\n  /**\n   * Slot for list items.\n   *\n   * @slot items\n   * @public\n   */\n  @slot({ type: HTMLElement, \"default\": true })\n    items!: Array<UDExContactItem>;\n\n  /**\n   * Defines the mobile mode for component\n   *\n   * @private\n   */\n  @property({ type: Boolean })\n    _isMobileMode: boolean = BreakpointUtils.isAtMost(\"M\");\n\n  _screenResizeHandler: () => void;\n  _screenResizeHandlerAttached?: boolean;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  constructor() {\n    super();\n    this._screenResizeHandler = this._screenResize.bind(this);\n  }\n\n  onEnterDOM() {\n    this._attachScreenResizeHandler();\n  }\n\n  onExitDOM() {\n    this._detachScreenResizeHandler();\n  }\n\n  _openPopover(): void {\n    this._responsivePopover.open = !this._responsivePopover.open;\n  }\n\n  _closePopover(): void {\n    this._responsivePopover.open = false;\n  }\n\n  _screenResize(): void {\n    this._isMobileMode = BreakpointUtils.isAtMost(\"M\");\n  }\n\n  _attachScreenResizeHandler(): void {\n    if (!this._screenResizeHandlerAttached) {\n      window.addEventListener(\"resize\", this._screenResizeHandler);\n      this._screenResizeHandlerAttached = true;\n    }\n  }\n\n  _detachScreenResizeHandler(): void {\n    if (this._screenResizeHandlerAttached) {\n      window.removeEventListener(\"resize\", this._screenResizeHandler);\n      this._screenResizeHandlerAttached = false;\n    }\n  }\n\n  get _contactNumbersArray(): ContactNumber[] {\n    return parseArrayFromString<ContactNumber>(this.contactNumbers);\n  }\n\n  get _responsivePopover(): UI5ResponsivePopover {\n    return this.shadowRoot!.querySelector<UI5ResponsivePopover>(\".udex-contact__popover\")!;\n  }\n\n  get _completeListTitle(): string {\n    return `${UDExContact.i18nBundle.getText(COMPLETE_LIST_OF)} `;\n  }\n\n  get _localCountryTitle(): string {\n    return UDExContact.i18nBundle.getText(LOCAL_COUNTRY_NAMES);\n  }\n\n  get _numbersTitle(): string {\n    return UDExContact.i18nBundle.getText(CALL_US_TODAY);\n  }\n\n  get _contactUsTitle(): string {\n    return UDExContact.i18nBundle.getText(CONTACT_US);\n  }\n\n  get _hasNumbersList(): boolean {\n    return this._contactNumbersArray.length > 0;\n  }\n}\n\nUDExContact.define();\n\nexport default UDExContact;\n"]}
+{"version":3,"file":"Contact.js","sourceRoot":"","sources":["../src/Contact.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport ContactTemplate from \"./ContactTemplate.js\";\nimport type UDExContactItem from \"./ContactItem.js\";\nimport type UI5ResponsivePopover from \"@ui5/webcomponents/dist/ResponsivePopover.js\";\nimport parseArrayFromString from \"./utils/parseArrayFromString.js\";\nimport {\n  LOCAL_COUNTRY_NAMES, COMPLETE_LIST_OF, CALL_US_TODAY, CONTACT_US,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport i18n from \"@ui5/webcomponents-base/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/i18nBundle.js\";\nimport translate from \"./utils/translate.js\";\n\n// Styles\nimport ContactCss from \"./generated/themes/Contact.css.js\";\nimport { BreakpointUtils } from \"./utils/Breakpoints.js\";\n\nexport type ContactNumber = {\n  number: string;\n  country: string;\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-contact</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Contact.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-contact\n * @public\n */\n@customElement({\n  tag: \"udex-contact\",\n  renderer: jsxRenderer,\n  styles: ContactCss,\n  template: ContactTemplate,\n})\n\nclass UDExContact extends UI5Element {\n  /**\n   * Defines the <code>text</code> for the contact button.\n   *\n   * @public\n   */\n  @property({ type: String })\n    buttonText!: string;\n\n  /**\n   * List of the contact numbers\n   *\n   * @default \"[]\"\n   * @public\n   */\n  @property({ type: String })\n    contactNumbers: string = \"\";\n\n  /**\n   * Defines the local country numbers link's href\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    localCountryNumbersLink: string = \"\";\n\n  /**\n   * Defines if the initial focus should be prevented.\n   * @public\n   */\n  @property({ type: Boolean })\n    preventInitialFocus!: boolean;\n\n  /**\n   * Defines if the focus should be returned to the previously focused element.\n   * @public\n   */\n  @property({ type: Boolean })\n    preventFocusRestore!: boolean;\n\n  /**\n   * Defines the accessible name of the component.\n   * @default undefined\n   * @public\n   */\n  @property({ type: String })\n    accessibleName?: string;\n\n  /**\n   * Defines the IDs of the elements that label the component.\n   * @default undefined\n   * @public\n   */\n  @property({ type: String })\n    accessibleNameRef?: string;\n\n  /**\n   * Slot for list items.\n   *\n   * @slot items\n   * @public\n   */\n  @slot({ type: HTMLElement, \"default\": true })\n    items!: Array<UDExContactItem>;\n\n  /**\n   * Defines the mobile mode for component\n   *\n   * @private\n   */\n  @property({ type: Boolean })\n    _isMobileMode: boolean = BreakpointUtils.isAtMost(\"M\");\n\n  _screenResizeHandler: () => void;\n  _screenResizeHandlerAttached?: boolean;\n\n  @i18n(\"@sapudex/web-components\")\n  static i18nBundle: I18nBundle;\n\n  constructor() {\n    super();\n    this._screenResizeHandler = this._screenResize.bind(this);\n  }\n\n  onEnterDOM() {\n    this._attachScreenResizeHandler();\n  }\n\n  onExitDOM() {\n    this._detachScreenResizeHandler();\n  }\n\n  _openPopover(): void {\n    this._responsivePopover.open = !this._responsivePopover.open;\n  }\n\n  _closePopover(): void {\n    this._responsivePopover.open = false;\n  }\n\n  _screenResize(): void {\n    this._isMobileMode = BreakpointUtils.isAtMost(\"M\");\n  }\n\n  _attachScreenResizeHandler(): void {\n    if (!this._screenResizeHandlerAttached) {\n      window.addEventListener(\"resize\", this._screenResizeHandler);\n      this._screenResizeHandlerAttached = true;\n    }\n  }\n\n  _detachScreenResizeHandler(): void {\n    if (this._screenResizeHandlerAttached) {\n      window.removeEventListener(\"resize\", this._screenResizeHandler);\n      this._screenResizeHandlerAttached = false;\n    }\n  }\n\n  get _contactNumbersArray(): ContactNumber[] {\n    return parseArrayFromString<ContactNumber>(this.contactNumbers);\n  }\n\n  get _responsivePopover(): UI5ResponsivePopover {\n    return this.shadowRoot!.querySelector<UI5ResponsivePopover>(\".udex-contact__popover\")!;\n  }\n\n  get _completeListTitle(): string {\n    return `${translate(UDExContact, COMPLETE_LIST_OF)} `;\n  }\n\n  get _localCountryTitle(): string {\n    return translate(UDExContact, LOCAL_COUNTRY_NAMES);\n  }\n\n  get _numbersTitle(): string {\n    return translate(UDExContact, CALL_US_TODAY);\n  }\n\n  get _contactUsTitle(): string {\n    return translate(UDExContact, CONTACT_US);\n  }\n\n  get _hasNumbersList(): boolean {\n    return this._contactNumbersArray.length > 0;\n  }\n}\n\nUDExContact.define();\n\nexport default UDExContact;\n"]}

package/dist/CountrySelector.d.ts

@@ -19,7 +19,7 @@ type UDExCountrySelectorChangeSearchEventDetail = {
  * <code>import "@sapudex/web-components/dist/CountrySelector.js";</code>
  *
  * @constructor
- * @extends UDExSearchableListBase
+ * @extends UDExSelectBase
  * @tagname udex-country-selector
  * @public
  */

package/dist/CountrySelector.js

@@ -39,7 +39,7 @@ import getEffectiveScrollbarStyle from "./utils/getEffectiveScrollbarStyle.js";
  * <code>import "@sapudex/web-components/dist/CountrySelector.js";</code>
  *
  * @constructor
- * @extends UDExSearchableListBase
+ * @extends UDExSelectBase
  * @tagname udex-country-selector
  * @public
  */

package/dist/CountrySelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"CountrySelector.js","sourceRoot":"","sources":["../src/CountrySelector.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport UI5Button from \"@ui5/webcomponents/dist/Button.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-down-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-up-arrow.js\";\nimport type { Country } from \"./data/CountryListISO3166.js\";\nimport { CountryListDB } from \"./data/CountryListISO3166.js\";\nimport UDExSearch from \"./Search.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExList from \"./List.js\";\nimport UDExSelectBase from \"./SelectBase.js\";\nimport UDExListItem from \"./ListItem.js\";\nimport UDExTextField from \"./TextField.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\nimport SelectBoxTemplate from \"./generated/templates/SelectBoxTemplate.lit.js\";\n\n// Styles\nimport CountrySelectorCss from \"./generated/themes/CountrySelector.css.js\";\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\nimport SelectBaseCss from \"./generated/themes/SelectBase.css.js\";\nimport SearchableListCss from \"./generated/themes/SearchableList.css.js\";\nimport getEffectiveScrollbarStyle from \"./utils/getEffectiveScrollbarStyle.js\";\n\ntype UDExCountrySelectorChangeSearchEventDetail = {\n  value: string,\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-country-selector</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/CountrySelector.js\";</code>\n *\n * @constructor\n * @extends UDExSearchableListBase\n * @tagname udex-country-selector\n * @public\n */\n@customElement({\n  tag: \"udex-country-selector\",\n  renderer: litRender,\n  styles: [\n    TextFieldCss,\n    SelectBaseCss,\n    CountrySelectorCss,\n    SearchableListCss,\n    getEffectiveScrollbarStyle(),\n  ],\n  template: SelectBoxTemplate,\n  dependencies: [\n    UI5Button,\n    UDExList,\n    UDExSearch,\n    UDExListItem,\n    UDExDropdown,\n    UDExTextField,\n    UDExStatusMessage,\n  ],\n})\n\nclass UDExCountrySelector extends UDExSelectBase {\n  /**\n   * Allows to define the initially preselected country.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    preselectedCountry!: string;\n\n  /**\n   * Allows to define the list of blocked country.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    blockedCountryCodes?: string;\n\n  /**\n   * Allows to hide the flag images in the country selector.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    hideFlagImages?: boolean;\n\n  /**\n   * Indicates whether the country selector is enabled.\n   *\n   * @default true\n   * @private\n   */\n  @property({ type: Boolean })\n    _countrySelector: boolean = true;\n\n  _countryList: Country[] = CountryListDB;\n  _selectedCountry!: Country | undefined;\n\n  onAfterRendering(): void {\n    super.onAfterRendering();\n    this.handleOutsideClick();\n  }\n\n  onBeforeRendering(): void {\n    super.onBeforeRendering();\n    this.filterBlockedCountries();\n    this.setPreselectedCountry();\n    this.prepareCountrySelectorItems();\n  }\n\n  handleItemPress(e: CustomEvent): void {\n    this.handleItemSelection(e);\n    this.selectCountryByElement(e.target as HTMLElement);\n  }\n\n  handleInputFocusIn(): void {\n    this.inputFocusIn();\n  }\n\n  handleInputFocusOut(e: FocusEvent): void {\n    const relatedTarget = e.relatedTarget as HTMLElement;\n    const isInsideComponent = relatedTarget?.closest(`.${this._rootClass}`);\n\n    if (!isInsideComponent) {\n      this.closeDropdown();\n      this.resetSearchState();\n      this.updateImagePosition();\n    }\n\n    this._focused = false;\n  }\n\n  handleKeyDownSearch(e: KeyboardEvent): void {\n    this.onKeyDownSearch(e);\n  }\n\n  handleDropdownBeforeOpen(): void {\n    this.dropdownBeforeOpen();\n  }\n\n  handleDropdownClose(): void {\n    this._open = false;\n    this.fireEventDropdownClose();\n  }\n\n  handleOutsideClick(): void {\n    document.addEventListener(\"click\", (e: Event) => {\n      if (e.target !== this) {\n        this._open = this._popover.open;\n      }\n    });\n  }\n\n  updateImagePosition(): void {\n    const imagePlaceholder = this.shadowRoot!.querySelector<HTMLElement>(\".udex-text-field__input > .udex-text-field__image\");\n    if (imagePlaceholder) {\n      imagePlaceholder.style.backgroundPosition = this.selectedCountryFlagX || \"\";\n    }\n  }\n\n  filterBlockedCountries(): void {\n    if (this.blockedCountryCodes?.length) {\n      const blockedCountryCodesArray = this.blockedCountryCodes.split(\",\").map(code => code.trim().toUpperCase());\n      this._countryList = this._countryList.filter(country => !blockedCountryCodesArray.includes(country.iso.toUpperCase()));\n    }\n  }\n\n  setPreselectedCountry(): void {\n    if (!this._selectedCountry && this.preselectedCountry) {\n      const preselectedISO = this.preselectedCountry.toUpperCase();\n      this._selectedCountry = this._countryList.find(({ iso }) => iso.toUpperCase() === preselectedISO);\n    }\n  }\n\n  selectCountryByElement(el: HTMLElement): void {\n    const tokenId = el?.getAttribute(\"data-token-id\") || \"\";\n    const itemObj = this.getItemFromList(tokenId);\n    this._selectedCountry = this._countryList.find(country => country.iso === itemObj?._id);\n    this._selectedOption = this.selectedCountryName || \"\";\n  }\n\n  prepareCountrySelectorItems(): void {\n    this.items.length = 0;\n    this._countryList.forEach(country => {\n      const selected = country.iso.toUpperCase() === this._selectedCountry?.iso.toUpperCase();\n      this.items.push({\n        label: this.getCountryLabel(country.countryName, country.localName),\n        innerHTML: this.getItemTemplate(country),\n        selected,\n        _id: country.iso.toUpperCase(),\n      } as UDExListItem);\n    });\n  }\n\n  getItemTemplate(country: Country) :string | undefined {\n    return this.hideFlagImages ? undefined : `<span class=\"udex-text-field__image\" style=\"background-position:${country.flagX}\">`;\n  }\n\n  getCountryLabel(countryName?: string, localName?: string): string | null {\n    return localName ? `${countryName} (${localName})` : countryName || null;\n  }\n\n  get selectedCountryName(): string | null {\n    return this._selectedCountry ? this.getCountryLabel(this._selectedCountry.countryName, this._selectedCountry.localName) : \"\";\n  }\n\n  get flagAriaLabel(): string {\n    return this.getCountryLabel(this._selectedCountry?.countryName, this._selectedCountry?.localName) || \"None\";\n  }\n\n  get selectedCountryFlagX(): string | undefined {\n    return this._selectedCountry?.flagX;\n  }\n\n  get selectedCountryFlagY(): string | undefined {\n    return this._selectedCountry?.flagY;\n  }\n\n  get showImageFlags(): boolean {\n    return true;\n  }\n}\n\nUDExCountrySelector.define();\n\nexport default UDExCountrySelector;\nexport type { UDExCountrySelectorChangeSearchEventDetail };\n"]}
+{"version":3,"file":"CountrySelector.js","sourceRoot":"","sources":["../src/CountrySelector.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport UI5Button from \"@ui5/webcomponents/dist/Button.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-down-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-up-arrow.js\";\nimport type { Country } from \"./data/CountryListISO3166.js\";\nimport { CountryListDB } from \"./data/CountryListISO3166.js\";\nimport UDExSearch from \"./Search.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExList from \"./List.js\";\nimport UDExSelectBase from \"./SelectBase.js\";\nimport UDExListItem from \"./ListItem.js\";\nimport UDExTextField from \"./TextField.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\nimport SelectBoxTemplate from \"./generated/templates/SelectBoxTemplate.lit.js\";\n\n// Styles\nimport CountrySelectorCss from \"./generated/themes/CountrySelector.css.js\";\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\nimport SelectBaseCss from \"./generated/themes/SelectBase.css.js\";\nimport SearchableListCss from \"./generated/themes/SearchableList.css.js\";\nimport getEffectiveScrollbarStyle from \"./utils/getEffectiveScrollbarStyle.js\";\n\ntype UDExCountrySelectorChangeSearchEventDetail = {\n  value: string,\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-country-selector</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/CountrySelector.js\";</code>\n *\n * @constructor\n * @extends UDExSelectBase\n * @tagname udex-country-selector\n * @public\n */\n@customElement({\n  tag: \"udex-country-selector\",\n  renderer: litRender,\n  styles: [\n    TextFieldCss,\n    SelectBaseCss,\n    CountrySelectorCss,\n    SearchableListCss,\n    getEffectiveScrollbarStyle(),\n  ],\n  template: SelectBoxTemplate,\n  dependencies: [\n    UI5Button,\n    UDExList,\n    UDExSearch,\n    UDExListItem,\n    UDExDropdown,\n    UDExTextField,\n    UDExStatusMessage,\n  ],\n})\n\nclass UDExCountrySelector extends UDExSelectBase {\n  /**\n   * Allows to define the initially preselected country.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    preselectedCountry!: string;\n\n  /**\n   * Allows to define the list of blocked country.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    blockedCountryCodes?: string;\n\n  /**\n   * Allows to hide the flag images in the country selector.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    hideFlagImages?: boolean;\n\n  /**\n   * Indicates whether the country selector is enabled.\n   *\n   * @default true\n   * @private\n   */\n  @property({ type: Boolean })\n    _countrySelector: boolean = true;\n\n  _countryList: Country[] = CountryListDB;\n  _selectedCountry!: Country | undefined;\n\n  onAfterRendering(): void {\n    super.onAfterRendering();\n    this.handleOutsideClick();\n  }\n\n  onBeforeRendering(): void {\n    super.onBeforeRendering();\n    this.filterBlockedCountries();\n    this.setPreselectedCountry();\n    this.prepareCountrySelectorItems();\n  }\n\n  handleItemPress(e: CustomEvent): void {\n    this.handleItemSelection(e);\n    this.selectCountryByElement(e.target as HTMLElement);\n  }\n\n  handleInputFocusIn(): void {\n    this.inputFocusIn();\n  }\n\n  handleInputFocusOut(e: FocusEvent): void {\n    const relatedTarget = e.relatedTarget as HTMLElement;\n    const isInsideComponent = relatedTarget?.closest(`.${this._rootClass}`);\n\n    if (!isInsideComponent) {\n      this.closeDropdown();\n      this.resetSearchState();\n      this.updateImagePosition();\n    }\n\n    this._focused = false;\n  }\n\n  handleKeyDownSearch(e: KeyboardEvent): void {\n    this.onKeyDownSearch(e);\n  }\n\n  handleDropdownBeforeOpen(): void {\n    this.dropdownBeforeOpen();\n  }\n\n  handleDropdownClose(): void {\n    this._open = false;\n    this.fireEventDropdownClose();\n  }\n\n  handleOutsideClick(): void {\n    document.addEventListener(\"click\", (e: Event) => {\n      if (e.target !== this) {\n        this._open = this._popover.open;\n      }\n    });\n  }\n\n  updateImagePosition(): void {\n    const imagePlaceholder = this.shadowRoot!.querySelector<HTMLElement>(\".udex-text-field__input > .udex-text-field__image\");\n    if (imagePlaceholder) {\n      imagePlaceholder.style.backgroundPosition = this.selectedCountryFlagX || \"\";\n    }\n  }\n\n  filterBlockedCountries(): void {\n    if (this.blockedCountryCodes?.length) {\n      const blockedCountryCodesArray = this.blockedCountryCodes.split(\",\").map(code => code.trim().toUpperCase());\n      this._countryList = this._countryList.filter(country => !blockedCountryCodesArray.includes(country.iso.toUpperCase()));\n    }\n  }\n\n  setPreselectedCountry(): void {\n    if (!this._selectedCountry && this.preselectedCountry) {\n      const preselectedISO = this.preselectedCountry.toUpperCase();\n      this._selectedCountry = this._countryList.find(({ iso }) => iso.toUpperCase() === preselectedISO);\n    }\n  }\n\n  selectCountryByElement(el: HTMLElement): void {\n    const tokenId = el?.getAttribute(\"data-token-id\") || \"\";\n    const itemObj = this.getItemFromList(tokenId);\n    this._selectedCountry = this._countryList.find(country => country.iso === itemObj?._id);\n    this._selectedOption = this.selectedCountryName || \"\";\n  }\n\n  prepareCountrySelectorItems(): void {\n    this.items.length = 0;\n    this._countryList.forEach(country => {\n      const selected = country.iso.toUpperCase() === this._selectedCountry?.iso.toUpperCase();\n      this.items.push({\n        label: this.getCountryLabel(country.countryName, country.localName),\n        innerHTML: this.getItemTemplate(country),\n        selected,\n        _id: country.iso.toUpperCase(),\n      } as UDExListItem);\n    });\n  }\n\n  getItemTemplate(country: Country) :string | undefined {\n    return this.hideFlagImages ? undefined : `<span class=\"udex-text-field__image\" style=\"background-position:${country.flagX}\">`;\n  }\n\n  getCountryLabel(countryName?: string, localName?: string): string | null {\n    return localName ? `${countryName} (${localName})` : countryName || null;\n  }\n\n  get selectedCountryName(): string | null {\n    return this._selectedCountry ? this.getCountryLabel(this._selectedCountry.countryName, this._selectedCountry.localName) : \"\";\n  }\n\n  get flagAriaLabel(): string {\n    return this.getCountryLabel(this._selectedCountry?.countryName, this._selectedCountry?.localName) || \"None\";\n  }\n\n  get selectedCountryFlagX(): string | undefined {\n    return this._selectedCountry?.flagX;\n  }\n\n  get selectedCountryFlagY(): string | undefined {\n    return this._selectedCountry?.flagY;\n  }\n\n  get showImageFlags(): boolean {\n    return true;\n  }\n}\n\nUDExCountrySelector.define();\n\nexport default UDExCountrySelector;\nexport type { UDExCountrySelectorChangeSearchEventDetail };\n"]}

package/dist/DatePicker.js

@@ -15,6 +15,7 @@ import "@ui5/webcomponents-icons/dist/appointment-2.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import { CALENDAR_ICON, DATEPICKER_DATE_DESCRIPTION } from "./generated/i18n/i18n-defaults.js";
 import UDExValueState from "./types/common.js";
+import translate from "./utils/translate.js";
 // Template
 import DatePickerTemplate from "./DatePickerTemplate.js";
 // Styles
@@ -362,10 +363,10 @@ let UDExDatePicker = UDExDatePicker_1 = class UDExDatePicker extends DateCompone
         return this._calendarSelectedDates[1] || "";
     }
     get accessibleIconName() {
-        return UDExDatePicker_1.i18nBundle.getText(CALENDAR_ICON);
+        return translate(UDExDatePicker_1, CALENDAR_ICON);
     }
     get dateAccessibleName() {
-        return this.accessibleName || UDExDatePicker_1.i18nBundle.getText(DATEPICKER_DATE_DESCRIPTION);
+        return this.accessibleName || translate(UDExDatePicker_1, DATEPICKER_DATE_DESCRIPTION);
     }
     get isRangeMode() {
         return this.selectionMode === UDExDatePickerSelectionMode.Range;