@sapudex/web-components 2.14.0 → 2.15.0

package/cypress/specs/Breadcrumbs.cy.tsx

@@ -0,0 +1,77 @@
+import { UDExBreadcrumbs, UDExBreadcrumbsItem } from "../support/component-imports.js";
+
+const breadcrumbs = <UDExBreadcrumbs id="breadcrumbs" class="udex-breadcrumbs">
+  <UDExBreadcrumbsItem
+    href="https://www.sap.com"
+    target="_blank"
+    icon="home"
+    accessible-name="Home page">
+    SAP Home
+  </UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Second Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Third Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Fourth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Fifth level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Sixth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Seventh level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Eight Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Ninth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem>Current Page</UDExBreadcrumbsItem>
+</UDExBreadcrumbs>
+
+const breadcrumbsShowItemsHigher = <UDExBreadcrumbs
+  id="breadcrumbs-show-items-higher"
+  show-items="10"
+  class="udex-breadcrumbs">
+  <UDExBreadcrumbsItem
+    href="https://www.sap.com"
+    target="_blank"
+    icon="home"
+    accessible-name="Home page">
+    SAP Home
+  </UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Second Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Third Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Fourth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Fifth level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Sixth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Seventh level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Eight Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem href="https://www.sap.com" target="_blank">Ninth Level</UDExBreadcrumbsItem>
+  <UDExBreadcrumbsItem>Current Page</UDExBreadcrumbsItem>
+</UDExBreadcrumbs>
+
+describe("Breadcrumbs", () => {
+  beforeEach(() => {
+    cy.mount(breadcrumbs);
+  });
+
+  it("tests if web component is correctly rendered", () => {
+    cy.get("#breadcrumbs").shadow().find(".ui5-breadcrumbs-root").should("be.visible");
+  });
+
+  it("tests if items that fit the container are visible", () => {
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__item--visible").should("have.length", 3);
+  });
+
+  it("tests if items that don't fit are rendered in dropdown", () => {
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__trigger").click();
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__item--hidden").should("have.length", 10);
+  });
+
+  it("tests if the dropdown is opened after clicking on arrow item", () => {
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__trigger").click();
+    cy.get("#breadcrumbs").shadow().find("[udex-dropdown]").should("have.attr", "open");
+  });
+
+  it("tests if the first arrow item is focused after pressing \"Escape\" key inside the dropdown on the first dropdown item", () => {
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__trigger").click();
+    cy.get("body").realType("{esc}");
+    cy.get("#breadcrumbs").shadow().find(".udex-breadcrumbs__trigger").should("be.focused");
+  });
+
+  it("tests if all items are rendered if showItems property is higher than number of available items", () => {
+    cy.mount(breadcrumbsShowItemsHigher);
+    cy.get("#breadcrumbs-show-items-higher").shadow().find(".udex-breadcrumbs__item--visible").should("have.length", 9);
+  });
+});

package/cypress/specs/FilterMenu.cy.tsx

@@ -124,14 +124,14 @@ const filterMenuSingleWithSearch = <>
 const filterMenuSelectAll = <>
   <span id="resultSelectAll"></span>
   <UDExFilterMenu
