@infineon/infineon-design-system-stencil 39.4.4--canary.2074.d943070f9cdd99fe53a3a22232500eeb825c9004.0 → 39.4.4--canary.1723.72d4b66375fecde1ebf334fa524d5d0f7ab3c974.0

package/dist/infineon-design-system-stencil/p-0929589d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["checkboxGroupCss","CheckboxGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","required","hasErrors","handleSlotChange","initializeState","handleCheckboxError","event","checkbox","target","tagName","toLowerCase","set","detail","updateHasErrors","setGroupError","error","checkboxes","Array","from","el","querySelectorAll","forEach","componentWillLoad","componentDidLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","clear","has","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ifx-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.checkbox-group-container {\n    display: flex;\n    flex-direction: column;\n}\n\n.checkbox-group {\n    display: flex;\n    gap: tokens.$ifxSpace100;\n\n    &.horizontal {\n        flex-direction: row;\n        column-gap: tokens.$ifxSpace150;\n    }\n\n    &.vertical {\n        flex-direction: column;\n        row-gap: tokens.$ifxSpace150;\n    }\n}\n\n.group-label {\n    font-size: tokens.$ifxFontSizeM;\n    color: tokens.$ifxColorBaseBlack;\n    line-height: tokens.$ifxLineHeightM;\n    font-weight: tokens.$ifxFontWeightRegular;\n    margin-bottom: tokens.$ifxSpace100;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.group-label .required {\n    color: tokens.$ifxColorEngineering500;\n    margin-left: tokens.$ifxSpace50;\n}\n\n.group-label .required.error {\n    color: tokens.$ifxColorRed500;\n}\n\n.caption {\n    margin-top: tokens.$ifxSpace100;\n    align-self: flex-start;\n    display: flex;\n    width: 100%;\n    column-gap: tokens.$ifxSpace100;\n    justify-content: space-between;\n    align-items: center;\n\n    &.default {\n        color: tokens.$ifxColorBaseBlack;\n    }\n\n    &.error {\n        color: tokens.$ifxColorRed500;\n    }\n}\n\n.caption-text {\n    font-weight: tokens.$ifxFontWeightRegular;\n    font-size: tokens.$ifxFontSizeXs;\n    line-height: tokens.$ifxLineHeightXs;\n    flex: 1;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n    flex:0;\n    display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-checkbox-group',\n  styleUrl: 'checkbox-group.scss',\n  shadow: true,\n  // formAssociated: true\n})\n\nexport class CheckboxGroup {\n  private errorStates: Map<HTMLElement, boolean> = new Map();\n\n  @Element() el: HTMLElement;\n  @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n  @Prop() size: string;\n  @Prop() showGroupLabel: boolean;\n  @Prop() groupLabelText: string = 'Group Label Text';\n  @Prop() showCaption: boolean;\n  @Prop() captionText: string;\n  @Prop() showCaptionIcon: boolean;\n  @Prop() required: boolean = false;\n  @State() hasErrors: boolean = false;\n\n  @Listen('ifxError')\n  handleCheckboxError(event: CustomEvent) {\n    const checkbox = event.target as HTMLElement;\n    if (checkbox.tagName.toLowerCase() === 'ifx-checkbox') {\n      this.errorStates.set(checkbox, event.detail);\n      this.updateHasErrors();\n    }\n  }\n\n  // Method to set the error state of all checkboxes in the group\n  @Method()\n  async setGroupError(error: boolean) {\n    const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n    checkboxes.forEach((checkbox) => {\n      (checkbox as any).error = error;\n    });\n  }\n\n  componentWillLoad() {\n    this.initializeState();\n\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-checkbox-group', await framework)\n    }\n  }\n\n  handleSlotChange = () => {\n    this.initializeState();\n  };\n\n  private initializeState() {\n    this.errorStates.clear();\n    const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n    checkboxes.forEach((checkbox) => {\n      if (!this.errorStates.has(checkbox)) {\n        this.errorStates.set(checkbox, (checkbox as any).error || false);\n      }\n    });\n    this.updateHasErrors();\n  }\n\n  private updateHasErrors() {\n    this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n  }\n\n  render() {\n    return (\n      <div class='checkbox-group-container'>\n        {this.showGroupLabel && (\n          <div class=\"group-label\">\n            {this.groupLabelText}\n            {this.required && <span class={`required ${this.hasErrors ? 'error' : ''}`}>*</span>}\n          </div>\n        )}\n        <div class={`checkbox-group ${this.alignment} ${this.size}`}>\n          <slot onSlotchange={this.handleSlotChange}></slot>\n        </div>\n        {this.showCaption ? (\n          <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n            {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n            </ifx-icon></div> : ''}\n            <div class='caption-text'>{this.captionText}</div>\n          </div>) : ''}\n      </div>\n    );\n  }\n}"],"mappings":"iIAAA,MAAMA,EAAmB,u6B,MCYZC,EAAa,MAP1B,WAAAC,CAAAC,G,UAQUC,KAAAC,YAAyC,IAAIC,IAG7CF,KAASG,UAA8B,WAGvCH,KAAcI,eAAW,mBAIzBJ,KAAQK,SAAY,MACnBL,KAASM,UAAY,MAgC9BN,KAAgBO,iBAAG,KACjBP,KAAKQ,iBAAiB,CAuCzB,CArEC,mBAAAC,CAAoBC,GAClB,MAAMC,EAAWD,EAAME,OACvB,GAAID,EAASE,QAAQC,gBAAkB,eAAgB,CACrDd,KAAKC,YAAYc,IAAIJ,EAAUD,EAAMM,QACrChB,KAAKiB,iB,EAMT,mBAAMC,CAAcC,GAClB,MAAMC,EAAaC,MAAMC,KAAKtB,KAAKuB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASd,IACjBA,EAAiBQ,MAAQA,CAAK,G,CAInC,iBAAAO,GACE1B,KAAKQ,iB,CAIP,sBAAMmB,GACJ,IAAIC,EAAuB5B,KAAKuB,IAAK,CACnC,MAAMM,EAAYC,IAClBC,EAAe,2BAA4BF,E,EAQvC,eAAArB,GACNR,KAAKC,YAAY+B,QACjB,MAAMZ,EAAaC,MAAMC,KAAKtB,KAAKuB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASd,IAClB,IAAKX,KAAKC,YAAYgC,IAAItB,GAAW,CACnCX,KAAKC,YAAYc,IAAIJ,EAAWA,EAAiBQ,OAAS,M,KAG9DnB,KAAKiB,iB,CAGC,eAAAA,GACNjB,KAAKM,UAAYe,MAAMC,KAAKtB,KAAKC,YAAYiC,UAAUC,MAAMhB,GAAUA,G,CAGzE,MAAAiB,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,4BACRvC,KAAKwC,gBACJH,EAAK,OAAAC,IAAA,2CAAAC,MAAM,eACRvC,KAAKI,eACLJ,KAAKK,UAAYgC,EAAA,QAAAC,IAAA,2CAAMC,MAAO,YAAYvC,KAAKM,UAAY,QAAU,MAAc,MAGxF+B,EAAK,OAAAC,IAAA,2CAAAC,MAAO,kBAAkBvC,KAAKG,aAAaH,KAAKyC,QACnDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAc1C,KAAKO,oBAE1BP,KAAK2C,YACJN,EAAA,OAAKE,MAAO,WAAWvC,KAAKM,UAAY,QAAU,aAC/CN,KAAK4C,gBAAkBP,EAAK,OAAAE,MAAM,gBAAeF,EAAU,YAAAQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBvC,KAAK8C,cACxB,G","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-faa25811.entry.js → p-0be8f0c9.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as t,a as s}from"./p-C6IIVo5u.js";const a=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{position:relative;display:block}:host([data-has-icon=false]){display:var(--ifx-sidebar-item-without-icon-display, block)}.sidebar__nav-item:focus-visible,.sidebar__nav-item.header__section:focus-visible{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.sidebar__nav-item:focus-visible .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:focus-visible .sidebar__nav-item-label,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:focus-visible .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item:hover,.sidebar__nav-item.header__section:hover{outline:none}.sidebar__nav-item:hover .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:hover .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-label,.sidebar__nav-item.header__section:hover .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item{display:flex;flex-direction:var(--ifx-sidebar-item-flex-direction, row);align-items:center;width:100%;padding:8px 0px;gap:4px;flex:none;order:0;flex-grow:0;text-decoration:none;color:#1D1D1D;cursor:pointer;font-family:var(--ifx-font-family)}.sidebar__nav-item.extra-padding__bottom{padding:8px 0px 16px 0px}.sidebar__nav-item.active{color:#0A8276}.sidebar__nav-item.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.open{padding:8px 0px}.sidebar__nav-item.open .sidebar__nav-item-label{font-size:16px;font-style:normal;font-weight:400;line-height:24px}.sidebar__nav-item.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section{box-sizing:padding-box;border-top:1px solid #EEEDED;padding:16px 0px;display:-webkit-flex;-webkit-line-clamp:1;-webkit-box-orient:horizontal;overflow:hidden;text-overflow:ellipsis}.sidebar__nav-item.header__section.no-top-border{border-top:none}.sidebar__nav-item.header__section.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.header__section.open{padding:16px 0px 8px 0px}.sidebar__nav-item.header__section.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section .sidebar__nav-item-label{color:#1D1D1D;font-family:Source Sans 3;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sidebar__nav-item.submenu__item{padding:4px 0px}.sidebar__nav-item.submenu__item.extra-padding__bottom{padding:4px 0px 16px 0px}.sidebar__nav-item .sidebar__nav-item-icon-wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;gap:8px;flex-shrink:0}.sidebar__nav-item .sidebar__nav-item-icon-wrapper.noIcon{display:none}.sidebar__nav-item .sidebar__nav-item-icon-wrapper ifx-icon{width:16px;height:16px}.sidebar__nav-item .sidebar__nav-item-label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;flex:none;order:1;flex-grow:1;cursor:pointer;display:var(--ifx-sidebar-item-text-display, flex)}.sidebar__nav-item .sidebar__nav-item-indicator{display:var(--ifx-sidebar-item-text-display, flex);flex-direction:row;justify-content:center;align-items:center;padding:0px 4px;flex:none;order:2;flex-grow:0;position:relative}:host([data-sidebar-collapsed]) .sidebar__nav-item .sidebar__nav-item-indicator{position:absolute;top:0;right:0;z-index:10;padding:0}.expandable__submenu{display:none;list-style-type:none;flex-direction:column;padding:0;margin:0;padding-left:40px}.expandable__submenu.open{display:flex}.header__section+.expandable__submenu{padding-left:0}';const n=class{constructor(t){e(this,t);this.ifxSidebarMenu=i(this,"ifxSidebarMenu",7);this.ifxSidebarNavigationItem=i(this,"ifxSidebarNavigationItem",7);this.ifxSidebarActionItem=i(this,"ifxSidebarActionItem",7);this.icon="";this.showIcon=true;this.showIconWrapper=false;this.href="";this.internalHref="";this.target="_self";this.isExpandable=false;this.isNested=true;this.isSubMenuItem=false;this.active=false;this.isActionItem=false;this.indicatorVariant="number";this.internalActiveState=false;this.titleText=""}handleActiveChange(e,i){if(this.isActionItem){this.internalActiveState=false;return}this.internalActiveState=e;if(e!==i){let i=this.getNavItem(this.el.shadowRoot);if(!this.isExpandable&&!e){this.handleClassList(i,"remove","active")}if(!this.isExpandable&&e){this.handleClassList(i,"add","active")}}}handleNumberIndicatorChange(){this.updateIndicatorVariant()}handleConsoleError(e){if(e.detail){this.showIcon=false}else{this.showIcon=true}}handleEventEmission(){this.ifxSidebarMenu.emit(this.el)}handleClassList(e,i,t){e.classList[i](t);if(i==="contains"){return e.classList.contains(t)}}getExpandableMenu(){const e=this.el.shadowRoot.querySelector(".expandable__submenu");return e}getNavItem(e){return e===null||e===void 0?void 0:e.querySelector(".sidebar__nav-item")}getSidebarMenuItems(e=this.el){const i=e.querySelectorAll("ifx-sidebar-item");if(i.length===0){return e.shadowRoot.querySelectorAll("ifx-sidebar-item")}return i}getSidebarMenuItem(){const e=this.el.shadowRoot.querySelector(".sidebar__nav-item");return e}toggleSubmenu(){if(this.isExpandable){const e=this.getSidebarMenuItem();const i=this.getExpandableMenu();this.handleClassList(i,"toggle","open");this.handleClassList(e,"toggle","open");this.handleEventEmission()}else{if(this.isActionItem){this.ifxSidebarActionItem.emit(this.el);return}else{this.handleActiveChange(true,this.internalActiveState);this.ifxSidebarNavigationItem.emit(this.el)}if(this.handleItemClick){this.handleItemClick(this.el)}}}handleExpandableMenu(e){const i=this.getExpandableMenu();e.forEach((e=>{const t=document.createElement("li");t.appendChild(e);i.appendChild(t)}))}parentElementIsSidebar(){const e=this.el.parentElement;if(e.tagName.toUpperCase()==="IFX-SIDEBAR"){return true}else return false}checkIfMenuItemIsNested(){const e=this.parentElementIsSidebar();if(e){this.isNested=false}}checkIfMenuItemIsSubMenu(){const e=this.el.parentElement;const i=this.getNavItem(e.shadowRoot);if(e.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"&&!this.handleClassList(i,"contains","header__section")){this.isSubMenuItem=true}else{this.isSubMenuItem=false}}isActive(e){const i=e.getAttribute("active");const t=i==="true";return t}getParentSection(e){let i=e.parentElement;while(i&&i.tagName.toUpperCase()!=="IFX-SIDEBAR"){if(i.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"){return i}i=i.parentElement}return null}handleBorderIndicatorDisplacement(e){const i=(e,t)=>{const s=this.isActive(e);if(s){const e=this.handleClassList(t,"contains","open");const i=this.getActiveItemSection();if(!e){this.handleClassList(i,"add","active-section")}else{this.handleClassList(i,"remove","active-section")}}const a=this.getSidebarMenuItems(e);a.forEach((e=>i(e,t)))};const t=this.getSidebarMenuItems();t.forEach((t=>i(t,e)))}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}getActiveItemSection(){const e=this.parentElementIsSidebar();if(e){const e=this.getNavItem(this.el.shadowRoot);return e}else{const e=this.getNavItem(this.el.shadowRoot);return e}}async setActiveClasses(){const e=this.getNavItem(this.el.shadowRoot);this.handleClassList(e,"add","active")}async expandMenu(e){const i=this.getSidebarMenuItem();const t=this.getExpandableMenu();this.handleClassList(t,"add","open");this.handleClassList(i,"add","open");if(e){this.handleClassList(t,"remove","active-section");this.handleClassList(i,"remove","active-section")}}async isItemExpandable(){return this.isExpandable}handleActiveState(){if(this.internalActiveState){this.setActiveClasses()}}handleKeyDown(e){if(e.key==="Enter"){this.toggleSubmenu()}}componentDidLoad(){this.handleActiveState();if(this.isExpandable){const e=this.getSidebarMenuItems();this.handleExpandableMenu(e)}this.updateIndicatorVariant();this.observeCollapsedState();this.extractTitleText()}extractTitleText(){const e=this.el.shadowRoot.querySelector("slot");if(e){const i=e.assignedNodes();this.titleText=i.filter((e=>e.nodeType===Node.TEXT_NODE||e.nodeType===Node.ELEMENT_NODE)).map((e=>{var i;return((i=e.textContent)===null||i===void 0?void 0:i.trim())||""})).join(" ").trim()}}updateIndicatorVariant(){const e=this.el.hasAttribute("data-sidebar-collapsed");if(this.numberIndicator>0){this.indicatorVariant=e?"dot":"number"}}observeCollapsedState(){const e=new MutationObserver((()=>{this.updateIndicatorVariant()}));e.observe(this.el,{attributes:true,attributeFilter:["data-sidebar-collapsed"]})}componentWillLoad(){this.internalActiveState=this.active;this.checkIfMenuItemIsNested();this.checkIfMenuItemIsSubMenu();this.setHref();this.el.setAttribute("data-has-icon",this.icon?"true":"false");const e=this.getSidebarMenuItems();if(e.length!==0){this.isExpandable=true}else{this.isExpandable=false}}componentWillUpdate(){if(this.active&&!this.internalActiveState){this.internalActiveState=this.active;this.ifxSidebarNavigationItem.emit(this.el)}}render(){const e=this.el.hasAttribute("data-sidebar-collapsed");const i=this.el.hasAttribute("data-hide-in-collapsed");return t("div",{key:"491cbffba289bab9d633a08724a2bf1575b92d9f",style:{display:i?"none":"block"}},t("a",{key:"50a8e5dd2298c86711260427549b7d86601d5b46",tabIndex:1,onKeyDown:e=>this.handleKeyDown(e),href:this.internalHref,onClick:()=>this.toggleSubmenu(),target:this.target,class:`sidebar__nav-item ${!this.isNested&&this.isExpandable?"header__section":""} ${this.isSubMenuItem?"submenu__item":""}`,title:this.titleText},this.icon&&t("div",{key:"b27c805c73bd5404b648f493c4ded4d689b9eb3c",class:`sidebar__nav-item-icon-wrapper ${!this.showIcon&&!e?"noIcon":""}`},t("ifx-icon",{key:"2049a5d0f58106ad977b68c848c8c0f21182a86d",icon:this.icon})),t("div",{key:"c140a72eb126c87989c71066f287cea862060562",class:"sidebar__nav-item-label"},t("slot",{key:"ee9708e5f3591b34e7251546cab50224967abffe"})),(this.isExpandable||!isNaN(this.numberIndicator))&&t("div",{key:"d5ac6af6cf668e3463626c7b0f8f5694d23d2d1f",class:"sidebar__nav-item-indicator",style:{display:!e||this.icon?"flex":"none"}},this.isExpandable&&t("span",{key:"7ff6bd7e736d73392e8786980b740b0d1f1b1ac2",class:"item__arrow-wrapper"},t("ifx-icon",{key:"dc62663bee631edbb5a1126b5b2cd4bfb6125c98",icon:"chevron-down-16"})),this.numberIndicator>0&&!this.isExpandable&&!this.isNested&&t("span",{key:"2a02e2d009f260b57c7fb75cdce87366e56e5a53",class:"item__number-indicator"},t("ifx-indicator",{key:"8dcaf820d27afd21722e4f02f81e4d52441d5458",variant:this.indicatorVariant,number:this.numberIndicator})))),this.isExpandable&&t("ul",{key:"c55eb1c02512807fe889dff1e2b9e3455bc5cc23",class:"expandable__submenu"}))}get el(){return s(this)}static get watchers(){return{active:["handleActiveChange"],numberIndicator:["handleNumberIndicatorChange"]}}};n.style=a;export{n as ifx_sidebar_item};
-//# sourceMappingURL=p-faa25811.entry.js.map
+import{r as e,c as i,h as t,a as s}from"./p-PqnYwNKt.js";const a=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{position:relative;display:block}:host([data-has-icon=false]){display:var(--ifx-sidebar-item-without-icon-display, block)}.sidebar__nav-item:focus-visible,.sidebar__nav-item.header__section:focus-visible{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.sidebar__nav-item:focus-visible .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:focus-visible .sidebar__nav-item-label,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:focus-visible .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:focus-visible .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item:hover,.sidebar__nav-item.header__section:hover{outline:none}.sidebar__nav-item:hover .sidebar__nav-item-icon-wrapper,.sidebar__nav-item.header__section:hover .sidebar__nav-item-icon-wrapper{color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-label,.sidebar__nav-item.header__section:hover .sidebar__nav-item-label{outline:none;color:#08665C}.sidebar__nav-item:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon,.sidebar__nav-item.header__section:hover .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{color:#08665C}.sidebar__nav-item{display:flex;flex-direction:var(--ifx-sidebar-item-flex-direction, row);align-items:center;width:100%;padding:8px 0px;gap:4px;flex:none;order:0;flex-grow:0;text-decoration:none;color:#1D1D1D;cursor:pointer;font-family:var(--ifx-font-family)}.sidebar__nav-item.extra-padding__bottom{padding:8px 0px 16px 0px}.sidebar__nav-item.active{color:#0A8276}.sidebar__nav-item.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.open{padding:8px 0px}.sidebar__nav-item.open .sidebar__nav-item-label{font-size:16px;font-style:normal;font-weight:400;line-height:24px}.sidebar__nav-item.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section{box-sizing:padding-box;border-top:1px solid #EEEDED;padding:16px 0px;display:-webkit-flex;-webkit-line-clamp:1;-webkit-box-orient:horizontal;overflow:hidden;text-overflow:ellipsis}.sidebar__nav-item.header__section.no-top-border{border-top:none}.sidebar__nav-item.header__section.active-section::before{content:"";position:absolute;left:-32px;height:40px;width:2px;background:#0A8276}.sidebar__nav-item.header__section.open{padding:16px 0px 8px 0px}.sidebar__nav-item.header__section.open .sidebar__nav-item-indicator .item__arrow-wrapper ifx-icon{transform:rotate(-180deg)}.sidebar__nav-item.header__section .sidebar__nav-item-label{color:#1D1D1D;font-family:Source Sans 3;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sidebar__nav-item.submenu__item{padding:4px 0px}.sidebar__nav-item.submenu__item.extra-padding__bottom{padding:4px 0px 16px 0px}.sidebar__nav-item .sidebar__nav-item-icon-wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;gap:8px;flex-shrink:0}.sidebar__nav-item .sidebar__nav-item-icon-wrapper.noIcon{display:none}.sidebar__nav-item .sidebar__nav-item-icon-wrapper ifx-icon{width:16px;height:16px}.sidebar__nav-item .sidebar__nav-item-label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;flex:none;order:1;flex-grow:1;cursor:pointer;display:var(--ifx-sidebar-item-text-display, flex)}.sidebar__nav-item .sidebar__nav-item-indicator{display:var(--ifx-sidebar-item-text-display, flex);flex-direction:row;justify-content:center;align-items:center;padding:0px 4px;flex:none;order:2;flex-grow:0;position:relative}:host([data-sidebar-collapsed]) .sidebar__nav-item .sidebar__nav-item-indicator{position:absolute;top:0;right:0;z-index:10;padding:0}.expandable__submenu{display:none;list-style-type:none;flex-direction:column;padding:0;margin:0;padding-left:40px}.expandable__submenu.open{display:flex}.header__section+.expandable__submenu{padding-left:0}';const n=class{constructor(t){e(this,t);this.ifxSidebarMenu=i(this,"ifxSidebarMenu",7);this.ifxSidebarNavigationItem=i(this,"ifxSidebarNavigationItem",7);this.ifxSidebarActionItem=i(this,"ifxSidebarActionItem",7);this.icon="";this.showIcon=true;this.showIconWrapper=false;this.href="";this.internalHref="";this.target="_self";this.isExpandable=false;this.isNested=true;this.isSubMenuItem=false;this.active=false;this.isActionItem=false;this.indicatorVariant="number";this.internalActiveState=false;this.titleText=""}handleActiveChange(e,i){if(this.isActionItem){this.internalActiveState=false;return}this.internalActiveState=e;if(e!==i){let i=this.getNavItem(this.el.shadowRoot);if(!this.isExpandable&&!e){this.handleClassList(i,"remove","active")}if(!this.isExpandable&&e){this.handleClassList(i,"add","active")}}}handleNumberIndicatorChange(){this.updateIndicatorVariant()}handleConsoleError(e){if(e.detail){this.showIcon=false}else{this.showIcon=true}}handleEventEmission(){this.ifxSidebarMenu.emit(this.el)}handleClassList(e,i,t){e.classList[i](t);if(i==="contains"){return e.classList.contains(t)}}getExpandableMenu(){const e=this.el.shadowRoot.querySelector(".expandable__submenu");return e}getNavItem(e){return e===null||e===void 0?void 0:e.querySelector(".sidebar__nav-item")}getSidebarMenuItems(e=this.el){const i=e.querySelectorAll("ifx-sidebar-item");if(i.length===0){return e.shadowRoot.querySelectorAll("ifx-sidebar-item")}return i}getSidebarMenuItem(){const e=this.el.shadowRoot.querySelector(".sidebar__nav-item");return e}toggleSubmenu(){if(this.isExpandable){const e=this.getSidebarMenuItem();const i=this.getExpandableMenu();this.handleClassList(i,"toggle","open");this.handleClassList(e,"toggle","open");this.handleEventEmission()}else{if(this.isActionItem){this.ifxSidebarActionItem.emit(this.el);return}else{this.handleActiveChange(true,this.internalActiveState);this.ifxSidebarNavigationItem.emit(this.el)}if(this.handleItemClick){this.handleItemClick(this.el)}}}handleExpandableMenu(e){const i=this.getExpandableMenu();e.forEach((e=>{const t=document.createElement("li");t.appendChild(e);i.appendChild(t)}))}parentElementIsSidebar(){const e=this.el.parentElement;if(e.tagName.toUpperCase()==="IFX-SIDEBAR"){return true}else return false}checkIfMenuItemIsNested(){const e=this.parentElementIsSidebar();if(e){this.isNested=false}}checkIfMenuItemIsSubMenu(){const e=this.el.parentElement;const i=this.getNavItem(e.shadowRoot);if(e.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"&&!this.handleClassList(i,"contains","header__section")){this.isSubMenuItem=true}else{this.isSubMenuItem=false}}isActive(e){const i=e.getAttribute("active");const t=i==="true";return t}getParentSection(e){let i=e.parentElement;while(i&&i.tagName.toUpperCase()!=="IFX-SIDEBAR"){if(i.tagName.toUpperCase()==="IFX-SIDEBAR-ITEM"){return i}i=i.parentElement}return null}handleBorderIndicatorDisplacement(e){const i=(e,t)=>{const s=this.isActive(e);if(s){const e=this.handleClassList(t,"contains","open");const i=this.getActiveItemSection();if(!e){this.handleClassList(i,"add","active-section")}else{this.handleClassList(i,"remove","active-section")}}const a=this.getSidebarMenuItems(e);a.forEach((e=>i(e,t)))};const t=this.getSidebarMenuItems();t.forEach((t=>i(t,e)))}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}getActiveItemSection(){const e=this.parentElementIsSidebar();if(e){const e=this.getNavItem(this.el.shadowRoot);return e}else{const e=this.getNavItem(this.el.shadowRoot);return e}}async setActiveClasses(){const e=this.getNavItem(this.el.shadowRoot);this.handleClassList(e,"add","active")}async expandMenu(e){const i=this.getSidebarMenuItem();const t=this.getExpandableMenu();this.handleClassList(t,"add","open");this.handleClassList(i,"add","open");if(e){this.handleClassList(t,"remove","active-section");this.handleClassList(i,"remove","active-section")}}async isItemExpandable(){return this.isExpandable}handleActiveState(){if(this.internalActiveState){this.setActiveClasses()}}handleKeyDown(e){if(e.key==="Enter"){this.toggleSubmenu()}}componentDidLoad(){this.handleActiveState();if(this.isExpandable){const e=this.getSidebarMenuItems();this.handleExpandableMenu(e)}this.updateIndicatorVariant();this.observeCollapsedState();this.extractTitleText()}extractTitleText(){const e=this.el.shadowRoot.querySelector("slot");if(e){const i=e.assignedNodes();this.titleText=i.filter((e=>e.nodeType===Node.TEXT_NODE||e.nodeType===Node.ELEMENT_NODE)).map((e=>{var i;return((i=e.textContent)===null||i===void 0?void 0:i.trim())||""})).join(" ").trim()}}updateIndicatorVariant(){const e=this.el.hasAttribute("data-sidebar-collapsed");if(this.numberIndicator>0){this.indicatorVariant=e?"dot":"number"}}observeCollapsedState(){const e=new MutationObserver((()=>{this.updateIndicatorVariant()}));e.observe(this.el,{attributes:true,attributeFilter:["data-sidebar-collapsed"]})}componentWillLoad(){this.internalActiveState=this.active;this.checkIfMenuItemIsNested();this.checkIfMenuItemIsSubMenu();this.setHref();this.el.setAttribute("data-has-icon",this.icon?"true":"false");const e=this.getSidebarMenuItems();if(e.length!==0){this.isExpandable=true}else{this.isExpandable=false}}componentWillUpdate(){if(this.active&&!this.internalActiveState){this.internalActiveState=this.active;this.ifxSidebarNavigationItem.emit(this.el)}}render(){const e=this.el.hasAttribute("data-sidebar-collapsed");const i=this.el.hasAttribute("data-hide-in-collapsed");return t("div",{key:"491cbffba289bab9d633a08724a2bf1575b92d9f",style:{display:i?"none":"block"}},t("a",{key:"50a8e5dd2298c86711260427549b7d86601d5b46",tabIndex:1,onKeyDown:e=>this.handleKeyDown(e),href:this.internalHref,onClick:()=>this.toggleSubmenu(),target:this.target,class:`sidebar__nav-item ${!this.isNested&&this.isExpandable?"header__section":""} ${this.isSubMenuItem?"submenu__item":""}`,title:this.titleText},this.icon&&t("div",{key:"b27c805c73bd5404b648f493c4ded4d689b9eb3c",class:`sidebar__nav-item-icon-wrapper ${!this.showIcon&&!e?"noIcon":""}`},t("ifx-icon",{key:"2049a5d0f58106ad977b68c848c8c0f21182a86d",icon:this.icon})),t("div",{key:"c140a72eb126c87989c71066f287cea862060562",class:"sidebar__nav-item-label"},t("slot",{key:"ee9708e5f3591b34e7251546cab50224967abffe"})),(this.isExpandable||!isNaN(this.numberIndicator))&&t("div",{key:"d5ac6af6cf668e3463626c7b0f8f5694d23d2d1f",class:"sidebar__nav-item-indicator",style:{display:!e||this.icon?"flex":"none"}},this.isExpandable&&t("span",{key:"7ff6bd7e736d73392e8786980b740b0d1f1b1ac2",class:"item__arrow-wrapper"},t("ifx-icon",{key:"dc62663bee631edbb5a1126b5b2cd4bfb6125c98",icon:"chevron-down-16"})),this.numberIndicator>0&&!this.isExpandable&&!this.isNested&&t("span",{key:"2a02e2d009f260b57c7fb75cdce87366e56e5a53",class:"item__number-indicator"},t("ifx-indicator",{key:"8dcaf820d27afd21722e4f02f81e4d52441d5458",variant:this.indicatorVariant,number:this.numberIndicator})))),this.isExpandable&&t("ul",{key:"c55eb1c02512807fe889dff1e2b9e3455bc5cc23",class:"expandable__submenu"}))}get el(){return s(this)}static get watchers(){return{active:["handleActiveChange"],numberIndicator:["handleNumberIndicatorChange"]}}};n.style=a;export{n as ifx_sidebar_item};
+//# sourceMappingURL=p-0be8f0c9.entry.js.map

package/dist/infineon-design-system-stencil/p-0be8f0c9.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sidebarItemCss","SidebarItem","constructor","hostRef","this","icon","showIcon","showIconWrapper","href","internalHref","target","isExpandable","isNested","isSubMenuItem","active","isActionItem","indicatorVariant","internalActiveState","titleText","handleActiveChange","newValue","oldValue","labelElement","getNavItem","el","shadowRoot","handleClassList","handleNumberIndicatorChange","updateIndicatorVariant","handleConsoleError","event","detail","handleEventEmission","ifxSidebarMenu","emit","type","className","classList","contains","getExpandableMenu","expandableSubmenu","querySelector","getSidebarMenuItems","sidebarItems","querySelectorAll","length","getSidebarMenuItem","sidebarItem","toggleSubmenu","menuItem","expandableMenu","ifxSidebarActionItem","ifxSidebarNavigationItem","handleItemClick","handleExpandableMenu","sidebarExpandableMenu","forEach","li","document","createElement","appendChild","parentElementIsSidebar","parentElement","tagName","toUpperCase","checkIfMenuItemIsNested","parentIsSidebar","checkIfMenuItemIsSubMenu","navItem","isActive","iteratedComponent","activeAttributeValue","getAttribute","getParentSection","handleBorderIndicatorDisplacement","handleItem","item","isOpen","activeMenuItemSection","getActiveItemSection","children","child","topLevelItems","setHref","toLowerCase","trim","undefined","setActiveClasses","activeMenuItem","expandMenu","ac","isItemExpandable","handleActiveState","handleKeyDown","key","componentDidLoad","observeCollapsedState","extractTitleText","slotElement","assignedNodes","filter","node","nodeType","Node","TEXT_NODE","ELEMENT_NODE","map","_a","textContent","join","isCollapsed","hasAttribute","numberIndicator","observer","MutationObserver","observe","attributes","attributeFilter","componentWillLoad","setAttribute","componentWillUpdate","render","shouldHide","h","style","display","tabIndex","onKeyDown","onClick","class","title","isNaN","variant","number"],"sources":["src/components/navigation/sidebar/sidebar-item.scss?tag=ifx-sidebar-item&encapsulation=shadow","src/components/navigation/sidebar/sidebar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  position: relative;\n  display: block;\n}\n\n:host([data-has-icon=\"false\"]) {\n  display: var(--ifx-sidebar-item-without-icon-display, block);\n}\n\n.sidebar__nav-item,\n.sidebar__nav-item.header__section {\n  &:focus-visible {\n      outline: none;\n      box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n\n\n\n  &:hover {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n}\n\n.sidebar__nav-item {\n  display: flex;\n  flex-direction: var(--ifx-sidebar-item-flex-direction, row);\n  align-items: center;\n  width: 100%;\n  padding: 8px 0px;\n  gap: 4px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  cursor: pointer;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n  &.extra-padding__bottom {\n    padding: 8px 0px 16px 0px;\n  }\n\n  &.active {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &.active-section {\n    &::before {\n      content: \"\";\n      position: absolute;\n      left: -32px;\n      height: 40px;\n      width: 2px;\n      background: tokens.$ifxColorOcean500;\n    }\n  }\n\n\n  &.open {\n    padding: 8px 0px;\n\n    & .sidebar__nav-item-label {\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          transform: rotate(-180deg);\n        }\n      }\n    }\n  }\n\n  &.header__section {\n    box-sizing: padding-box;\n    border-top: 1px solid tokens.$ifxColorEngineering200;\n    padding: 16px 0px;\n    display: -webkit-flex;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: horizontal;\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    &.no-top-border {\n      border-top: none;\n    }\n\n    &.active-section {\n      &::before {\n        content: \"\";\n        position: absolute;\n        left: -32px;\n        height: 40px;\n        width: 2px;\n        background: tokens.$ifxColorOcean500;\n      }\n    }\n\n    &.open {\n\n      padding: 16px 0px 8px 0px;\n\n      & .sidebar__nav-item-indicator {\n        & .item__arrow-wrapper {\n          & ifx-icon {\n            transform: rotate(-180deg);\n          }\n        }\n      }\n    }\n\n    & .sidebar__nav-item-label {\n      color: tokens.$ifxColorBaseBlack;\n      font-family: Source Sans 3;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 24px;\n    }\n  }\n\n  &.submenu__item {\n    padding: 4px 0px;\n\n    &.extra-padding__bottom {\n      padding: 4px 0px 16px 0px;\n    }\n  }\n\n  & .sidebar__nav-item-icon-wrapper {\n    display: flex;\n    width: tokens.$ifxSize300;\n    height: tokens.$ifxSize300;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    flex-shrink: 0;\n\n    &.noIcon {\n      display: none;\n    }\n\n    & ifx-icon {\n      width: tokens.$ifxSize200;\n      height: tokens.$ifxSize200;\n    }\n  }\n\n  & .sidebar__nav-item-label {\n    font-style: normal;\n    font-weight: 400;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    display: flex;\n    align-items: center;\n    flex: none;\n    order: 1;\n    flex-grow: 1;\n    cursor: pointer;\n    display: var(--ifx-sidebar-item-text-display, flex);\n  }\n\n  & .sidebar__nav-item-indicator {\n    display: var(--ifx-sidebar-item-text-display, flex);\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px 4px;\n    flex: none;\n    order: 2;\n    flex-grow: 0;\n    position: relative;\n\n    // Collapsed state styling - position indicator over icon\n    :host([data-sidebar-collapsed]) & {\n      position: absolute;\n      top: 0;\n      right: 0;\n      z-index: 10;\n      padding: 0;\n    }\n  }\n}\n\n.expandable__submenu {\n  display: none;\n  list-style-type: none;\n  flex-direction: column;\n  padding: 0;\n  margin: 0;\n  padding-left: 40px;\n\n  &.open {\n    display: flex;\n  }\n}\n\n.header__section+.expandable__submenu {\n  padding-left: 0;\n}","import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-sidebar-item',\n  styleUrl: 'sidebar-item.scss',\n  shadow: true\n})\nexport class SidebarItem {\n  @Element() el;\n  @Prop() icon: string = \"\"\n  @State() showIcon: boolean = true;\n  @State() showIconWrapper: boolean = false;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\";\n  @Prop() target: string = \"_self\";\n  @State() isExpandable: boolean = false;\n  @State() isNested: boolean = true;\n  @State() isSubMenuItem: boolean = false;\n  @Prop() numberIndicator: number;\n  @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n  @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n  @State() indicatorVariant: 'number' | 'dot' = 'number';\n\n  @State() internalActiveState: boolean = false;\n \n  @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n  @Prop() handleItemClick: (item: HTMLElement) => void;\n\n  private titleText: string = '';\n\n  @Watch('active')\n  handleActiveChange(newValue: boolean, oldValue: boolean) {\n    // If the item is an action item, ignore the active prop\n    if (this.isActionItem) {\n      this.internalActiveState = false;\n      return;\n    }\n    this.internalActiveState = newValue;\n    if (newValue !== oldValue) {\n      let labelElement = this.getNavItem(this.el.shadowRoot)\n      if (!this.isExpandable && !newValue) {\n        this.handleClassList(labelElement, 'remove', 'active');\n      }\n      if (!this.isExpandable && newValue) {\n        this.handleClassList(labelElement, 'add', 'active');\n      }\n    }\n  }\n\n  @Watch('numberIndicator')  \n  handleNumberIndicatorChange() {\n    this.updateIndicatorVariant();\n  }\n\n  @Listen('consoleError')\n  handleConsoleError(event: CustomEvent<boolean>) {\n    if (event.detail) {\n      this.showIcon = false;\n    } else {\n      this.showIcon = true;\n    }\n  }\n\n  handleEventEmission() {\n    // Get the active item section\n    this.ifxSidebarMenu.emit(this.el)\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  getExpandableMenu() {\n    const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n    return expandableSubmenu\n  }\n\n  getNavItem(el) {\n    return el?.querySelector('.sidebar__nav-item')\n  }\n\n\n\n  getSidebarMenuItems(el = this.el) {\n    const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n    if (sidebarItems.length === 0) {\n      return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n    }\n    return sidebarItems;\n  }\n\n  getSidebarMenuItem() {\n    const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n    return sidebarItem;\n  }\n\n\n  toggleSubmenu() {\n    if (this.isExpandable) {\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'toggle', 'open');\n      this.handleClassList(menuItem, 'toggle', 'open');\n      // Emit an event with the current component\n      this.handleEventEmission();\n    } else {\n      // If the sidebar item is not expandable, it's a leaf item without a submenu.\n      // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n      if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n        this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n        return;\n      } else { //its a navigation item which becomes active after clicking it\n        this.handleActiveChange(true, this.internalActiveState)\n        this.ifxSidebarNavigationItem.emit(this.el);\n      }\n      // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n      if (this.handleItemClick) {\n        this.handleItemClick(this.el);\n      }\n    }\n    // // Emit an event with the current component\n    // this.handleEventEmission();\n  }\n\n\n\n  handleExpandableMenu(sidebarItems) {\n    const sidebarExpandableMenu = this.getExpandableMenu();\n    sidebarItems.forEach((el: HTMLElement) => {\n      const li = document.createElement('li')\n      li.appendChild(el)\n      sidebarExpandableMenu.appendChild(li)\n    })\n  }\n\n  parentElementIsSidebar() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n      return true;\n    } else return false;\n  }\n\n  checkIfMenuItemIsNested() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      this.isNested = false;\n    }\n  }\n\n  checkIfMenuItemIsSubMenu() {\n    const parentElement = this.el.parentElement;\n    const navItem = this.getNavItem(parentElement.shadowRoot);\n    if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n      this.isSubMenuItem = true;\n    }else {\n      this.isSubMenuItem = false;\n    }\n  }\n\n  isActive(iteratedComponent) {\n    const activeAttributeValue = iteratedComponent.getAttribute('active');\n    const isActive = activeAttributeValue === 'true';\n    return isActive\n  }\n\n  getParentSection(el: HTMLElement) {\n    let parentElement = el.parentElement;\n\n    while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n      if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n        return parentElement;\n      }\n      parentElement = parentElement.parentElement;\n    }\n\n    return null;\n  }\n\n\n\n  handleBorderIndicatorDisplacement(menuItem) {\n    // Recursive function to handle each item\n    const handleItem = (item, menuItem) => {\n      const isActive = this.isActive(item);\n      if (isActive) {\n        const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n        const activeMenuItemSection = this.getActiveItemSection();\n        if (!isOpen) {\n          this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n        } else {\n          this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n        }\n      }\n\n      // Process each child item\n      const children = this.getSidebarMenuItems(item);\n      children.forEach((child) => handleItem(child, menuItem));\n    }\n\n    // Start with the top-level items\n    const topLevelItems = this.getSidebarMenuItems();\n    topLevelItems.forEach((item) => handleItem(item, menuItem));\n  }\n\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  getActiveItemSection() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    } else {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    }\n  }\n\n  @Method()\n  async setActiveClasses() {\n    const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n    this.handleClassList(activeMenuItem, 'add', 'active')\n  }\n\n  @Method()\n  async expandMenu(ac: boolean){\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'add', 'open');\n      this.handleClassList(menuItem, 'add', 'open');\n      if(ac){\n        this.handleClassList(expandableMenu, 'remove', 'active-section')\n        this.handleClassList(menuItem, 'remove', 'active-section')\n      }\n  }\n\n  @Method()\n  async isItemExpandable(){\n    return this.isExpandable;\n  }\n\n  handleActiveState() {\n    if (this.internalActiveState) {\n      this.setActiveClasses()\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter') {\n      this.toggleSubmenu()\n    }\n  }\n\n  componentDidLoad() {\n    this.handleActiveState();\n    if (this.isExpandable) {\n      const sidebarItems = this.getSidebarMenuItems();\n      this.handleExpandableMenu(sidebarItems)\n    }\n    // Listen for collapsed state changes\n    this.updateIndicatorVariant();\n    // Set up MutationObserver to watch for CSS custom property changes\n    this.observeCollapsedState();\n    // Extract text content for title attribute\n    this.extractTitleText();\n  }\n\n  private extractTitleText() {\n    // Get the text content from the slot\n    const slotElement = this.el.shadowRoot.querySelector('slot');\n    if (slotElement) {\n      const assignedNodes = slotElement.assignedNodes();\n      this.titleText = assignedNodes\n        .filter(node => node.nodeType === Node.TEXT_NODE || node.nodeType === Node.ELEMENT_NODE)\n        .map(node => node.textContent?.trim() || '')\n        .join(' ')\n        .trim();\n    }\n  }\n\n  private updateIndicatorVariant() {\n    // Check the data attribute on this element\n    const isCollapsed = this.el.hasAttribute('data-sidebar-collapsed');\n    //this.indicatorVariant = isCollapsed ? 'dot' : 'number';\n    if (this.numberIndicator > 0) {\n        this.indicatorVariant = isCollapsed ? 'dot' : 'number';\n    }\n  }\n\n  private observeCollapsedState() {\n    // Create a MutationObserver to watch for data-sidebar-collapsed attribute changes\n    const observer = new MutationObserver(() => {\n      this.updateIndicatorVariant();\n    });\n\n    observer.observe(this.el, {\n      attributes: true,\n      attributeFilter: ['data-sidebar-collapsed']\n    });\n  }\n\n  componentWillLoad() {\n    this.internalActiveState = this.active;\n    this.checkIfMenuItemIsNested();\n    this.checkIfMenuItemIsSubMenu();\n    this.setHref()\n\n    // Set attribute to track if item has icon\n    this.el.setAttribute('data-has-icon', this.icon ? 'true' : 'false');\n\n    const sidebarItems = this.getSidebarMenuItems();\n    if (sidebarItems.length !== 0) {\n      this.isExpandable = true;\n    } else {\n      this.isExpandable = false;\n    }\n  }\n\n  componentWillUpdate() {\n    // If the active prop has been set to true and the internalActiveState has not been set to true yet\n    if (this.active && !this.internalActiveState) {\n      // Set the internal active state to true\n      this.internalActiveState = this.active;\n\n      // Emit the event to notify the parent Sidebar\n      this.ifxSidebarNavigationItem.emit(this.el);\n    }\n  }\n\n\nrender() {\n  const isCollapsed = this.el.hasAttribute('data-sidebar-collapsed');\n  const shouldHide = this.el.hasAttribute('data-hide-in-collapsed');\n\n  return (\n    <div style={{ display: shouldHide ? 'none' : 'block' }}>\n      <a\n        tabIndex={1}\n        onKeyDown={(event) => this.handleKeyDown(event)}\n        href={this.internalHref}\n        onClick={() => this.toggleSubmenu()}\n        target={this.target}\n        class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}\n        title={this.titleText}\n      >\n        {this.icon &&\n          <div class={`sidebar__nav-item-icon-wrapper ${!this.showIcon && !isCollapsed ? 'noIcon' : \"\"}`}>\n            <ifx-icon icon={this.icon}></ifx-icon>\n          </div>}\n        <div class=\"sidebar__nav-item-label\">\n          <slot />\n        </div>\n        {\n        (this.isExpandable || !isNaN(this.numberIndicator)) &&\n          <div class=\"sidebar__nav-item-indicator\" style={{\n            display: (!isCollapsed || this.icon) ? 'flex' : 'none'\n          }}>\n            {this.isExpandable &&\n              <span class='item__arrow-wrapper'>\n                <ifx-icon icon=\"chevron-down-16\" />\n              </span>\n            }\n\n            {this.numberIndicator > 0 && !this.isExpandable && !this.isNested &&\n              <span class=\"item__number-indicator\">\n                <ifx-indicator\n                  variant={this.indicatorVariant}\n                  number={this.numberIndicator}>\n                </ifx-indicator>\n              </span>}\n\n          </div>\n        }\n      </a>\n      {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n    </div>\n  );\n}\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-cea19e32.entry.js → p-0fb9f42b.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o,d as t}from"./p-C6IIVo5u.js";const r=".ifx-content-switcher-item{all:unset;height:36px;box-sizing:border-box;border-radius:9999px;border:3px solid transparent;padding:7px 20px;font-family:var(--ifx-font-family);font-weight:600;font-size:14px;line-height:20px;display:flex;justify-content:center;align-items:center;gap:8px;background-color:transparent}.ifx-content-switcher-item.selected{color:#0A8276;background-color:#FFFFFF;border:3px solid #0A8276}.ifx-content-switcher-item:hover{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C;cursor:pointer}.ifx-content-switcher-item:active{color:#08665C;background-color:#FFFFFF;border:3px solid #06534B}.ifx-content-switcher-item:focus{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C}";const c=class{constructor(o){e(this,o);this.selected=false}render(){return o(t,{key:"844da0fa26ea37b9b53d16f70f982fc4daf3bed1"},o("button",{key:"ed5ec4be1c0cd301db79a078fe28f36967a55d85",class:"ifx-content-switcher-item"+(this.selected?" selected":"")},o("slot",{key:"6469c05327408244756a8af3f555c32bae66ace1"})))}};c.style=r;export{c as ifx_content_switcher_item};
-//# sourceMappingURL=p-cea19e32.entry.js.map
+import{r as e,h as t,d as o}from"./p-PqnYwNKt.js";const r=".ifx-content-switcher-item{all:unset;height:36px;box-sizing:border-box;border-radius:9999px;border:3px solid transparent;padding:7px 20px;font-family:var(--ifx-font-family);font-weight:600;font-size:14px;line-height:20px;display:flex;justify-content:center;align-items:center;gap:8px;background-color:transparent}.ifx-content-switcher-item.selected{color:#0A8276;background-color:#FFFFFF;border:3px solid #0A8276}.ifx-content-switcher-item:hover{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C;cursor:pointer}.ifx-content-switcher-item:active{color:#08665C;background-color:#FFFFFF;border:3px solid #06534B}.ifx-content-switcher-item:focus{color:#08665C;background-color:#FFFFFF;border:3px solid #08665C}";const c=class{constructor(t){e(this,t);this.selected=false}render(){return t(o,{key:"844da0fa26ea37b9b53d16f70f982fc4daf3bed1"},t("button",{key:"ed5ec4be1c0cd301db79a078fe28f36967a55d85",class:"ifx-content-switcher-item"+(this.selected?" selected":"")},t("slot",{key:"6469c05327408244756a8af3f555c32bae66ace1"})))}};c.style=r;export{c as ifx_content_switcher_item};
+//# sourceMappingURL=p-0fb9f42b.entry.js.map

package/dist/infineon-design-system-stencil/p-0fb9f42b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["contentSwitcherItemCss","ContentSwitcherItem","constructor","hostRef","this","selected","render","h","Host","key","class"],"sources":["src/components/content-switcher/content-switcher-item.scss?tag=ifx-content-switcher-item&encapsulation=shadow","src/components/content-switcher/content-switcher-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.ifx-content-switcher-item {\n    all: unset;\n\n    height: tokens.$ifxSize450;\n    box-sizing: border-box;\n    border-radius: tokens.$ifxBorderRadiusRound;\n    border: 3px solid transparent; // avoid jumping around\n    padding: 7px tokens.$ifxSize250;\n\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n    font-weight: tokens.$ifxFontWeightSemibold;\n    font-size: tokens.$ifxSize175;\n    line-height: 20px;\n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    background-color: transparent;\n\n    &.selected {\n        color: tokens.$ifxColorOcean500;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean500;\n    }\n\n    &:hover {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean600;\n        cursor: pointer;\n    }\n\n    &:active {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean700;\n    }\n\n    &:focus {\n        color: tokens.$ifxColorOcean600;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 3px solid tokens.$ifxColorOcean600;\n    }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-content-switcher-item',\n  styleUrl: './content-switcher-item.scss',\n  shadow: true,\n})\nexport class ContentSwitcherItem {\n  @Prop() selected: boolean = false;\n  @Prop() value: string;\n\n  render() {\n    return (\n      <Host>\n        <button class={'ifx-content-switcher-item' + (this.selected ? ' selected' : '')}>\n          <slot></slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAyB,mtB,MCOlBC,EAAmB,MALhC,WAAAC,CAAAC,G,UAMUC,KAAQC,SAAY,KAY7B,CATC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,MAAO,6BAA+BN,KAAKC,SAAW,YAAc,KAC1EE,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-ad24bfd3.entry.js → p-116c853e.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,d as s,a}from"./p-C6IIVo5u.js";const l=":host{display:block;width:100%}.search-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-start;margin-bottom:16px}.components-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-end;align-content:flex-end;flex-wrap:wrap;gap:16px}.filter-slot-wrapper{flex-grow:1;flex-basis:100%;max-width:100%}@media (max-width: 1024px){.more-filters-wrapper{order:3;width:100%;display:flex;justify-content:center;padding-top:16px;}}@media (min-width: 720px) and (max-width: 1024px){.filter-slot-wrapper{flex-basis:calc((100% - 16px) / 2);max-width:calc((100% - 16px) / 2)}}@media (min-width: 1025px){.filter-slot-wrapper{flex-basis:auto;max-width:200px}::slotted([slot=filter-search]){max-width:828px}}::slotted([slot=filter-search]){flex-grow:1;flex-basis:100%;width:100%}";const r=class{constructor(i){t(this,i);this.ifxTopbarFilterChange=e(this,"ifxTopbarFilterChange",7);this.selectedOptions=[];this.showAllFilters=false;this.maxShownFilters=4;this.showMoreFiltersButton=true;this.handleMoreFiltersClick=()=>{this.showAllFilters=true;this.updateVisibleSlots()};this.handleResetEvent=()=>{var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="filter-search"]');if(e instanceof HTMLSlotElement){const t=e.assignedElements({flatten:true});t.forEach((t=>{const e=t.querySelector("ifx-filter-search");const i=e.shadowRoot.querySelectorAll("ifx-search-field");if(i.length>0){i.forEach((t=>{t.value=""}))}}))}this.selectedOptions=[];this.ifxTopbarFilterChange.emit(this.selectedOptions)};this.handleSearchChange=t=>{this.handleTopbarFilterChange(t)};this.handleFilterSelect=t=>{this.handleTopbarFilterChange(t)};this.handleTopbarFilterChange=t=>{const e=[...this.selectedOptions];if(t.type==="ifxFilterSearchChange"){const{filterName:i,filterValue:s}=t.detail;const a=e.findIndex((t=>t.filterName===i));if(a!==-1){e[a].filterValues=[s]}else{e.push({filterName:i,filterValues:[s],type:"text"})}}else if(t.type==="ifxFilterSelect"){const{filterName:i,filterValues:s,type:a}=t.detail;const l=e.findIndex((t=>t.filterName===i));if(l!==-1){e[l].filterValues=s;e[l].type=a}else{e.push({filterName:i,filterValues:s,type:a})}}this.selectedOptions=e;this.ifxTopbarFilterChange.emit(this.selectedOptions)}}connectedCallback(){this.el.addEventListener("ifxFilterSelect",this.handleTopbarFilterChange);this.el.addEventListener("ifxFilterSearchChange",this.handleSearchChange);window.addEventListener("ifxResetFiltersEvent",this.handleResetEvent)}componentWillUnload(){this.el.removeEventListener("ifxFilterSelect",this.handleTopbarFilterChange);this.el.removeEventListener("ifxFilterSearchChange",this.handleSearchChange);window.removeEventListener("ifxResetFiltersEvent",this.handleResetEvent)}componentWillLoad(){this.updateVisibleSlots()}updateVisibleSlots(){this.visibleSlots=this.showAllFilters?Number.MAX_SAFE_INTEGER:this.maxShownFilters}render(){const t=Math.max(0,this.visibleSlots);const e=this.el.querySelectorAll("ifx-set-filter").length;const a=Math.min(t,e,Number.MAX_SAFE_INTEGER);const l=Array.from({length:a},((t,e)=>i("div",{class:"filter-slot-wrapper"},i("slot",{name:`filter-component-${e+1}`}))));return i(s,{key:"2b4927cc61d5e9c566f85544f47b8f3a4305be4e"},i("div",{key:"dc3fc02769297cfea89e54f7403bd811ad4cf952",class:"search-container"},i("slot",{key:"9ec9fe23bd4d14de1d2795d0d2dd21622c93eb76",name:"filter-search"})," "),i("div",{key:"c4ea12c884a69fc6905cb178de6da350648821e0",class:"components-container"},l.length>0?l:i("slot",{name:"filter-component"}),this.showMoreFiltersButton&&!this.showAllFilters&&i("div",{key:"d99f66f19f88a1788b9bfdb86b5ceacbe2fd3fad",class:"more-filters-wrapper",onClick:this.handleMoreFiltersClick},i("ifx-button",{key:"fbf09d84fc2ea71ece0a6440fc808ddf89b78f65",type:"button",disabled:false,variant:"tertiary",size:"m",target:"_blank",theme:"default","full-width":"false"},i("ifx-icon",{key:"930c10fd594a70b820249134cbbb320e17ebf8a7",icon:"filter-16"}),"More filters"))))}get el(){return a(this)}};r.style=l;export{r as ifx_filter_bar};
-//# sourceMappingURL=p-ad24bfd3.entry.js.map
+import{r as t,c as e,h as i,d as s,a}from"./p-PqnYwNKt.js";const l=":host{display:block;width:100%}.search-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-start;margin-bottom:16px}.components-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-end;align-content:flex-end;flex-wrap:wrap;gap:16px}.filter-slot-wrapper{flex-grow:1;flex-basis:100%;max-width:100%}@media (max-width: 1024px){.more-filters-wrapper{order:3;width:100%;display:flex;justify-content:center;padding-top:16px;}}@media (min-width: 720px) and (max-width: 1024px){.filter-slot-wrapper{flex-basis:calc((100% - 16px) / 2);max-width:calc((100% - 16px) / 2)}}@media (min-width: 1025px){.filter-slot-wrapper{flex-basis:auto;max-width:200px}::slotted([slot=filter-search]){max-width:828px}}::slotted([slot=filter-search]){flex-grow:1;flex-basis:100%;width:100%}";const r=class{constructor(i){t(this,i);this.ifxTopbarFilterChange=e(this,"ifxTopbarFilterChange",7);this.selectedOptions=[];this.showAllFilters=false;this.maxShownFilters=4;this.showMoreFiltersButton=true;this.handleMoreFiltersClick=()=>{this.showAllFilters=true;this.updateVisibleSlots()};this.handleResetEvent=()=>{var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="filter-search"]');if(e instanceof HTMLSlotElement){const t=e.assignedElements({flatten:true});t.forEach((t=>{const e=t.querySelector("ifx-filter-search");const i=e.shadowRoot.querySelectorAll("ifx-search-field");if(i.length>0){i.forEach((t=>{t.value=""}))}}))}this.selectedOptions=[];this.ifxTopbarFilterChange.emit(this.selectedOptions)};this.handleSearchChange=t=>{this.handleTopbarFilterChange(t)};this.handleFilterSelect=t=>{this.handleTopbarFilterChange(t)};this.handleTopbarFilterChange=t=>{const e=[...this.selectedOptions];if(t.type==="ifxFilterSearchChange"){const{filterName:i,filterValue:s}=t.detail;const a=e.findIndex((t=>t.filterName===i));if(a!==-1){e[a].filterValues=[s]}else{e.push({filterName:i,filterValues:[s],type:"text"})}}else if(t.type==="ifxFilterSelect"){const{filterName:i,filterValues:s,type:a}=t.detail;const l=e.findIndex((t=>t.filterName===i));if(l!==-1){e[l].filterValues=s;e[l].type=a}else{e.push({filterName:i,filterValues:s,type:a})}}this.selectedOptions=e;this.ifxTopbarFilterChange.emit(this.selectedOptions)}}connectedCallback(){this.el.addEventListener("ifxFilterSelect",this.handleTopbarFilterChange);this.el.addEventListener("ifxFilterSearchChange",this.handleSearchChange);window.addEventListener("ifxResetFiltersEvent",this.handleResetEvent)}componentWillUnload(){this.el.removeEventListener("ifxFilterSelect",this.handleTopbarFilterChange);this.el.removeEventListener("ifxFilterSearchChange",this.handleSearchChange);window.removeEventListener("ifxResetFiltersEvent",this.handleResetEvent)}componentWillLoad(){this.updateVisibleSlots()}updateVisibleSlots(){this.visibleSlots=this.showAllFilters?Number.MAX_SAFE_INTEGER:this.maxShownFilters}render(){const t=Math.max(0,this.visibleSlots);const e=this.el.querySelectorAll("ifx-set-filter").length;const a=Math.min(t,e,Number.MAX_SAFE_INTEGER);const l=Array.from({length:a},((t,e)=>i("div",{class:"filter-slot-wrapper"},i("slot",{name:`filter-component-${e+1}`}))));return i(s,{key:"2b4927cc61d5e9c566f85544f47b8f3a4305be4e"},i("div",{key:"dc3fc02769297cfea89e54f7403bd811ad4cf952",class:"search-container"},i("slot",{key:"9ec9fe23bd4d14de1d2795d0d2dd21622c93eb76",name:"filter-search"})," "),i("div",{key:"c4ea12c884a69fc6905cb178de6da350648821e0",class:"components-container"},l.length>0?l:i("slot",{name:"filter-component"}),this.showMoreFiltersButton&&!this.showAllFilters&&i("div",{key:"d99f66f19f88a1788b9bfdb86b5ceacbe2fd3fad",class:"more-filters-wrapper",onClick:this.handleMoreFiltersClick},i("ifx-button",{key:"fbf09d84fc2ea71ece0a6440fc808ddf89b78f65",type:"button",disabled:false,variant:"tertiary",size:"m",target:"_blank",theme:"default","full-width":"false"},i("ifx-icon",{key:"930c10fd594a70b820249134cbbb320e17ebf8a7",icon:"filter-16"}),"More filters"))))}get el(){return a(this)}};r.style=l;export{r as ifx_filter_bar};
+//# sourceMappingURL=p-116c853e.entry.js.map

package/dist/infineon-design-system-stencil/p-116c853e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["filterBarCss","FilterBar","constructor","hostRef","this","selectedOptions","showAllFilters","maxShownFilters","showMoreFiltersButton","handleMoreFiltersClick","updateVisibleSlots","handleResetEvent","filterSearchSlot","_a","el","shadowRoot","querySelector","HTMLSlotElement","filterSearchSlottedElements","assignedElements","flatten","forEach","filterSearchWrapper","filterSearch","searchField","querySelectorAll","length","searchFieldElement","value","ifxTopbarFilterChange","emit","handleSearchChange","event","handleTopbarFilterChange","handleFilterSelect","newSelectedOptions","type","filterName","filterValue","detail","existingOptionIndex","findIndex","option","filterValues","push","connectedCallback","addEventListener","window","componentWillUnload","removeEventListener","componentWillLoad","visibleSlots","Number","MAX_SAFE_INTEGER","render","safeVisibleSlots","Math","max","actualNumberOfComponents","slotsToShow","min","slots","Array","from","_","i","h","class","name","Host","key","onClick","disabled","variant","size","target","theme","icon"],"sources":["src/components/table-advanced-version/filter-bar/filter-bar.scss?tag=ifx-filter-bar&encapsulation=shadow","src/components/table-advanced-version/filter-bar/filter-bar.tsx"],"sourcesContent":["/* filter-bar.scss */\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: block;\n  width: 100%;\n}\n\n.search-container {\n  display: flex;\n  width: calc(100% - 48px); /* Adjust width to account for padding */\n  padding-left: 24px;\n  padding-right: 24px;  flex-direction: row;\n  align-items: flex-start;\n  margin-bottom: tokens.$ifxSpace200;\n}\n\n.components-container {\n  display: flex;\n  width: calc(100% - 48px); /* Adjust width to account for padding */\n  padding-left: 24px;\n  padding-right: 24px;  flex-direction: row;\n  align-items: flex-end;\n  align-content:flex-end;\n  flex-wrap: wrap;\n  gap: tokens.$ifxSpace200;\n}\n\n.filter-slot-wrapper {\n    flex-grow: 1;\n    flex-basis: 100%; \n    max-width: 100%; \n  }\n\n@media (max-width: 1024px) { /* Adjust based on your breakpoints for mid/small screens */\n    .more-filters-wrapper {\n        order: 3; /* Keeps the button at the end/new row */\n        width: 100%; /* Takes full width to allow centering */\n        display: flex; /* Enables flexbox properties */\n        justify-content: center; /* Centers the button horizontally */\n        padding-top: tokens.$ifxSpace200; /* Adds space above the button, adjust as needed */\n      }\n  }\n\n\n  @media (min-width: 720px) and (max-width: 1024px) {\n    .filter-slot-wrapper {\n        flex-basis: calc((100% - tokens.$ifxSpace200) / 2);\n        max-width: calc((100% - tokens.$ifxSpace200) / 2);\n      }\n    \n\n}\n\n  @media (min-width: 1025px) {\n    .filter-slot-wrapper {\n        flex-basis: auto; \n        max-width: 200px; \n      }\n\n    ::slotted([slot=\"filter-search\"]) {\n        max-width: 828px;\n      }\n  }\n  \n  ::slotted([slot=\"filter-search\"]) {\n    flex-grow: 1;\n    flex-basis: 100%;\n    width: 100%; \n  }","// FilterBar.tsx\nimport { Component, h, Host, Element, Event, EventEmitter, State, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-filter-bar',\n  styleUrl: 'filter-bar.scss',\n  shadow: true\n})\nexport class FilterBar {\n  @Element() el: HTMLElement;\n  @State() selectedOptions: Array<{ filterName: string, filterValues: [string], type: string }> = [];\n  @Event() ifxTopbarFilterChange: EventEmitter;\n  @State() showAllFilters: boolean = false;\n  @Prop() maxShownFilters: number = 4; // Default to 4, can be overridden by parent component\n  @State() visibleSlots: number;\n@Prop() showMoreFiltersButton: boolean = true;\n\n  /* If the component is ever removed and then reattached to the DOM, \nconnectedCallback ensures that the event listeners are properly set up again */\n  connectedCallback() {\n    this.el.addEventListener('ifxFilterSelect', this.handleTopbarFilterChange);\n    this.el.addEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.addEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n  }\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxFilterSelect', this.handleTopbarFilterChange);\n    this.el.removeEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n  }\n\n  \n  componentWillLoad() {\n    this.updateVisibleSlots();\n  }\n\n// Modify updateVisibleSlots to use showAllFilters to determine the number of slots\nupdateVisibleSlots() {\n   this.visibleSlots = this.showAllFilters ? Number.MAX_SAFE_INTEGER : this.maxShownFilters;\n }\n\n  handleMoreFiltersClick = () => {\n    this.showAllFilters = true;\n    this.updateVisibleSlots(); // Recalculate visible slots based on the new state\n  }\n\n  handleResetEvent = () => {\n    const filterSearchSlot = this.el.shadowRoot?.querySelector('slot[name=\"filter-search\"]');\n    if (filterSearchSlot instanceof HTMLSlotElement) { // Ensure it's treated as HTMLSlotElement\n      const filterSearchSlottedElements = filterSearchSlot.assignedElements({ flatten: true });\n  \n    filterSearchSlottedElements.forEach((filterSearchWrapper: HTMLElement) => {\n      const filterSearch = filterSearchWrapper.querySelector('ifx-filter-search');\n\n      const searchField = filterSearch.shadowRoot.querySelectorAll('ifx-search-field')\n\n      if (searchField.length > 0) {\n        searchField.forEach((searchFieldElement: any) => {\n          searchFieldElement.value = '';\n        });\n      }\n    });\n  }\n\n    this.selectedOptions = [];\n\n    // Emit the change to inform any parent components that the filters have been reset\n    this.ifxTopbarFilterChange.emit(this.selectedOptions);\n  }\n\n\n  handleSearchChange = (event: CustomEvent) => {\n    this.handleTopbarFilterChange(event);\n  }\n\n  handleFilterSelect = (event: CustomEvent) => {\n    this.handleTopbarFilterChange(event);\n  }\n\n  handleTopbarFilterChange = (event: CustomEvent) => {\n    const newSelectedOptions = [...this.selectedOptions];\n\n    if (event.type === 'ifxFilterSearchChange') {\n      const { filterName, filterValue } = event.detail;\n      const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterName === filterName);\n\n      if (existingOptionIndex !== -1) {\n        // If an existing filter is found, update its value\n        newSelectedOptions[existingOptionIndex].filterValues = [filterValue];\n      } else {\n        newSelectedOptions.push({ filterName: filterName, filterValues: [filterValue], type: 'text' });\n      }\n    } else if (event.type === 'ifxFilterSelect') {\n      const { filterName, filterValues, type } = event.detail;\n      const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterName === filterName);\n\n      if (existingOptionIndex !== -1) {\n        newSelectedOptions[existingOptionIndex].filterValues = filterValues;\n        newSelectedOptions[existingOptionIndex].type = type; // Update type based on the number of selected items\n      } else {\n        newSelectedOptions.push({ filterName: filterName, filterValues: filterValues, type: type });\n      }\n    }\n\n    this.selectedOptions = newSelectedOptions;\n    this.ifxTopbarFilterChange.emit(this.selectedOptions);\n  }\n\n  render() {\n    const safeVisibleSlots = Math.max(0, this.visibleSlots);\n\n    const actualNumberOfComponents = this.el.querySelectorAll('ifx-set-filter').length; \n     // Calculate slotsToShow safely\n    const slotsToShow = Math.min(safeVisibleSlots, actualNumberOfComponents, Number.MAX_SAFE_INTEGER);\n\n    const slots = Array.from({ length: slotsToShow }, (_, i) => (\n      <div class=\"filter-slot-wrapper\">\n        <slot name={`filter-component-${i + 1}`}></slot>\n      </div>\n    ));\n\n    return (\n      <Host>\n        <div class=\"search-container\">\n          <slot name=\"filter-search\"></slot> {/* Directly place the search slot here */}\n        </div>\n        <div class=\"components-container\">\n          {slots.length > 0 ? slots : <slot name=\"filter-component\"></slot>}\n          {this.showMoreFiltersButton && !this.showAllFilters && (\n            <div class=\"more-filters-wrapper\" onClick={this.handleMoreFiltersClick}>\n              <ifx-button type=\"button\" disabled={false} variant=\"tertiary\" size=\"m\" target=\"_blank\" theme=\"default\" full-width=\"false\">\n                <ifx-icon icon=\"filter-16\"></ifx-icon>More filters\n              </ifx-button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-f80cad1e.entry.js → p-169f26ae.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,c as t,h as s,a as e}from"./p-C6IIVo5u.js";import{c as n}from"./p-DMLRPGid.js";import"./p-B85MJLTf.js";const o=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.action-list-item{display:flex;align-items:center;padding:8px 16px;background:#FFFFFF;transition:background-color 0.2s ease;cursor:default}.action-list-item--clickable{cursor:pointer}.action-list-item--clickable:hover:not(.action-list-item--disabled){background:#F7F7F7}.action-list-item--clickable:focus:not(.action-list-item--disabled){outline:none;background:#F7F7F7}.action-list-item--clickable:active:not(.action-list-item--disabled){background:#EEEDED}.action-list-item--disabled ::slotted(ifx-icon){color:#BFBBBB}.action-list-item--disabled ::slotted(*) ifx-icon{color:#BFBBBB}.action-list-item__leading{display:flex;align-items:center;justify-content:center;margin-right:16px;flex-shrink:0}.action-list-item__content{flex:1;min-width:0}.action-list-item__title{font-weight:600;font-size:1rem;line-height:1.5rem;color:#1D1D1D;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-list-item--disabled .action-list-item__title{color:#BFBBBB}.action-list-item__description{font-size:0.875rem;line-height:1.25rem;color:#575352;margin-top:2px}.action-list-item--disabled .action-list-item__description{color:#BFBBBB}.action-list-item__trailing{display:flex;align-items:center;justify-content:center;margin-left:16px;flex-shrink:0;gap:16px}';const l=class{constructor(s){i(this,s);this.ifxActionListItemClick=t(this,"ifxActionListItemClick",7);this.target="_self";this.disabled=false;this.handleMainClick=i=>{var t,s;if(this.disabled){i.preventDefault();i.stopPropagation();return}const e=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector(".action-list-item__leading");const n=(s=this.host.shadowRoot)===null||s===void 0?void 0:s.querySelector(".action-list-item__trailing");if((e===null||e===void 0?void 0:e.contains(i.target))||(n===null||n===void 0?void 0:n.contains(i.target))){return}this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.handleLeadingClick=i=>{if(this.disabled){i.preventDefault();i.stopPropagation();return}const t=i.target;let s=t;while(s&&s!==this.host){if(this.isInteractiveElement(s)){i.stopPropagation();return}s=s.parentElement}i.stopPropagation();this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.handleTrailingClick=i=>{if(this.disabled){i.preventDefault();i.stopPropagation();return}const t=i.target;let s=t;while(s&&s!==this.host){if(this.isInteractiveElement(s)){i.stopPropagation();return}s=s.parentElement}i.stopPropagation();this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.isInteractiveElement=i=>{const t=i.tagName.toUpperCase();const s=["IFX-BUTTON","IFX-CHECKBOX","IFX-SWITCH"];return s.includes(t)};this.handleMainKeyDown=i=>{if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();this.handleMainClick(i)}};this.handleLeadingKeyDown=i=>{var t;if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();const s=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="leading"]');const e=(s===null||s===void 0?void 0:s.assignedElements())||[];const n=e.find((i=>this.isInteractiveElement(i)));if(n){n.focus();n.click()}}};this.handleTrailingKeyDown=i=>{var t;if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();const s=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="trailing"]');const e=(s===null||s===void 0?void 0:s.assignedElements())||[];const n=e.find((i=>this.isInteractiveElement(i)));if(n){n.focus();n.click()}}};this.updateSlotElementsDisabledState=()=>{const i=["ifx-checkbox","ifx-switch","ifx-button"];const t=this.host.querySelectorAll("[slot]");t.forEach((t=>{if(i.includes(t.tagName.toLowerCase())){this.setElementDisabledState(t)}i.forEach((i=>{const s=t.querySelectorAll(i);s.forEach((i=>{this.setElementDisabledState(i)}))}))}))};this.setElementDisabledState=i=>{if(this.disabled){i.setAttribute("disabled","true")}else{i.removeAttribute("disabled")}}}onDisabledChange(){this.updateSlotElementsDisabledState()}hasSlotContent(i){const t=this.host.querySelector(`[slot="${i}"]`);return!!t}componentDidLoad(){this.updateSlotElementsDisabledState()}componentDidUpdate(){this.updateSlotElementsDisabledState()}render(){const i=!this.disabled&&(this.href||this.value);const t=this.itemAriaLabel||`${this.itemTitle}${this.description?` - ${this.description}`:""}`;const e=this.hasSlotContent("leading");const o=this.hasSlotContent("trailing");return s("div",{key:"afc03036455ceb23a99e893ebdc36c052fcc2e64",class:n("action-list-item",this.disabled&&"action-list-item--disabled",i&&"action-list-item--clickable"),role:"listitem",tabIndex:i?0:-1,"aria-label":t,"aria-disabled":this.disabled?"true":undefined,onClick:this.handleMainClick,onKeyDown:this.handleMainKeyDown},e&&s("div",{key:"fbc09a625f124bdcf9137cde295838592925cc93",class:"action-list-item__leading",onClick:this.handleLeadingClick,onKeyDown:this.handleLeadingKeyDown},s("slot",{key:"915fb5467635e391ca3713def64ee031095e784d",name:"leading"})),s("div",{key:"589bd17dcd1f2de8ac7ac1c86db677c9b8eac35e",class:"action-list-item__content"},s("div",{key:"4b0ac3d7e1439cbe8682f9d14411acc4683b2ffe",class:"action-list-item__title"},this.itemTitle),this.description&&s("div",{key:"e5a0481505f637db1f7672fca5e1800a934d4270",class:"action-list-item__description"},this.description)),o&&s("div",{key:"c855aff75b5e1ddba37456c2225f46be3ae17429",class:"action-list-item__trailing",onClick:this.handleTrailingClick,onKeyDown:this.handleTrailingKeyDown},s("slot",{key:"68ff1e04f0bdf90894fa729619c7b7a6f896bad8",name:"trailing"})))}get host(){return e(this)}static get watchers(){return{disabled:["onDisabledChange"]}}};l.style=o;export{l as ifx_action_list_item};
-//# sourceMappingURL=p-f80cad1e.entry.js.map
+import{r as i,c as t,h as s,a as e}from"./p-PqnYwNKt.js";import{c as n}from"./p-DMLRPGid.js";import"./p-B85MJLTf.js";const o=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.action-list-item{display:flex;align-items:center;padding:8px 16px;background:#FFFFFF;transition:background-color 0.2s ease;cursor:default}.action-list-item--clickable{cursor:pointer}.action-list-item--clickable:hover:not(.action-list-item--disabled){background:#F7F7F7}.action-list-item--clickable:focus:not(.action-list-item--disabled){outline:none;background:#F7F7F7}.action-list-item--clickable:active:not(.action-list-item--disabled){background:#EEEDED}.action-list-item--disabled ::slotted(ifx-icon){color:#BFBBBB}.action-list-item--disabled ::slotted(*) ifx-icon{color:#BFBBBB}.action-list-item__leading{display:flex;align-items:center;justify-content:center;margin-right:16px;flex-shrink:0}.action-list-item__content{flex:1;min-width:0}.action-list-item__title{font-weight:600;font-size:1rem;line-height:1.5rem;color:#1D1D1D;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-list-item--disabled .action-list-item__title{color:#BFBBBB}.action-list-item__description{font-size:0.875rem;line-height:1.25rem;color:#575352;margin-top:2px}.action-list-item--disabled .action-list-item__description{color:#BFBBBB}.action-list-item__trailing{display:flex;align-items:center;justify-content:center;margin-left:16px;flex-shrink:0;gap:16px}';const l=class{constructor(s){i(this,s);this.ifxActionListItemClick=t(this,"ifxActionListItemClick",7);this.target="_self";this.disabled=false;this.handleMainClick=i=>{var t,s;if(this.disabled){i.preventDefault();i.stopPropagation();return}const e=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector(".action-list-item__leading");const n=(s=this.host.shadowRoot)===null||s===void 0?void 0:s.querySelector(".action-list-item__trailing");if((e===null||e===void 0?void 0:e.contains(i.target))||(n===null||n===void 0?void 0:n.contains(i.target))){return}this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.handleLeadingClick=i=>{if(this.disabled){i.preventDefault();i.stopPropagation();return}const t=i.target;let s=t;while(s&&s!==this.host){if(this.isInteractiveElement(s)){i.stopPropagation();return}s=s.parentElement}i.stopPropagation();this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.handleTrailingClick=i=>{if(this.disabled){i.preventDefault();i.stopPropagation();return}const t=i.target;let s=t;while(s&&s!==this.host){if(this.isInteractiveElement(s)){i.stopPropagation();return}s=s.parentElement}i.stopPropagation();this.ifxActionListItemClick.emit({value:this.value,href:this.href,target:this.target,component:this});if(this.href){if(this.target==="_blank"){window.open(this.href,this.target)}else{window.location.href=this.href}}};this.isInteractiveElement=i=>{const t=i.tagName.toUpperCase();const s=["IFX-BUTTON","IFX-CHECKBOX","IFX-SWITCH"];return s.includes(t)};this.handleMainKeyDown=i=>{if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();this.handleMainClick(i)}};this.handleLeadingKeyDown=i=>{var t;if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();const s=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="leading"]');const e=(s===null||s===void 0?void 0:s.assignedElements())||[];const n=e.find((i=>this.isInteractiveElement(i)));if(n){n.focus();n.click()}}};this.handleTrailingKeyDown=i=>{var t;if(this.disabled)return;if(i.key==="Enter"||i.key===" "){i.preventDefault();const s=(t=this.host.shadowRoot)===null||t===void 0?void 0:t.querySelector('slot[name="trailing"]');const e=(s===null||s===void 0?void 0:s.assignedElements())||[];const n=e.find((i=>this.isInteractiveElement(i)));if(n){n.focus();n.click()}}};this.updateSlotElementsDisabledState=()=>{const i=["ifx-checkbox","ifx-switch","ifx-button"];const t=this.host.querySelectorAll("[slot]");t.forEach((t=>{if(i.includes(t.tagName.toLowerCase())){this.setElementDisabledState(t)}i.forEach((i=>{const s=t.querySelectorAll(i);s.forEach((i=>{this.setElementDisabledState(i)}))}))}))};this.setElementDisabledState=i=>{if(this.disabled){i.setAttribute("disabled","true")}else{i.removeAttribute("disabled")}}}onDisabledChange(){this.updateSlotElementsDisabledState()}hasSlotContent(i){const t=this.host.querySelector(`[slot="${i}"]`);return!!t}componentDidLoad(){this.updateSlotElementsDisabledState()}componentDidUpdate(){this.updateSlotElementsDisabledState()}render(){const i=!this.disabled&&(this.href||this.value);const t=this.itemAriaLabel||`${this.itemTitle}${this.description?` - ${this.description}`:""}`;const e=this.hasSlotContent("leading");const o=this.hasSlotContent("trailing");return s("div",{key:"afc03036455ceb23a99e893ebdc36c052fcc2e64",class:n("action-list-item",this.disabled&&"action-list-item--disabled",i&&"action-list-item--clickable"),role:"listitem",tabIndex:i?0:-1,"aria-label":t,"aria-disabled":this.disabled?"true":undefined,onClick:this.handleMainClick,onKeyDown:this.handleMainKeyDown},e&&s("div",{key:"fbc09a625f124bdcf9137cde295838592925cc93",class:"action-list-item__leading",onClick:this.handleLeadingClick,onKeyDown:this.handleLeadingKeyDown},s("slot",{key:"915fb5467635e391ca3713def64ee031095e784d",name:"leading"})),s("div",{key:"589bd17dcd1f2de8ac7ac1c86db677c9b8eac35e",class:"action-list-item__content"},s("div",{key:"4b0ac3d7e1439cbe8682f9d14411acc4683b2ffe",class:"action-list-item__title"},this.itemTitle),this.description&&s("div",{key:"e5a0481505f637db1f7672fca5e1800a934d4270",class:"action-list-item__description"},this.description)),o&&s("div",{key:"c855aff75b5e1ddba37456c2225f46be3ae17429",class:"action-list-item__trailing",onClick:this.handleTrailingClick,onKeyDown:this.handleTrailingKeyDown},s("slot",{key:"68ff1e04f0bdf90894fa729619c7b7a6f896bad8",name:"trailing"})))}get host(){return e(this)}static get watchers(){return{disabled:["onDisabledChange"]}}};l.style=o;export{l as ifx_action_list_item};
+//# sourceMappingURL=p-169f26ae.entry.js.map

package/dist/infineon-design-system-stencil/p-169f26ae.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["actionListItemCss","ActionListItem","constructor","hostRef","this","target","disabled","handleMainClick","event","preventDefault","stopPropagation","leadingElement","_a","host","shadowRoot","querySelector","trailingElement","_b","contains","ifxActionListItemClick","emit","value","href","component","window","open","location","handleLeadingClick","currentElement","isInteractiveElement","parentElement","handleTrailingClick","element","tagName","toUpperCase","interactiveInfineonComponents","includes","handleMainKeyDown","key","handleLeadingKeyDown","leadingSlot","assignedElements","firstInteractive","find","el","focus","click","handleTrailingKeyDown","trailingSlot","updateSlotElementsDisabledState","interactiveComponents","slots","querySelectorAll","forEach","slottedElement","toLowerCase","setElementDisabledState","componentTag","nestedElements","nestedElement","setAttribute","removeAttribute","onDisabledChange","hasSlotContent","slotName","slot","componentDidLoad","componentDidUpdate","render","isClickable","ariaLabel","itemAriaLabel","itemTitle","description","hasLeadingContent","hasTrailingContent","h","class","classNames","role","tabIndex","undefined","onClick","onKeyDown","name"],"sources":["src/components/action-list/action-list-item.scss?tag=ifx-action-list-item&encapsulation=shadow","src/components/action-list/action-list-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.action-list-item {\n  display: flex;\n  align-items: center;\n  padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n  background: tokens.$ifxColorBaseWhite;\n  transition: background-color 0.2s ease;\n  cursor: default;\n\n  &--clickable {\n    cursor: pointer;\n\n    &:hover:not(.action-list-item--disabled) {\n      background: tokens.$ifxColorEngineering100;\n    }\n\n    &:focus:not(.action-list-item--disabled) {\n      outline: none;\n      //outline: 2px solid tokens.$ifxColorOcean500;\n      //outline-offset: -2px;\n      background: tokens.$ifxColorEngineering100;\n    }\n\n    &:active:not(.action-list-item--disabled) {\n      background: tokens.$ifxColorEngineering200;\n    }\n  }\n\n  &--disabled {\n    // Apply disabled color to all slotted icons\n    ::slotted(ifx-icon) {\n      color: tokens.$ifxColorEngineering300;\n    }\n\n    // Also apply to nested icons within slotted elements\n    ::slotted(*) {\n      ifx-icon {\n        color: tokens.$ifxColorEngineering300;\n      }\n    }\n  }\n\n  &__leading {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-right: tokens.$ifxSpace200;\n    flex-shrink: 0;\n  }\n\n  &__content {\n    flex: 1;\n    min-width: 0; // Allows text to truncate\n  }\n\n  &__title {\n    font-weight: tokens.$ifxFontWeightSemibold;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    color: tokens.$ifxColorBaseBlack;\n\n    // Truncate long titles\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    // Disabled state\n    .action-list-item--disabled & {\n      color: tokens.$ifxColorEngineering300;\n    }\n  }\n\n  &__description {\n    font-size: tokens.$ifxFontSizeS;\n    line-height: tokens.$ifxLineHeightS;\n    color: tokens.$ifxColorEngineering500;\n    margin-top: tokens.$ifxSpace25;\n\n    // Disabled state\n    .action-list-item--disabled & {\n      color: tokens.$ifxColorEngineering300;\n    }\n  }\n\n  &__trailing {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-left: tokens.$ifxSpace200;\n    flex-shrink: 0;\n    gap: 16px;\n  }\n}","import { Component, h, Prop, Element, Event, EventEmitter, Watch } from '@stencil/core';\nimport classNames from 'classnames';\n\nexport interface ActionListItemClickEvent {\n  value?: string;\n  href?: string;\n  target?: string;\n  component?: ActionListItem;\n}\n\n@Component({\n  tag: 'ifx-action-list-item',\n  styleUrl: 'action-list-item.scss',\n  shadow: true,\n})\nexport class ActionListItem {\n  @Element() host: HTMLElement;\n\n  /**\n   * The title text displayed in the item\n   */\n  @Prop() itemTitle: string;\n\n  /**\n   * The description text displayed below the title\n   */\n  @Prop() description?: string;\n\n  /**\n   * Value associated with this item\n   */\n  @Prop() value?: string;\n\n  /**\n   * URL to navigate to when item is clicked\n   */\n  @Prop() href?: string;\n\n  /**\n   * Target for the link navigation\n   * @default '_self'\n   */\n  @Prop() target: string = '_self';\n\n  /**\n   * Controls whether the item is disabled\n   * @default false\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Aria label for accessibility support\n   */\n  @Prop() itemAriaLabel?: string;\n\n  /**\n   * Event emitted when the main item area is clicked\n   */\n  @Event() ifxActionListItemClick: EventEmitter<ActionListItemClickEvent>;\n\n  @Watch('disabled')\n  onDisabledChange() {\n    // Update interactive elements when disabled state changes\n    this.updateSlotElementsDisabledState();\n  }\n\n  private handleMainClick = (event: MouseEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    // Check if clicked element is inside leading or trailing areas\n    const leadingElement = this.host.shadowRoot?.querySelector('.action-list-item__leading');\n    const trailingElement = this.host.shadowRoot?.querySelector('.action-list-item__trailing');\n\n    if (leadingElement?.contains(event.target as Node) || trailingElement?.contains(event.target as Node)) {\n      return; // Don't trigger main click if clicking on leading/trailing areas\n    }\n\n    // Always emit main event when clicking on content area (text), regardless of interactive elements\n    this.ifxActionListItemClick.emit({\n      value: this.value,\n      href: this.href,\n      target: this.target,\n      component: this,\n    });\n\n    // If href is provided, automatically navigate (Link mode)\n    // If no href is provided, only the event is emitted (Event mode)\n    if (this.href) {\n      if (this.target === '_blank') {\n        window.open(this.href, this.target);\n      } else {\n        window.location.href = this.href;\n      }\n    }\n  };\n\n  private handleLeadingClick = (event: MouseEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    const target = event.target as HTMLElement;\n\n    // Check if the clicked element or any of its parents is an interactive component\n    let currentElement = target;\n    while (currentElement && currentElement !== this.host) {\n      if (this.isInteractiveElement(currentElement)) {\n        // Interactive element clicked - stop propagation to prevent main event\n        event.stopPropagation();\n        return;\n      }\n      currentElement = currentElement.parentElement;\n    }\n\n    // Non-interactive element clicked - trigger main action\n    event.stopPropagation();\n    this.ifxActionListItemClick.emit({\n      value: this.value,\n      href: this.href,\n      target: this.target,\n      component: this,\n    });\n\n    // If href is provided, automatically navigate\n    if (this.href) {\n      if (this.target === '_blank') {\n        window.open(this.href, this.target);\n      } else {\n        window.location.href = this.href;\n      }\n    }\n  };\n\n  private handleTrailingClick = (event: MouseEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    const target = event.target as HTMLElement;\n\n    // Check if the clicked element or any of its parents is an interactive component\n    let currentElement = target;\n    while (currentElement && currentElement !== this.host) {\n      if (this.isInteractiveElement(currentElement)) {\n        // Interactive element clicked - stop propagation to prevent main event\n        event.stopPropagation();\n        return;\n      }\n      currentElement = currentElement.parentElement;\n    }\n\n    // Non-interactive element clicked - trigger main action\n    event.stopPropagation();\n    this.ifxActionListItemClick.emit({\n      value: this.value,\n      href: this.href,\n      target: this.target,\n      component: this,\n    });\n\n    // If href is provided, automatically navigate\n    if (this.href) {\n      if (this.target === '_blank') {\n        window.open(this.href, this.target);\n      } else {\n        window.location.href = this.href;\n      }\n    }\n  };\n\n  private isInteractiveElement = (element: HTMLElement): boolean => {\n    // Get the tag name, handling both custom elements and standard HTML\n    const tagName = element.tagName.toUpperCase();\n\n    // List of Infineon components that should block main event\n    const interactiveInfineonComponents = [\n      'IFX-BUTTON',\n      'IFX-CHECKBOX',\n      'IFX-SWITCH'\n    ];\n\n    // Check if it's an interactive Infineon component\n    return interactiveInfineonComponents.includes(tagName);\n  };\n\n  private handleMainKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n\n      // Always trigger main action via keyboard, regardless of interactive elements\n      this.handleMainClick(event as any);\n    }\n  };\n\n  private handleLeadingKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n\n      const leadingSlot = this.host.shadowRoot?.querySelector('slot[name=\"leading\"]') as HTMLSlotElement;\n      const assignedElements = leadingSlot?.assignedElements() || [];\n\n      // Find first interactive element and activate it\n      const firstInteractive = assignedElements.find(el =>\n        this.isInteractiveElement(el as HTMLElement)\n      ) as HTMLElement;\n\n      if (firstInteractive) {\n        firstInteractive.focus();\n        firstInteractive.click();\n      }\n    }\n  };\n\n  private handleTrailingKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n\n      const trailingSlot = this.host.shadowRoot?.querySelector('slot[name=\"trailing\"]') as HTMLSlotElement;\n      const assignedElements = trailingSlot?.assignedElements() || [];\n\n      // Find first interactive element and activate it\n      const firstInteractive = assignedElements.find(el =>\n        this.isInteractiveElement(el as HTMLElement)\n      ) as HTMLElement;\n\n      if (firstInteractive) {\n        firstInteractive.focus();\n        firstInteractive.click();\n      }\n    }\n  };\n\n  private hasSlotContent(slotName: string): boolean {\n    const slot = this.host.querySelector(`[slot=\"${slotName}\"]`);\n    return !!slot;\n  }\n\n  componentDidLoad() {\n    // Apply disabled state to interactive elements in slots\n    this.updateSlotElementsDisabledState();\n  }\n\n  componentDidUpdate() {\n    // Apply disabled state to interactive elements in slots when disabled prop changes\n    this.updateSlotElementsDisabledState();\n  }\n\n  private updateSlotElementsDisabledState = () => {\n    // Only handle interactive components that should be disabled\n    const interactiveComponents = ['ifx-checkbox', 'ifx-switch', 'ifx-button'];\n\n    // Get all slotted elements\n    const slots = this.host.querySelectorAll('[slot]');\n\n    slots.forEach(slottedElement => {\n      // Check if the slotted element itself is an interactive component\n      if (interactiveComponents.includes(slottedElement.tagName.toLowerCase())) {\n        this.setElementDisabledState(slottedElement as HTMLElement);\n      }\n\n      // Also check for nested interactive components within the slotted element\n      interactiveComponents.forEach(componentTag => {\n        const nestedElements = slottedElement.querySelectorAll(componentTag);\n        nestedElements.forEach(nestedElement => {\n          this.setElementDisabledState(nestedElement as HTMLElement);\n        });\n      });\n    });\n  };\n\n  private setElementDisabledState = (element: HTMLElement) => {\n    if (this.disabled) {\n      element.setAttribute('disabled', 'true');\n    } else {\n      element.removeAttribute('disabled');\n    }\n  };  render() {\n    const isClickable = !this.disabled && (this.href || this.value);\n    const ariaLabel = this.itemAriaLabel || `${this.itemTitle}${this.description ? ` - ${this.description}` : ''}`;\n    const hasLeadingContent = this.hasSlotContent('leading');\n    const hasTrailingContent = this.hasSlotContent('trailing');\n\n    return (\n      <div\n        class={classNames(\n          'action-list-item',\n          this.disabled && 'action-list-item--disabled',\n          isClickable && 'action-list-item--clickable'\n        )}\n        role=\"listitem\"\n        tabIndex={isClickable ? 0 : -1}\n        aria-label={ariaLabel}\n        aria-disabled={this.disabled ? 'true' : undefined}\n        onClick={this.handleMainClick}\n        onKeyDown={this.handleMainKeyDown}\n      >\n        {/* Leading Item Container - only render if content exists */}\n        {hasLeadingContent && (\n          <div\n            class=\"action-list-item__leading\"\n            onClick={this.handleLeadingClick}\n            onKeyDown={this.handleLeadingKeyDown}\n          >\n            <slot name=\"leading\"></slot>\n          </div>\n        )}\n\n        {/* Text Container */}\n        <div class=\"action-list-item__content\">\n          <div class=\"action-list-item__title\">\n            {this.itemTitle}\n          </div>\n          {this.description && (\n            <div class=\"action-list-item__description\">\n              {this.description}\n            </div>\n          )}\n        </div>\n\n        {/* Trailing Item Container - only render if content exists */}\n        {hasTrailingContent && (\n          <div\n            class=\"action-list-item__trailing\"\n            onClick={this.handleTrailingClick}\n            onKeyDown={this.handleTrailingKeyDown}\n          >\n            <slot name=\"trailing\"></slot>\n          </div>\n        )}\n      </div>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-cd8ed5ca.entry.js → p-1c1b1a1f.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as i,h as t,a as e}from"./p-C6IIVo5u.js";const n=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.dropdown-item:focus{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}';const s=class{constructor(t){o(this,t);this.ifxDropdownItem=i(this,"ifxDropdownItem",7);this.href="";this.target="_self";this.hide=false;this.size="l"}handleMenuSize(o){this.size=o.detail}handleEventEmission(){this.ifxDropdownItem.emit(this.el.textContent)}render(){const o=this.href!==undefined&&this.href!==null&&this.href!=="";const i={class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`,onClick:()=>this.handleEventEmission(),role:"menuitem"};if(!o)i.tabIndex=0;return t("a",Object.assign({key:"0fa61b25ba8f7f8dec6828def32fca24c753970b"},i,o?{href:this.href,target:this.target}:{}),this.icon&&t("ifx-icon",{key:"7676baff54e17a8ac7a3de6a47fb00e773b80718",class:"icon",icon:this.icon}),t("span",{key:"a2b3213b15b3e0d0b40c12cf7863158f5233c400"},t("slot",{key:"b0c64b7c89c088900c65736450ebb366fcccad3c"})))}get el(){return e(this)}};s.style=n;export{s as ifx_dropdown_item};
-//# sourceMappingURL=p-cd8ed5ca.entry.js.map
+import{r as i,c as o,h as t,a as e}from"./p-PqnYwNKt.js";const n=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.dropdown-item:focus{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}';const s=class{constructor(t){i(this,t);this.ifxDropdownItem=o(this,"ifxDropdownItem",7);this.href="";this.target="_self";this.hide=false;this.size="l"}handleMenuSize(i){this.size=i.detail}handleEventEmission(){this.ifxDropdownItem.emit(this.el.textContent)}render(){const i=this.href!==undefined&&this.href!==null&&this.href!=="";const o={class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`,onClick:()=>this.handleEventEmission(),role:"menuitem"};if(!i)o.tabIndex=0;return t("a",Object.assign({key:"0fa61b25ba8f7f8dec6828def32fca24c753970b"},o,i?{href:this.href,target:this.target}:{}),this.icon&&t("ifx-icon",{key:"7676baff54e17a8ac7a3de6a47fb00e773b80718",class:"icon",icon:this.icon}),t("span",{key:"a2b3213b15b3e0d0b40c12cf7863158f5233c400"},t("slot",{key:"b0c64b7c89c088900c65736450ebb366fcccad3c"})))}get el(){return e(this)}};s.style=n;export{s as ifx_dropdown_item};
+//# sourceMappingURL=p-1c1b1a1f.entry.js.map

package/dist/infineon-design-system-stencil/p-1c1b1a1f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownItemCss","DropdownItem","constructor","hostRef","this","href","target","hide","size","handleMenuSize","event","detail","handleEventEmission","ifxDropdownItem","emit","el","textContent","render","hasHref","undefined","common","class","onClick","role","tabIndex","h","Object","assign","key","icon"],"sources":["src/components/dropdown/dropdown-item/dropdown-item.scss?tag=ifx-dropdown-item&encapsulation=shadow","src/components/dropdown/dropdown-item/dropdown-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.dropdown-item {\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  gap: tokens.$ifxSize100;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n  &:focus{\n    outline: none;\n    box-shadow: 0 0 0 2px tokens.$ifxColorBaseWhite, 0 0 0 4px tokens.$ifxColorOcean500;\n  }\n\n  &.hide {\n    display: none;\n  }\n\n  & span {\n    color: tokens.$ifxColorBaseBlack;\n    font-size: 16px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 24px;\n    /* 150% */\n  }\n\n  &.small {\n    & span {\n      font-size: 14px;\n    }\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.icon {\n  margin-right: 4px;\n}","import { Component, Prop, h, Listen, State, Event, EventEmitter, Element } from \"@stencil/core\";\n\n@Component({\n  tag: 'ifx-dropdown-item',\n  styleUrl: 'dropdown-item.scss',\n  shadow: true\n})\n\nexport class DropdownItem {\n  @Prop() icon: string;\n  @Prop() href: string = \"\"\n  @Prop() target: string = \"_self\"\n  @Prop() hide: boolean = false;\n  @State() size: string = 'l'\n  @Event() ifxDropdownItem: EventEmitter;\n  @Element() el;\n\n  @Listen('menuSize', { target: 'body' })\n  handleMenuSize(event: CustomEvent) {\n    this.size = event.detail;\n  }\n\n  handleEventEmission() {\n    this.ifxDropdownItem.emit(this.el.textContent)\n  }\n\n  render() {\n    const hasHref = this.href !== undefined && this.href !== null && this.href !== '';\n    const common = {\n      class: `dropdown-item ${this.size === 's' ? 'small' : \"\"} ${this.hide ? 'hide' : \"\"}`,\n      onClick: () => this.handleEventEmission(),\n      role: 'menuitem'\n    } as any;\n\n    if (!hasHref) common.tabIndex = 0;\n\n    return (\n      <a {...common} {...(hasHref ? { href: this.href, target: this.target } : {})}>\n        {this.icon && <ifx-icon class=\"icon\" icon={this.icon}></ifx-icon>}\n        <span><slot /></span>\n      </a>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAkB,klB,MCQXC,EAAY,MANzB,WAAAC,CAAAC,G,2DAQUC,KAAIC,KAAW,GACfD,KAAME,OAAW,QACjBF,KAAIG,KAAY,MACfH,KAAII,KAAW,GA8BzB,CAzBC,cAAAC,CAAeC,GACbN,KAAKI,KAAOE,EAAMC,M,CAGpB,mBAAAC,GACER,KAAKS,gBAAgBC,KAAKV,KAAKW,GAAGC,Y,CAGpC,MAAAC,GACE,MAAMC,EAAUd,KAAKC,OAASc,WAAaf,KAAKC,OAAS,MAAQD,KAAKC,OAAS,GAC/E,MAAMe,EAAS,CACbC,MAAO,iBAAiBjB,KAAKI,OAAS,IAAM,QAAU,MAAMJ,KAAKG,KAAO,OAAS,KACjFe,QAAS,IAAMlB,KAAKQ,sBACpBW,KAAM,YAGR,IAAKL,EAASE,EAAOI,SAAW,EAEhC,OACEC,EAAO,IAAAC,OAAAC,OAAA,CAAAC,IAAA,4CAAAR,EAAaF,EAAU,CAAEb,KAAMD,KAAKC,KAAMC,OAAQF,KAAKE,QAAW,IACtEF,KAAKyB,MAAQJ,EAAA,YAAAG,IAAA,2CAAUP,MAAM,OAAOQ,KAAMzB,KAAKyB,OAChDJ,EAAA,QAAAG,IAAA,4CAAMH,EAAQ,QAAAG,IAAA,8C","ignoreList":[]}