@infineon/infineon-design-system-stencil 34.0.0--canary.1868.cb713cf1255db3ab13d7c954671e012411e39515.0 → 34.0.0--canary.1868.4efc3539ee45a2c869d4a2ecaf2f351e0a66627c.0

package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js

@@ -31,8 +31,8 @@ export class FilterAccordion {
         this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
     }
     render() {
-        return (h("div", { key: 'dcee8e0efc95236f519e28d19819ec4ff308f5b6', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '53b7dae8f8a2798408ace40dcf18c602946c1b1f', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '1e8047d0e9808475d8bfaad216fa7d0a1024b696', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '8ca900b6cd9539106789327caef0e26120ecf795', class: "text" }, h("span", { key: '6da0944b9bfca9ad62ef0000da328a4a7ad7c972' }, this.filterGroupName), h("ifx-number-indicator", { key: 'f30c44cd8d704bb030be5fe9992d61bd9274435a' }, this.count)), h("ifx-icon", { key: '212e9e442d4e4a0da39985ec4ed57e804fbd5a90', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'bcc8e05d06158818f63f5d10fa505ac85a754f33', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
-            h("div", { key: 'd1756b49a90159e1d24397354e839a01abe534a2', class: "filter-accordion-container" }, h("slot", { key: '4020258a7ed72253cfa34cc53c15b8fe186d1d43', name: "list" }))));
+        return (h("div", { key: 'dcee8e0efc95236f519e28d19819ec4ff308f5b6', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '53b7dae8f8a2798408ace40dcf18c602946c1b1f', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '1e8047d0e9808475d8bfaad216fa7d0a1024b696', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '8ca900b6cd9539106789327caef0e26120ecf795', class: "text" }, h("span", { key: '6da0944b9bfca9ad62ef0000da328a4a7ad7c972' }, this.filterGroupName), h("ifx-indicator", { key: '5f586a9f3f366642b027e303bf4026d2b446ba7c', variant: 'number', number: this.count })), h("ifx-icon", { key: '8c296860ddedc2cd3069d7eaa4fca00f8a98b65d', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: '99050fc03f6301f0ff144df0164cea86dce1e3e6', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
+            h("div", { key: 'b5162242fb32c6aa1edc7f9bf20243ba6929493d', class: "filter-accordion-container" }, h("slot", { key: '08e51213aea8e5bd15ab07598423743592ac1dce', name: "list" }))));
     }
     static get is() { return "ifx-filter-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-accordion.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAOrD,MAAM,OAAO,eAAe;IAL5B;QAMU,gBAAW,GAAG,KAAK,CAAC;QAEnB,aAAQ,GAAY,KAAK,CAAC;QAE1B,UAAK,GAAW,CAAC,CAAC;QAClB,eAAU,GAAG,CAAC,CAAC;QAEhB,oBAAe,GAAG,EAAE,CAAC;QAkB/B,wBAAmB,GAAG,CAAC,KAAkB,EAAE,EAAE;YACzC,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC;YACjD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;QAC/F,CAAC,CAAA;QAMD,oBAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;YACtC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAA;KA+BF;IA1DC,iBAAiB;QACf,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEtE,CAAC;IAEH,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,MAAM,aAAa,GAAG,yBAAyB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACzD,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;YAClC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,4CAA4C;QACvE,CAAC;IACH,CAAC;IASC,mBAAmB;QACjB,IAAI,CAAC,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACzE,CAAC;IAOD,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,aAAa,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;YACxD,4DAAK,KAAK,EAAE,UAAU,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,eAAe;gBACpF,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;oBAC5D,4DAAK,KAAK,EAAC,MAAM;wBACf,+DAAO,IAAI,CAAC,eAAe,CAAQ;wBACnC,+EAAuB,IAAI,CAAC,KAAK,CAAwB,CACrD;oBACN,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,EACpC,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB;oBACZ,iEACE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EACpC,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,eAAe,GACnB,CACR,CACF;YACL,IAAI,CAAC,QAAQ;gBACZ,4DAAK,KAAK,EAAC,4BAA4B;oBACrC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CAEJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n  tag: 'ifx-filter-accordion',\n  styleUrl: 'filter-accordion.scss',\n  shadow: true,\n})\nexport class FilterAccordion {\n  private initialized = false;\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @Prop() maxVisibleItems: number;\n  @State() count: number = 0;\n  @State() totalItems = 0;\n\n  @Prop() filterGroupName = \"\";\n\n  @Event() ifxFilterAccordionChange: EventEmitter;\n\n  componentWillLoad() {\n    this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n  }\n\ncomponentDidLoad() {\n  if (!this.initialized) {\n    const selectedItems = getInitiallySelectedItems(this.el);\n    this.count = selectedItems.length;\n    this.initialized = true; // Prevent further execution in future calls\n  }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n    const selectedItems = event.detail.selectedItems;\n    this.count = selectedItems.length;\n    this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n  }\n\n  toggleAccordion = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  render() {\n    return (\n      <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n        <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n          <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n            <div class=\"text\">\n              <span>{this.filterGroupName}</span>\n              <ifx-number-indicator>{this.count}</ifx-number-indicator>\n            </div>\n            <ifx-icon\n              class={this.expanded ? '' : 'hidden'}\n              icon=\"minus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n            <ifx-icon\n              class={this.expanded ? 'hidden' : ''}\n              icon=\"plus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n          </div>\n        </div>\n        {this.expanded &&\n          <div class=\"filter-accordion-container\">\n            <slot name=\"list\"></slot>\n          </div>\n        }\n      </div>\n    );\n  }\n}"]}
+{"version":3,"file":"filter-accordion.js","sourceRoot":"","sources":["../../../../../src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n  tag: 'ifx-filter-accordion',\n  styleUrl: 'filter-accordion.scss',\n  shadow: true,\n})\nexport class FilterAccordion {\n  private initialized = false;\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @Prop() maxVisibleItems: number;\n  @State() count: number = 0;\n  @State() totalItems = 0;\n\n  @Prop() filterGroupName = \"\";\n\n  @Event() ifxFilterAccordionChange: EventEmitter;\n\n  componentWillLoad() {\n    this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n  }\n\ncomponentDidLoad() {\n  if (!this.initialized) {\n    const selectedItems = getInitiallySelectedItems(this.el);\n    this.count = selectedItems.length;\n    this.initialized = true; // Prevent further execution in future calls\n  }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n    const selectedItems = event.detail.selectedItems;\n    this.count = selectedItems.length;\n    this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n  }\n\n  toggleAccordion = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  render() {\n    return (\n      <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n        <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n          <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n            <div class=\"text\">\n              <span>{this.filterGroupName}</span>\n              <ifx-indicator variant='number' number={this.count}></ifx-indicator>\n            </div>\n            <ifx-icon\n              class={this.expanded ? '' : 'hidden'}\n              icon=\"minus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n            <ifx-icon\n              class={this.expanded ? 'hidden' : ''}\n              icon=\"plus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n          </div>\n        </div>\n        {this.expanded &&\n          <div class=\"filter-accordion-container\">\n            <slot name=\"list\"></slot>\n          </div>\n        }\n      </div>\n    );\n  }\n}"]}

package/dist/components/ifx-chip.js

@@ -1,4 +1,4 @@
-import { C as Chip, d as defineCustomElement$1 } from './p-b7fabe3a.js';
+import { C as Chip, d as defineCustomElement$1 } from './p-ca6632cb.js';
 
 const IfxChip = Chip;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ifx-filter-accordion.js

@@ -1,5 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-2cc378b8.js';
-import { d as defineCustomElement$2 } from './p-2a46b223.js';
+import { d as defineCustomElement$3 } from './p-2a46b223.js';
+import { d as defineCustomElement$2 } from './p-13845b7d.js';
 
 // utils.ts
 function getInitiallySelectedItems(el) {
@@ -52,8 +53,8 @@ const FilterAccordion = /*@__PURE__*/ proxyCustomElement(class FilterAccordion e
         this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
     }
     render() {
-        return (h("div", { key: 'dcee8e0efc95236f519e28d19819ec4ff308f5b6', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '53b7dae8f8a2798408ace40dcf18c602946c1b1f', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '1e8047d0e9808475d8bfaad216fa7d0a1024b696', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '8ca900b6cd9539106789327caef0e26120ecf795', class: "text" }, h("span", { key: '6da0944b9bfca9ad62ef0000da328a4a7ad7c972' }, this.filterGroupName), h("ifx-number-indicator", { key: 'f30c44cd8d704bb030be5fe9992d61bd9274435a' }, this.count)), h("ifx-icon", { key: '212e9e442d4e4a0da39985ec4ed57e804fbd5a90', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'bcc8e05d06158818f63f5d10fa505ac85a754f33', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
-            h("div", { key: 'd1756b49a90159e1d24397354e839a01abe534a2', class: "filter-accordion-container" }, h("slot", { key: '4020258a7ed72253cfa34cc53c15b8fe186d1d43', name: "list" }))));
+        return (h("div", { key: 'dcee8e0efc95236f519e28d19819ec4ff308f5b6', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '53b7dae8f8a2798408ace40dcf18c602946c1b1f', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '1e8047d0e9808475d8bfaad216fa7d0a1024b696', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '8ca900b6cd9539106789327caef0e26120ecf795', class: "text" }, h("span", { key: '6da0944b9bfca9ad62ef0000da328a4a7ad7c972' }, this.filterGroupName), h("ifx-indicator", { key: '5f586a9f3f366642b027e303bf4026d2b446ba7c', variant: 'number', number: this.count })), h("ifx-icon", { key: '8c296860ddedc2cd3069d7eaa4fca00f8a98b65d', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: '99050fc03f6301f0ff144df0164cea86dce1e3e6', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
+            h("div", { key: 'b5162242fb32c6aa1edc7f9bf20243ba6929493d', class: "filter-accordion-container" }, h("slot", { key: '08e51213aea8e5bd15ab07598423743592ac1dce', name: "list" }))));
     }
     get el() { return this; }
     static get style() { return IfxFilterAccordionStyle0; }
@@ -68,7 +69,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["ifx-filter-accordion", "ifx-icon"];
+    const components = ["ifx-filter-accordion", "ifx-icon", "ifx-indicator"];
     components.forEach(tagName => { switch (tagName) {
         case "ifx-filter-accordion":
             if (!customElements.get(tagName)) {
@@ -76,6 +77,11 @@ function defineCustomElement$1() {
             }
             break;
         case "ifx-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ifx-indicator":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }

package/dist/components/ifx-filter-accordion.js.map

@@ -1 +1 @@
-{"file":"ifx-filter-accordion.js","mappings":"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","names":[],"sources":["src/components/table-advanced-version/filter-type-group/utils.ts","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.scss?tag=ifx-filter-accordion&encapsulation=shadow","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"sourcesContent":["// utils.ts\nexport function getInitiallySelectedItems(el: HTMLElement) {\n   return Array.from(el.querySelectorAll('ifx-list-entry'))\n\n    .filter(entry => entry.getAttribute('value') === 'true')\n    .map(entry => {\n      return {\n        label: entry.getAttribute('label'),\n        value: entry.getAttribute('value'),\n        type: entry.getAttribute('type')\n      };\n    });\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n.header {\n  display: flex;\n  align-items: flex-start;\n  align-self: stretch;\n  cursor: pointer;\n  border-left: 3px solid transparent;\n}\n\n.text-and-icon {\n  display: flex;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200 tokens.$ifxSpace150 tokens.$ifxSpace250;\n  align-items: center;\n  gap: tokens.$ifxSpace200;\n  flex: 1 0 0;\n}\n\n.header.expanded {\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n.text {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex: 1 0 0;\n  color: tokens.$ifxColorBaseBlack;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 24px;\n}\n\n.hidden {\n  display: none;\n}\n\n.accordion {\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n\n.filter-accordion-container {\n  display: flex;\n  padding: 8px 16px 16px 20px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: none;\n}\n\n.link {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.show-more ::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: block;\n}\n\n.show-more .show-more-link {\n  display: none;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n  tag: 'ifx-filter-accordion',\n  styleUrl: 'filter-accordion.scss',\n  shadow: true,\n})\nexport class FilterAccordion {\n  private initialized = false;\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @Prop() maxVisibleItems: number;\n  @State() count: number = 0;\n  @State() totalItems = 0;\n\n  @Prop() filterGroupName = \"\";\n\n  @Event() ifxFilterAccordionChange: EventEmitter;\n\n  componentWillLoad() {\n    this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n  }\n\ncomponentDidLoad() {\n  if (!this.initialized) {\n    const selectedItems = getInitiallySelectedItems(this.el);\n    this.count = selectedItems.length;\n    this.initialized = true; // Prevent further execution in future calls\n  }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n    const selectedItems = event.detail.selectedItems;\n    this.count = selectedItems.length;\n    this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n  }\n\n  toggleAccordion = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  render() {\n    return (\n      <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n        <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n          <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n            <div class=\"text\">\n              <span>{this.filterGroupName}</span>\n              <ifx-number-indicator>{this.count}</ifx-number-indicator>\n            </div>\n            <ifx-icon\n              class={this.expanded ? '' : 'hidden'}\n              icon=\"minus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n            <ifx-icon\n              class={this.expanded ? 'hidden' : ''}\n              icon=\"plus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n          </div>\n        </div>\n        {this.expanded &&\n          <div class=\"filter-accordion-container\">\n            <slot name=\"list\"></slot>\n          </div>\n        }\n      </div>\n    );\n  }\n}"],"version":3}
+{"file":"ifx-filter-accordion.js","mappings":"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","names":[],"sources":["src/components/table-advanced-version/filter-type-group/utils.ts","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.scss?tag=ifx-filter-accordion&encapsulation=shadow","src/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.tsx"],"sourcesContent":["// utils.ts\nexport function getInitiallySelectedItems(el: HTMLElement) {\n   return Array.from(el.querySelectorAll('ifx-list-entry'))\n\n    .filter(entry => entry.getAttribute('value') === 'true')\n    .map(entry => {\n      return {\n        label: entry.getAttribute('label'),\n        value: entry.getAttribute('value'),\n        type: entry.getAttribute('type')\n      };\n    });\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n.header {\n  display: flex;\n  align-items: flex-start;\n  align-self: stretch;\n  cursor: pointer;\n  border-left: 3px solid transparent;\n}\n\n.text-and-icon {\n  display: flex;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200 tokens.$ifxSpace150 tokens.$ifxSpace250;\n  align-items: center;\n  gap: tokens.$ifxSpace200;\n  flex: 1 0 0;\n}\n\n.header.expanded {\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n.text {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex: 1 0 0;\n  color: tokens.$ifxColorBaseBlack;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 24px;\n}\n\n.hidden {\n  display: none;\n}\n\n.accordion {\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n}\n\n\n.filter-accordion-container {\n  display: flex;\n  padding: 8px 16px 16px 20px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-left: 3px solid tokens.$ifxColorOcean500;\n}\n\n::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: none;\n}\n\n.link {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.show-more ::slotted(ifx-filter-entry:nth-child(n+7)) {\n  display: block;\n}\n\n.show-more .show-more-link {\n  display: none;\n}","import { Component, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { getInitiallySelectedItems } from '../utils';\n\n@Component({\n  tag: 'ifx-filter-accordion',\n  styleUrl: 'filter-accordion.scss',\n  shadow: true,\n})\nexport class FilterAccordion {\n  private initialized = false;\n  @Element() private el: HTMLElement;\n  @State() expanded: boolean = false;\n  @Prop() maxVisibleItems: number;\n  @State() count: number = 0;\n  @State() totalItems = 0;\n\n  @Prop() filterGroupName = \"\";\n\n  @Event() ifxFilterAccordionChange: EventEmitter;\n\n  componentWillLoad() {\n    this.el.addEventListener('ifxListUpdate', this.handleCheckedChange);\n\n  }\n\ncomponentDidLoad() {\n  if (!this.initialized) {\n    const selectedItems = getInitiallySelectedItems(this.el);\n    this.count = selectedItems.length;\n    this.initialized = true; // Prevent further execution in future calls\n  }\n}\n\n\nhandleCheckedChange = (event: CustomEvent) => {\n    const selectedItems = event.detail.selectedItems;\n    this.count = selectedItems.length;\n    this.ifxFilterAccordionChange.emit({ filterGroupName: this.filterGroupName, selectedItems });\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);\n  }\n\n  toggleAccordion = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.expanded = !this.expanded;\n  }\n\n  render() {\n    return (\n      <div class={`accordion ${this.expanded ? 'expanded' : ''}`}>\n        <div class={`header ${this.expanded ? 'expanded' : ''}`} onClick={this.toggleAccordion} >\n          <div class={`text-and-icon ${this.expanded ? 'expanded' : ''}`}>\n            <div class=\"text\">\n              <span>{this.filterGroupName}</span>\n              <ifx-indicator variant='number' number={this.count}></ifx-indicator>\n            </div>\n            <ifx-icon\n              class={this.expanded ? '' : 'hidden'}\n              icon=\"minus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n            <ifx-icon\n              class={this.expanded ? 'hidden' : ''}\n              icon=\"plus-16\"\n              onClick={this.toggleAccordion}\n            ></ifx-icon>\n          </div>\n        </div>\n        {this.expanded &&\n          <div class=\"filter-accordion-container\">\n            <slot name=\"list\"></slot>\n          </div>\n        }\n      </div>\n    );\n  }\n}"],"version":3}

package/dist/components/ifx-indicator.js

@@ -1,52 +1,4 @@
-import { p as proxyCustomElement, H, h } from './p-2cc378b8.js';
-
-const indicatorCss = ":root{font-family:\"Source Sans 3\", sans-serif}:host{display:inline-flex}.indicator__container .dot__wrapper{display:flex;width:8px;height:8px;justify-content:center;align-items:center;flex-shrink:0;border-radius:50%;background-color:#0A8276}.indicator__container .number__container{height:16px;display:inline-flex;padding:0;min-width:16px;justify-content:center;align-items:center;border-radius:100px;background-color:#0A8276}.indicator__container .number__container .number__wrapper{padding:0 4px;color:#FFFFFF;text-align:center;font-size:0.875rem;font-style:normal;font-weight:600;line-height:16px}.indicator__container .number__container.inverted{background-color:#FFFFFF}.indicator__container .number__container.inverted .number__wrapper{color:#0A8276}";
-const IfxIndicatorStyle0 = indicatorCss;
-
-const Indicator = /*@__PURE__*/ proxyCustomElement(class Indicator extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.inverted = false;
-        this.variant = 'number';
-        this.number = 0;
-    }
-    handleNumber() {
-        this.filteredNumber = !isNaN(this.number) && this.number > 99 ? '99+' : this.number;
-    }
-    componentWillLoad() {
-        this.handleNumber();
-    }
-    componentWillUpdate() {
-        this.handleNumber();
-    }
-    render() {
-        return (h("div", { key: 'd5990eba87822345236d9fbe47c882e205b1ec5f', "aria-label": this.ariaLabel, class: 'indicator__container' }, this.variant === 'number' &&
-            h("div", { key: '3a00aed3a5061e233420ec4fa8dfbce1c62e6f92', class: `number__container ${this.inverted ? 'inverted' : ""}` }, h("div", { key: 'a1c61453d1d4eaa38f78ef839a4a9ba0c1cfe812', class: "number__wrapper" }, this.filteredNumber)), this.variant === 'dot' && h("div", { key: '4ab45b177a45afda00886b77ae101299c134d201', class: "dot__wrapper" })));
-    }
-    get el() { return this; }
-    static get style() { return IfxIndicatorStyle0; }
-}, [1, "ifx-indicator", {
-        "inverted": [4],
-        "ariaLabel": [1, "aria-label"],
-        "variant": [1],
-        "number": [2],
-        "filteredNumber": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ifx-indicator"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ifx-indicator":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, Indicator);
-            }
-            break;
-    } });
-}
+import { I as Indicator, d as defineCustomElement$1 } from './p-13845b7d.js';
 
 const IfxIndicator = Indicator;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ifx-indicator.js.map

@@ -1 +1 @@
-{"file":"ifx-indicator.js","mappings":";;AAAA,MAAM,YAAY,GAAG,wvBAAwvB,CAAC;AAC9wB,2BAAe,YAAY;;MCOd,SAAS;IALtB;;;;QAQU,aAAQ,GAAY,KAAK,CAAC;QAE1B,YAAO,GAAW,QAAQ,CAAA;QAC1B,WAAM,GAAW,CAAC,CAAC;KA2B5B;IAzBC,YAAY;QACV,IAAI,CAAC,cAAc,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC;KACrF;IAED,iBAAiB;QACf,IAAI,CAAC,YAAY,EAAE,CAAA;KACpB;IAED,mBAAmB;QACjB,IAAI,CAAC,YAAY,EAAE,CAAA;KACpB;IAED,MAAM;QACJ,QACE,0EAAiB,IAAI,CAAC,SAAS,EAAE,KAAK,EAAC,sBAAsB,IAC3D,IAAI,CAAC,OAAO,KAAK,QAAQ;YAC1B,4DAAK,KAAK,EAAE,qBAAqB,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,IAC/D,4DAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,cAAc,CAChB,CACH,EACL,IAAI,CAAC,OAAO,KAAK,KAAK,IAAI,4DAAK,KAAK,EAAC,cAAc,GAAO,CACtD,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/indicator/indicator.scss?tag=ifx-indicator&encapsulation=shadow","src/components/indicator/indicator.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.indicator__container { \n  & .dot__wrapper { \n  display: flex;\n  width: 8px;\n  height: 8px;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n  border-radius: 50%;\n  background-color: tokens.$ifxColorOcean500;\n  }\n\n  & .number__container {\n  height: 16px;\n  display: inline-flex;\n  padding: 0; \n  min-width: 16px; \n  justify-content: center;\n  align-items: center;\n  border-radius: 100px;\n  background-color: tokens.$ifxColorOcean500;\n\n    & .number__wrapper {\n      padding: 0 4px;\n      color: tokens.$ifxColorBaseWhite;\n      text-align: center;\n      font-size: tokens.$ifxFontSizeS;\n      font-style: normal;\n      font-weight: tokens.$ifxFontWeightSemibold;\n      line-height: 16px;\n    }\n\n    &.inverted {\n      background-color: tokens.$ifxColorBaseWhite;\n\n      & .number__wrapper {\n        color: tokens.$ifxColorOcean500;\n      }\n    }\n  }\n}\n\n\n","import { Component, h, Prop, Element, State } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-indicator',\n  styleUrl: 'indicator.scss',\n  shadow: true\n})\nexport class Indicator {\n  @Element() el;\n  @State() filteredNumber: string | number;\n  @Prop() inverted: boolean = false;\n  @Prop() ariaLabel: string | null;\n  @Prop() variant: string = 'number'\n  @Prop() number: number = 0;\n\n  handleNumber() {\n    this.filteredNumber = !isNaN(this.number) && this.number > 99 ? '99+' : this.number;\n  }\n\n  componentWillLoad() { \n    this.handleNumber()\n  }\n\n  componentWillUpdate() {\n    this.handleNumber()\n  }\n\n  render() {\n    return (\n      <div aria-label={this.ariaLabel} class='indicator__container'>\n       {this.variant === 'number' && \n       <div class={`number__container ${this.inverted ? 'inverted' : \"\"}`}>\n          <div class=\"number__wrapper\">\n            {this.filteredNumber}\n          </div> \n       </div>}\n       {this.variant === 'dot' && <div class=\"dot__wrapper\"></div>}\n      </div>\n    );\n  }\n}"],"version":3}
+{"file":"ifx-indicator.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/ifx-navbar-item.js

@@ -1,7 +1,8 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-2cc378b8.js';
-import { d as defineCustomElement$2 } from './p-2a46b223.js';
+import { d as defineCustomElement$3 } from './p-2a46b223.js';
+import { d as defineCustomElement$2 } from './p-13845b7d.js';
 
-const navbarItemCss = ":host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:\"Source Sans 3\";text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .dot__indicator-wrapper{display:flex;width:8px;height:8px;justify-content:center;align-items:center;flex-shrink:0;border-radius:50%;background-color:#0A8276;position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:\"Source Sans 3\";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:\"Source Sans 3\";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:\"Source Sans 3\"}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:\"Source Sans 3\"}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}";
+const navbarItemCss = ":host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:\"Source Sans 3\";text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:\"Source Sans 3\";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:\"Source Sans 3\";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:\"Source Sans 3\"}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:\"Source Sans 3\"}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}";
 const IfxNavbarItemStyle0 = navbarItemCss;
 
 const NavbarItem = /*@__PURE__*/ proxyCustomElement(class NavbarItem extends H {
@@ -333,13 +334,13 @@ const NavbarItem = /*@__PURE__*/ proxyCustomElement(class NavbarItem extends H {
     }
     render() {
         return (h("div", { key: 'e2601a0327ccc31f2451fcc2490191eb582a0016', class: "container", onMouseLeave: e => this.handleNestedLayerMenu(e), onMouseEnter: e => this.handleNestedLayerMenu(e) }, h("div", { key: '3ec0353eb436ea0adc828f56b508624f525264ec', class: "sub__layer-back-button" }, h("div", { key: '39284ea8b7f17a83084f948c7ea3b12c1d2fac2a', class: "back__button-wrapper", onClick: () => this.returnToFirstLayer() }, h("ifx-icon", { key: '2d6e46c606579b12ba9680039e2f88c5dc31a4eb', icon: "arrow-left-16" }), h("span", { key: 'a5fd3d1d8551b6be567f608568b97ca2c4c5348e' }, "Back"))), h("a", { key: 'fea66a4b956ec1671a7e9fcf7441a5bf676a200e', href: this.internalHref, target: this.target, onClick: () => this.toggleItemMenu(), class: `navbar__item ${this.isSidebarMenuItem ? 'sidebarMenuItem' : ""} ${!this.showLabel ? 'removeLabel' : ""} ${this.isMenuItem ? 'menuItem' : ""} ${this.hasChildNavItems ? 'isParent' : ""}` }, h("div", { key: '29e17c7b770251a917a4c84c08fa013693d22a60', class: "inner__content-wrapper" }, h("div", { key: '5e35323bc544eeacdf08d985fc59dfccbf5d17f7', class: `navbar__container-right-content-navigation-item-icon-wrapper ${!this.icon ? "removeWrapper" : ""}` }, this.icon && h("ifx-icon", { key: '7572d24b3f914d43f98ff551de9a27d323a2a791', icon: this.icon }), this.icon && !this.showLabel && !isNaN(this.numberIndicator) &&
-            h("div", { key: '93a14b1b3ecec23fbed6c57295eceb42bf71f729', class: "number__indicator-wrapper" }, h("ifx-number-indicator", { key: '559d6b9be6a709377650b8f916ef471a898b4978' }, this.numberIndicator)), this.icon && !this.showLabel && !this.numberIndicator && this.dotIndicator &&
-            h("div", { key: '18e46a53550e5dc1ea1969c4ce326d24cfb34c90', class: "dot__indicator-wrapper" })), this.itemPosition === 'left'
+            h("div", { key: '93a14b1b3ecec23fbed6c57295eceb42bf71f729', class: "number__indicator-wrapper" }, h("ifx-indicator", { key: '8d199195005806e77a66610619ea4941999e6b04', variant: "number", number: this.numberIndicator })), this.icon && !this.showLabel && !this.numberIndicator && this.dotIndicator &&
+            h("div", { key: 'ca4d41d281c7d812ffd79d2ecebf98206509c11e', class: "dot__indicator-wrapper" })), this.itemPosition === 'left'
             && this.hasChildNavItems
             && this.isMenuItem &&
-            h("div", { key: '811fbfb3eace865b2daeb9f066a0f82bd14d3252', class: "menuItemLeftIconWrapper" }, h("ifx-icon", { key: '4db1bb1ad3e8576787d00a1f694a0978ab3f9dab', icon: "chevron-left-12" })), h("span", { key: '1488814cc51e2b865215ecae2f307327d26bc6f0', class: "label__wrapper" }, h("slot", { key: 'c606849d2d390d4e8682b90d343b701b8f8ebbc0' }))), this.showLabel && this.numberIndicator && !isNaN(this.numberIndicator) ?
-            h("div", { class: "number__indicator-wrapper" }, h("ifx-number-indicator", null, this.numberIndicator)) : "", this.showLabel && !this.numberIndicator && this.dotIndicator ?
-            h("div", { class: "dot__indicator-wrapper" }) : "", h("div", { key: '58690fdfe5fd7f28b36ffa9cda42f3fa12aa3f72', class: `navItemIconWrapper ${this.hasChildNavItems && !this.isMenuItem && !this.isSidebarMenuItem ? '' : "hide"}` }, h("ifx-icon", { key: '7d9a0bb30c32c57699a870d24234aa21e5ec237e', icon: "chevron-down-12" })), h("div", { key: '0bcb2940fc3a894de79b4f03ab7e4c19ebb4a2ce', class: `menuItemRightIconWrapper ${((this.itemPosition === 'right' && this.hasChildNavItems && this.isMenuItem) || (this.isSidebarMenuItem && this.hasChildNavItems)) ? '' : "hide"}` }, h("ifx-icon", { key: '428705d1296ecd32607916d10f02f196f1ac1a46', icon: "chevron-right-12" }))), this.hasChildNavItems && !this.isSidebarMenuItem && h("ul", { key: '4588da2dacea9fdf098fe214ca6d514dca7f0f9c', class: 'navbar-menu' }, " ", h("slot", { key: '609e99e98ccfcad77464a593eaf04a33b277530b', name: "first__layer" }), " "), this.isSidebarMenuItem && h("ul", { key: 'fcde7c04a90485be10b3e980c6631ec7e9afe9d6', class: 'sub__layer-menu' }, " ", h("slot", { key: '4b43e369dc12c8265899f96990709c0ef20562ad', name: "second__layer" }), " ")));
+            h("div", { key: '112b20051b5ffab13d9d0c0bcd66a1828735a5e2', class: "menuItemLeftIconWrapper" }, h("ifx-icon", { key: '0294d7fa95431d7485807ab9825de32cb7cc1c96', icon: "chevron-left-12" })), h("span", { key: '45eb2664782d473678ffdf1ffd243d18bf721d1b', class: "label__wrapper" }, h("slot", { key: 'c3fdf303fb5eb539c64a6c1f8905f773e184efe8' }))), this.showLabel && this.numberIndicator && !isNaN(this.numberIndicator) ?
+            h("div", { class: "number__indicator-wrapper" }, h("ifx-indicator", { variant: "number", number: this.numberIndicator })) : "", this.showLabel && !this.numberIndicator && this.dotIndicator ?
+            h("ifx-indicator", { variant: "dot" }) : "", h("div", { key: '62555991fa617ac0dddaa347086245214da42a68', class: `navItemIconWrapper ${this.hasChildNavItems && !this.isMenuItem && !this.isSidebarMenuItem ? '' : "hide"}` }, h("ifx-icon", { key: '788a12f3719f1c4f43d1532dcca232867b5cbe91', icon: "chevron-down-12" })), h("div", { key: '68d2677b612fb670930c41b5e22c3b7521ecf07a', class: `menuItemRightIconWrapper ${((this.itemPosition === 'right' && this.hasChildNavItems && this.isMenuItem) || (this.isSidebarMenuItem && this.hasChildNavItems)) ? '' : "hide"}` }, h("ifx-icon", { key: '9caf7fcdfc151e631daa735c26fbd0e51ac89a95', icon: "chevron-right-12" }))), this.hasChildNavItems && !this.isSidebarMenuItem && h("ul", { key: '7f86354e5c3db42d1d2a6ca3227fce444ca8b1e1', class: 'navbar-menu' }, " ", h("slot", { key: '6dd2300504349618730ccf50c133b97d9d7e6993', name: "first__layer" }), " "), this.isSidebarMenuItem && h("ul", { key: '0035b465e812546856240dea531d4a0e4d443ec0', class: 'sub__layer-menu' }, " ", h("slot", { key: 'b61eeb9d819b6691d1c3cfa99b27b304d612dd0f', name: "second__layer" }), " ")));
     }
     get el() { return this; }
     static get style() { return IfxNavbarItemStyle0; }
@@ -371,7 +372,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["ifx-navbar-item", "ifx-icon"];
+    const components = ["ifx-navbar-item", "ifx-icon", "ifx-indicator"];
     components.forEach(tagName => { switch (tagName) {
         case "ifx-navbar-item":
             if (!customElements.get(tagName)) {
@@ -379,6 +380,11 @@ function defineCustomElement$1() {
             }
             break;
         case "ifx-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ifx-indicator":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }

package/dist/components/ifx-navbar-item.js.map

@@ -1 +1 @@
-{"file":"ifx-navbar-item.js","mappings":"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","names":[],"sources":["src/components/navigation/navbar/navbar-item.scss?tag=ifx-navbar-item&encapsulation=shadow","src/components/navigation/navbar/navbar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host(.hidden) {\n  display: none;\n}\n\n.navbar__item {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px 8px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  font-family: tokens.$ifxFontFamilyBody;\n  text-decoration: none;\n  font-weight: 400;\n  font-size: 16px;\n  color: tokens.$ifxColorBaseBlack;\n\n  &.hide { \n    display: none;\n  }\n\n  &.isParent { \n    gap: 8px;\n  }\n\n  & .navItemIconWrapper { \n    transition: .3s;\n  }\n\n  &.open { \n    & .navItemIconWrapper { \n      transform: rotate(-180deg);\n      transition: .3s;\n    }\n  }\n\n  &:hover {\n    color: tokens.$ifxColorOcean500;\n    cursor: pointer;\n\n    & .username__tooltip { \n      display: block;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper { \n      & .initials__wrapper { \n        cursor: pointer;\n        background-color: tokens.$ifxColorOcean600;\n      }\n    }\n  }\n\n  &.remove {\n    display: none;\n  }\n\n  &.removeLabel {\n    & .label__wrapper {\n      display: none;\n    }\n  }\n\n  & .number__indicator-wrapper { \n    position: relative;\n    top: -11px;\n  }\n\n  & .dot__indicator-wrapper { \n    display: flex;\n    width: 8px;\n    height: 8px;\n    justify-content: center;\n    align-items: center;\n    flex-shrink: 0;\n    border-radius: 50%;\n    background-color: tokens.$ifxColorOcean500;\n    position: relative;\n    top: -11px;\n  }\n\n  & .navbar__container-right-content-navigation-item-icon-wrapper {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px;\n    gap: 8px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n \n    & .username__tooltip { \n      display: none;\n      position: absolute;\n      top: 35px;\n      right: 0;\n      text-wrap: nowrap;\n      padding: 1px 5px;\n      font-size: 13px;\n      font-family: \"Source Sans 3\";\n      background-color: black;\n      color: #fff;\n      z-index: 99;\n    }\n\n    &:hover { \n      & .username__tooltip { \n        display: block;\n      }\n    }\n\n    & .initials__wrapper { \n      display: flex;\n      width: 24px;\n      height: 24px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100%;\n      background-color: tokens.$ifxColorOcean500;\n\n      & .initials { \n        color: #FFF;\n        text-align: center;\n        font-family: \"Source Sans 3\";\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 20px; \n\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -khtml-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        user-select: none;\n      \n      }\n    }\n\n    & img { \n      width: 24px; \n      height: 24px;\n      border-radius: 100%;\n    }\n\n    &.removeWrapper {\n      display: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n}\n\n.container { \n  position: relative;\n\n  & .sub__layer-back-button { \n    display: none;\n    &.show { \n      display: flex;\n      justify-content: flex-start;\n\n      & .back__button-wrapper { \n        display: flex;\n        align-items: center;\n        gap: tokens.$ifxSpace100;\n        padding: tokens.$ifxSpace100 0 tokens.$ifxSpace200 0;\n        color: tokens.$ifxColorOcean500;\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 24px;\n\n        & span, & ifx-icon { \n          &:hover { \n            cursor: pointer;\n          }\n        }\n\n      }\n    }\n  }\n\n  &.hide { \n    display: none;\n  }\n\n  & .inner__content-wrapper { \n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    &.no-gap { \n      gap: 0px;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper {\n      &.no-gap { \n        gap: 0px;\n      }\n    }\n\n    & .number__indicator-wrapper { \n      position: relative;\n      top: -11px;\n    }\n\n  }\n}\n\n.navbar-menu  {\n  position: absolute;\n  display: none;\n  list-style-type: none;\n  visibility: visible;\n  flex-direction: column;\n  width: 224px;\n  min-width: 224px;\n  background: tokens.$ifxColorBaseWhite;\n  box-shadow: 0px 6px 9px 0px #1d1d1d1a;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  padding: 8px 0px;\n  font-family: tokens.$ifxFontFamilyBody;\n\n  &.open:not(.itemInMobileMenu) {\n    display: flex;\n  }\n\n  &.itemInMobileMenu { \n    display: none;\n  }\n\n  &.right { \n    left: 100%;\n    top: -40%;\n  }\n\n  &.left { \n    top: -40%;\n    right: 100%;\n  }\n\n  &.rightSideItemMenu { \n    left: initial;\n    right: 0px;\n  }\n}\n\n.navbar__item { \n    &.layer__item-parent { \n      color: tokens.$ifxColorBaseBlack;\n      font-size: 24px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 32px; \n      letter-spacing: -0.24px;\n      cursor: initial;\n\n      & .navbar__container-right-content-navigation-item-icon-wrapper { \n        & ifx-icon { \n          & svg { \n            width: 24px;\n            height: 24px;\n          }\n        }\n      }\n    }\n\n\n  &.sidebarMenuItem { \n    justify-content: space-between;\n    padding: 0;\n  }\n\n\n  &.menuItem {\n    text-decoration: none;\n    color: tokens.$ifxColorBaseBlack;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 8px 16px;\n    gap: 8px;\n    font-family: tokens.$ifxFontFamilyBody;\n  \n    &.hide {\n      display: none;\n    }\n  \n    & .label__wrapper {\n      color: tokens.$ifxColorBaseBlack;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n  \n    &:hover {\n      cursor: pointer;\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  \n    &:active {\n      background-color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.sub__layer-menu { \n  padding: 5px;\n  display: none;\n\n  &.remove__margin { \n    margin: 0;\n    padding: 0;\n  }\n \n  &.open { \n    display: block;\n  }\n}\n\n.navbar__item { \n  &.hide { \n    display: none;\n  }\n}\n\n.menuItemRightIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n.navItemIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n","import { Component, h, Element, Prop, State, Listen, Method, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-navbar-item',\n  styleUrl: 'navbar-item.scss',\n  shadow: true\n})\n\nexport class NavbarItem {\n\n  @Element() el;\n  @Prop() showLabel: boolean = true;\n  @Prop() icon: string = \"\"\n  @Prop() href: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() hideOnMobile: boolean = true;\n  @State() internalHref: string = \"\"\n  @State() isMenuItem: boolean = false;\n  @State() hasChildNavItems: boolean = false;\n  @State() isSidebarMenuItem: boolean = false;\n  @State() itemPosition: string;\n  @Event() ifxNavItem: EventEmitter;\n  @Prop() numberIndicator: number;\n  @Prop() dotIndicator: boolean = false;\n \n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const itemMenu = this.getItemMenu()\n    if(itemMenu) { \n      if(itemMenu.classList.contains('open')) { \n        if (!path.includes(this.el)) {\n          this.closeItemMenu();\n        }\n      }\n    }\n  }\n\n  @Method()\n  async hideComponent() { \n    this.el.style.display = 'none';\n  }\n\n  @Method()\n  async showComponent() { \n    this.el.style.display = '';\n  }\n\n  @Method()\n  async toggleChildren(action) { \n    const itemMenu = this.getItemMenu()\n    const arrowIcon = this.getChevronDownIconWrapper()\n    if(itemMenu) { \n      this.handleClassList(arrowIcon, action, 'hide')\n      this.handleClassList(itemMenu, action, 'itemInMobileMenu')\n    }\n  }\n\n  @Method()\n  async moveChildComponentsIntoSubLayerMenu() { \n    const subLayerMenu = this.getItemMenu()\n    if(subLayerMenu) { \n      const subLayerMenuIsOpened = this.handleClassList(subLayerMenu, 'contains', 'open')\n      if(subLayerMenuIsOpened) { \n        const navbarItem = this.getNavBarItem()\n        const subLayerBackButton = this.getSubLayerBackButton()\n        this.handleClassList(navbarItem, 'add', 'layer__item-parent')\n        this.handleClassList(subLayerBackButton, 'add', 'show')\n        this.ifxNavItem.emit({component: this.el, action: 'hideFirstLayer'})\n      }\n    }\n\n    const navItems = this.el.querySelectorAll('[slot=\"first__layer\"]')\n    this.isSidebarMenuItem = true;\n\n    for(let i = 0; i < navItems.length; i++) { \n      navItems[i].setAttribute('slot', 'second__layer')\n      navItems[i].moveChildComponentsIntoSubLayerMenu()\n    }\n  }\n\n  getSubLayerBackButton() { \n    const sublayerBackButton = this.el.shadowRoot.querySelector('.sub__layer-back-button')\n    return sublayerBackButton\n  }\n\n  @Method()\n  async toggleFirstLayerItem(actionOne, actionTwo) { \n   const navbarItem = this.getNavBarItem()\n   const secondLayerMenu = this.getSubLayerMenu()\n   const subLayerBackButton = this.getSubLayerBackButton()\n   this.handleClassList(subLayerBackButton, [actionOne], 'show')\n   this.handleClassList(navbarItem, [actionTwo], 'hide')\n   this.handleClassList(secondLayerMenu, [actionTwo], 'remove__margin')\n  }\n\n  openSubLayerMenu() { \n    if(this.hasChildNavItems) { \n      const subLayerBackButton = this.getSubLayerBackButton()\n      const rightArrowIcon = this.getRightArrowIcon()\n      const navbarItem = this.getNavBarItem()\n      const subLayerMenu = this.getSubLayerMenu()\n      const slotName = this.el.getAttribute('slot')\n\n      this.handleClassList(subLayerBackButton, 'add', 'show')\n      this.handleClassList(rightArrowIcon, 'add', 'hide')\n      this.handleClassList(navbarItem, 'add', 'layer__item-parent')\n      this.handleClassList(subLayerMenu, 'add', 'open')\n    \n      if(slotName.toLowerCase() === 'second__layer') {\n        this.ifxNavItem.emit({component: this.el, parent: this.el.parentElement, action: 'hideSecondLayer'})\n        this.handleClassList(navbarItem, 'remove', 'menuItem')\n      } else { \n        this.ifxNavItem.emit({component: this.el, action: 'hideFirstLayer'})\n      }\n    }\n  }\n\n  @Method()\n  async addMenuItemClass() { \n    const navbarItem = this.getNavBarItem()\n    this.handleClassList(navbarItem, 'add', 'menuItem')\n    const rightArrowIcon = this.getRightArrowIcon()\n    if(this.hasChildNavItems) { \n      this.handleClassList(rightArrowIcon, 'remove', 'hide')\n    }\n  }\n\n  @Method()\n  async moveChildComponentsBackIntoNavbar() { \n    const subLayerBackButton = this.getSubLayerBackButton()\n    const navbarItem = this.getNavBarItem()\n    const secondLayerMenu = this.getSubLayerMenu()\n\n    this.handleClassList(subLayerBackButton, 'remove', 'show')\n    this.handleClassList(navbarItem, 'remove', 'layer__item-parent')\n    this.handleClassList(secondLayerMenu, 'remove', 'remove__margin')\n\n    this.ifxNavItem.emit({component: this.el, action: 'show'})\n\n    const navItems = this.el.querySelectorAll('[slot=\"second__layer\"]')\n    this.isSidebarMenuItem = false;\n    this.showComponent()\n    this.handleClassList(navbarItem, 'remove', 'hide')\n\n    for(let i = 0; i < navItems.length; i++) { \n      navItems[i].setAttribute('slot', 'first__layer')\n      navItems[i].moveChildComponentsBackIntoNavbar()\n      navItems[i].addMenuItemClass()\n      navItems[i].returnToFirstLayer()\n    }\n  }\n\n  getRightArrowIcon() { \n    const menuItemRightIconWrapper = this.el.shadowRoot.querySelector('.menuItemRightIconWrapper')\n    return menuItemRightIconWrapper;\n  }\n\n  getChevronDownIconWrapper() { \n    const arrowIcon = this.el.shadowRoot.querySelector('.navItemIconWrapper');\n    return arrowIcon;\n  }\n\n  @Method()\n  async returnToFirstLayer() { \n    const subLayerBackButton = this.getSubLayerBackButton()\n    const navbarItem = this.getNavBarItem()\n    const rightArrowIcon = this.getRightArrowIcon()\n    const subLayerMenu = this.getSubLayerMenu()\n    const slotName = this.el.getAttribute('slot')\n\n    this.handleClassList(subLayerBackButton, 'remove', 'show')\n    this.handleClassList(navbarItem, 'remove', 'layer__item-parent')\n    this.handleClassList(subLayerMenu, 'remove', 'open')\n    if(this.hasChildNavItems) { \n      this.handleClassList(rightArrowIcon, 'remove', 'hide')\n    }\n\n    if(slotName.toLowerCase() === 'second__layer') {\n      this.ifxNavItem.emit({component: this.el, parent: this.el.parentElement, action: 'returnToSecondLayer'})\n      this.handleClassList(navbarItem, 'add', 'menuItem')\n    } else { \n      this.ifxNavItem.emit({component: this.el, action: 'return'})\n    }\n  }\n\n  componentWillLoad() {\n    this.setHref()\n    this.checkIfItemIsNested()\n    this.checkIfItemHasChildren()\n    this.removeEmptyItem()\n  }\n\n  componentDidLoad() { \n    this.handleItemGap()\n    this.handleLabelWrapper()\n    if(this.hasChildNavItems) { \n      const navItems = this.getNavbarItems();\n      this.relocateItemsToFirstlayer(navItems)\n    }\n  }\n\n  componentDidUpdate() { \n    const navbarItem = this.getNavBarItem()\n    const isLayerItemParent = this.handleClassList(navbarItem, 'contains', 'layer__item-parent')\n    if(this.isSidebarMenuItem && isLayerItemParent) {\n      const rightArrowIcon = this.getRightArrowIcon()\n      this.handleClassList(rightArrowIcon, 'add', 'hide')\n    }\n  }\n \n  @Method()\n  async setMenuItemPosition() { \n    if(this.isMenuItem && this.hasChildNavItems) { \n      const menuPosition = this.getItemMenuPosition()\n      if(menuPosition === 'left') { \n        this.itemPosition = 'left'\n      } else if(menuPosition === 'right') { \n        this.itemPosition = 'right'\n      }\n    }\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getNavbarItems() {\n    const navItems = this.el.querySelectorAll('ifx-navbar-item')\n    return navItems;\n  }\n  \n  getNavBarItem() { \n    const navItem = this.el.shadowRoot.querySelector('.navbar__item')\n    return navItem;\n  }\n\n  getSubLayerMenu() { \n    const subLayerMenu = this.el.shadowRoot.querySelector('.sub__layer-menu')\n    return subLayerMenu;\n  }\n\n  relocateItemsToFirstlayer(navItems) { \n     navItems.forEach(item => {\n      item.setAttribute('slot', 'first__layer')\n    })\n  }\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  checkIfItemIsNested() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-NAVBAR-ITEM' \n    || parentElement.tagName.toUpperCase() === 'IFX-NAVBAR-PROFILE') {\n      this.isMenuItem = true;\n      return;\n    } else {\n      this.isMenuItem = false;\n    }\n  }\n\n  checkIfItemHasChildren() { \n    const sidebarItems = this.getNavbarItems();\n    if (sidebarItems.length !== 0) {\n      this.hasChildNavItems = true;\n    } else {\n      this.hasChildNavItems = false;\n    } \n  }\n\n  @Method()\n  async setItemSideSpecifications() {  \n    const menuItem = this.el;\n    const itemMenu = this.getItemMenu()\n    const slotValue = menuItem.getAttribute('slot')\n \n    if(slotValue.toLowerCase().trim() === \"right-item\") { \n      this.handleClassList(itemMenu, 'add', 'rightSideItemMenu')\n    }\n\n    return true;\n  }\n\n  getItemMenu() { \n    const menu = this.el.shadowRoot.querySelector('.navbar-menu');\n    return menu;\n  }\n\n  closeItemMenu() { \n    const itemMenu = this.getItemMenu()\n    const menuItem = this.getNavBarItem()\n    if(itemMenu) { \n      this.handleClassList(itemMenu, 'remove', 'open')\n      this.handleClassList(menuItem, 'remove', 'open')\n    }\n  }\n\n  getItemMenuPosition() {\n    let parentElement = this.el;\n    while(parentElement) {\n      if(parentElement.tagName === 'IFX-NAVBAR-PROFILE' || parentElement.slot === 'right-item') {\n        return 'left'\n      }\n      parentElement = parentElement.parentElement || parentElement.getRootNode().host;\n    }\n    return 'right'\n  }\n  \n  toggleItemMenu() {\n    const slotName = this.el.getAttribute('slot')\n\n    if(slotName.toLowerCase() === 'mobile-menu-top' || slotName.toLowerCase() === 'second__layer') { \n      this.openSubLayerMenu()\n    }\n\n    if(!this.internalHref && slotName.toLowerCase() !== 'mobile-menu-top' && slotName.toLowerCase() !== 'second__layer' ) {   \n      const itemMenu = this.getItemMenu()\n    \n      if(this.hasChildNavItems) { \n        const menuItem = this.getNavBarItem()\n        this.handleClassList(itemMenu, 'toggle', 'open');\n        this.handleClassList(menuItem, 'toggle', 'open');\n      } \n    }\n  }\n\n  handleNestedLayerMenu(e) { \n    if(this.isMenuItem && this.hasChildNavItems && !this.isSidebarMenuItem) { \n      const itemMenu = this.getItemMenu()\n      const menuPosition = this.getItemMenuPosition()\n      if(e.type.toUpperCase() === 'MOUSEENTER') { \n        this.handleClassList(itemMenu, 'add', 'open')\n        if(menuPosition === 'left') { \n          this.handleClassList(itemMenu, 'add', 'left')\n        } else if(menuPosition === 'right') { \n          this.handleClassList(itemMenu, 'add', 'right')\n        }\n      }\n\n      if(e.type.toUpperCase() === 'MOUSELEAVE') { \n        this.handleClassList(itemMenu, 'remove', 'open')\n        if(menuPosition === 'left') { \n          this.handleClassList(itemMenu, 'remove', 'left')\n        } else if (menuPosition === 'right') { \n          this.handleClassList(itemMenu, 'remove', 'right')\n        }\n      }\n    }\n  }\n\n  handleLabelWrapper() { \n    const labelWrapper = this.el.shadowRoot.querySelector('.label__wrapper');\n    const navItem = this.getNavBarItem();\n    const slot = labelWrapper.querySelector('slot');\n    if (!slot.assignedNodes().length) {\n      navItem.classList.add('removeLabel')\n    } else if(this.showLabel && navItem.classList.contains('removeLabel')) {\n      navItem.classList.remove('removeLabel')\n    }\n  }\n\n  handleItemGap() { \n    const innerContentWrapper = this.el.shadowRoot.querySelector('.navbar__item')\n    const numberIndicatorWrapper = innerContentWrapper.querySelector('.navbar__container-right-content-navigation-item-icon-wrapper');\n    if(this.numberIndicator || this.dotIndicator) { \n      this.handleClassList(numberIndicatorWrapper, 'add', 'no-gap')\n    } else { \n      this.handleClassList(numberIndicatorWrapper, 'remove', 'no-gap')\n    }\n  }\n\n  removeEmptyItem() { \n    const hostElement = this.el.shadowRoot.host;\n    if(!this.showLabel && !this.icon) { \n      this.handleClassList(hostElement, 'add', 'hidden')\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"container\" onMouseLeave={e => this.handleNestedLayerMenu(e)}  onMouseEnter={e => this.handleNestedLayerMenu(e)}>\n        <div class=\"sub__layer-back-button\">\n          <div class=\"back__button-wrapper\" onClick={() => this.returnToFirstLayer()}>\n            <ifx-icon icon=\"arrow-left-16\" />\n            <span>Back</span>\n          </div>\n        </div>\n        <a href={this.internalHref} target={this.target} onClick={() => this.toggleItemMenu()} class=   {`navbar__item ${this.isSidebarMenuItem ? 'sidebarMenuItem' : \"\"} ${!this.showLabel ? 'removeLabel' : \"\"} ${this.isMenuItem ? 'menuItem' : \"\"} ${this.hasChildNavItems ? 'isParent' : \"\"}`}>\n          <div class=\"inner__content-wrapper\">\n            <div class={`navbar__container-right-content-navigation-item-icon-wrapper ${!this.icon ? \"removeWrapper\" : \"\"}`}>\n              {this.icon && <ifx-icon icon={this.icon}></ifx-icon>}\n              {this.icon && !this.showLabel && !isNaN(this.numberIndicator) && \n              <div class=\"number__indicator-wrapper\">\n                <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n              </div>}\n              {this.icon && !this.showLabel && !this.numberIndicator && this.dotIndicator && \n            <div class=\"dot__indicator-wrapper\"></div>}\n            </div>\n\n            {this.itemPosition === 'left' \n            && this.hasChildNavItems \n            && this.isMenuItem && \n            <div class=\"menuItemLeftIconWrapper\">\n                <ifx-icon icon=\"chevron-left-12\" />\n            </div>}\n\n            <span class=\"label__wrapper\">\n              <slot />\n            </span>\n          </div>\n\n          {this.showLabel && this.numberIndicator && !isNaN(this.numberIndicator) ? \n            <div class=\"number__indicator-wrapper\">\n                <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n            </div> : \"\"}\n\n            {this.showLabel && !this.numberIndicator && this.dotIndicator ? \n            <div class=\"dot__indicator-wrapper\"></div> : \"\"}\n\n          <div class={`navItemIconWrapper ${this.hasChildNavItems && !this.isMenuItem && !this.isSidebarMenuItem ? '' : \"hide\"}`}>\n            <ifx-icon icon=\"chevron-down-12\" />\n          </div>\n          \n         {<div class={`menuItemRightIconWrapper ${((this.itemPosition === 'right' && this.hasChildNavItems && this.isMenuItem) || (this.isSidebarMenuItem && this.hasChildNavItems)) ? '' : \"hide\"}`}>\n            <ifx-icon icon=\"chevron-right-12\" />\n          </div>}\n        </a>\n        \n        {this.hasChildNavItems && !this.isSidebarMenuItem && <ul class='navbar-menu'> <slot name=\"first__layer\" /> </ul>}\n        {this.isSidebarMenuItem && <ul class='sub__layer-menu'> <slot name=\"second__layer\" /> </ul>}\n\n      </div>\n    )\n  }\n}"],"version":3}
+{"file":"ifx-navbar-item.js","mappings":"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","names":[],"sources":["src/components/navigation/navbar/navbar-item.scss?tag=ifx-navbar-item&encapsulation=shadow","src/components/navigation/navbar/navbar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host(.hidden) {\n  display: none;\n}\n\n.navbar__item {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px 8px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  font-family: tokens.$ifxFontFamilyBody;\n  text-decoration: none;\n  font-weight: 400;\n  font-size: 16px;\n  color: tokens.$ifxColorBaseBlack;\n\n  &.hide { \n    display: none;\n  }\n\n  &.isParent { \n    gap: 8px;\n  }\n\n  & .navItemIconWrapper { \n    transition: .3s;\n  }\n\n  &.open { \n    & .navItemIconWrapper { \n      transform: rotate(-180deg);\n      transition: .3s;\n    }\n  }\n\n  &:hover {\n    color: tokens.$ifxColorOcean500;\n    cursor: pointer;\n\n    & .username__tooltip { \n      display: block;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper { \n      & .initials__wrapper { \n        cursor: pointer;\n        background-color: tokens.$ifxColorOcean600;\n      }\n    }\n  }\n\n  &.remove {\n    display: none;\n  }\n\n  &.removeLabel {\n    & .label__wrapper {\n      display: none;\n    }\n  }\n\n  & .number__indicator-wrapper { \n    position: relative;\n    top: -11px;\n  }\n\n  & .navbar__container-right-content-navigation-item-icon-wrapper {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px;\n    gap: 8px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n \n    & .username__tooltip { \n      display: none;\n      position: absolute;\n      top: 35px;\n      right: 0;\n      text-wrap: nowrap;\n      padding: 1px 5px;\n      font-size: 13px;\n      font-family: \"Source Sans 3\";\n      background-color: black;\n      color: #fff;\n      z-index: 99;\n    }\n\n    &:hover { \n      & .username__tooltip { \n        display: block;\n      }\n    }\n\n    & .initials__wrapper { \n      display: flex;\n      width: 24px;\n      height: 24px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100%;\n      background-color: tokens.$ifxColorOcean500;\n\n      & .initials { \n        color: #FFF;\n        text-align: center;\n        font-family: \"Source Sans 3\";\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 20px; \n\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -khtml-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        user-select: none;\n      \n      }\n    }\n\n    & img { \n      width: 24px; \n      height: 24px;\n      border-radius: 100%;\n    }\n\n    &.removeWrapper {\n      display: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n}\n\n.container { \n  position: relative;\n\n  & .sub__layer-back-button { \n    display: none;\n    &.show { \n      display: flex;\n      justify-content: flex-start;\n\n      & .back__button-wrapper { \n        display: flex;\n        align-items: center;\n        gap: tokens.$ifxSpace100;\n        padding: tokens.$ifxSpace100 0 tokens.$ifxSpace200 0;\n        color: tokens.$ifxColorOcean500;\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 24px;\n\n        & span, & ifx-icon { \n          &:hover { \n            cursor: pointer;\n          }\n        }\n\n      }\n    }\n  }\n\n  &.hide { \n    display: none;\n  }\n\n  & .inner__content-wrapper { \n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    &.no-gap { \n      gap: 0px;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper {\n      &.no-gap { \n        gap: 0px;\n      }\n    }\n\n    & .number__indicator-wrapper { \n      position: relative;\n      top: -11px;\n    }\n\n  }\n}\n\n.navbar-menu  {\n  position: absolute;\n  display: none;\n  list-style-type: none;\n  visibility: visible;\n  flex-direction: column;\n  width: 224px;\n  min-width: 224px;\n  background: tokens.$ifxColorBaseWhite;\n  box-shadow: 0px 6px 9px 0px #1d1d1d1a;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  padding: 8px 0px;\n  font-family: tokens.$ifxFontFamilyBody;\n\n  &.open:not(.itemInMobileMenu) {\n    display: flex;\n  }\n\n  &.itemInMobileMenu { \n    display: none;\n  }\n\n  &.right { \n    left: 100%;\n    top: -40%;\n  }\n\n  &.left { \n    top: -40%;\n    right: 100%;\n  }\n\n  &.rightSideItemMenu { \n    left: initial;\n    right: 0px;\n  }\n}\n\n.navbar__item { \n    &.layer__item-parent { \n      color: tokens.$ifxColorBaseBlack;\n      font-size: 24px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 32px; \n      letter-spacing: -0.24px;\n      cursor: initial;\n\n      & .navbar__container-right-content-navigation-item-icon-wrapper { \n        & ifx-icon { \n          & svg { \n            width: 24px;\n            height: 24px;\n          }\n        }\n      }\n    }\n\n\n  &.sidebarMenuItem { \n    justify-content: space-between;\n    padding: 0;\n  }\n\n\n  &.menuItem {\n    text-decoration: none;\n    color: tokens.$ifxColorBaseBlack;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 8px 16px;\n    gap: 8px;\n    font-family: tokens.$ifxFontFamilyBody;\n  \n    &.hide {\n      display: none;\n    }\n  \n    & .label__wrapper {\n      color: tokens.$ifxColorBaseBlack;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n  \n    &:hover {\n      cursor: pointer;\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  \n    &:active {\n      background-color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.sub__layer-menu { \n  padding: 5px;\n  display: none;\n\n  &.remove__margin { \n    margin: 0;\n    padding: 0;\n  }\n \n  &.open { \n    display: block;\n  }\n}\n\n.navbar__item { \n  &.hide { \n    display: none;\n  }\n}\n\n.menuItemRightIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n.navItemIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n","import { Component, h, Element, Prop, State, Listen, Method, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-navbar-item',\n  styleUrl: 'navbar-item.scss',\n  shadow: true\n})\n\nexport class NavbarItem {\n\n  @Element() el;\n  @Prop() showLabel: boolean = true;\n  @Prop() icon: string = \"\"\n  @Prop() href: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() hideOnMobile: boolean = true;\n  @State() internalHref: string = \"\"\n  @State() isMenuItem: boolean = false;\n  @State() hasChildNavItems: boolean = false;\n  @State() isSidebarMenuItem: boolean = false;\n  @State() itemPosition: string;\n  @Event() ifxNavItem: EventEmitter;\n  @Prop() numberIndicator: number;\n  @Prop() dotIndicator: boolean = false;\n \n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const itemMenu = this.getItemMenu()\n    if(itemMenu) { \n      if(itemMenu.classList.contains('open')) { \n        if (!path.includes(this.el)) {\n          this.closeItemMenu();\n        }\n      }\n    }\n  }\n\n  @Method()\n  async hideComponent() { \n    this.el.style.display = 'none';\n  }\n\n  @Method()\n  async showComponent() { \n    this.el.style.display = '';\n  }\n\n  @Method()\n  async toggleChildren(action) { \n    const itemMenu = this.getItemMenu()\n    const arrowIcon = this.getChevronDownIconWrapper()\n    if(itemMenu) { \n      this.handleClassList(arrowIcon, action, 'hide')\n      this.handleClassList(itemMenu, action, 'itemInMobileMenu')\n    }\n  }\n\n  @Method()\n  async moveChildComponentsIntoSubLayerMenu() { \n    const subLayerMenu = this.getItemMenu()\n    if(subLayerMenu) { \n      const subLayerMenuIsOpened = this.handleClassList(subLayerMenu, 'contains', 'open')\n      if(subLayerMenuIsOpened) { \n        const navbarItem = this.getNavBarItem()\n        const subLayerBackButton = this.getSubLayerBackButton()\n        this.handleClassList(navbarItem, 'add', 'layer__item-parent')\n        this.handleClassList(subLayerBackButton, 'add', 'show')\n        this.ifxNavItem.emit({component: this.el, action: 'hideFirstLayer'})\n      }\n    }\n\n    const navItems = this.el.querySelectorAll('[slot=\"first__layer\"]')\n    this.isSidebarMenuItem = true;\n\n    for(let i = 0; i < navItems.length; i++) { \n      navItems[i].setAttribute('slot', 'second__layer')\n      navItems[i].moveChildComponentsIntoSubLayerMenu()\n    }\n  }\n\n  getSubLayerBackButton() { \n    const sublayerBackButton = this.el.shadowRoot.querySelector('.sub__layer-back-button')\n    return sublayerBackButton\n  }\n\n  @Method()\n  async toggleFirstLayerItem(actionOne, actionTwo) { \n   const navbarItem = this.getNavBarItem()\n   const secondLayerMenu = this.getSubLayerMenu()\n   const subLayerBackButton = this.getSubLayerBackButton()\n   this.handleClassList(subLayerBackButton, [actionOne], 'show')\n   this.handleClassList(navbarItem, [actionTwo], 'hide')\n   this.handleClassList(secondLayerMenu, [actionTwo], 'remove__margin')\n  }\n\n  openSubLayerMenu() { \n    if(this.hasChildNavItems) { \n      const subLayerBackButton = this.getSubLayerBackButton()\n      const rightArrowIcon = this.getRightArrowIcon()\n      const navbarItem = this.getNavBarItem()\n      const subLayerMenu = this.getSubLayerMenu()\n      const slotName = this.el.getAttribute('slot')\n\n      this.handleClassList(subLayerBackButton, 'add', 'show')\n      this.handleClassList(rightArrowIcon, 'add', 'hide')\n      this.handleClassList(navbarItem, 'add', 'layer__item-parent')\n      this.handleClassList(subLayerMenu, 'add', 'open')\n    \n      if(slotName.toLowerCase() === 'second__layer') {\n        this.ifxNavItem.emit({component: this.el, parent: this.el.parentElement, action: 'hideSecondLayer'})\n        this.handleClassList(navbarItem, 'remove', 'menuItem')\n      } else { \n        this.ifxNavItem.emit({component: this.el, action: 'hideFirstLayer'})\n      }\n    }\n  }\n\n  @Method()\n  async addMenuItemClass() { \n    const navbarItem = this.getNavBarItem()\n    this.handleClassList(navbarItem, 'add', 'menuItem')\n    const rightArrowIcon = this.getRightArrowIcon()\n    if(this.hasChildNavItems) { \n      this.handleClassList(rightArrowIcon, 'remove', 'hide')\n    }\n  }\n\n  @Method()\n  async moveChildComponentsBackIntoNavbar() { \n    const subLayerBackButton = this.getSubLayerBackButton()\n    const navbarItem = this.getNavBarItem()\n    const secondLayerMenu = this.getSubLayerMenu()\n\n    this.handleClassList(subLayerBackButton, 'remove', 'show')\n    this.handleClassList(navbarItem, 'remove', 'layer__item-parent')\n    this.handleClassList(secondLayerMenu, 'remove', 'remove__margin')\n\n    this.ifxNavItem.emit({component: this.el, action: 'show'})\n\n    const navItems = this.el.querySelectorAll('[slot=\"second__layer\"]')\n    this.isSidebarMenuItem = false;\n    this.showComponent()\n    this.handleClassList(navbarItem, 'remove', 'hide')\n\n    for(let i = 0; i < navItems.length; i++) { \n      navItems[i].setAttribute('slot', 'first__layer')\n      navItems[i].moveChildComponentsBackIntoNavbar()\n      navItems[i].addMenuItemClass()\n      navItems[i].returnToFirstLayer()\n    }\n  }\n\n  getRightArrowIcon() { \n    const menuItemRightIconWrapper = this.el.shadowRoot.querySelector('.menuItemRightIconWrapper')\n    return menuItemRightIconWrapper;\n  }\n\n  getChevronDownIconWrapper() { \n    const arrowIcon = this.el.shadowRoot.querySelector('.navItemIconWrapper');\n    return arrowIcon;\n  }\n\n  @Method()\n  async returnToFirstLayer() { \n    const subLayerBackButton = this.getSubLayerBackButton()\n    const navbarItem = this.getNavBarItem()\n    const rightArrowIcon = this.getRightArrowIcon()\n    const subLayerMenu = this.getSubLayerMenu()\n    const slotName = this.el.getAttribute('slot')\n\n    this.handleClassList(subLayerBackButton, 'remove', 'show')\n    this.handleClassList(navbarItem, 'remove', 'layer__item-parent')\n    this.handleClassList(subLayerMenu, 'remove', 'open')\n    if(this.hasChildNavItems) { \n      this.handleClassList(rightArrowIcon, 'remove', 'hide')\n    }\n\n    if(slotName.toLowerCase() === 'second__layer') {\n      this.ifxNavItem.emit({component: this.el, parent: this.el.parentElement, action: 'returnToSecondLayer'})\n      this.handleClassList(navbarItem, 'add', 'menuItem')\n    } else { \n      this.ifxNavItem.emit({component: this.el, action: 'return'})\n    }\n  }\n\n  componentWillLoad() {\n    this.setHref()\n    this.checkIfItemIsNested()\n    this.checkIfItemHasChildren()\n    this.removeEmptyItem()\n  }\n\n  componentDidLoad() { \n    this.handleItemGap()\n    this.handleLabelWrapper()\n    if(this.hasChildNavItems) { \n      const navItems = this.getNavbarItems();\n      this.relocateItemsToFirstlayer(navItems)\n    }\n  }\n\n  componentDidUpdate() { \n    const navbarItem = this.getNavBarItem()\n    const isLayerItemParent = this.handleClassList(navbarItem, 'contains', 'layer__item-parent')\n    if(this.isSidebarMenuItem && isLayerItemParent) {\n      const rightArrowIcon = this.getRightArrowIcon()\n      this.handleClassList(rightArrowIcon, 'add', 'hide')\n    }\n  }\n \n  @Method()\n  async setMenuItemPosition() { \n    if(this.isMenuItem && this.hasChildNavItems) { \n      const menuPosition = this.getItemMenuPosition()\n      if(menuPosition === 'left') { \n        this.itemPosition = 'left'\n      } else if(menuPosition === 'right') { \n        this.itemPosition = 'right'\n      }\n    }\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getNavbarItems() {\n    const navItems = this.el.querySelectorAll('ifx-navbar-item')\n    return navItems;\n  }\n  \n  getNavBarItem() { \n    const navItem = this.el.shadowRoot.querySelector('.navbar__item')\n    return navItem;\n  }\n\n  getSubLayerMenu() { \n    const subLayerMenu = this.el.shadowRoot.querySelector('.sub__layer-menu')\n    return subLayerMenu;\n  }\n\n  relocateItemsToFirstlayer(navItems) { \n     navItems.forEach(item => {\n      item.setAttribute('slot', 'first__layer')\n    })\n  }\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  checkIfItemIsNested() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-NAVBAR-ITEM' \n    || parentElement.tagName.toUpperCase() === 'IFX-NAVBAR-PROFILE') {\n      this.isMenuItem = true;\n      return;\n    } else {\n      this.isMenuItem = false;\n    }\n  }\n\n  checkIfItemHasChildren() { \n    const sidebarItems = this.getNavbarItems();\n    if (sidebarItems.length !== 0) {\n      this.hasChildNavItems = true;\n    } else {\n      this.hasChildNavItems = false;\n    } \n  }\n\n  @Method()\n  async setItemSideSpecifications() {  \n    const menuItem = this.el;\n    const itemMenu = this.getItemMenu()\n    const slotValue = menuItem.getAttribute('slot')\n \n    if(slotValue.toLowerCase().trim() === \"right-item\") { \n      this.handleClassList(itemMenu, 'add', 'rightSideItemMenu')\n    }\n\n    return true;\n  }\n\n  getItemMenu() { \n    const menu = this.el.shadowRoot.querySelector('.navbar-menu');\n    return menu;\n  }\n\n  closeItemMenu() { \n    const itemMenu = this.getItemMenu()\n    const menuItem = this.getNavBarItem()\n    if(itemMenu) { \n      this.handleClassList(itemMenu, 'remove', 'open')\n      this.handleClassList(menuItem, 'remove', 'open')\n    }\n  }\n\n  getItemMenuPosition() {\n    let parentElement = this.el;\n    while(parentElement) {\n      if(parentElement.tagName === 'IFX-NAVBAR-PROFILE' || parentElement.slot === 'right-item') {\n        return 'left'\n      }\n      parentElement = parentElement.parentElement || parentElement.getRootNode().host;\n    }\n    return 'right'\n  }\n  \n  toggleItemMenu() {\n    const slotName = this.el.getAttribute('slot')\n\n    if(slotName.toLowerCase() === 'mobile-menu-top' || slotName.toLowerCase() === 'second__layer') { \n      this.openSubLayerMenu()\n    }\n\n    if(!this.internalHref && slotName.toLowerCase() !== 'mobile-menu-top' && slotName.toLowerCase() !== 'second__layer' ) {   \n      const itemMenu = this.getItemMenu()\n    \n      if(this.hasChildNavItems) { \n        const menuItem = this.getNavBarItem()\n        this.handleClassList(itemMenu, 'toggle', 'open');\n        this.handleClassList(menuItem, 'toggle', 'open');\n      } \n    }\n  }\n\n  handleNestedLayerMenu(e) { \n    if(this.isMenuItem && this.hasChildNavItems && !this.isSidebarMenuItem) { \n      const itemMenu = this.getItemMenu()\n      const menuPosition = this.getItemMenuPosition()\n      if(e.type.toUpperCase() === 'MOUSEENTER') { \n        this.handleClassList(itemMenu, 'add', 'open')\n        if(menuPosition === 'left') { \n          this.handleClassList(itemMenu, 'add', 'left')\n        } else if(menuPosition === 'right') { \n          this.handleClassList(itemMenu, 'add', 'right')\n        }\n      }\n\n      if(e.type.toUpperCase() === 'MOUSELEAVE') { \n        this.handleClassList(itemMenu, 'remove', 'open')\n        if(menuPosition === 'left') { \n          this.handleClassList(itemMenu, 'remove', 'left')\n        } else if (menuPosition === 'right') { \n          this.handleClassList(itemMenu, 'remove', 'right')\n        }\n      }\n    }\n  }\n\n  handleLabelWrapper() { \n    const labelWrapper = this.el.shadowRoot.querySelector('.label__wrapper');\n    const navItem = this.getNavBarItem();\n    const slot = labelWrapper.querySelector('slot');\n    if (!slot.assignedNodes().length) {\n      navItem.classList.add('removeLabel')\n    } else if(this.showLabel && navItem.classList.contains('removeLabel')) {\n      navItem.classList.remove('removeLabel')\n    }\n  }\n\n  handleItemGap() { \n    const innerContentWrapper = this.el.shadowRoot.querySelector('.navbar__item')\n    const numberIndicatorWrapper = innerContentWrapper.querySelector('.navbar__container-right-content-navigation-item-icon-wrapper');\n    if(this.numberIndicator || this.dotIndicator) { \n      this.handleClassList(numberIndicatorWrapper, 'add', 'no-gap')\n    } else { \n      this.handleClassList(numberIndicatorWrapper, 'remove', 'no-gap')\n    }\n  }\n\n  removeEmptyItem() { \n    const hostElement = this.el.shadowRoot.host;\n    if(!this.showLabel && !this.icon) { \n      this.handleClassList(hostElement, 'add', 'hidden')\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"container\" onMouseLeave={e => this.handleNestedLayerMenu(e)}  onMouseEnter={e => this.handleNestedLayerMenu(e)}>\n        <div class=\"sub__layer-back-button\">\n          <div class=\"back__button-wrapper\" onClick={() => this.returnToFirstLayer()}>\n            <ifx-icon icon=\"arrow-left-16\" />\n            <span>Back</span>\n          </div>\n        </div>\n        <a href={this.internalHref} target={this.target} onClick={() => this.toggleItemMenu()} class=   {`navbar__item ${this.isSidebarMenuItem ? 'sidebarMenuItem' : \"\"} ${!this.showLabel ? 'removeLabel' : \"\"} ${this.isMenuItem ? 'menuItem' : \"\"} ${this.hasChildNavItems ? 'isParent' : \"\"}`}>\n          <div class=\"inner__content-wrapper\">\n            <div class={`navbar__container-right-content-navigation-item-icon-wrapper ${!this.icon ? \"removeWrapper\" : \"\"}`}>\n              {this.icon && <ifx-icon icon={this.icon}></ifx-icon>}\n              {this.icon && !this.showLabel && !isNaN(this.numberIndicator) && \n              <div class=\"number__indicator-wrapper\">\n                <ifx-indicator variant=\"number\" number={this.numberIndicator}></ifx-indicator>\n              </div>}\n              {this.icon && !this.showLabel && !this.numberIndicator && this.dotIndicator && \n            <div class=\"dot__indicator-wrapper\"></div>}\n            </div>\n\n            {this.itemPosition === 'left' \n            && this.hasChildNavItems \n            && this.isMenuItem && \n            <div class=\"menuItemLeftIconWrapper\">\n                <ifx-icon icon=\"chevron-left-12\" />\n            </div>}\n\n            <span class=\"label__wrapper\">\n              <slot />\n            </span>\n          </div>\n\n          {this.showLabel && this.numberIndicator && !isNaN(this.numberIndicator) ? \n            <div class=\"number__indicator-wrapper\">\n                <ifx-indicator variant=\"number\" number={this.numberIndicator}></ifx-indicator>\n            </div> : \"\"}\n\n            {this.showLabel && !this.numberIndicator && this.dotIndicator ? \n            <ifx-indicator variant=\"dot\" /> : \"\"}\n\n          <div class={`navItemIconWrapper ${this.hasChildNavItems && !this.isMenuItem && !this.isSidebarMenuItem ? '' : \"hide\"}`}>\n            <ifx-icon icon=\"chevron-down-12\" />\n          </div>\n          \n         {<div class={`menuItemRightIconWrapper ${((this.itemPosition === 'right' && this.hasChildNavItems && this.isMenuItem) || (this.isSidebarMenuItem && this.hasChildNavItems)) ? '' : \"hide\"}`}>\n            <ifx-icon icon=\"chevron-right-12\" />\n          </div>}\n        </a>\n        \n        {this.hasChildNavItems && !this.isSidebarMenuItem && <ul class='navbar-menu'> <slot name=\"first__layer\" /> </ul>}\n        {this.isSidebarMenuItem && <ul class='sub__layer-menu'> <slot name=\"second__layer\" /> </ul>}\n\n      </div>\n    )\n  }\n}"],"version":3}

package/dist/components/ifx-navbar-profile.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-2cc378b8.js';
 
-const navbarItemCss = ":host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:\"Source Sans 3\";text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .dot__indicator-wrapper{display:flex;width:8px;height:8px;justify-content:center;align-items:center;flex-shrink:0;border-radius:50%;background-color:#0A8276;position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:\"Source Sans 3\";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:\"Source Sans 3\";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:\"Source Sans 3\"}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:\"Source Sans 3\"}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}";
+const navbarItemCss = ":host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:\"Source Sans 3\";text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:\"Source Sans 3\";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:\"Source Sans 3\";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:\"Source Sans 3\"}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:\"Source Sans 3\"}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}";
 const IfxNavbarProfileStyle0 = navbarItemCss;
 
 const NavbarProfile = /*@__PURE__*/ proxyCustomElement(class NavbarProfile extends H {

package/dist/components/ifx-navbar-profile.js.map

@@ -1 +1 @@
-{"file":"ifx-navbar-profile.js","mappings":"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","names":[],"sources":["src/components/navigation/navbar/navbar-item.scss?tag=ifx-navbar-profile&encapsulation=shadow","src/components/navigation/navbar/navbar-profile.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host(.hidden) {\n  display: none;\n}\n\n.navbar__item {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px 8px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  font-family: tokens.$ifxFontFamilyBody;\n  text-decoration: none;\n  font-weight: 400;\n  font-size: 16px;\n  color: tokens.$ifxColorBaseBlack;\n\n  &.hide { \n    display: none;\n  }\n\n  &.isParent { \n    gap: 8px;\n  }\n\n  & .navItemIconWrapper { \n    transition: .3s;\n  }\n\n  &.open { \n    & .navItemIconWrapper { \n      transform: rotate(-180deg);\n      transition: .3s;\n    }\n  }\n\n  &:hover {\n    color: tokens.$ifxColorOcean500;\n    cursor: pointer;\n\n    & .username__tooltip { \n      display: block;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper { \n      & .initials__wrapper { \n        cursor: pointer;\n        background-color: tokens.$ifxColorOcean600;\n      }\n    }\n  }\n\n  &.remove {\n    display: none;\n  }\n\n  &.removeLabel {\n    & .label__wrapper {\n      display: none;\n    }\n  }\n\n  & .number__indicator-wrapper { \n    position: relative;\n    top: -11px;\n  }\n\n  & .dot__indicator-wrapper { \n    display: flex;\n    width: 8px;\n    height: 8px;\n    justify-content: center;\n    align-items: center;\n    flex-shrink: 0;\n    border-radius: 50%;\n    background-color: tokens.$ifxColorOcean500;\n    position: relative;\n    top: -11px;\n  }\n\n  & .navbar__container-right-content-navigation-item-icon-wrapper {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px;\n    gap: 8px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n \n    & .username__tooltip { \n      display: none;\n      position: absolute;\n      top: 35px;\n      right: 0;\n      text-wrap: nowrap;\n      padding: 1px 5px;\n      font-size: 13px;\n      font-family: \"Source Sans 3\";\n      background-color: black;\n      color: #fff;\n      z-index: 99;\n    }\n\n    &:hover { \n      & .username__tooltip { \n        display: block;\n      }\n    }\n\n    & .initials__wrapper { \n      display: flex;\n      width: 24px;\n      height: 24px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100%;\n      background-color: tokens.$ifxColorOcean500;\n\n      & .initials { \n        color: #FFF;\n        text-align: center;\n        font-family: \"Source Sans 3\";\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 20px; \n\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -khtml-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        user-select: none;\n      \n      }\n    }\n\n    & img { \n      width: 24px; \n      height: 24px;\n      border-radius: 100%;\n    }\n\n    &.removeWrapper {\n      display: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n}\n\n.container { \n  position: relative;\n\n  & .sub__layer-back-button { \n    display: none;\n    &.show { \n      display: flex;\n      justify-content: flex-start;\n\n      & .back__button-wrapper { \n        display: flex;\n        align-items: center;\n        gap: tokens.$ifxSpace100;\n        padding: tokens.$ifxSpace100 0 tokens.$ifxSpace200 0;\n        color: tokens.$ifxColorOcean500;\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 24px;\n\n        & span, & ifx-icon { \n          &:hover { \n            cursor: pointer;\n          }\n        }\n\n      }\n    }\n  }\n\n  &.hide { \n    display: none;\n  }\n\n  & .inner__content-wrapper { \n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    &.no-gap { \n      gap: 0px;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper {\n      &.no-gap { \n        gap: 0px;\n      }\n    }\n\n    & .number__indicator-wrapper { \n      position: relative;\n      top: -11px;\n    }\n\n  }\n}\n\n.navbar-menu  {\n  position: absolute;\n  display: none;\n  list-style-type: none;\n  visibility: visible;\n  flex-direction: column;\n  width: 224px;\n  min-width: 224px;\n  background: tokens.$ifxColorBaseWhite;\n  box-shadow: 0px 6px 9px 0px #1d1d1d1a;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  padding: 8px 0px;\n  font-family: tokens.$ifxFontFamilyBody;\n\n  &.open:not(.itemInMobileMenu) {\n    display: flex;\n  }\n\n  &.itemInMobileMenu { \n    display: none;\n  }\n\n  &.right { \n    left: 100%;\n    top: -40%;\n  }\n\n  &.left { \n    top: -40%;\n    right: 100%;\n  }\n\n  &.rightSideItemMenu { \n    left: initial;\n    right: 0px;\n  }\n}\n\n.navbar__item { \n    &.layer__item-parent { \n      color: tokens.$ifxColorBaseBlack;\n      font-size: 24px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 32px; \n      letter-spacing: -0.24px;\n      cursor: initial;\n\n      & .navbar__container-right-content-navigation-item-icon-wrapper { \n        & ifx-icon { \n          & svg { \n            width: 24px;\n            height: 24px;\n          }\n        }\n      }\n    }\n\n\n  &.sidebarMenuItem { \n    justify-content: space-between;\n    padding: 0;\n  }\n\n\n  &.menuItem {\n    text-decoration: none;\n    color: tokens.$ifxColorBaseBlack;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 8px 16px;\n    gap: 8px;\n    font-family: tokens.$ifxFontFamilyBody;\n  \n    &.hide {\n      display: none;\n    }\n  \n    & .label__wrapper {\n      color: tokens.$ifxColorBaseBlack;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n  \n    &:hover {\n      cursor: pointer;\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  \n    &:active {\n      background-color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.sub__layer-menu { \n  padding: 5px;\n  display: none;\n\n  &.remove__margin { \n    margin: 0;\n    padding: 0;\n  }\n \n  &.open { \n    display: block;\n  }\n}\n\n.navbar__item { \n  &.hide { \n    display: none;\n  }\n}\n\n.menuItemRightIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n.navItemIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n","import { Component, h, Element, Prop, State, Listen, Method } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-navbar-profile',\n  styleUrl: 'navbar-item.scss',\n  shadow: true,\n  assetsDirs: ['assets']\n})\n\nexport class NavbarProfile {\n\n  @Element() el;\n  @Prop() showLabel: boolean = true;\n  @Prop() href: string = \"\"\n  @Prop() imageUrl: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() alt: string = \"\"\n  @Prop() userName: string = \"\";\n  @State() internalHref: string = \"\"\n  @State() isMenuItem: boolean = false;\n  @State() hasChildNavItems: boolean = false;\n  @State() internalImageUrl: any = {type: \"\", value: \"\"}\n \n  private defaultProfileImage = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"48\" height=\"48\" fill=\"#0A8276\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M24 14C21.7909 14 20 15.7909 20 18C20 20.2091 21.7909 22 24 22C26.2091 22 28 20.2091 28 18C28 15.7909 26.2091 14 24 14ZM18 18C18 14.6863 20.6863 12 24 12C27.3137 12 30 14.6863 30 18C30 21.3137 27.3137 24 24 24C20.6863 24 18 21.3137 18 18ZM16.5869 28.3984C18.2683 27.0179 20.7466 26 24 26C27.2541 26 29.7324 27.0209 31.4134 28.4024C33.0562 29.7526 34 31.5119 34 33V35C34 35.5523 33.5523 36 33 36H15C14.4477 36 14 35.5523 14 35V33C14 31.5074 14.9433 29.7479 16.5869 28.3984ZM17.8561 29.9441C16.5187 31.0421 16 32.2826 16 33V34H32V33C32 32.2881 31.4818 31.0474 30.1436 29.9476C28.8436 28.8791 26.8219 28 24 28C21.1774 28 19.1557 28.8771 17.8561 29.9441Z\" fill=\"white\"/>\n</svg>`\n\n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const itemMenu = this.getItemMenu()\n    if(itemMenu) { \n      if(itemMenu.classList.contains('open')) { \n        if (!path.includes(this.el)) {\n          this.closeItemMenu();\n        }\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.setHref()\n    this.setImage()\n    const sidebarItems = this.getNavbarItems();\n    if (sidebarItems.length !== 0) {\n      this.hasChildNavItems = true;\n    } else {\n      this.hasChildNavItems = false;\n    }\n  }\n\n  componentDidLoad() { \n    this.setProfileGap()\n    if(this.hasChildNavItems) { \n      const navItems = this.getNavbarItems();\n      this.appendNavItemToMenu(navItems)\n    }\n  }\n\n  @Method()\n  async hideComponent() { \n    this.el.style.display = 'none';\n  }\n\n  @Method()\n  async showComponent() { \n    this.el.style.display = '';\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getNavbarItems() {\n    const navItems = this.el.querySelectorAll('ifx-navbar-item')\n    return navItems;\n  }\n  \n  getNavBarItem() { \n    const navItem = this.el.shadowRoot.querySelector('.navbar__item')\n    return navItem;\n  }\n\n  relocateUsingSlot(navItems) { \n    navItems.forEach(item => {\n     item.setAttribute('slot', 'first__layer')\n   })\n }\n\n  appendNavItemToMenu(navItems) { \n    this.relocateUsingSlot(navItems)\n  }\n\n  isValidHttpUrl(string) {\n    let url;\n    \n    try {\n      url = new URL(string);\n    } catch (_) {\n      return false;  \n    }\n  \n    return url.protocol === \"http:\" || url.protocol === \"https:\";\n  }\n\n  setImage() { \n    if (this.imageUrl.toLowerCase().trim() === \"\") {\n      this.internalImageUrl = {type: undefined, value: \"\"}\n    } else if(this.isValidHttpUrl(this.imageUrl)) {\n      this.internalImageUrl = { type: 'url', value: this.imageUrl}\n    } else { \n      this.internalImageUrl = { type: 'initials', value: this.imageUrl}\n    }\n  }\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  setProfileGap() { \n    const innerContentWrapper = this.el.shadowRoot.querySelector('.inner__content-wrapper')\n    const labelWrapper = this.el.shadowRoot.querySelector('.label__wrapper')\n    const labelSlot = labelWrapper.querySelector('slot')\n    const nodes = labelSlot.assignedNodes();\n    if(!nodes.length) { \n      this.handleClassList(innerContentWrapper, 'add', 'no-gap')\n    } else { \n      this.handleClassList(innerContentWrapper, 'remove', 'no-gap')\n    }\n  }\n\n  getItemMenu() { \n    const menu = this.el.shadowRoot.querySelector('.navbar-menu');\n    return menu;\n  }\n\n  closeItemMenu() { \n    const itemMenu = this.getItemMenu()\n    const menuItem = this.getNavBarItem()\n    if(itemMenu) { \n      this.handleClassList(itemMenu, 'remove', 'open')\n      this.handleClassList(menuItem, 'remove', 'open')\n    }\n  }\n\n  toggleItemMenu() {\n    if(!this.internalHref) {     \n      if(this.isMenuItem && this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu()\n        this.handleClassList(itemMenu, 'add', 'right')\n      }\n   \n      if(this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu();\n        const menuItem = this.getNavBarItem()\n        this.handleClassList(itemMenu, 'toggle', 'open');\n        this.handleClassList(menuItem, 'toggle', 'open');\n      } \n    }\n  }\n\n  itemHasNestedItems() { \n    const childNavItem = this.el.shadowRoot.querySelector('ifx-navbar-item')\n    if(childNavItem) { \n      return true;\n    } else {\n      return false;\n    }\n  }\n\n\n  render() {\n    return (\n      <div class=\"container\">\n        <a href={this.internalHref} target={this.target} onClick={() => this.toggleItemMenu()} class=   {`navbar__item ${!this.showLabel ? 'removeLabel' : \"\"} ${this.hasChildNavItems ? 'isParent' : \"\"}`}>\n          <div class=\"inner__content-wrapper\">\n            <div class={`navbar__container-right-content-navigation-item-icon-wrapper`}>\n             {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>}\n\n             {this.internalImageUrl.type !== 'initials' && \n              <img src={ this.internalImageUrl.type === 'url' ? this.internalImageUrl.value : `data:image/svg+xml,${encodeURIComponent(this.defaultProfileImage)}`} alt={this.alt} />}\n\n              {this.internalImageUrl.type === 'initials' && \n              <div class=\"initials__wrapper\">\n                <span class=\"initials\">{this.internalImageUrl.value}</span>\n              </div>}\n              \n            </div>\n            <span class=\"label__wrapper\">\n              <slot onSlotchange={() => this.setProfileGap()} />\n            </span>\n          </div>\n          {/* {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>} */}\n        </a>\n        \n        {this.hasChildNavItems && <ul class='navbar-menu rightSideItemMenu'> <slot name=\"first__layer\" /> </ul>}\n      </div>\n    )\n  }\n}"],"version":3}
+{"file":"ifx-navbar-profile.js","mappings":"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","names":[],"sources":["src/components/navigation/navbar/navbar-item.scss?tag=ifx-navbar-profile&encapsulation=shadow","src/components/navigation/navbar/navbar-profile.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host(.hidden) {\n  display: none;\n}\n\n.navbar__item {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0px 8px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  font-family: tokens.$ifxFontFamilyBody;\n  text-decoration: none;\n  font-weight: 400;\n  font-size: 16px;\n  color: tokens.$ifxColorBaseBlack;\n\n  &.hide { \n    display: none;\n  }\n\n  &.isParent { \n    gap: 8px;\n  }\n\n  & .navItemIconWrapper { \n    transition: .3s;\n  }\n\n  &.open { \n    & .navItemIconWrapper { \n      transform: rotate(-180deg);\n      transition: .3s;\n    }\n  }\n\n  &:hover {\n    color: tokens.$ifxColorOcean500;\n    cursor: pointer;\n\n    & .username__tooltip { \n      display: block;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper { \n      & .initials__wrapper { \n        cursor: pointer;\n        background-color: tokens.$ifxColorOcean600;\n      }\n    }\n  }\n\n  &.remove {\n    display: none;\n  }\n\n  &.removeLabel {\n    & .label__wrapper {\n      display: none;\n    }\n  }\n\n  & .number__indicator-wrapper { \n    position: relative;\n    top: -11px;\n  }\n\n  & .navbar__container-right-content-navigation-item-icon-wrapper {\n    position: relative;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px;\n    gap: 8px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n \n    & .username__tooltip { \n      display: none;\n      position: absolute;\n      top: 35px;\n      right: 0;\n      text-wrap: nowrap;\n      padding: 1px 5px;\n      font-size: 13px;\n      font-family: \"Source Sans 3\";\n      background-color: black;\n      color: #fff;\n      z-index: 99;\n    }\n\n    &:hover { \n      & .username__tooltip { \n        display: block;\n      }\n    }\n\n    & .initials__wrapper { \n      display: flex;\n      width: 24px;\n      height: 24px;\n      justify-content: center;\n      align-items: center;\n      border-radius: 100%;\n      background-color: tokens.$ifxColorOcean500;\n\n      & .initials { \n        color: #FFF;\n        text-align: center;\n        font-family: \"Source Sans 3\";\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 20px; \n\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -khtml-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        user-select: none;\n      \n      }\n    }\n\n    & img { \n      width: 24px; \n      height: 24px;\n      border-radius: 100%;\n    }\n\n    &.removeWrapper {\n      display: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n}\n\n.container { \n  position: relative;\n\n  & .sub__layer-back-button { \n    display: none;\n    &.show { \n      display: flex;\n      justify-content: flex-start;\n\n      & .back__button-wrapper { \n        display: flex;\n        align-items: center;\n        gap: tokens.$ifxSpace100;\n        padding: tokens.$ifxSpace100 0 tokens.$ifxSpace200 0;\n        color: tokens.$ifxColorOcean500;\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: 24px;\n\n        & span, & ifx-icon { \n          &:hover { \n            cursor: pointer;\n          }\n        }\n\n      }\n    }\n  }\n\n  &.hide { \n    display: none;\n  }\n\n  & .inner__content-wrapper { \n    position: relative;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    &.no-gap { \n      gap: 0px;\n    }\n\n    & .navbar__container-right-content-navigation-item-icon-wrapper {\n      &.no-gap { \n        gap: 0px;\n      }\n    }\n\n    & .number__indicator-wrapper { \n      position: relative;\n      top: -11px;\n    }\n\n  }\n}\n\n.navbar-menu  {\n  position: absolute;\n  display: none;\n  list-style-type: none;\n  visibility: visible;\n  flex-direction: column;\n  width: 224px;\n  min-width: 224px;\n  background: tokens.$ifxColorBaseWhite;\n  box-shadow: 0px 6px 9px 0px #1d1d1d1a;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  padding: 8px 0px;\n  font-family: tokens.$ifxFontFamilyBody;\n\n  &.open:not(.itemInMobileMenu) {\n    display: flex;\n  }\n\n  &.itemInMobileMenu { \n    display: none;\n  }\n\n  &.right { \n    left: 100%;\n    top: -40%;\n  }\n\n  &.left { \n    top: -40%;\n    right: 100%;\n  }\n\n  &.rightSideItemMenu { \n    left: initial;\n    right: 0px;\n  }\n}\n\n.navbar__item { \n    &.layer__item-parent { \n      color: tokens.$ifxColorBaseBlack;\n      font-size: 24px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 32px; \n      letter-spacing: -0.24px;\n      cursor: initial;\n\n      & .navbar__container-right-content-navigation-item-icon-wrapper { \n        & ifx-icon { \n          & svg { \n            width: 24px;\n            height: 24px;\n          }\n        }\n      }\n    }\n\n\n  &.sidebarMenuItem { \n    justify-content: space-between;\n    padding: 0;\n  }\n\n\n  &.menuItem {\n    text-decoration: none;\n    color: tokens.$ifxColorBaseBlack;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 8px 16px;\n    gap: 8px;\n    font-family: tokens.$ifxFontFamilyBody;\n  \n    &.hide {\n      display: none;\n    }\n  \n    & .label__wrapper {\n      color: tokens.$ifxColorBaseBlack;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n  \n    &:hover {\n      cursor: pointer;\n      background-color: tokens.$ifxColorEngineering200;\n    }\n  \n    &:active {\n      background-color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.sub__layer-menu { \n  padding: 5px;\n  display: none;\n\n  &.remove__margin { \n    margin: 0;\n    padding: 0;\n  }\n \n  &.open { \n    display: block;\n  }\n}\n\n.navbar__item { \n  &.hide { \n    display: none;\n  }\n}\n\n.menuItemRightIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n.navItemIconWrapper { \n  &.hide { \n    display: none;\n  }\n}\n\n","import { Component, h, Element, Prop, State, Listen, Method } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-navbar-profile',\n  styleUrl: 'navbar-item.scss',\n  shadow: true,\n  assetsDirs: ['assets']\n})\n\nexport class NavbarProfile {\n\n  @Element() el;\n  @Prop() showLabel: boolean = true;\n  @Prop() href: string = \"\"\n  @Prop() imageUrl: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() alt: string = \"\"\n  @Prop() userName: string = \"\";\n  @State() internalHref: string = \"\"\n  @State() isMenuItem: boolean = false;\n  @State() hasChildNavItems: boolean = false;\n  @State() internalImageUrl: any = {type: \"\", value: \"\"}\n \n  private defaultProfileImage = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<rect width=\"48\" height=\"48\" fill=\"#0A8276\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M24 14C21.7909 14 20 15.7909 20 18C20 20.2091 21.7909 22 24 22C26.2091 22 28 20.2091 28 18C28 15.7909 26.2091 14 24 14ZM18 18C18 14.6863 20.6863 12 24 12C27.3137 12 30 14.6863 30 18C30 21.3137 27.3137 24 24 24C20.6863 24 18 21.3137 18 18ZM16.5869 28.3984C18.2683 27.0179 20.7466 26 24 26C27.2541 26 29.7324 27.0209 31.4134 28.4024C33.0562 29.7526 34 31.5119 34 33V35C34 35.5523 33.5523 36 33 36H15C14.4477 36 14 35.5523 14 35V33C14 31.5074 14.9433 29.7479 16.5869 28.3984ZM17.8561 29.9441C16.5187 31.0421 16 32.2826 16 33V34H32V33C32 32.2881 31.4818 31.0474 30.1436 29.9476C28.8436 28.8791 26.8219 28 24 28C21.1774 28 19.1557 28.8771 17.8561 29.9441Z\" fill=\"white\"/>\n</svg>`\n\n  @Listen('mousedown', { target: 'document' })\n  handleOutsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    const itemMenu = this.getItemMenu()\n    if(itemMenu) { \n      if(itemMenu.classList.contains('open')) { \n        if (!path.includes(this.el)) {\n          this.closeItemMenu();\n        }\n      }\n    }\n  }\n\n  componentWillLoad() {\n    this.setHref()\n    this.setImage()\n    const sidebarItems = this.getNavbarItems();\n    if (sidebarItems.length !== 0) {\n      this.hasChildNavItems = true;\n    } else {\n      this.hasChildNavItems = false;\n    }\n  }\n\n  componentDidLoad() { \n    this.setProfileGap()\n    if(this.hasChildNavItems) { \n      const navItems = this.getNavbarItems();\n      this.appendNavItemToMenu(navItems)\n    }\n  }\n\n  @Method()\n  async hideComponent() { \n    this.el.style.display = 'none';\n  }\n\n  @Method()\n  async showComponent() { \n    this.el.style.display = '';\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getNavbarItems() {\n    const navItems = this.el.querySelectorAll('ifx-navbar-item')\n    return navItems;\n  }\n  \n  getNavBarItem() { \n    const navItem = this.el.shadowRoot.querySelector('.navbar__item')\n    return navItem;\n  }\n\n  relocateUsingSlot(navItems) { \n    navItems.forEach(item => {\n     item.setAttribute('slot', 'first__layer')\n   })\n }\n\n  appendNavItemToMenu(navItems) { \n    this.relocateUsingSlot(navItems)\n  }\n\n  isValidHttpUrl(string) {\n    let url;\n    \n    try {\n      url = new URL(string);\n    } catch (_) {\n      return false;  \n    }\n  \n    return url.protocol === \"http:\" || url.protocol === \"https:\";\n  }\n\n  setImage() { \n    if (this.imageUrl.toLowerCase().trim() === \"\") {\n      this.internalImageUrl = {type: undefined, value: \"\"}\n    } else if(this.isValidHttpUrl(this.imageUrl)) {\n      this.internalImageUrl = { type: 'url', value: this.imageUrl}\n    } else { \n      this.internalImageUrl = { type: 'initials', value: this.imageUrl}\n    }\n  }\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  setProfileGap() { \n    const innerContentWrapper = this.el.shadowRoot.querySelector('.inner__content-wrapper')\n    const labelWrapper = this.el.shadowRoot.querySelector('.label__wrapper')\n    const labelSlot = labelWrapper.querySelector('slot')\n    const nodes = labelSlot.assignedNodes();\n    if(!nodes.length) { \n      this.handleClassList(innerContentWrapper, 'add', 'no-gap')\n    } else { \n      this.handleClassList(innerContentWrapper, 'remove', 'no-gap')\n    }\n  }\n\n  getItemMenu() { \n    const menu = this.el.shadowRoot.querySelector('.navbar-menu');\n    return menu;\n  }\n\n  closeItemMenu() { \n    const itemMenu = this.getItemMenu()\n    const menuItem = this.getNavBarItem()\n    if(itemMenu) { \n      this.handleClassList(itemMenu, 'remove', 'open')\n      this.handleClassList(menuItem, 'remove', 'open')\n    }\n  }\n\n  toggleItemMenu() {\n    if(!this.internalHref) {     \n      if(this.isMenuItem && this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu()\n        this.handleClassList(itemMenu, 'add', 'right')\n      }\n   \n      if(this.hasChildNavItems) { \n        const itemMenu = this.getItemMenu();\n        const menuItem = this.getNavBarItem()\n        this.handleClassList(itemMenu, 'toggle', 'open');\n        this.handleClassList(menuItem, 'toggle', 'open');\n      } \n    }\n  }\n\n  itemHasNestedItems() { \n    const childNavItem = this.el.shadowRoot.querySelector('ifx-navbar-item')\n    if(childNavItem) { \n      return true;\n    } else {\n      return false;\n    }\n  }\n\n\n  render() {\n    return (\n      <div class=\"container\">\n        <a href={this.internalHref} target={this.target} onClick={() => this.toggleItemMenu()} class=   {`navbar__item ${!this.showLabel ? 'removeLabel' : \"\"} ${this.hasChildNavItems ? 'isParent' : \"\"}`}>\n          <div class=\"inner__content-wrapper\">\n            <div class={`navbar__container-right-content-navigation-item-icon-wrapper`}>\n             {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>}\n\n             {this.internalImageUrl.type !== 'initials' && \n              <img src={ this.internalImageUrl.type === 'url' ? this.internalImageUrl.value : `data:image/svg+xml,${encodeURIComponent(this.defaultProfileImage)}`} alt={this.alt} />}\n\n              {this.internalImageUrl.type === 'initials' && \n              <div class=\"initials__wrapper\">\n                <span class=\"initials\">{this.internalImageUrl.value}</span>\n              </div>}\n              \n            </div>\n            <span class=\"label__wrapper\">\n              <slot onSlotchange={() => this.setProfileGap()} />\n            </span>\n          </div>\n          {/* {this.userName.trim() !== \"\" && <div class='username__tooltip'>{this.userName}</div>} */}\n        </a>\n        \n        {this.hasChildNavItems && <ul class='navbar-menu rightSideItemMenu'> <slot name=\"first__layer\" /> </ul>}\n      </div>\n    )\n  }\n}"],"version":3}