-  id="filter-menu-select-all"
-  mode={UDExListMode.MultiSelect}
-  filter-name="Filter Name">
-  <UDExFilterMenuSelectAll>
-    <UDExFilterMenuItem label="JavaScript" supporting-text="Frontend web development"></UDExFilterMenuItem>
-    <UDExFilterMenuItem label="Python" supporting-text="Used in data analysis"></UDExFilterMenuItem>
-  </UDExFilterMenuSelectAll>
-</UDExFilterMenu>
+    id="filter-menu-select-all"
+    mode={UDExListMode.MultiSelect}
+    filter-name="Filter Name">
+    <UDExFilterMenuSelectAll>
+      <UDExFilterMenuItem label="JavaScript" supporting-text="Frontend web development"></UDExFilterMenuItem>
+      <UDExFilterMenuItem label="Python" supporting-text="Used in data analysis"></UDExFilterMenuItem>
+    </UDExFilterMenuSelectAll>
+  </UDExFilterMenu>
 </>
 
 describe("Filter Menu component", () => {
@@ -559,45 +559,21 @@ describe("Filter Menu component", () => {
         .shadow().find("udex-list-item").should("have.text", "Select All");
     });
 
-    it("header is not selected if at least one element is selected", () => {
-      cy.get("[udex-filter-menu]").shadow().find(".udex-filter-menu__list").as("list");
-      cy.get("@list").find("udex-list-item").eq(0).shadow().find(".udex-list__item").as("firstItem");
-
-      cy.get("@firstItem").click();
-
-      cy.get("@selectAllHeader").should("not.have.attr", "selected");
-    });
-
-    it("unselect all items when user clicks on select all header", () => {
-      cy.get("[udex-filter-menu]").shadow()
-        .find("udex-list-select-all")
-        .find("udex-list-item").as("item");
-      cy.get("@item").eq(0).shadow().find(".udex-list__item").as("firstItem");
-      cy.get("@item").eq(1).shadow().find(".udex-list__item").as("secondItem");
-
-      cy.get("[udex-filter-menu]")
-        .shadow().find("udex-list-select-all")
-        .shadow().find("udex-list-item")
-        .shadow().find(".udex-list__item")
-        .as("selectAllHeader");
-
-      cy.get("@firstItem").click();
-      cy.get("@secondItem").click();
-
-      cy.get("@firstItem").should("have.attr", "data-selected", "true");
-      cy.get("@secondItem").should("have.attr", "data-selected", "true");
-      cy.get("@selectAllHeader").should("have.attr", "data-selected", "false");
-
-      cy.get("@selectAllHeader").click();
-
-      cy.get("@firstItem").should("have.attr", "data-selected", "false");
-      cy.get("@secondItem").should("have.attr", "data-selected", "false");
-    });
-
     it("select all header focus on pressed letter", () => {
       cy.realPress("p");
       cy.get("[udex-filter-menu]").shadow().find("udex-list-item").eq(1).should("have.attr", "focused");
     });
+
+    it("emit select-all when Select All header clicked", () => {
+      let selectAllEmitted = false;
+      cy.get("[udex-filter-menu]").then(menu => {
+        menu.get(0).addEventListener('ui5-select-all', function() {
+          selectAllEmitted = true;
+        });
+      });
+
+      cy.get("@selectAllHeader").click().then(() => expect(selectAllEmitted).to.be.true);
+    });
   });
 
   describe("Filter Menu focus state tests", () => {

package/cypress/specs/InputGroup.cy.tsx

@@ -0,0 +1,47 @@
+import { UDExInputGroup, UDExCheckbox } from "../support/component-imports.js";
+
+const groupOrientation = "Horizontal";
+const groupState = "Error";
+const groupText = "Error message";
+const groupName = "test-name"
+
+const simpleGroup = <UDExInputGroup></UDExInputGroup>
+const checkboxGroup = <UDExInputGroup orientation={groupOrientation} valueState={groupState} supportingText={groupText} groupName={groupName}>
+  <UDExCheckbox text="Text option 1"></UDExCheckbox>
+  <UDExCheckbox text="Text option 2"></UDExCheckbox>
+</UDExInputGroup>
+
+describe("Input Group", () => {
+  beforeEach(() => {
+    cy.mount(checkboxGroup);
+  });
+
+  it("renders input group", () => {
+    cy.get("[udex-input-group]").shadow().find(".udex-input-group__container").should("be.visible");
+  });
+
+  it("renders input group with error message", () => {
+    cy.get("[udex-input-group]").shadow().find("[udex-status-message]").should("be.visible");
+    cy.get("[udex-input-group]").shadow().find("[udex-status-message]").shadow().find(".udex-status-message").should("have.text", groupText);
+  });
+
+  it("renders input group with custom name", () => {
+    cy.get("[udex-input-group]").find("[udex-checkbox]").should("have.attr", "name", groupName);
+  });
+
+  it("renders input group with horizontal orientation", () => {
+    cy.get("[udex-input-group]").should("have.attr", "orientation", groupOrientation);
+  });
+
+  it("renders input group with proper items length", () => {
+    cy.get("[udex-input-group]").shadow().find(".udex-input-group__item").should("have.length", 2);
+  });
+
+  it("renders input group with defaults", () => {
+    cy.mount(simpleGroup)
+    cy.get("[udex-input-group]").shadow().find(".udex-input-group__container").should("exist");
+    cy.get("[udex-input-group]").shadow().find(".udex-input-group__content").should("exist");
+    cy.get("[udex-input-group]").should("have.attr", "orientation", "Vertical");
+    cy.get("[udex-input-group]").shadow().find("[udex-status-message]").should("not.exist");
+  });
+});

package/cypress/support/component-imports.instrumented.ts

@@ -57,6 +57,8 @@ import UDExQuote from "../../instrumented/Quote.js";
 import UDExMastheadProfileMenu from "../../instrumented/MastheadProfileMenu.js";
 import UDExMessageStrip from "../../instrumented/MessageStrip.js";
 import UDExHeroBanner from "../../instrumented/HeroBanner.js";
+import UDExCheckbox from "../../instrumented/Checkbox.js";
+import UDExInputGroup from "../../instrumented/InputGroup.js";
 
 export {
   UDExAccordion,
@@ -118,4 +120,6 @@ export {
   UDExMastheadProfileMenu,
   UDExMessageStrip,
   UDExHeroBanner,
+  UDExCheckbox,
+  UDExInputGroup
 };

package/cypress/support/component-imports.src.ts

@@ -57,6 +57,8 @@ import UDExQuote from "../../src/Quote.js";
 import UDExMastheadProfileMenu from "../../src/MastheadProfileMenu.js";
 import UDExMessageStrip from "../../src/MessageStrip.js";
 import UDExHeroBanner from "../../src/HeroBanner.js";
+import UDExCheckbox from "../../src/Checkbox.js";
+import UDExInputGroup from "../../src/InputGroup.js";
 
 export {
   UDExAccordion,
@@ -118,4 +120,6 @@ export {
   UDExMastheadProfileMenu,
   UDExMessageStrip,
   UDExHeroBanner,
+  UDExCheckbox,
+  UDExInputGroup
 };

package/dist/Breadcrumbs.d.ts

@@ -62,6 +62,8 @@ declare class UDExBreadcrumbs extends UI5Element {
     _responsivePopover?: UDExDropdown;
     _itemNavigation?: ItemNavigation;
     _shouldFocusFirstVisibleItem: boolean;
+    _rootClass: string;
+    constructor();
     onBeforeRendering(): void;
     onAfterRendering(): void;
     _preprocessItems(): void;

package/dist/Breadcrumbs.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var UDExBreadcrumbs_1;
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import jsxRenderer from "@ui5/webcomponents-base/renderer/JsxRenderer.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
@@ -19,7 +19,7 @@ import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import UI5BreadcrumbsCss from "@ui5/webcomponents/dist/generated/themes/Breadcrumbs.css.js";
 import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
 import "@ui5/webcomponents-icons/dist/home.js";
-import BreadcrumbsTemplate from "./generated/templates/BreadcrumbsTemplate.lit.js";
+import BreadcrumbsTemplate from "./BreadcrumbsTemplate.js";
 import UDExBreadcrumbsItem from "./BreadcrumbsItem.js";
 import UDExDropdown from "./Dropdown.js";
 import UDExLink from "./Link.js";
@@ -27,7 +27,6 @@ import { BREADCRUMBS_ARIA_LABEL, BREADCRUMBS_OVERFLOW_ARIA_LABEL } from "./gener
 // Styles
 import BreadcrumbsCss from "./generated/themes/Breadcrumbs.css.js";
 import BreadcrumbsPopoverCss from "./generated/themes/BreadcrumbsPopover.css.js";
-const triggerActiveClass = "udex-breadcrumbs__trigger--opened";
 /**
  * @class
  *
@@ -47,7 +46,7 @@ const triggerActiveClass = "udex-breadcrumbs__trigger--opened";
  */
 let UDExBreadcrumbs = UDExBreadcrumbs_1 = class UDExBreadcrumbs extends UI5Element {
     constructor() {
-        super(...arguments);
+        super();
         /**
          * Defines how many breadcrumb items should be visible
          *
@@ -55,6 +54,7 @@ let UDExBreadcrumbs = UDExBreadcrumbs_1 = class UDExBreadcrumbs extends UI5Eleme
          * @public
          */
         this.showItems = 3;
+        this._rootClass = "udex-breadcrumbs";
     }
     onBeforeRendering() {
         this._preprocessItems();
@@ -139,7 +139,7 @@ let UDExBreadcrumbs = UDExBreadcrumbs_1 = class UDExBreadcrumbs extends UI5Eleme
         this._itemNavigation?.setCurrentItem(currentItem);
     }
     _handleKeydown(e) {
-        const itemIndex = e.target.getAttribute("index");
+        const itemIndex = e.target.getAttribute("data-index");
         const isLastItem = itemIndex === (this.items.length - 2).toString();
         const isFirstItem = itemIndex === "0";
         if (isTabNext(e) && isLastItem) {
@@ -199,7 +199,8 @@ let UDExBreadcrumbs = UDExBreadcrumbs_1 = class UDExBreadcrumbs extends UI5Eleme
         return this._getItems().filter(i => this._isItemVisible(i));
     }
     get _triggerClass() {
-        return this._dropdownOpened ? triggerActiveClass : "";
+        const rootClass = "udex-breadcrumbs";
+        return this._dropdownOpened ? `${rootClass} ${rootClass}__trigger--opened` : rootClass;
     }
     get _accessibleNameText() {
         return UDExBreadcrumbs_1.i18nBundle.getText(BREADCRUMBS_ARIA_LABEL);
@@ -223,7 +224,7 @@ __decorate([
 UDExBreadcrumbs = UDExBreadcrumbs_1 = __decorate([
     customElement({
         tag: "udex-breadcrumbs",
-        renderer: litRender,
+        renderer: jsxRenderer,
         styles: [UI5BreadcrumbsCss, BreadcrumbsCss, BreadcrumbsPopoverCss],
         template: BreadcrumbsTemplate,
         dependencies: [UDExBreadcrumbsItem, UDExLink, UDExDropdown, UI5Icon],

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 litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.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 \"./generated/templates/BreadcrumbsTemplate.lit.js\";\nimport UDExBreadcrumbsItem from \"./BreadcrumbsItem.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExLink from \"./Link.js\";\nimport { BREADCRUMBS_ARIA_LABEL, BREADCRUMBS_OVERFLOW_ARIA_LABEL } 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\nconst triggerActiveClass = \"udex-breadcrumbs__trigger--opened\";\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: litRender,\n  styles: [UI5BreadcrumbsCss, BreadcrumbsCss, BreadcrumbsPopoverCss],\n  template: BreadcrumbsTemplate,\n  dependencies: [UDExBreadcrumbsItem, UDExLink, UDExDropdown, UI5Icon],\n})\n/**\n * @public\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\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(\"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    return this._dropdownOpened ? triggerActiveClass : \"\";\n  }\n\n  get _accessibleNameText(): 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\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 { BREADCRUMBS_ARIA_LABEL, BREADCRUMBS_OVERFLOW_ARIA_LABEL } 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 */\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 _accessibleNameText(): 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\nUDExBreadcrumbs.define();\n\nexport default UDExBreadcrumbs;\nexport type { UDExBreadcrumbsItemClickEventDetail };\n"]}

package/dist/BreadcrumbsItem.d.ts

@@ -19,8 +19,7 @@ import BreadcrumbsItem from "@ui5/webcomponents/dist/BreadcrumbsItem.js";
 declare class UDExBreadcrumbsItem extends BreadcrumbsItem {
     /**
      * Defines item icon to be displayed before the item name.
-     *
-     * @default ""
+     * @default undefined
      * @public
      */
     icon?: string;

package/dist/BreadcrumbsItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbsItem.js","sourceRoot":"","sources":["../src/BreadcrumbsItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,eAAe,MAAM,4CAA4C,CAAC;AAEzE;;;;;;;;;;;;;;;;GAgBG;AAKH,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,eAAe;CAShD,CAAA;AADG;IADD,QAAQ,EAAE;iDACK;AARZ,mBAAmB;IAJxB,aAAa,CAAC;QACb,GAAG,EAAE,uBAAuB;QAC5B,QAAQ,EAAE,WAAW;KACtB,CAAC;GACI,mBAAmB,CASxB;AAED,mBAAmB,CAAC,MAAM,EAAE,CAAC;AAE7B,eAAe,mBAAmB,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport BreadcrumbsItem from \"@ui5/webcomponents/dist/BreadcrumbsItem.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-breadcrumbs-item</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/BreadcrumbsItem.js\";</code>\n *\n * @constructor\n * @extends BreadcrumbsItem\n * @public\n */\n@customElement({\n  tag: \"udex-breadcrumbs-item\",\n  renderer: jsxRenderer,\n})\nclass UDExBreadcrumbsItem extends BreadcrumbsItem {\n  /**\n   * Defines item icon to be displayed before the item name.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    icon?: string;\n}\n\nUDExBreadcrumbsItem.define();\n\nexport default UDExBreadcrumbsItem;\n"]}
+{"version":3,"file":"BreadcrumbsItem.js","sourceRoot":"","sources":["../src/BreadcrumbsItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,eAAe,MAAM,4CAA4C,CAAC;AAEzE;;;;;;;;;;;;;;;;GAgBG;AAMH,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,eAAe;CAQhD,CAAA;AADG;IADD,QAAQ,EAAE;iDACK;AAPZ,mBAAmB;IALxB,aAAa,CAAC;QACb,GAAG,EAAE,uBAAuB;QAC5B,QAAQ,EAAE,WAAW;KACtB,CAAC;GAEI,mBAAmB,CAQxB;AAED,mBAAmB,CAAC,MAAM,EAAE,CAAC;AAE7B,eAAe,mBAAmB,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport BreadcrumbsItem from \"@ui5/webcomponents/dist/BreadcrumbsItem.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-breadcrumbs-item</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/BreadcrumbsItem.js\";</code>\n *\n * @constructor\n * @extends BreadcrumbsItem\n * @public\n */\n@customElement({\n  tag: \"udex-breadcrumbs-item\",\n  renderer: jsxRenderer,\n})\n\nclass UDExBreadcrumbsItem extends BreadcrumbsItem {\n  /**\n   * Defines item icon to be displayed before the item name.\n   * @default undefined\n   * @public\n   */\n  @property()\n    icon?: string;\n}\n\nUDExBreadcrumbsItem.define();\n\nexport default UDExBreadcrumbsItem;\n"]}

package/dist/BreadcrumbsPopoverTemplate.d.ts

@@ -0,0 +1,2 @@
+import type Breadcrumbs from "./Breadcrumbs.js";
+export default function BreadcrumbsPopoverTemplate(this: Breadcrumbs): import("@ui5/webcomponents-base").JSX.Element;

package/dist/BreadcrumbsPopoverTemplate.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import UDExDropdown from "./Dropdown.js";
+import UDExLink from "./Link.js";
+import { Placement, HorizontalAlign } from "./types/Dropdown.js";
+export default function BreadcrumbsPopoverTemplate() {
+    return (_jsx(UDExDropdown, { id: `udex-${this._id}-breadcrumbs__popover`, opener: `udex-${this._id}-breadcrumbs__opener`, class: `${this._rootClass}__popover ui5-breadcrumbs-popover`, placement: Placement.Bottom, horizontalAlign: HorizontalAlign.Start, onKeyDown: this._handleKeydown, onClose: this._afterDropdownClose, onOpen: this._afterDropdownOpen, children: _jsx("div", { className: `${this._rootClass}__popover-content`, children: this._dropdownItems.map((item, index) => (item.icon ? (_jsx(UDExLink, { "data-index": index, id: `${item._id}-li`, onClick: this._onDropdownLinkPress, href: item.href, target: item.target, class: `${this._rootClass}__item ${this._rootClass}__item--with-icon ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`, icon: item.icon, accessibleName: item.textContent ?? undefined, "data-ui5-stable": item.stableDomRef, children: item.textContent }, index)) : item._isCurrentPageItem ? (_jsx("span", { id: `${item._id}-li`, className: `${this._rootClass}__item ${this._rootClass}__item--current ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`, "accessible-name": item.accessibleName, "data-ui5-stable": item.stableDomRef, children: item.textContent }, index)) : (_jsx(UDExLink, { "data-index": index, id: `${item._id}-li`, onClick: this._onDropdownLinkPress, href: item.href, target: item.target, class: `${this._rootClass}__item ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`, accessibleName: item.accessibleName, "data-ui5-stable": item.stableDomRef, children: item.textContent }, index)))) }) }));
+}
+//# sourceMappingURL=BreadcrumbsPopoverTemplate.js.map

package/dist/BreadcrumbsPopoverTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbsPopoverTemplate.js","sourceRoot":"","sources":["../src/BreadcrumbsPopoverTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,YAAY,MAAM,eAAe,CAAC;AACzC,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEjE,MAAM,CAAC,OAAO,UAAU,0BAA0B;IAChD,OAAO,CACL,KAAC,YAAY,IACX,EAAE,EAAE,QAAQ,IAAI,CAAC,GAAG,uBAAuB,EAC3C,MAAM,EAAE,QAAQ,IAAI,CAAC,GAAG,sBAAsB,EAC9C,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,mCAAmC,EAC5D,SAAS,EAAE,SAAS,CAAC,MAAM,EAC3B,eAAe,EAAE,eAAe,CAAC,KAAK,EACtC,SAAS,EAAE,IAAI,CAAC,cAAc,EAC9B,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,MAAM,EAAE,IAAI,CAAC,kBAAkB,YAC/B,cAAK,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,mBAAmB,YAClD,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACxC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACV,KAAC,QAAQ,kBAEK,KAAK,EACjB,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,KAAK,EACpB,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAClC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,UAAU,IAAI,CAAC,UAAU,qBAAqB,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,UAAU,WAAW,KAAK,EAAE,EACzI,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,cAAc,EAAE,IAAI,CAAC,WAAW,IAAI,SAAS,qBAC5B,IAAI,CAAC,YAAY,YACjC,IAAI,CAAC,WAAW,IAVZ,KAAK,CAWD,CACZ,CAAC,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAC5B,eAEE,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,KAAK,EACpB,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,UAAU,IAAI,CAAC,UAAU,mBAAmB,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,UAAU,WAAW,KAAK,EAAE,qBAC1H,IAAI,CAAC,cAAc,qBACnB,IAAI,CAAC,YAAY,YACjC,IAAI,CAAC,WAAW,IALZ,KAAK,CAML,CACR,CAAC,CAAC,CAAC,CACF,KAAC,QAAQ,kBAEK,KAAK,EACjB,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,KAAK,EACpB,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAClC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,UAAU,IAAI,CAAC,UAAU,kBAAkB,IAAI,CAAC,UAAU,WAAW,KAAK,EAAE,EACrG,cAAc,EAAE,IAAI,CAAC,cAAc,qBAClB,IAAI,CAAC,YAAY,YACjC,IAAI,CAAC,WAAW,IATZ,KAAK,CAUD,CACZ,CACF,CAAC,GACE,GACO,CAChB,CAAC;AACJ,CAAC","sourcesContent":["import type Breadcrumbs from \"./Breadcrumbs.js\";\nimport UDExDropdown from \"./Dropdown.js\";\nimport UDExLink from \"./Link.js\";\nimport { Placement, HorizontalAlign } from \"./types/Dropdown.js\";\n\nexport default function BreadcrumbsPopoverTemplate(this: Breadcrumbs) {\n  return (\n    <UDExDropdown\n      id={`udex-${this._id}-breadcrumbs__popover`}\n      opener={`udex-${this._id}-breadcrumbs__opener`}\n      class={`${this._rootClass}__popover ui5-breadcrumbs-popover`}\n      placement={Placement.Bottom}\n      horizontalAlign={HorizontalAlign.Start}\n      onKeyDown={this._handleKeydown}\n      onClose={this._afterDropdownClose}\n      onOpen={this._afterDropdownOpen}>\n      <div className={`${this._rootClass}__popover-content`}>\n        {this._dropdownItems.map((item, index) => (\n          item.icon ? (\n            <UDExLink\n              key={index}\n              data-index={index}\n              id={`${item._id}-li`}\n              onClick={this._onDropdownLinkPress}\n              href={item.href}\n              target={item.target}\n              class={`${this._rootClass}__item ${this._rootClass}__item--with-icon ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`}\n              icon={item.icon}\n              accessibleName={item.textContent ?? undefined}\n              data-ui5-stable={item.stableDomRef}>\n              {item.textContent}\n            </UDExLink>\n          ) : item._isCurrentPageItem ? (\n            <span\n              key={index}\n              id={`${item._id}-li`}\n              className={`${this._rootClass}__item ${this._rootClass}__item--current ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`}\n              accessible-name={item.accessibleName}\n              data-ui5-stable={item.stableDomRef}>\n              {item.textContent}\n            </span>\n          ) : (\n            <UDExLink\n              key={index}\n              data-index={index}\n              id={`${item._id}-li`}\n              onClick={this._onDropdownLinkPress}\n              href={item.href}\n              target={item.target}\n              class={`${this._rootClass}__item ${this._rootClass}__item--hidden ${this._rootClass}__item--${index}`}\n              accessibleName={item.accessibleName}\n              data-ui5-stable={item.stableDomRef}>\n              {item.textContent}\n            </UDExLink>\n          )\n        ))}\n      </div>\n    </UDExDropdown>\n  );\n}\n"]}

package/dist/BreadcrumbsTemplate.d.ts

@@ -0,0 +1,2 @@
+import type Breadcrumbs from "./Breadcrumbs.js";
+export default function BreadcrumbsTemplate(this: Breadcrumbs): import("@ui5/webcomponents-base").JSX.Element;

package/dist/BreadcrumbsTemplate.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import UDExLink from "./Link.js";
+import UDExButtonAccessibleRole from "./types/ButtonAccessibleRole.js";
+import slimArrowDown from "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
+import BreadcrumbsPopoverTemplate from "./BreadcrumbsPopoverTemplate.js";
+export default function BreadcrumbsTemplate() {
+    const rootClass = "udex-breadcrumbs";
+    return (_jsxs(_Fragment, { children: [_jsx("nav", { class: `${this._rootClass} ui5-breadcrumbs-root`, "aria-label": this._accessibleNameText, children: _jsxs("ol", { onFocusIn: this._onfocusin, children: [_jsx("li", { class: `${this._rootClass}__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper`, children: _jsx(UDExLink, { id: `udex-${this._id}-breadcrumbs__opener`, class: `${this._rootClass}__trigger ${this._triggerClass}`, onClick: this._toggleDropdown, "aria-label": this._dropdownArrowAccessibleNameText, accessibleRole: UDExButtonAccessibleRole.Button, icon: slimArrowDown, "aria-haspopup": "true" }) }), this._linksData.map(linkData => _jsx("li", { class: `${this._rootClass}__link-wrapper ui5-breadcrumbs-link-wrapper`, id: `${linkData._id}-link-wrapper`, children: !linkData._isCurrentPageItem && (_jsxs(_Fragment, { children: [_jsx("span", { className: `${this._rootClass}__separator`, "aria-hidden": "true" }), _jsx(UDExLink, { onClick: this._onLinkPress, id: `${linkData._id}-link`, class: `${rootClass}__item ${this._rootClass}__item--visible`, href: linkData.href, target: linkData.target, accessibleName: linkData._accessibleNameText, "data-ui5-stable": linkData.stableDomRef, children: linkData.innerText })] })) }))] }) }), BreadcrumbsPopoverTemplate.call(this)] }));
+}
+//# sourceMappingURL=BreadcrumbsTemplate.js.map

package/dist/BreadcrumbsTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbsTemplate.js","sourceRoot":"","sources":["../src/BreadcrumbsTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,wBAAwB,MAAM,iCAAiC,CAAC;AACvE,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,0BAA0B,MAAM,iCAAiC,CAAC;AAEzE,MAAM,CAAC,OAAO,UAAU,mBAAmB;IACzC,MAAM,SAAS,GAAG,kBAAkB,CAAC;IAErC,OAAO,CACL,8BACE,cACE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,uBAAuB,gBACpC,IAAI,CAAC,mBAAmB,YACpC,cAAI,SAAS,EAAE,IAAI,CAAC,UAAU,aAC5B,aAAI,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,6DAA6D,YACxF,KAAC,QAAQ,IACP,EAAE,EAAE,QAAQ,IAAI,CAAC,GAAG,sBAAsB,EAC1C,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,aAAa,IAAI,CAAC,aAAa,EAAE,EAC1D,OAAO,EAAE,IAAI,CAAC,eAAe,gBACjB,IAAI,CAAC,gCAAgC,EACjD,cAAc,EAAE,wBAAwB,CAAC,MAAM,EAC/C,IAAI,EAAE,aAAa,mBACL,MAAM,GACX,GACR,EACJ,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAC9B,aACE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,6CAA6C,EACtE,EAAE,EAAE,GAAG,QAAQ,CAAC,GAAG,eAAe,YACjC,CAAC,QAAQ,CAAC,kBAAkB,IAAI,CAC/B,8BACE,eAAM,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,aAAa,iBAAc,MAAM,GAAQ,EAC5E,KAAC,QAAQ,IACP,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,EAAE,EAAE,GAAG,QAAQ,CAAC,GAAG,OAAO,EAC1B,KAAK,EAAE,GAAG,SAAS,UAAU,IAAI,CAAC,UAAU,iBAAiB,EAC7D,IAAI,EAAE,QAAQ,CAAC,IAAI,EACnB,MAAM,EAAE,QAAQ,CAAC,MAAM,EACvB,cAAc,EAAE,QAAQ,CAAC,mBAAmB,qBAC3B,QAAQ,CAAC,YAAY,YACrC,QAAQ,CAAC,SAAS,GACV,IACV,CACJ,GACE,CACN,IACE,GACD,EACL,0BAA0B,CAAC,IAAI,CAAC,IAAI,CAAC,IACrC,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import type Breadcrumbs from \"./Breadcrumbs.js\";\nimport UDExLink from \"./Link.js\";\nimport UDExButtonAccessibleRole from \"./types/ButtonAccessibleRole.js\";\nimport slimArrowDown from \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport BreadcrumbsPopoverTemplate from \"./BreadcrumbsPopoverTemplate.js\";\n\nexport default function BreadcrumbsTemplate(this: Breadcrumbs) {\n  const rootClass = \"udex-breadcrumbs\";\n\n  return (\n    <>\n      <nav\n        class={`${this._rootClass} ui5-breadcrumbs-root`}\n        aria-label={this._accessibleNameText}>\n        <ol onFocusIn={this._onfocusin}>\n          <li class={`${this._rootClass}__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper`}>\n            <UDExLink\n              id={`udex-${this._id}-breadcrumbs__opener`}\n              class={`${this._rootClass}__trigger ${this._triggerClass}`}\n              onClick={this._toggleDropdown}\n              aria-label={this._dropdownArrowAccessibleNameText}\n              accessibleRole={UDExButtonAccessibleRole.Button}\n              icon={slimArrowDown}\n              aria-haspopup=\"true\">\n            </UDExLink>\n          </li>\n          {this._linksData.map(linkData =>\n            <li\n              class={`${this._rootClass}__link-wrapper ui5-breadcrumbs-link-wrapper`}\n              id={`${linkData._id}-link-wrapper`}>\n              {!linkData._isCurrentPageItem && (\n                <>\n                  <span className={`${this._rootClass}__separator`} aria-hidden=\"true\"></span>\n                  <UDExLink\n                    onClick={this._onLinkPress}\n                    id={`${linkData._id}-link`}\n                    class={`${rootClass}__item ${this._rootClass}__item--visible`}\n                    href={linkData.href}\n                    target={linkData.target}\n                    accessibleName={linkData._accessibleNameText}\n                    data-ui5-stable={linkData.stableDomRef}>\n                    {linkData.innerText}\n                  </UDExLink>\n                </>\n              )}\n            </li>\n          )}\n        </ol>\n      </nav>\n      {BreadcrumbsPopoverTemplate.call(this)}\n    </>\n  );\n}\n"]}

package/dist/FilterMenu.js

@@ -141,8 +141,7 @@ let UDExFilterMenu = UDExFilterMenu_1 = class UDExFilterMenu extends UDExSearcha
         this._trigger = this.getTriggerButton();
     }
     handleSelectAll(e) {
-        this.onFilterSelectAllHeaderPress(e);
-        this.fireDecoratorEvent("select-all");
+        this.onSelectAllHeaderPress(e);
     }
     handleItemPress(e) {
         this.onItemPress(e);