@infineon/infineon-design-system-stencil 30.10.0--canary.1690.3d3b622c5283d21417323e397dba5684776ee0fb.0 → 30.10.0--canary.1696.f6fc7149013229dfeecb984f52e464c01a339d3d.0

package/dist/infineon-design-system-stencil/{p-5c757132.entry.js → p-1313c9fd.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as a}from"./p-c63974da.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.container{display:inline-flex;align-items:center;padding:4px 16px;border:1px solid #BFBBBB;border-radius:9999px;background-color:#FFFFFF;gap:8px;font-family:var(--ifx-font-family)}.container:hover{cursor:pointer;border-color:#8D8786}.container:active,.container.active{border-color:#1D1D1D}.container:focus:not(:active,.active){outline:none;border-color:#1D1D1D}.container .label-wrapper{text-decoration:none}.container .label-wrapper .label{margin:0;font-weight:400;font-size:1rem;line-height:20px;color:#1D1D1D}';const r=o;const i=class{constructor(a){e(this,a)}render(){return a("div",{key:"ebe5d8e2f3bc59ad1bdef92eb7e4fbc7a07f9c4c","aria-label":"a tag",class:"container"},this.icon&&a("ifx-icon",{key:"accc8280c6248bb81a2d139e85da8a048329e917",icon:this.icon}),a("a",{key:"1282f2372cc961db61fefee89e2a21bf1a998537",href:"javascript:void(null);",class:"label-wrapper"},a("p",{key:"76534734832475e44606e0fed6d3577802525d2f",class:"label"},a("slot",{key:"6d422addc814889fc71d851bc2dc3ab65a7cb3e6"}))))}};i.style=r;export{i as ifx_tag};
-//# sourceMappingURL=p-5c757132.entry.js.map
+import{r as e,h as a}from"./p-6b122987.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.container{display:inline-flex;align-items:center;padding:4px 16px;border:1px solid #BFBBBB;border-radius:9999px;background-color:#FFFFFF;gap:8px;font-family:var(--ifx-font-family)}.container:hover{cursor:pointer;border-color:#8D8786}.container:active,.container.active{border-color:#1D1D1D}.container:focus:not(:active,.active){outline:none;border-color:#1D1D1D}.container .label-wrapper{text-decoration:none}.container .label-wrapper .label{margin:0;font-weight:400;font-size:1rem;line-height:20px;color:#1D1D1D}';const r=o;const i=class{constructor(a){e(this,a);this.icon=undefined}render(){return a("div",{key:"ebe5d8e2f3bc59ad1bdef92eb7e4fbc7a07f9c4c","aria-label":"a tag",class:"container"},this.icon&&a("ifx-icon",{key:"accc8280c6248bb81a2d139e85da8a048329e917",icon:this.icon}),a("a",{key:"1282f2372cc961db61fefee89e2a21bf1a998537",href:"javascript:void(null);",class:"label-wrapper"},a("p",{key:"76534734832475e44606e0fed6d3577802525d2f",class:"label"},a("slot",{key:"6d422addc814889fc71d851bc2dc3ab65a7cb3e6"}))))}};i.style=r;export{i as ifx_tag};
+//# sourceMappingURL=p-1313c9fd.entry.js.map

package/dist/infineon-design-system-stencil/{p-5c757132.entry.js.map → p-1313c9fd.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["tagCss","IfxTagStyle0","Tag","render","h","key","class","this","icon","href"],"sources":["src/components/tag/tag.scss?tag=ifx-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.container {\n  display: inline-flex;\n  align-items: center;\n  padding: tokens.$ifxSpace50 tokens.$ifxSpace200;\n  border: 1px solid tokens.$ifxColorEngineering300;\n  border-radius: tokens.$ifxBorderRadiusRound;\n  background-color: tokens.$ifxColorBaseWhite;\n  gap: tokens.$ifxSpace100;\n  font-family: var(--ifx-font-family);\n\n  &:hover {\n    cursor: pointer;\n    border-color: tokens.$ifxColorEngineering400;\n  }\n\n  &:active,\n  &.active {\n    border-color: tokens.$ifxColorBaseBlack;\n  }\n\n  &:focus:not(:active, .active) {\n    outline: none;\n    border-color: tokens.$ifxColorBaseBlack;\n  }\n\n  .label-wrapper {\n    text-decoration: none;\n\n    .label {\n      margin: 0;\n      font-weight: tokens.$ifxFontWeightRegular;\n      font-size: tokens.$ifxFontSizeM;\n      line-height: 20px;\n      color: tokens.$ifxColorBaseBlack;\n    }\n  }\n}","import { Component, Prop, h } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-tag',\n  styleUrl: 'tag.scss',\n  shadow: true\n})\nexport class Tag {\n  @Prop() icon: string;\n\n\n\n  render() {\n    return (\n      <div aria-label=\"a tag\" class=\"container\">\n        {this.icon && (\n          <ifx-icon icon={this.icon}></ifx-icon>)}\n        <a href=\"javascript:void(null);\" class=\"label-wrapper\" >\n          <p class=\"label\">\n            <slot />\n          </p>\n        </a>\n      </div>\n\n    );\n  }\n}"],"mappings":"2CAAA,MAAMA,EAAS,snBACf,MAAAC,EAAeD,E,MCOFE,EAAG,M,yBAKd,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,wDAAgB,QAAQC,MAAM,aAC3BC,KAAKC,MACJJ,EAAA,YAAAC,IAAA,2CAAUG,KAAMD,KAAKC,OACvBJ,EAAA,KAAAC,IAAA,2CAAGI,KAAK,yBAAyBH,MAAM,iBACrCF,EAAA,KAAAC,IAAA,2CAAGC,MAAM,SACPF,EAAA,QAAAC,IAAA,+C","ignoreList":[]}
+{"version":3,"names":["tagCss","IfxTagStyle0","Tag","render","h","key","class","this","icon","href"],"sources":["src/components/tag/tag.scss?tag=ifx-tag&encapsulation=shadow","src/components/tag/tag.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.container {\n  display: inline-flex;\n  align-items: center;\n  padding: tokens.$ifxSpace50 tokens.$ifxSpace200;\n  border: 1px solid tokens.$ifxColorEngineering300;\n  border-radius: tokens.$ifxBorderRadiusRound;\n  background-color: tokens.$ifxColorBaseWhite;\n  gap: tokens.$ifxSpace100;\n  font-family: var(--ifx-font-family);\n\n  &:hover {\n    cursor: pointer;\n    border-color: tokens.$ifxColorEngineering400;\n  }\n\n  &:active,\n  &.active {\n    border-color: tokens.$ifxColorBaseBlack;\n  }\n\n  &:focus:not(:active, .active) {\n    outline: none;\n    border-color: tokens.$ifxColorBaseBlack;\n  }\n\n  .label-wrapper {\n    text-decoration: none;\n\n    .label {\n      margin: 0;\n      font-weight: tokens.$ifxFontWeightRegular;\n      font-size: tokens.$ifxFontSizeM;\n      line-height: 20px;\n      color: tokens.$ifxColorBaseBlack;\n    }\n  }\n}","import { Component, Prop, h } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-tag',\n  styleUrl: 'tag.scss',\n  shadow: true\n})\nexport class Tag {\n  @Prop() icon: string;\n\n\n\n  render() {\n    return (\n      <div aria-label=\"a tag\" class=\"container\">\n        {this.icon && (\n          <ifx-icon icon={this.icon}></ifx-icon>)}\n        <a href=\"javascript:void(null);\" class=\"label-wrapper\" >\n          <p class=\"label\">\n            <slot />\n          </p>\n        </a>\n      </div>\n\n    );\n  }\n}"],"mappings":"2CAAA,MAAMA,EAAS,snBACf,MAAAC,EAAeD,E,MCOFE,EAAG,M,6CAKd,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,wDAAgB,QAAQC,MAAM,aAC3BC,KAAKC,MACJJ,EAAA,YAAAC,IAAA,2CAAUG,KAAMD,KAAKC,OACvBJ,EAAA,KAAAC,IAAA,2CAAGI,KAAK,yBAAyBH,MAAM,iBACrCF,EAAA,KAAAC,IAAA,2CAAGC,MAAM,SACPF,EAAA,QAAAC,IAAA,+C","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-15d7d577.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i,g as a}from"./p-6b122987.js";import{i as t}from"./p-38c8a9b0.js";const o='.container{display:flex;flex-direction:column;gap:10px}.alert__wrapper{margin-bottom:40px}.html-wrapper{background:rgb(38, 38, 38);padding:20px;color:white;font-family:monospace;position:sticky;top:0;left:0;z-index:99}.html-wrapper button{position:absolute;right:0px;bottom:0px;background:rgba(0, 0, 0, 0.85);color:#C9CDCF;border:0 none;padding:4px 10px;font-size:0.75rem;font-family:"Nunito Sans";font-weight:700;border-top:1px solid rgba(255, 255, 255, 0.1);border-left:1px solid rgba(255, 255, 255, 0.1);margin-left:-1px;border-radius:4px 0 0 0;cursor:pointer}.html-wrapper .component-name{color:#A8FF60}.html-wrapper .attribute-name{color:rgb(150, 203, 254)}.html-wrapper .attribute-value{color:rgb(180, 116, 221)}.preview__container{box-sizing:border-box;display:flex;align-items:center;padding:2px;flex-wrap:wrap;gap:4px}.preview__container .preview__container-item{display:flex;justify-content:center;align-items:center;border:1px solid #f1f1f1;padding:2px;width:50px;height:50px;position:relative}.preview__container .preview__container-item:active{border-color:#378375}.preview__container .preview__container-item:hover{cursor:pointer}.preview__container .preview__container-item.copied::after{z-index:50;content:"copied!";position:absolute;top:0;left:50px;background-color:#000;color:white;padding:3px;border-radius:4px}';const n=o;const c=class{constructor(i){e(this,i);this.iconsArray=[];this.isCopied=false;this.copiedIndex=undefined;this.htmlTag='<ifx-icon icon="calendar-16"></ifx-icon>';this.iconName=`"c-info-24"`}handleCopiedText(){this.isCopied=true;setTimeout((()=>{this.isCopied=false}),2e3)}copyIconText(e){this.htmlTag=`<ifx-icon icon="${e}"></ifx-icon>`;this.iconName=`"${e}"`}copyHtmlString(){const e=`<ifx-icon icon=${this.iconName}></ifx-icon>`;navigator.clipboard.writeText(e);this.handleCopiedText()}componentWillLoad(){for(let e in t){this.iconsArray.push(e)}}render(){return i("div",{key:"1115df3774a76b620e5a03e11bd3ef59e5ff05fd",class:"container"},i("div",{key:"e513e6952f643ceb85c11b00ac515a169d4b10ff",class:"alert__wrapper"},i("ifx-notification",{key:"4d4a5adc91abfce7f1aeffcbb5eaf49459d8cb63",icon:"c-check-16",variant:"success","link-text":"Figma icon library","link-href":"https://www.figma.com/design/yWwaLoqsWLWygDxXfvdym9/Infineon-DDS-%7C-UI-icon-library?node-id=13284-1289&p=f&t=SD6EdmXaSufsjPCv-0","link-target":"_blank"},"You can also find the UI icons in Figma for use in mockups.")),i("div",{key:"f697a5c0fc135ce5e4c6fdb46e9048546b56819b",class:"html-wrapper"},i("span",{key:"893d72ee2dd899e21cc8901dd63417e92257ebc2",class:"html-tag"},"<"),i("span",{key:"fc80b732f5274841790a4a7d0a080e072f355720",class:"component-name"},"ifx-icon"),i("span",{key:"aee512ce9297d447d5a60cef6abec4033a1b8cff",class:"attribute-name"}," icon"),"=",i("span",{key:"6da85573beefb794f1aa4ad50a687086f06a6c3d",class:"attribute-value"},this.iconName),i("span",{key:"86582b2a2011836773285e45de5235ffb568ffd8",class:"html-tag"},">"),i("span",{key:"34684e64ccd0f7a92f52e8dbc108d7fce5494c6d",class:"html-tag"},"</"),i("span",{key:"19cecd8e0ee91008a92a987bd87c0814c2cf1f44",class:"component-name"},"ifx-icon"),i("span",{key:"1f0892b3abf012963f5ff45c774e4d9ad69efa8b",class:"html-tag"},">"),i("button",{key:"b5e268a37eff1dc9ee2f115530f64b4d96a2ad20",onClick:()=>this.copyHtmlString()},this.isCopied?"Copied":"Copy")),i("div",{key:"cc8a8d6e65f4523f267c0733a207d2f6e05d5d2d",class:"preview__container"},this.iconsArray.map(((e,a)=>i("div",{class:`preview__container-item ${this.isCopied&&this.copiedIndex===a?"copied":""}`,onClick:()=>this.copyIconText(e)},i("ifx-icon",{icon:e}))))))}get el(){return a(this)}};c.style=n;export{c as ifx_icons_preview};
+//# sourceMappingURL=p-15d7d577.entry.js.map

package/dist/infineon-design-system-stencil/p-15d7d577.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["iconsPreviewCss","IfxIconsPreviewStyle0","IconsPreview","handleCopiedText","this","isCopied","setTimeout","copyIconText","icon","htmlTag","iconName","copyHtmlString","copiedTag","navigator","clipboard","writeText","componentWillLoad","icons","iconsArray","push","render","h","key","class","variant","onClick","map","index","copiedIndex"],"sources":["src/components/icons-preview/icons-preview.scss?tag=ifx-icons-preview&encapsulation=shadow","src/components/icons-preview/icons-preview.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.container {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.alert__wrapper { \n  margin-bottom: 40px;\n}\n\n.html-wrapper {\n  background: rgb(38, 38, 38);\n  padding: 20px;\n  color: white;\n  font-family: monospace;\n  position: sticky;\n  top: 0;\n  left: 0;\n  z-index: 99;\n\n  & button {\n    position: absolute;\n    right: 0px;\n    bottom: 0px;\n    background: rgba(0, 0, 0, 0.85);\n    color: #C9CDCF;\n    border: 0 none;\n    padding: 4px 10px;\n    font-size: tokens.$ifxFontSizeXs;\n    font-family: \"Nunito Sans\";\n    font-weight: 700;\n    border-top: 1px solid rgba(255, 255, 255, .1);\n    border-left: 1px solid rgba(255, 255, 255, .1);\n    margin-left: -1px;\n    border-radius: 4px 0 0 0;\n    cursor: pointer;\n  }\n\n  & .component-name {\n    color: #A8FF60;\n  }\n\n  & .attribute-name {\n    color: rgb(150, 203, 254);\n  }\n\n  & .attribute-value {\n    color: rgb(180, 116, 221);\n  }\n\n\n}\n\n.preview__container {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  padding: 2px;\n  flex-wrap: wrap;\n  gap: 4px;\n\n  & .preview__container-item {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border: 1px solid #f1f1f1;\n    padding: 2px;\n    width: 50px;\n    height: 50px;\n    position: relative;\n\n    &:active {\n      border-color: #378375;\n    }\n\n    &:hover {\n      cursor: pointer;\n    }\n\n    &.copied {\n      &::after {\n        z-index: 50;\n        content: 'copied!';\n        position: absolute;\n        top: 0;\n        left: 50px;\n        background-color: #000;\n        color: white;\n        padding: 3px;\n        border-radius: 4px;\n      }\n    }\n  }\n}","import { Component, h, Element, State } from \"@stencil/core\";\nimport { icons } from '@infineon/infineon-icons';\n\n@Component({\n  tag: 'ifx-icons-preview',\n  styleUrl: './icons-preview.scss',\n  shadow: true\n})\n\nexport class IconsPreview {\n  @State() iconsArray: string[] = [];\n  @State() isCopied: boolean = false;\n  @State() copiedIndex: number;\n  @State() htmlTag: string = '<ifx-icon icon=\"calendar-16\"></ifx-icon>';\n  @State() iconName: string = `\"c-info-24\"`;\n  @Element() el;\n\n  handleCopiedText() { \n    this.isCopied = true;\n    setTimeout(() => {\n      this.isCopied = false\n    }, 2000);\n  }\n\n  copyIconText(icon) { \n    this.htmlTag = `<ifx-icon icon=\"${icon}\"></ifx-icon>`;\n    this.iconName = `\"${icon}\"`\n  }\n\n  copyHtmlString() { \n    const copiedTag = `<ifx-icon icon=${this.iconName}></ifx-icon>`;\n    navigator.clipboard.writeText(copiedTag);\n    this.handleCopiedText()\n  }\n\n  componentWillLoad() { \n    for(let icon in icons) { \n      this.iconsArray.push(icon)\n    }\n  }\n\n  render() {\n    return (\n      <div class='container'>\n        <div class=\"alert__wrapper\">\n            <ifx-notification \n              icon=\"c-check-16\" \n              variant=\"success\" \n              link-text=\"Figma icon library\" \n              link-href=\"https://www.figma.com/design/yWwaLoqsWLWygDxXfvdym9/Infineon-DDS-%7C-UI-icon-library?node-id=13284-1289&p=f&t=SD6EdmXaSufsjPCv-0\"\n              link-target=\"_blank\">\n              You can also find the UI icons in Figma for use in mockups.\n            </ifx-notification>\n        </div>\n        <div class='html-wrapper'>\n          <span class=\"html-tag\">&lt;</span>\n          <span class=\"component-name\">ifx-icon</span>\n          <span class=\"attribute-name\"> icon</span>=<span class=\"attribute-value\">{this.iconName}</span>\n          <span class=\"html-tag\">&gt;</span>\n          <span class=\"html-tag\">&lt;/</span>\n          <span class=\"component-name\">ifx-icon</span>\n          <span class=\"html-tag\">&gt;</span>\n          <button onClick={() => this.copyHtmlString()}>{this.isCopied ? 'Copied' : 'Copy'}</button>\n        </div>\n        <div class=\"preview__container\">\n          {this.iconsArray.map((icon, index) => \n          <div class={`preview__container-item ${this.isCopied && this.copiedIndex === index ? 'copied' : \"\"}`} onClick={() => this.copyIconText(icon)}>\n            <ifx-icon icon={icon}></ifx-icon>\n          </div>)}\n        </div>\n      </div>\n    )\n  }\n}"],"mappings":"sFAAA,MAAMA,EAAkB,qzCACxB,MAAAC,EAAeD,E,MCQFE,EAAY,M,yCACS,G,cACH,M,wCAEF,2C,cACC,a,CAG5B,gBAAAC,GACEC,KAAKC,SAAW,KAChBC,YAAW,KACTF,KAAKC,SAAW,KAAK,GACpB,I,CAGL,YAAAE,CAAaC,GACXJ,KAAKK,QAAU,mBAAmBD,iBAClCJ,KAAKM,SAAW,IAAIF,I,CAGtB,cAAAG,GACE,MAAMC,EAAY,kBAAkBR,KAAKM,uBACzCG,UAAUC,UAAUC,UAAUH,GAC9BR,KAAKD,kB,CAGP,iBAAAa,GACE,IAAI,IAAIR,KAAQS,EAAO,CACrBb,KAAKc,WAAWC,KAAKX,E,EAIzB,MAAAY,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,aACTF,EAAA,OAAAC,IAAA,2CAAKC,MAAM,kBACPF,EAAA,oBAAAC,IAAA,2CACEd,KAAK,aACLgB,QAAQ,UAAS,YACP,qBAAoB,YACpB,mIAAkI,cAChI,UAAQ,gEAI1BH,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gBACTF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,YAAU,KACtBF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,kBAAgB,YAC5BF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,kBAAgB,SAAa,IAACF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,mBAAmBnB,KAAKM,UAC9EW,EAAA,QAAAC,IAAA,2CAAMC,MAAM,YAAU,KACtBF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,YAAU,MACtBF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,kBAAgB,YAC5BF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,YAAU,KACtBF,EAAA,UAAAC,IAAA,2CAAQG,QAAS,IAAMrB,KAAKO,kBAAmBP,KAAKC,SAAW,SAAW,SAE5EgB,EAAA,OAAAC,IAAA,2CAAKC,MAAM,sBACRnB,KAAKc,WAAWQ,KAAI,CAAClB,EAAMmB,IAC5BN,EAAA,OAAKE,MAAO,2BAA2BnB,KAAKC,UAAYD,KAAKwB,cAAgBD,EAAQ,SAAW,KAAMF,QAAS,IAAMrB,KAAKG,aAAaC,IACrIa,EAAA,YAAUb,KAAMA,Q","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-16417752.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i}from"./p-6b122987.js";import{c as r}from"./p-5cdc6210.js";const t=":host{display:inline-block}.spinner{position:relative;width:40px;height:40px}.spinner.s{width:24px;height:24px}.border{box-sizing:border-box;position:absolute;width:100%;height:100%;border:4px solid transparent;border-top-color:#0A8276;border-left-color:#0A8276;border-right-color:#0A8276;border-top-left-radius:1px;border-top-right-radius:1px;border-radius:50%;animation:spin 2s linear infinite}.border.inverted{border-top-color:#FFFFFF;border-left-color:#FFFFFF;border-right-color:#FFFFFF}.semiconductor{width:100%;height:100%;animation:spin 2s linear infinite}.semiconductor svg{fill:#0A8276}.semiconductor.inverted svg{fill:#FFFFFF}.semiconductor.s svg{width:24px;height:24px}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";const s=t;const o=class{constructor(i){e(this,i);this.size=undefined;this.variant=undefined;this.inverted=false}render(){return i("div",{key:"d81d2a7692cb71c15f4aa895abcdf0d4441d2b3a","aria-label":"spinner indicating a loading process",class:this.getClassNames()},i("div",{key:"7813885c276e55354c47f2ff735a16f498b1e39f",class:`${this.variant!=="brand"?"border":""} ${this.inverted?"inverted":""}`}),this.variant==="brand"&&i("div",{key:"c4163967c2a5f58795ac974716cc4e831ec6264b",class:`semiconductor ${this.inverted?"inverted":""} ${this.getSizeClass()}`},i("svg",{key:"0feafe9cdf7cfa8138a1d104824c8e5dff1b3caf",width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},i("g",{key:"ca3cdd02b91de714c12e1d2d6ad800fee938ac03",id:"spinner/conductor"},i("path",{key:"aedaa84532c0c51f8e0a7a8683fb7c24379b73a8",id:"Vector",d:"M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z"})))))}getSizeClass(){return`${this.size}`==="s"?"s":""}getClassNames(){return r("spinner",this.size&&`spinner ${this.getSizeClass()}`)}};o.style=s;export{o as ifx_spinner};
+//# sourceMappingURL=p-16417752.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["spinnerCss","IfxSpinnerStyle0","Spinner","render","h","key","class","this","getClassNames","variant","inverted","getSizeClass","width","height","viewBox","fill","xmlns","id","d","size","classNames"],"sources":["src/components/spinner/spinner.scss?tag=ifx-spinner&encapsulation=shadow","src/components/spinner/spinner.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: inline-block;\n\n}\n\n.spinner {\n  position: relative;\n  width: tokens.$ifxSize500;\n  height: tokens.$ifxSize500;\n\n}\n\n.spinner.s {\n  width: tokens.$ifxSize300;\n  height: tokens.$ifxSize300;\n}\n\n.border {\n  box-sizing: border-box;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  border: 4px solid transparent;\n  border-top-color: tokens.$ifxColorOcean500;\n  border-left-color: tokens.$ifxColorOcean500;\n  border-right-color: tokens.$ifxColorOcean500;\n  border-top-left-radius: 1px;\n  border-top-right-radius: 1px;\n  border-radius: 50%;\n  animation: spin 2s linear infinite;\n\n  &.inverted {\n    border-top-color: tokens.$ifxColorBaseWhite;\n    border-left-color: tokens.$ifxColorBaseWhite;\n    border-right-color: tokens.$ifxColorBaseWhite;\n  }\n}\n\n.semiconductor {\n  width: 100%;\n  height: 100%;\n  animation: spin 2s linear infinite;\n\n  & svg {\n    fill: tokens.$ifxColorOcean500;\n  }\n\n  &.inverted {\n    & svg {\n      fill: tokens.$ifxColorBaseWhite;\n    }\n  }\n\n  &.s {\n    & svg {\n      width: tokens.$ifxSize300;\n      height: tokens.$ifxSize300;\n    }\n  }\n}\n\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n}","import { Component, h, Prop } from '@stencil/core';\nimport classNames from 'classnames';\n \n\n@Component({\n  tag: 'ifx-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Prop() size: string;\n  @Prop() variant: string;\n  @Prop() inverted: boolean = false;\n\n\n  render() {\n    return (\n      <div aria-label=\"spinner indicating a loading process\" class={this.getClassNames()}>\n        <div class={`${this.variant !== 'brand' ? 'border' : \"\"} ${this.inverted ? 'inverted' : \"\"}`}></div>\n        {this.variant === 'brand'\n          && <div class={`semiconductor ${this.inverted ? 'inverted' : \"\"} ${this.getSizeClass()}`}>\n            <svg width='40' height='40' viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <g id=\"spinner/conductor\">\n                <path id=\"Vector\" d=\"M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z\" />\n              </g>\n            </svg>\n          </div>}\n      </div>\n    );\n  }\n\n  getSizeClass() {\n    return `${this.size}` === \"s\"\n      ? \"s\"\n      : \"\";\n  }\n\n  getClassNames() {\n    return classNames(\n      'spinner',\n      this.size && `spinner ${this.getSizeClass()}`\n    );\n  }\n}\n"],"mappings":"+EAAA,MAAMA,EAAa,ovBACnB,MAAAC,EAAeD,E,MCQFE,EAAO,M,kFAGU,K,CAG5B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,wDAAgB,uCAAuCC,MAAOC,KAAKC,iBACjEJ,EAAA,OAAAC,IAAA,2CAAKC,MAAO,GAAGC,KAAKE,UAAY,QAAU,SAAW,MAAMF,KAAKG,SAAW,WAAa,OACvFH,KAAKE,UAAY,SACbL,EAAA,OAAAC,IAAA,2CAAKC,MAAO,iBAAiBC,KAAKG,SAAW,WAAa,MAAMH,KAAKI,kBACtEP,EAAA,OAAAC,IAAA,2CAAKO,MAAM,KAAKC,OAAO,KAAKC,QAAQ,YAAYC,KAAK,OAAOC,MAAM,8BAChEZ,EAAA,KAAAC,IAAA,2CAAGY,GAAG,qBACJb,EAAA,QAAAC,IAAA,2CAAMY,GAAG,SAASC,EAAE,4vC,CAQlC,YAAAP,GACE,MAAO,GAAGJ,KAAKY,SAAW,IACtB,IACA,E,CAGN,aAAAX,GACE,OAAOY,EACL,UACAb,KAAKY,MAAQ,WAAWZ,KAAKI,iB","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-189c89c3.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as s}from"./p-6b122987.js";const i="";const l=i;const h=class{constructor(s){e(this,s);this.ifxFilterSelect=t(this,"ifxFilterSelect",7);this.filterName=undefined;this.filterLabel=undefined;this.placeholder=undefined;this.type="text";this.options=undefined;this.filterValues=[]}handleTextInputChange(e){const t=e.target;const s=t.value;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:[s],type:this.type})}handleSingleSelectChange(e){const t=e.detail.value;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:[t],type:this.type})}handleMultiselectOptionChange(e){this.filterValues=e.detail;this.ifxFilterSelect.emit({filterName:this.filterName,filterValues:this.filterValues,type:this.type})}render(){switch(this.type){case"text":return s("ifx-text-field",{error:false,disabled:false,placeholder:this.placeholder,onIfxInput:e=>this.handleTextInputChange(e)},this.filterLabel);case"single-select":return s("ifx-select",{placeholder:"true","search-enabled":"true","search-placeholder-value":"Search...",onIfxSelect:e=>this.handleSingleSelectChange(e),"ifx-placeholder-value":this.placeholder,"ifx-label":this.filterLabel,"ifx-options":this.options});case"multi-select":return s("ifx-multiselect",{label:this.filterLabel,placeholder:this.placeholder,options:this.options,onIfxSelect:e=>this.handleMultiselectOptionChange(e)});default:return null}}};h.style=l;export{h as ifx_set_filter};
+//# sourceMappingURL=p-189c89c3.entry.js.map

package/dist/infineon-design-system-stencil/p-189c89c3.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["setFilterCss","IfxSetFilterStyle0","SetFilter","handleTextInputChange","event","target","value","this","ifxFilterSelect","emit","filterName","filterValues","type","handleSingleSelectChange","detail","handleMultiselectOptionChange","render","h","error","disabled","placeholder","onIfxInput","filterLabel","onIfxSelect","options","label"],"sources":["src/components/table-advanced-version/set-filter/set-filter.scss?tag=ifx-set-filter&encapsulation=shadow","src/components/table-advanced-version/set-filter/setFilter.tsx"],"sourcesContent":["/* set-filter.css */\n\n","// SetFilter.tsx\nimport { Component, h, Event, EventEmitter, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-set-filter',\n  styleUrl: 'set-filter.scss',\n  shadow: true\n})\nexport class SetFilter {\n  @Prop() filterName: string;\n  @Prop() filterLabel: string;\n  @Prop() placeholder: string;\n  @Prop() type: 'text' | 'single-select' | 'multi-select' = 'text';\n  @Prop() options: any[] | string;\n  @State() filterValues: string[] = [];\n\n  @Event() ifxFilterSelect: EventEmitter;\n\n\n  handleTextInputChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n    const value = target.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n\n  }\n\n  handleSingleSelectChange(event: CustomEvent) {\n    const value = event.detail.value;\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: [value], type: this.type }); // Emit an array for consistency with the multi select component\n  }\n\n\n  handleMultiselectOptionChange(event: CustomEvent) {\n    this.filterValues = event.detail; // Assuming that ifx-multiselect emits an array of selected options\n    this.ifxFilterSelect.emit({ filterName: this.filterName, filterValues: this.filterValues, type: this.type });\n  }\n\n\n  render() {\n    switch (this.type) {\n      case 'text':\n        return (\n          <ifx-text-field error={false} disabled={false} placeholder={this.placeholder}\n            onIfxInput={event => this.handleTextInputChange(event)}\n          >{this.filterLabel}</ifx-text-field>\n        );\n      case 'single-select':\n        return (\n          <ifx-select\n            placeholder=\"true\"\n            search-enabled=\"true\"\n            search-placeholder-value=\"Search...\"\n            onIfxSelect={event => this.handleSingleSelectChange(event)}\n            ifx-placeholder-value={this.placeholder}\n            ifx-label={this.filterLabel}\n            ifx-options={this.options}\n          ></ifx-select>\n        );\n      case 'multi-select':\n        return (\n          <ifx-multiselect\n            label={this.filterLabel}\n            placeholder={this.placeholder}\n            options={this.options}\n            onIfxSelect={event => this.handleMultiselectOptionChange(event)}\n          />\n        );\n      default:\n        return null;\n    }\n  }\n}\n\n"],"mappings":"kDAAA,MAAMA,EAAe,GACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,oKAIsC,O,yCAExB,E,CAKlC,qBAAAC,CAAsBC,GACpB,MAAMC,EAASD,EAAMC,OACrB,MAAMC,EAAQD,EAAOC,MACrBC,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAc,CAACL,GAAQM,KAAML,KAAKK,M,CAI7F,wBAAAC,CAAyBT,GACvB,MAAME,EAAQF,EAAMU,OAAOR,MAC3BC,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAc,CAACL,GAAQM,KAAML,KAAKK,M,CAI7F,6BAAAG,CAA8BX,GAC5BG,KAAKI,aAAeP,EAAMU,OAC1BP,KAAKC,gBAAgBC,KAAK,CAAEC,WAAYH,KAAKG,WAAYC,aAAcJ,KAAKI,aAAcC,KAAML,KAAKK,M,CAIvG,MAAAI,GACE,OAAQT,KAAKK,MACX,IAAK,OACH,OACEK,EAAA,kBAAgBC,MAAO,MAAOC,SAAU,MAAOC,YAAab,KAAKa,YAC/DC,WAAYjB,GAASG,KAAKJ,sBAAsBC,IAChDG,KAAKe,aAEX,IAAK,gBACH,OACEL,EAAA,cACEG,YAAY,OAAM,iBACH,OAAM,2BACI,YACzBG,YAAanB,GAASG,KAAKM,yBAAyBT,GAAM,wBACnCG,KAAKa,YAAW,YAC5Bb,KAAKe,YAAW,cACdf,KAAKiB,UAGxB,IAAK,eACH,OACEP,EAAA,mBACEQ,MAAOlB,KAAKe,YACZF,YAAab,KAAKa,YAClBI,QAASjB,KAAKiB,QACdD,YAAanB,GAASG,KAAKQ,8BAA8BX,KAG/D,QACE,OAAO,K","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-19c620c0.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,g as n}from"./p-6b122987.js";const a='.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family:var(--ifx-font-family);text-decoration:none;font-weight:400;font-size:16px;color:#1D1D1D}.navbar__item.hide{display:none}.navbar__item.isParent{gap:8px}.navbar__item .navItemIconWrapper{transition:0.3s}.navbar__item.open .navItemIconWrapper{transform:rotate(-180deg);transition:0.3s}.navbar__item:hover{color:#0A8276;cursor:pointer}.navbar__item:hover .username__tooltip{display:block}.navbar__item:hover .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{cursor:pointer;background-color:#08665C}.navbar__item.remove{display:none}.navbar__item.removeLabel .label__wrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:"Source Sans 3";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:"Source Sans 3";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family:var(--ifx-font-family)}.navbar-menu.open:not(.itemInMobileMenu){display:flex}.navbar-menu.itemInMobileMenu{display:none}.navbar-menu.right{left:100%;top:-40%}.navbar-menu.left{top:-40%;right:100%}.navbar-menu.rightSideItemMenu{left:initial;right:0px}.navbar__item.layer__item-parent{color:#1D1D1D;font-size:24px;font-style:normal;font-weight:600;line-height:32px;letter-spacing:-0.24px;cursor:initial}.navbar__item.layer__item-parent .navbar__container-right-content-navigation-item-icon-wrapper ifx-icon svg{width:24px;height:24px}.navbar__item.sidebarMenuItem{justify-content:space-between;padding:0}.navbar__item.menuItem{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.navbar__item.menuItem.hide{display:none}.navbar__item.menuItem .label__wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.navbar__item.menuItem:hover{cursor:pointer;background-color:#EEEDED}.navbar__item.menuItem:active{background-color:#BFBBBB}.sub__layer-menu{padding:5px;display:none}.sub__layer-menu.remove__margin{margin:0;padding:0}.sub__layer-menu.open{display:block}.navbar__item.hide{display:none}.menuItemRightIconWrapper.hide{display:none}.navItemIconWrapper.hide{display:none}';const s=a;const o=class{constructor(i){e(this,i);this.ifxNavItem=t(this,"ifxNavItem",7);this.showLabel=true;this.icon="";this.href="";this.target="_self";this.hideOnMobile=true;this.internalHref="";this.isMenuItem=false;this.hasChildNavItems=false;this.isSidebarMenuItem=false;this.itemPosition=undefined}handleOutsideClick(e){const t=e.composedPath();const i=this.getItemMenu();if(i){if(i.classList.contains("open")){if(!t.includes(this.el)){this.closeItemMenu()}}}}async hideComponent(){this.el.style.display="none"}async showComponent(){this.el.style.display=""}async toggleChildren(e){const t=this.getItemMenu();const i=this.getChevronDownIconWrapper();if(t){this.handleClassList(i,e,"hide");this.handleClassList(t,e,"itemInMobileMenu")}}async moveChildComponentsIntoSubLayerMenu(){const e=this.getItemMenu();if(e){const t=this.handleClassList(e,"contains","open");if(t){const e=this.getNavBarItem();const t=this.getSubLayerBackButton();this.handleClassList(e,"add","layer__item-parent");this.handleClassList(t,"add","show");this.ifxNavItem.emit({component:this.el,action:"hideFirstLayer"})}}const t=this.el.querySelectorAll('[slot="first__layer"]');this.isSidebarMenuItem=true;for(let e=0;e<t.length;e++){t[e].setAttribute("slot","second__layer");t[e].moveChildComponentsIntoSubLayerMenu()}}getSubLayerBackButton(){const e=this.el.shadowRoot.querySelector(".sub__layer-back-button");return e}async toggleFirstLayerItem(e,t){const i=this.getNavBarItem();const n=this.getSubLayerMenu();const a=this.getSubLayerBackButton();this.handleClassList(a,[e],"show");this.handleClassList(i,[t],"hide");this.handleClassList(n,[t],"remove__margin")}openSubLayerMenu(){if(this.hasChildNavItems){const e=this.getSubLayerBackButton();const t=this.getRightArrowIcon();const i=this.getNavBarItem();const n=this.getSubLayerMenu();const a=this.el.getAttribute("slot");this.handleClassList(e,"add","show");this.handleClassList(t,"add","hide");this.handleClassList(i,"add","layer__item-parent");this.handleClassList(n,"add","open");if(a.toLowerCase()==="second__layer"){this.ifxNavItem.emit({component:this.el,parent:this.el.parentElement,action:"hideSecondLayer"});this.handleClassList(i,"remove","menuItem")}else{this.ifxNavItem.emit({component:this.el,action:"hideFirstLayer"})}}}async addMenuItemClass(){const e=this.getNavBarItem();this.handleClassList(e,"add","menuItem");const t=this.getRightArrowIcon();if(this.hasChildNavItems){this.handleClassList(t,"remove","hide")}}async moveChildComponentsBackIntoNavbar(){const e=this.getSubLayerBackButton();const t=this.getNavBarItem();const i=this.getSubLayerMenu();this.handleClassList(e,"remove","show");this.handleClassList(t,"remove","layer__item-parent");this.handleClassList(i,"remove","remove__margin");this.ifxNavItem.emit({component:this.el,action:"show"});const n=this.el.querySelectorAll('[slot="second__layer"]');this.isSidebarMenuItem=false;this.showComponent();this.handleClassList(t,"remove","hide");for(let e=0;e<n.length;e++){n[e].setAttribute("slot","first__layer");n[e].moveChildComponentsBackIntoNavbar();n[e].addMenuItemClass();n[e].returnToFirstLayer()}}getRightArrowIcon(){const e=this.el.shadowRoot.querySelector(".menuItemRightIconWrapper");return e}getChevronDownIconWrapper(){const e=this.el.shadowRoot.querySelector(".navItemIconWrapper");return e}async returnToFirstLayer(){const e=this.getSubLayerBackButton();const t=this.getNavBarItem();const i=this.getRightArrowIcon();const n=this.getSubLayerMenu();const a=this.el.getAttribute("slot");this.handleClassList(e,"remove","show");this.handleClassList(t,"remove","layer__item-parent");this.handleClassList(n,"remove","open");if(this.hasChildNavItems){this.handleClassList(i,"remove","hide")}if(a.toLowerCase()==="second__layer"){this.ifxNavItem.emit({component:this.el,parent:this.el.parentElement,action:"returnToSecondLayer"});this.handleClassList(t,"add","menuItem")}else{this.ifxNavItem.emit({component:this.el,action:"return"})}}componentWillLoad(){this.setHref();this.checkIfItemIsNested();this.checkIfItemHasChildren()}componentDidLoad(){if(this.hasChildNavItems){const e=this.getNavbarItems();this.relocateItemsToFirstlayer(e)}}componentDidUpdate(){const e=this.getNavBarItem();const t=this.handleClassList(e,"contains","layer__item-parent");if(this.isSidebarMenuItem&&t){const e=this.getRightArrowIcon();this.handleClassList(e,"add","hide")}}async setMenuItemPosition(){if(this.isMenuItem&&this.hasChildNavItems){const e=this.getItemMenuPosition();if(e==="left"){this.itemPosition="left"}else if(e==="right"){this.itemPosition="right"}}}handleClassList(e,t,i){e.classList[t](i);if(t==="contains"){return e.classList.contains(i)}}getNavbarItems(){const e=this.el.querySelectorAll("ifx-navbar-item");return e}getNavBarItem(){const e=this.el.shadowRoot.querySelector(".navbar__item");return e}getSubLayerMenu(){const e=this.el.shadowRoot.querySelector(".sub__layer-menu");return e}relocateItemsToFirstlayer(e){e.forEach((e=>{e.setAttribute("slot","first__layer")}))}setHref(){if(this.href.toLowerCase().trim()===""){this.internalHref=undefined}else this.internalHref=this.href}checkIfItemIsNested(){const e=this.el.parentElement;if(e.tagName.toUpperCase()==="IFX-NAVBAR-ITEM"||e.tagName.toUpperCase()==="IFX-NAVBAR-PROFILE"){this.isMenuItem=true;return}else{this.isMenuItem=false}}checkIfItemHasChildren(){const e=this.getNavbarItems();if(e.length!==0){this.hasChildNavItems=true}else{this.hasChildNavItems=false}}async setItemSideSpecifications(){const e=this.el;const t=this.getItemMenu();const i=e.getAttribute("slot");if(i.toLowerCase().trim()==="right-item"){this.handleClassList(t,"add","rightSideItemMenu")}return true}getItemMenu(){const e=this.el.shadowRoot.querySelector(".navbar-menu");return e}closeItemMenu(){const e=this.getItemMenu();const t=this.getNavBarItem();if(e){this.handleClassList(e,"remove","open");this.handleClassList(t,"remove","open")}}getItemMenuPosition(){let e=this.el;while(e){if(e.tagName==="IFX-NAVBAR-PROFILE"||e.slot==="right-item"){return"left"}e=e.parentElement||e.getRootNode().host}return"right"}toggleItemMenu(){const e=this.el.getAttribute("slot");if(e.toLowerCase()==="mobile-menu-top"||e.toLowerCase()==="second__layer"){this.openSubLayerMenu()}if(!this.internalHref&&e.toLowerCase()!=="mobile-menu-top"&&e.toLowerCase()!=="second__layer"){const e=this.getItemMenu();if(this.hasChildNavItems){const t=this.getNavBarItem();this.handleClassList(e,"toggle","open");this.handleClassList(t,"toggle","open")}}}handleNestedLayerMenu(e){if(this.isMenuItem&&this.hasChildNavItems&&!this.isSidebarMenuItem){const t=this.getItemMenu();const i=this.getItemMenuPosition();if(e.type.toUpperCase()==="MOUSEENTER"){this.handleClassList(t,"add","open");if(i==="left"){this.handleClassList(t,"add","left")}else if(i==="right"){this.handleClassList(t,"add","right")}}if(e.type.toUpperCase()==="MOUSELEAVE"){this.handleClassList(t,"remove","open");if(i==="left"){this.handleClassList(t,"remove","left")}else if(i==="right"){this.handleClassList(t,"remove","right")}}}}render(){return i("div",{key:"345b3bf2c097e4ecfd291d627d9954da2659954d",class:"container",onMouseLeave:e=>this.handleNestedLayerMenu(e),onMouseEnter:e=>this.handleNestedLayerMenu(e)},i("div",{key:"8f3c877a21bdf8886474a218b571a696919700b9",class:"sub__layer-back-button"},i("div",{key:"b1755b11029e64c6347a3d9f45149d91ad75d7c1",class:"back__button-wrapper",onClick:()=>this.returnToFirstLayer()},i("ifx-icon",{key:"ac38b24910aff05b42f22046749cb3c89a923a0c",icon:"arrow-left-16"}),i("span",{key:"cf2aef43bcb1c9c5ad960f6f372f29493dcd120b"},"Back"))),i("a",{key:"e4a60082818e27684922e53b55d4447cbaf56d29",href:this.internalHref,target:this.target,onClick:()=>this.toggleItemMenu(),class:`navbar__item ${this.isSidebarMenuItem?"sidebarMenuItem":""} ${!this.showLabel?"removeLabel":""} ${this.isMenuItem?"menuItem":""} ${this.hasChildNavItems?"isParent":""}`},i("div",{key:"647442a215356d2c6346fd5f5a6bdd1a6b2c5222",class:"inner__content-wrapper"},i("div",{key:"125cdc9e44388741d19968040a78c946755e8439",class:`navbar__container-right-content-navigation-item-icon-wrapper ${!this.icon?"removeWrapper":""}`},this.icon&&i("ifx-icon",{key:"da2886bd50a80458ad13d58218f0a57f41d6e145",icon:this.icon})),this.itemPosition==="left"&&this.hasChildNavItems&&this.isMenuItem&&i("div",{key:"c9fba9df68ac8b3b427a5bda5db301d8a40a10d9",class:"menuItemLeftIconWrapper"},i("ifx-icon",{key:"7533be0d414f0d29c71b8b70886b34f6a71e52fa",icon:"chevron-left-12"})),i("span",{key:"a86116911c57b4cd9b7b76d209c8b1af656f2df9",class:"label__wrapper"},i("slot",{key:"0addaa970903253d2d71352d23812e9eed3f81cb"}))),i("div",{key:"401766106d446ecffe2bfe5ed414174f0c786ad3",class:`navItemIconWrapper ${this.hasChildNavItems&&!this.isMenuItem&&!this.isSidebarMenuItem?"":"hide"}`},i("ifx-icon",{key:"ad9a58f581bba3a5e3f99c4dd483f6f0f203005a",icon:"chevron-down-12"})),i("div",{key:"8152c4d4c9af75b7e24596ac50471400a3d79942",class:`menuItemRightIconWrapper ${this.itemPosition==="right"&&this.hasChildNavItems&&this.isMenuItem||this.isSidebarMenuItem&&this.hasChildNavItems?"":"hide"}`},i("ifx-icon",{key:"ad5c9a2b8c9f5a1ca6e1345c55b8530777ce10b3",icon:"chevron-right-12"}))),this.hasChildNavItems&&!this.isSidebarMenuItem&&i("ul",{key:"b31f301f3fd7c42458bb64ac7948ef01e562c4da",class:"navbar-menu"}," ",i("slot",{key:"46a76320b562f0343f639a461e66752af644c0e1",name:"first__layer"})," "),this.isSidebarMenuItem&&i("ul",{key:"4eed39a77aa530f375fb5e7e6bd752061caae700",class:"sub__layer-menu"}," ",i("slot",{key:"69ea311fe4009018edef46b772beb7462ad5ff88",name:"second__layer"})," "))}get el(){return n(this)}};o.style=s;export{o as ifx_navbar_item};
+//# sourceMappingURL=p-19c620c0.entry.js.map

package/dist/infineon-design-system-stencil/p-19c620c0.entry.js.map

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

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

@@ -0,0 +1,2 @@
+import{r as e,h as a,a as r,g as d}from"./p-6b122987.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.card{position:relative;display:inline-flex;flex-direction:column;word-wrap:break-word;background-color:#FFFFFF;background-clip:border-box;border:1px solid #EEEDED;border-radius:1px;width:350px;height:auto;font-family:var(--ifx-font-family)}.card:has(.card-href:focus),.card:has(.card-href:hover){outline:none;border-color:#0A8276}.card:has(.card-href:focus) ::slotted(ifx-card-headline),.card:has(.card-href:hover) ::slotted(ifx-card-headline){color:#0A8276}.card.noBtns .vertical .lower__body-wrapper{padding-bottom:24px}.card.noBtns .horizontal .lower__body-wrapper{padding-bottom:24px}.card .horizontal{display:flex;flex-direction:row;min-height:218px}.card .horizontal .card-img{flex:1;text-decoration:none}.card .horizontal .card-img.noImage{display:none}.card .horizontal .card-img ::slotted([slot=img]){width:100%;vertical-align:bottom}.card .horizontal .lower__body-wrapper{flex:1;display:grid;grid-template-rows:1fr auto}.card .horizontal .lower__body-wrapper .upper-body{display:flex;flex-direction:column;text-decoration:none;color:#1D1D1D;padding:24px 24px 0px 24px}.card .vertical .upper__body-wrapper{text-decoration:none;color:#1D1D1D}.card .vertical .upper__body-wrapper .card-img{height:190px}.card .vertical .upper__body-wrapper .card-img.noImage{display:none}.card .vertical .upper__body-wrapper .upper-body{padding:24px 24px 0px 24px}.card .vertical .lower__body-wrapper:hover{border-color:#EEEDED}.card.horizontal{flex-direction:row;width:538px}.card.horizontal .card-img{flex:1;order:2}.card.horizontal .card-img ::slotted([slot=img]){width:100%;height:100%;vertical-align:bottom;object-fit:cover}.card.horizontal.left .horizontal .card-img{order:1}.card.horizontal.left .horizontal .lower__body-wrapper{order:2}.card .card-href:focus{outline:none}';const i=o;const t=class{constructor(a){e(this,a);this.noBtns=undefined;this.direction="vertical";this.alignment=undefined;this.noImg=undefined;this.href="";this.internalHref="";this.target="_self";this.AriaLabel=undefined}setImgPosition(e){this.alignment=e.detail}handleComponentAdjustment(){const e=this.el.querySelector("ifx-card-image");const a=this.el.querySelector("ifx-card-links");if(!e){this.noImg=true}else this.noImg=false;if(!a){this.noBtns=true}else this.noBtns=false;if(this.href.trim()===""){this.internalHref=undefined}else this.internalHref=this.href}handleClassList(e,a,r){e.classList[a](r)}componentWillLoad(){this.handleComponentAdjustment()}componentWillUpdate(){this.handleComponentAdjustment()}render(){return a(r,{key:"01e7592f9bf887e80837db93ab637fa77fb1ce1f"},a("div",{key:"8b784dff18da8f47e57a293554dc18af013293f4","aria-label":this.AriaLabel,class:`card \n          ${this.noBtns?"noBtns":""}\n          ${this.direction} \n          ${this.alignment}`,role:"region"},this.direction==="horizontal"&&a("div",{key:"69e234c4c3302dd8bf6b5133016e3c0642cf0034",class:"horizontal"},a("a",{key:"c4e4288637327e7e0f68b68a3ee750e3567c327d",class:`card-img ${this.noImg?"noImage":""} ${this.internalHref?"card-href":""}`,href:this.internalHref},a("slot",{key:"d119095e1e71d459b160744276a2987b9596d076",name:"img"})),a("div",{key:"53b3816544b90daec193ced7b084aa2dfa12f7c6",class:"lower__body-wrapper"},a("a",{key:"61477913ea24a2bdc3765771bf60af809a5643f5",class:`upper-body ${this.internalHref?"card-href":""}`,href:this.internalHref},a("slot",{key:"aa49da1c6b7cefefb5d9f36f72f3166e09c2e494"})),a("div",{key:"da9e12e7e215397ed699f3158676235d3ec1e05c"},a("slot",{key:"dd43320f7bc1d0dce6f3c6a3bbf4de31c60d9f77",name:"buttons"})))),this.direction==="vertical"&&a("div",{key:"81a7e3a57402983a7544cb80c37609ca1189b8cd",class:"vertical"},a("a",{key:"3835c2cbb6de0e6b518f72d7752033e71e62e5f6",class:`upper__body-wrapper ${this.internalHref?"card-href":""}`,href:this.internalHref,target:this.target},a("div",{key:"57f555a369c10897d75058780993a45d0dc4b1da",class:`card-img ${this.noImg?"noImage":""}`},a("slot",{key:"fc23cd2f3575e0c8bf9dc4e50581527175d3dfa5",name:"img"})),a("div",{key:"abc7faafe9cb34acba6cd6db1daca948438511e9",class:"upper-body"},a("slot",{key:"9f8ed0bfa8ac124368b0fc0af24037ab9549d26b"}))),a("div",{key:"f13ded514016af3d5975224049db6c84c32e7c03",class:"lower__body-wrapper"},a("slot",{key:"3a6875e3f2daa209ad56bc5417facd8835af3ea0",name:"buttons"})))))}get el(){return d(this)}};t.style=i;export{t as ifx_card};
+//# sourceMappingURL=p-1aed7d45.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","IfxCardStyle0","Card","setImgPosition","event","this","alignment","detail","handleComponentAdjustment","image","el","querySelector","links","noImg","noBtns","href","trim","internalHref","undefined","handleClassList","type","className","classList","componentWillLoad","componentWillUpdate","render","h","Host","key","AriaLabel","class","direction","role","name","target"],"sources":["src/components/card/card.scss?tag=ifx-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.card {\n  position: relative;\n  display: inline-flex;\n  flex-direction: column;\n  word-wrap: break-word;\n  background-color: tokens.$ifxColorBaseWhite;\n  background-clip: border-box;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  border-radius: 1px;\n  //width: 22rem;\n  width: 350px;\n  height: auto;\n  font-family: var(--ifx-font-family);\n\n  // when the link is focused or hovered, the border color changes\n  &:has(.card-href:focus), &:has(.card-href:hover) {\n    outline: none;\n    border-color: tokens.$ifxColorOcean500;\n\n    ::slotted(ifx-card-headline) {\n      color: tokens.$ifxColorOcean500;\n    }\n  }\n\n  &.noBtns {\n    & .vertical {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n\n    & .horizontal {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n  }\n\n  & .horizontal {\n    display: flex;\n    flex-direction: row;\n    min-height: 218px;\n\n    & .card-img {\n      flex: 1;\n      text-decoration: none;\n\n      &.noImage {\n        display: none;\n      }\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        vertical-align: bottom;\n      }\n    }\n\n    & .lower__body-wrapper {\n      flex: 1;\n      display: grid;\n      grid-template-rows: 1fr auto;\n\n      & .upper-body {\n        display: flex;\n        flex-direction: column;\n        text-decoration: none;\n        color: tokens.$ifxColorBaseBlack;\n        padding: 24px 24px 0px 24px;\n      }\n    }\n  }\n\n  & .vertical {\n    & .upper__body-wrapper {\n      text-decoration: none;\n      color: tokens.$ifxColorBaseBlack;\n\n      & .card-img {\n        height: 190px;\n\n        &.noImage {\n          display: none;\n        }\n      }\n\n      & .upper-body {\n        padding: 24px 24px 0px 24px;\n      }\n    }\n\n    & .lower__body-wrapper {\n      &:hover {\n        border-color: tokens.$ifxColorEngineering200;\n      }\n    }\n  }\n\n  &.horizontal {\n    flex-direction: row;\n    width: 538px;\n\n    & .card-img {\n      flex: 1;\n      order: 2;\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        height: 100%;\n        vertical-align: bottom;\n        object-fit: cover;\n      }\n    }\n\n    &.left {\n      & .horizontal {\n        & .card-img {\n          order: 1;\n        }\n\n        & .lower__body-wrapper {\n          order: 2;\n        }\n      }\n    }\n  }\n\n  & .card-href:focus {\n    outline: none;\n  }\n}","import { Component, h, Host, Element, Prop, State, Listen } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\n\nexport class Card {\n  @Element() el;\n  @State() noBtns: boolean;\n  @Prop() direction: 'horizontal' | 'vertical' = 'vertical';\n  @State() alignment: string;\n  @State() noImg: boolean;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() AriaLabel: string;\n\n  @Listen('imgPosition')\n  setImgPosition(event) {\n    this.alignment = event.detail\n  }\n\n  handleComponentAdjustment() {\n    const image = this.el.querySelector('ifx-card-image')\n    const links = this.el.querySelector('ifx-card-links')\n\n    if (!image) {\n      this.noImg = true;\n    } else this.noImg = false;\n\n    if (!links) {\n      this.noBtns = true;\n    } else this.noBtns = false;\n\n    if (this.href.trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n  }\n\n\n  componentWillLoad() {\n    this.handleComponentAdjustment()\n  }\n\n  componentWillUpdate() {\n    this.handleComponentAdjustment()\n  }\n\nrender() {\n    return (\n      <Host>\n        <div aria-label={this.AriaLabel} class={\n          `card \n          ${this.noBtns ? 'noBtns' : \"\"}\n          ${this.direction} \n          ${this.alignment}`\n        }\n        role=\"region\">\n\n          {this.direction === 'horizontal' &&\n            <div class=\"horizontal\">\n              <a class={`card-img ${this.noImg ? 'noImage' : \"\"} ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref}>\n                <slot name=\"img\" />\n              </a>\n\n              <div class='lower__body-wrapper'>\n                <a class={`upper-body ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref}>\n                  <slot />\n                </a>\n                <div>\n                  <slot name='buttons' />\n                </div>\n              </div>\n            </div>}\n\n          {this.direction === 'vertical' &&\n            <div class=\"vertical\">\n              <a class={`upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref} target={this.target}>\n                <div class={`card-img ${this.noImg ? 'noImage' : \"\"}`}>\n                  <slot name=\"img\" />\n                </div>\n\n                <div class='upper-body'>\n                  <slot />\n                </div>\n              </a>\n\n              <div class='lower__body-wrapper'>\n                <slot name='buttons' />\n              </div>\n            </div>}\n        </div>\n      </Host>\n    );\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAU,+1DAChB,MAAAC,EAAeD,E,MCQFE,EAAI,M,8DAGgC,W,wDAGxB,G,kBACS,G,YACP,Q,yBAIzB,cAAAC,CAAeC,GACbC,KAAKC,UAAYF,EAAMG,M,CAGzB,yBAAAC,GACE,MAAMC,EAAQJ,KAAKK,GAAGC,cAAc,kBACpC,MAAMC,EAAQP,KAAKK,GAAGC,cAAc,kBAEpC,IAAKF,EAAO,CACVJ,KAAKQ,MAAQ,I,MACRR,KAAKQ,MAAQ,MAEpB,IAAKD,EAAO,CACVP,KAAKS,OAAS,I,MACTT,KAAKS,OAAS,MAErB,GAAIT,KAAKU,KAAKC,SAAW,GAAI,CAC3BX,KAAKY,aAAeC,S,MACfb,KAAKY,aAAeZ,KAAKU,I,CAGlC,eAAAI,CAAgBT,EAAIU,EAAMC,GACxBX,EAAGY,UAAUF,GAAMC,E,CAIrB,iBAAAE,GACElB,KAAKG,2B,CAGP,mBAAAgB,GACEnB,KAAKG,2B,CAGT,MAAAiB,GACI,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,wDAAiBvB,KAAKwB,UAAWC,MAC/B,oBACEzB,KAAKS,OAAS,SAAW,iBACzBT,KAAK0B,yBACL1B,KAAKC,YAET0B,KAAK,UAEF3B,KAAK0B,YAAc,cAClBL,EAAA,OAAAE,IAAA,2CAAKE,MAAM,cACTJ,EAAA,KAAAE,IAAA,2CAAGE,MAAO,YAAYzB,KAAKQ,MAAQ,UAAY,MAAMR,KAAKY,aAAe,YAAc,KAAMF,KAAMV,KAAKY,cACtGS,EAAA,QAAAE,IAAA,2CAAMK,KAAK,SAGbP,EAAA,OAAAE,IAAA,2CAAKE,MAAM,uBACTJ,EAAA,KAAAE,IAAA,2CAAGE,MAAO,cAAczB,KAAKY,aAAe,YAAc,KAAMF,KAAMV,KAAKY,cACzES,EAAA,QAAAE,IAAA,8CAEFF,EAAA,OAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,2CAAMK,KAAK,eAKlB5B,KAAK0B,YAAc,YAClBL,EAAA,OAAAE,IAAA,2CAAKE,MAAM,YACTJ,EAAA,KAAAE,IAAA,2CAAGE,MAAO,uBAAuBzB,KAAKY,aAAe,YAAc,KAAMF,KAAMV,KAAKY,aAAciB,OAAQ7B,KAAK6B,QAC7GR,EAAA,OAAAE,IAAA,2CAAKE,MAAO,YAAYzB,KAAKQ,MAAQ,UAAY,MAC/Ca,EAAA,QAAAE,IAAA,2CAAMK,KAAK,SAGbP,EAAA,OAAAE,IAAA,2CAAKE,MAAM,cACTJ,EAAA,QAAAE,IAAA,+CAIJF,EAAA,OAAAE,IAAA,2CAAKE,MAAM,uBACTJ,EAAA,QAAAE,IAAA,2CAAMK,KAAK,e","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-222c1af9.entry.js

@@ -0,0 +1,2 @@
+import{r as o,h as i,g as t,c as e}from"./p-6b122987.js";const n=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}';const a=n;const s=class{constructor(i){o(this,i);this.autoCollapse=false}async onItemOpen(o){if(this.autoCollapse){const i=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const t of i){const i=t;if(i!==o.target&&await i.open){i.open=false}}}}render(){return i("div",{key:"a69a6bea9d5347c0e1808d4635d458ce16614000",class:"accordion-wrapper"},i("slot",{key:"389e9039f9272a88d95aca8b83efbb754736a5dd"}))}static get delegatesFocus(){return true}get el(){return t(this)}};s.style=a;const c=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.accordion-item{border-radius:3px;overflow:hidden;transition:all 0.3s;font-family:var(--ifx-font-family)}.accordion-title:focus{outline:none}.accordion-title:focus::after{content:"";display:block;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px;border-radius:5px;border:2px solid #0A8276;box-sizing:border-box}.accordion-title:hover{border:1px solid #EEEDED;color:#08665C}.accordion-title{display:flex;align-items:center;position:relative;padding:12px 16px;gap:12px;color:#0A8276;background-color:#FFFFFF;border:1px solid #EEEDED;cursor:pointer;margin:4px}.accordion-caption{font-weight:600;font-size:1.125rem}.accordion-content{gap:8px;max-height:0;overflow:hidden;transition:max-height 0.3s ease-in-out;line-height:24px;font-size:1rem;font-weight:400}.inner-content{background-color:#FFFFFF;padding:24px;word-wrap:break-word;overflow-wrap:anywhere;align-self:stretch;}.accordion-icon{font-weight:bold;display:inline-block;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}';const r=c;const d=class{constructor(i){o(this,i);this.ifxItemOpen=e(this,"ifxItemOpen",7);this.ifxItemClose=e(this,"ifxItemClose",7);this.caption=undefined;this.open=false;this.AriaLive=3;this.internalOpen=false}componentWillLoad(){this.internalOpen=this.open}componentDidLoad(){this.openAccordionItem()}componentDidUpdate(){this.openAccordionItem()}openChanged(o){this.internalOpen=o}toggleOpen(){this.internalOpen=!this.internalOpen;this.open=this.internalOpen;if(this.internalOpen){this.ifxItemOpen.emit({isOpen:this.internalOpen})}else{this.ifxItemClose.emit({isClosed:!this.internalOpen})}}openAccordionItem(){if(this.internalOpen){this.contentEl.style.maxHeight=`${this.contentEl.scrollHeight}px`}else{this.contentEl.style.maxHeight="0"}}handleSlotChange(o){const i=o.target;const t=i.assignedNodes();if(t.length>0){t.forEach((o=>{const i=new MutationObserver(((o,i)=>{for(let i of o){if(i.type==="childList"){if(this.internalOpen){this.openAccordionItem()}}}}));i.observe(o,{attributes:true,childList:true,subtree:true})}))}if(this.internalOpen){this.openAccordionItem()}}handleKeydown(o){switch(o.key){case"Enter":case" ":o.preventDefault();this.toggleOpen();break}}render(){return i("div",{key:"1215772109c33556d626f4a7d40d6655684806a2",class:`accordion-item ${this.internalOpen?"open":""}`},i("div",{key:"30e7771bae93c213d9f95126886d7552ebe03b94",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0"},i("span",{key:"7da5f484c41f9f01dd7eec5092ec8ad82947d481","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLive),class:"accordion-icon"},i("ifx-icon",{key:"e64e478a66fd0dd2c3d3608294a6160aa4232952",icon:"chevron-down-12"})),i("span",{key:"7e1ff777da8ce68d6d5f1266512fbd05731169f5",id:"accordion-caption",class:"accordion-caption"},this.caption)),i("div",{key:"144fa8393da592e1d928b51d7b4ad48d6b06a100",id:"accordion-content",class:"accordion-content",ref:o=>this.contentEl=o,role:"region","aria-labelledby":"accordion-caption"},i("div",{key:"28702f514d9bd400499a49a3b1cd675f56d7fcad",class:"inner-content"},i("slot",{key:"e40109a457e4b1cc09c8234d5003361bb6c1c6fb",onSlotchange:o=>this.handleSlotChange(o)}))))}static get watchers(){return{open:["openChanged"]}}};d.style=r;export{s as ifx_accordion,d as ifx_accordion_item};
+//# sourceMappingURL=p-222c1af9.entry.js.map

package/dist/infineon-design-system-stencil/p-222c1af9.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["accordionCss","IfxAccordionStyle0","Accordion","onItemOpen","event","this","autoCollapse","items","Array","from","el","querySelectorAll","item","itemElement","target","open","render","h","key","class","accordionItemCss","IfxAccordionItemStyle0","IfxAccordionItem","componentWillLoad","internalOpen","componentDidLoad","openAccordionItem","componentDidUpdate","openChanged","newValue","toggleOpen","ifxItemOpen","emit","isOpen","ifxItemClose","isClosed","contentEl","style","maxHeight","scrollHeight","handleSlotChange","e","slotElement","nodes","assignedNodes","length","forEach","node","observer","MutationObserver","mutationsList","_","mutation","type","observe","attributes","childList","subtree","handleKeydown","ev","preventDefault","role","onClick","tabindex","String","AriaLive","icon","id","caption","ref","onSlotchange"],"sources":["src/components/accordion/accordion.scss?tag=ifx-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx","src/components/accordion/accordionItem.scss?tag=ifx-accordion-item&encapsulation=shadow","src/components/accordion/accordionItem.tsx"],"sourcesContent":["// ifxAccordion.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: block;\n}\n\n.accordion-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: tokens.$ifxSpace100;\n  font-family: var(--ifx-font-family);\n\n}","//ifxAccordion.tsx\nimport { Component, h, Listen, Element, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-accordion',\n  styleUrl: 'accordion.scss',\n  shadow: { delegatesFocus: true },\n})\nexport class Accordion {\n  @Element() el: HTMLElement;\n  @Prop() autoCollapse: boolean = false;\n\n\n  @Listen('ifxItemOpen')\n  async onItemOpen(event: CustomEvent) {\n    if (this.autoCollapse) {\n      const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n      for (const item of items) {\n        const itemElement = item as HTMLIfxAccordionItemElement;\n        if (itemElement !== event.target && (await itemElement.open)) {\n          itemElement.open = false;\n        }\n      }\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"accordion-wrapper\">\n        <slot />\n      </div>\n    );\n  }\n}\n","// ifxAccordionItem.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n\n.accordion-item {\n  border-radius: 3px;\n  overflow: hidden;\n  transition: all 0.3s;\n  font-family: var(--ifx-font-family);\n\n}\n\n.accordion-title:focus {\n  outline: none;\n}\n\n// workaround to add corner radius to outline\n.accordion-title:focus::after {\n  content: '';\n  display: block;\n  position: absolute;\n  top: -4px;\n  bottom: -4px;\n  left: -4px;\n  right: -4px;\n  border-radius: 5px;\n  border: 2px solid tokens.$ifxColorOcean500;\n  box-sizing: border-box;\n}\n\n.accordion-title:hover {\n  border: 1px solid tokens.$ifxColorEngineering200;\n  color: tokens.$ifxColorOcean600;\n}\n\n.accordion-title {\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200;\n  gap: tokens.$ifxSpace150;\n  color: tokens.$ifxColorOcean500;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  cursor: pointer;\n  margin: 4px;\n}\n\n.accordion-caption {\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSizeL;\n}\n\n.accordion-content {\n  gap: tokens.$ifxSpace100;\n  max-height: 0;\n  overflow: hidden;\n  transition: max-height 0.3s ease-in-out;\n  line-height: 24px;\n  font-size: tokens.$ifxFontSizeM;\n  font-weight: 400;\n}\n\n.inner-content {\n  background-color: tokens.$ifxColorBaseWhite;\n  padding: tokens.$ifxSpace300;\n  // white-space: pre-wrap;\n  /* wraps text at spaces and within words */\n  word-wrap: break-word;\n  /* breaks text within a word if necessary */\n  overflow-wrap: anywhere;\n  align-self: stretch;\n\n  /* breaks text at arbitrary points when needed */\n}\n\n.accordion-icon {\n  font-weight: bold;\n  display: inline-block;\n  transition: transform 0.3s;\n\n  &:hover {\n    color: tokens.$ifxColorOcean600;\n\n  }\n}\n\n\n\n.accordion-item.open .accordion-icon {\n  transform: rotate(-180deg);\n}","//ifxAccordionItem\nimport { Component, Prop, h, State, Event, EventEmitter, Watch, Listen } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-accordion-item',\n  styleUrl: 'accordionItem.scss',\n  shadow: true,\n})\nexport class IfxAccordionItem {\n  @Prop() caption: string;\n  @Prop({\n    mutable: true,\n  }) open: boolean = false;\n  @Prop() AriaLive = 3;\n  @State() internalOpen: boolean = false;\n  @Event() ifxItemOpen: EventEmitter;\n  @Event() ifxItemClose: EventEmitter;\n  private contentEl!: HTMLElement;\n\n\n  componentWillLoad() {\n    this.internalOpen = this.open;\n  }\n\n  componentDidLoad() {\n    this.openAccordionItem()\n  }\n\n  componentDidUpdate() {\n    this.openAccordionItem()\n  }\n\n\n\n  @Watch('open')\n  openChanged(newValue: boolean) {\n    this.internalOpen = newValue;\n  }\n\n  toggleOpen() {\n    this.internalOpen = !this.internalOpen;\n    this.open = this.internalOpen;\n\n    if (this.internalOpen) {\n      this.ifxItemOpen.emit({ isOpen: this.internalOpen });\n    } else {\n      this.ifxItemClose.emit({ isClosed: !this.internalOpen });\n    }\n  }\n\n  openAccordionItem() {\n    if (this.internalOpen) {\n      this.contentEl.style.maxHeight = `${this.contentEl.scrollHeight}px`;\n    } else {\n      this.contentEl.style.maxHeight = '0';\n    }\n  }\n\n  handleSlotChange(e) {\n    const slotElement = e.target;\n    const nodes = slotElement.assignedNodes();\n    \n    if(nodes.length > 0) {\n      nodes.forEach(node => {\n        const observer = new MutationObserver((mutationsList, _) => {\n          for(let mutation of mutationsList) {\n            if (mutation.type === 'childList') {\n              if (this.internalOpen) {\n                this.openAccordionItem();\n              }\n            }\n          }\n        });\n        observer.observe(node, { attributes: true, childList: true, subtree: true });\n      });\n    }\n\n    if (this.internalOpen) {\n      this.openAccordionItem();\n    }\n  }\n\n  \n\n  @Listen('keydown')\n  handleKeydown(ev: KeyboardEvent) {\n    switch (ev.key) {\n      case 'Enter': // fallthrough\n      case ' ': // space\n        ev.preventDefault();\n        this.toggleOpen();\n        break;\n    }\n  }\n\n\n  render() {\n    return (\n      <div class={`accordion-item ${this.internalOpen ? 'open' : ''}`}>\n        <div role=\"button\" aria-expanded={this.internalOpen} aria-controls=\"accordion-content\" class=\"accordion-title\" onClick={() => this.toggleOpen()} tabindex='0'>\n          <span aria-hidden=\"true\" role=\"heading\" aria-level={String(this.AriaLive) as string} class=\"accordion-icon\">\n            <ifx-icon icon=\"chevron-down-12\"/>\n          </span>\n          <span id=\"accordion-caption\" class=\"accordion-caption\">{this.caption}</span>\n        </div>\n        <div id=\"accordion-content\" class=\"accordion-content\" ref={(el) => (this.contentEl = el as HTMLElement)} role=\"region\" aria-labelledby=\"accordion-caption\">\n          <div class=\"inner-content\">\n            <slot onSlotchange={(e) => this.handleSlotChange(e)} />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAe,+MACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,2CAEY,K,CAIhC,gBAAMC,CAAWC,GACf,GAAIC,KAAKC,aAAc,CACrB,MAAMC,EAAQC,MAAMC,KAAKJ,KAAKK,GAAGC,iBAAiB,uBAClD,IAAK,MAAMC,KAAQL,EAAO,CACxB,MAAMM,EAAcD,EACpB,GAAIC,IAAgBT,EAAMU,cAAiBD,EAAYE,KAAO,CAC5DF,EAAYE,KAAO,K,IAM3B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,qBACTF,EAAA,QAAAC,IAAA,6C,6EC7BR,MAAME,EAAmB,8nCACzB,MAAAC,EAAeD,E,MCOFE,EAAgB,M,8IAIR,M,cACA,E,kBACc,K,CAMjC,iBAAAC,GACElB,KAAKmB,aAAenB,KAAKU,I,CAG3B,gBAAAU,GACEpB,KAAKqB,mB,CAGP,kBAAAC,GACEtB,KAAKqB,mB,CAMP,WAAAE,CAAYC,GACVxB,KAAKmB,aAAeK,C,CAGtB,UAAAC,GACEzB,KAAKmB,cAAgBnB,KAAKmB,aAC1BnB,KAAKU,KAAOV,KAAKmB,aAEjB,GAAInB,KAAKmB,aAAc,CACrBnB,KAAK0B,YAAYC,KAAK,CAAEC,OAAQ5B,KAAKmB,c,KAChC,CACLnB,KAAK6B,aAAaF,KAAK,CAAEG,UAAW9B,KAAKmB,c,EAI7C,iBAAAE,GACE,GAAIrB,KAAKmB,aAAc,CACrBnB,KAAK+B,UAAUC,MAAMC,UAAY,GAAGjC,KAAK+B,UAAUG,gB,KAC9C,CACLlC,KAAK+B,UAAUC,MAAMC,UAAY,G,EAIrC,gBAAAE,CAAiBC,GACf,MAAMC,EAAcD,EAAE3B,OACtB,MAAM6B,EAAQD,EAAYE,gBAE1B,GAAGD,EAAME,OAAS,EAAG,CACnBF,EAAMG,SAAQC,IACZ,MAAMC,EAAW,IAAIC,kBAAiB,CAACC,EAAeC,KACpD,IAAI,IAAIC,KAAYF,EAAe,CACjC,GAAIE,EAASC,OAAS,YAAa,CACjC,GAAIhD,KAAKmB,aAAc,CACrBnB,KAAKqB,mB,OAKbsB,EAASM,QAAQP,EAAM,CAAEQ,WAAY,KAAMC,UAAW,KAAMC,QAAS,MAAO,G,CAIhF,GAAIpD,KAAKmB,aAAc,CACrBnB,KAAKqB,mB,EAOT,aAAAgC,CAAcC,GACZ,OAAQA,EAAGzC,KACT,IAAK,QACL,IAAK,IACHyC,EAAGC,iBACHvD,KAAKyB,aACL,M,CAKN,MAAAd,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBd,KAAKmB,aAAe,OAAS,MACzDP,EAAA,OAAAC,IAAA,2CAAK2C,KAAK,SAAQ,gBAAgBxD,KAAKmB,aAAY,gBAAgB,oBAAoBL,MAAM,kBAAkB2C,QAAS,IAAMzD,KAAKyB,aAAciC,SAAS,KACxJ9C,EAAA,QAAAC,IAAA,yDAAkB,OAAO2C,KAAK,UAAS,aAAaG,OAAO3D,KAAK4D,UAAqB9C,MAAM,kBACzFF,EAAA,YAAAC,IAAA,2CAAUgD,KAAK,qBAEjBjD,EAAA,QAAAC,IAAA,2CAAMiD,GAAG,oBAAoBhD,MAAM,qBAAqBd,KAAK+D,UAE/DnD,EAAA,OAAAC,IAAA,2CAAKiD,GAAG,oBAAoBhD,MAAM,oBAAoBkD,IAAM3D,GAAQL,KAAK+B,UAAY1B,EAAoBmD,KAAK,SAAQ,kBAAiB,qBACrI5C,EAAA,OAAAC,IAAA,2CAAKC,MAAM,iBACTF,EAAA,QAAAC,IAAA,2CAAMoD,aAAe7B,GAAMpC,KAAKmC,iBAAiBC,O","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-27a52d0b.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as o,g as e}from"./p-6b122987.js";const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, 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.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 n=s;const a=class{constructor(o){i(this,o);this.ifxDropdownItem=t(this,"ifxDropdownItem",7);this.icon=undefined;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(){let i=this.href?{href:this.href,target:this.target}:{};return o("a",Object.assign({key:"d1c6f3cbd4554b1018770258e8f47419edc02352"},i,{onClick:()=>this.handleEventEmission(),class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`}),this.icon&&o("ifx-icon",{key:"b814d88ad14f00b04357b5549ae5a5b24adc1b6b",class:"icon",icon:this.icon}),o("span",{key:"49587568db0c0a4f76f9fad0873a6072a698c8ad"},o("slot",{key:"ccfdb428ffa6d9053c0ff9dc3b6b39469e09f208"})))}get el(){return e(this)}};a.style=n;export{a as ifx_dropdown_item};
+//# sourceMappingURL=p-27a52d0b.entry.js.map

package/dist/infineon-design-system-stencil/p-27a52d0b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownItemCss","IfxDropdownItemStyle0","DropdownItem","handleMenuSize","event","this","size","detail","handleEventEmission","ifxDropdownItem","emit","el","textContent","render","hrefAttr","href","target","h","Object","assign","key","onClick","class","hide","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);\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}","// dropdown-item.tsx\nimport { 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    let hrefAttr = this.href ? { href: this.href, target: this.target } : {};\n    return (\n      <a {...hrefAttr} onClick={() => this.handleEventEmission()} class={`dropdown-item ${this.size === 's' ? 'small' : \"\"} ${this.hide ? 'hide' : \"\"}`}>\n        {this.icon && <ifx-icon class=\"icon\" icon={this.icon}></ifx-icon>}\n        <span>\n          <slot />\n        </span>\n      </a>\n    );\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAkB,0hBACxB,MAAAC,EAAeD,E,MCQFE,EAAY,M,wGAEA,G,YACE,Q,UACD,M,UACA,G,CAKxB,cAAAC,CAAeC,GACbC,KAAKC,KAAOF,EAAMG,M,CAGpB,mBAAAC,GACEH,KAAKI,gBAAgBC,KAAKL,KAAKM,GAAGC,Y,CAGpC,MAAAC,GACE,IAAIC,EAAWT,KAAKU,KAAO,CAAEA,KAAMV,KAAKU,KAAMC,OAAQX,KAAKW,QAAW,GACtE,OACEC,EAAA,IAAAC,OAAAC,OAAA,CAAAC,IAAA,4CAAON,EAAQ,CAAEO,QAAS,IAAMhB,KAAKG,sBAAuBc,MAAO,iBAAiBjB,KAAKC,OAAS,IAAM,QAAU,MAAMD,KAAKkB,KAAO,OAAS,OAC1IlB,KAAKmB,MAAQP,EAAA,YAAAG,IAAA,2CAAUE,MAAM,OAAOE,KAAMnB,KAAKmB,OAChDP,EAAA,QAAAG,IAAA,4CACEH,EAAA,QAAAG,IAAA,8C","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-286f0803.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,a as s,g as r}from"./p-6b122987.js";const c=":host{display:flex}.filter-type-group{width:260px;align-items:flex-start;gap:8px}.filter-type-group>::slotted(*){margin-bottom:8px}";const o=c;const n=class{constructor(i){t(this,i);this.ifxSidebarFilterChange=e(this,"ifxSidebarFilterChange",7);this.handleResetEvent=()=>{const t=this.el.shadowRoot.querySelector('slot[name="filter-accordion"]');const e=t.assignedElements({flatten:true});e.forEach((t=>{const e=t.querySelectorAll("ifx-list");e.forEach((t=>{t.resetTrigger=!t.resetTrigger}))}));const i=this.el.shadowRoot.querySelector('slot[name="filter-search"]');const s=i.assignedElements({flatten:true});s.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.ifxSidebarFilterChange.emit(this.selectedOptions)};this.handleUpdateSidebarFilter=t=>{const{filterName:e}=t.detail;const i=this.el.shadowRoot.querySelector('slot[name="filter-accordion"]');const s=i?i.assignedElements({flatten:true}):[];s.forEach((t=>{const i=t.querySelectorAll("ifx-list");i.forEach((t=>{if(t.getAttribute("name")===e){t.resetTrigger=!t.resetTrigger}}))}));const r=this.el.shadowRoot.querySelector('slot[name="filter-search"]');const c=r?r.assignedNodes({flatten:true}):[];c.forEach((t=>{if(t.nodeType===Node.ELEMENT_NODE){const e=t;const i=e.firstElementChild;if(i){i.setAttribute("value","");i.dispatchEvent(new CustomEvent("ifxInput",{bubbles:true,composed:true,detail:""}))}}}));const o=this.selectedOptions.map((t=>{if(t.filterGroupName===e){return Object.assign(Object.assign({},t),{selectedItems:[],value:""})}return t}));this.selectedOptions=o;this.ifxSidebarFilterChange.emit(this.selectedOptions)};this.handleAccordionChange=t=>{this.handleFilterChange(t)};this.handleSearchChange=t=>{this.handleFilterChange(t)};this.handleFilterChange=t=>{const e=[...this.selectedOptions];if(t.type==="ifxFilterSearchChange"){const{filterName:i,filterValue:s}=t.detail;const r=e.findIndex((t=>typeof t!=="string"&&t.filterGroupName===i));if(r!==-1){e[r].value=s}else{e.push({filterGroupName:i,value:s})}}else if(t.type==="ifxFilterAccordionChange"){const{filterGroupName:i,selectedItems:s}=t.detail;const r=e.findIndex((t=>t.filterGroupName===i));if(r!==-1){e[r]={filterGroupName:i,selectedItems:s}}else{e.push({filterGroupName:i,selectedItems:s})}}this.selectedOptions=e;this.ifxSidebarFilterChange.emit(this.selectedOptions)};this.selectedOptions=[]}connectedCallback(){this.el.addEventListener("ifxFilterAccordionChange",this.handleAccordionChange);this.el.addEventListener("ifxFilterSearchChange",this.handleSearchChange);window.addEventListener("ifxResetFiltersEvent",this.handleResetEvent);window.addEventListener("ifxUpdateSidebarFilter",this.handleUpdateSidebarFilter)}componentWillUnload(){this.el.removeEventListener("ifxFilterAccordionChange",this.handleAccordionChange);this.el.removeEventListener("ifxFilterSearchChange",this.handleSearchChange);window.removeEventListener("ifxResetFiltersEvent",this.handleResetEvent)}render(){return i(s,{key:"d794c0d53d4cdf1d9e7a233dc36da89b7407bc57"},i("div",{key:"f59f81f2402e974ce04c937c620907fc553b3752",class:"filter-type-group"},i("slot",{key:"35b06d9b7d04566fce7497c81a641a76bcf987e4",name:"filter-search"}),i("slot",{key:"86614c6a09e9d42392cef57017965abd337582e4",name:"filter-accordion"})))}get el(){return r(this)}};n.style=o;export{n as ifx_filter_type_group};
+//# sourceMappingURL=p-286f0803.entry.js.map

package/dist/infineon-design-system-stencil/p-286f0803.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["filterTypeGroupCss","IfxFilterTypeGroupStyle0","IfxFilterTypeGroup","this","handleResetEvent","accordionSlot","el","shadowRoot","querySelector","filterAccordionSlottedElements","assignedElements","flatten","forEach","accordionElement","ifxLists","querySelectorAll","ifxListElement","resetTrigger","filterSearchSlot","filterSearchSlottedElements","filterSearchWrapper","filterSearch","searchField","length","searchFieldElement","value","selectedOptions","ifxSidebarFilterChange","emit","handleUpdateSidebarFilter","event","filterName","detail","getAttribute","searchSlot","assignedNodes","searchElement","nodeType","Node","ELEMENT_NODE","filterSearchComponent","firstElementChild","setAttribute","dispatchEvent","CustomEvent","bubbles","composed","newSelectedOptions","map","option","filterGroupName","Object","assign","selectedItems","handleAccordionChange","handleFilterChange","handleSearchChange","type","filterValue","existingOptionIndex","findIndex","push","connectedCallback","addEventListener","window","componentWillUnload","removeEventListener","render","h","Host","key","class","name"],"sources":["src/components/table-advanced-version/filter-type-group/filter-type-group.scss?tag=ifx-filter-type-group&encapsulation=shadow","src/components/table-advanced-version/filter-type-group/filter-type-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n:host {\n  display: flex;\n}\n\n.filter-type-group {\n  width: 260px;\n  align-items: flex-start;\n  gap: tokens.$ifxSpace100;\n}\n\n.filter-type-group > ::slotted(*) {\n  margin-bottom: 8px;\n}\n\n","import { Component, h, State, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-filter-type-group',\n  styleUrl: 'filter-type-group.scss',\n  shadow: true,\n})\nexport class IfxFilterTypeGroup {\n  @Element() el: HTMLElement;\n  @State() selectedOptions: Array<{ filterGroupName: string, selectedItems?: Array<{ filterName: string, value: boolean | string }>, value?: string }> = [];\n  @Event() ifxSidebarFilterChange: EventEmitter;\n\n\n\n  /* If the component is ever removed and then reattached to the DOM, \n  connectedCallback ensures that the event listeners are properly set up again */\n  connectedCallback() {\n    this.el.addEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n    this.el.addEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.addEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n    window.addEventListener('ifxUpdateSidebarFilter', this.handleUpdateSidebarFilter);\n   }\n\n\n  componentWillUnload() {\n    this.el.removeEventListener('ifxFilterAccordionChange', this.handleAccordionChange);\n    this.el.removeEventListener('ifxFilterSearchChange', this.handleSearchChange);\n    window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);\n  }\n\n  handleResetEvent = () => {\n    const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n    const filterAccordionSlottedElements = (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true });\n\n\n    filterAccordionSlottedElements.forEach(accordionElement => {\n      const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n      ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n        ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n      });\n    });\n\n    const filterSearchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n    const filterSearchSlottedElements = (filterSearchSlot as HTMLSlotElement).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.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n  handleUpdateSidebarFilter = (event: CustomEvent) => {\n    const { filterName } = event.detail;\n\n    const accordionSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-accordion\"]');\n    const filterAccordionSlottedElements = accordionSlot ? (accordionSlot as HTMLSlotElement).assignedElements({ flatten: true }) : [];\n\n    filterAccordionSlottedElements.forEach(accordionElement => {\n      const ifxLists = accordionElement.querySelectorAll('ifx-list');\n\n      ifxLists.forEach((ifxListElement: HTMLIfxListElement) => {\n        if (ifxListElement.getAttribute('name') === filterName) {\n          ifxListElement.resetTrigger = !ifxListElement.resetTrigger;\n        }\n      });\n    });\n\n    // Clear the search bar within the filter-search slot\n    const searchSlot = this.el.shadowRoot.querySelector('slot[name=\"filter-search\"]');\n    const filterSearchSlottedElements = searchSlot ? (searchSlot as HTMLSlotElement).assignedNodes({ flatten: true }) : [];\n  \n    filterSearchSlottedElements.forEach(searchElement => {\n      if (searchElement.nodeType === Node.ELEMENT_NODE) {\n        // Identify the ifx-filter-search component within the slot\n        const filterSearchComponent = searchElement as HTMLElement;\n          const searchField: any = filterSearchComponent.firstElementChild;\n          if (searchField) {\n             searchField.setAttribute('value', '');\n            searchField.dispatchEvent(new CustomEvent('ifxInput', { bubbles: true, composed: true, detail: '' })); // Trigger ifxInput event to reset\n          }\n        \n      }\n    });\n\n    const newSelectedOptions = this.selectedOptions.map(option => {\n      if (option.filterGroupName === filterName) {\n        return { ...option, selectedItems: [], value: '' };\n      }\n      return option;\n    });\n\n    this.selectedOptions = newSelectedOptions;\n\n    this.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n\n  handleAccordionChange = (event: CustomEvent) => {\n    this.handleFilterChange(event);\n  }\n\n  handleSearchChange = (event: CustomEvent) => {\n    // Call handleFilterChange with the created CustomEvent object\n    this.handleFilterChange(event);\n  }\n\n\n  handleFilterChange = (event: CustomEvent) => {\n    // Create a new array to hold the new state\n    const newSelectedOptions = [...this.selectedOptions];\n\n    // Check the type of the event\n    if (event.type === 'ifxFilterSearchChange') {\n      // Handle the ifxFilterSearchChange event\n      const { filterName, filterValue } = event.detail;\n\n      // Find the existing filter with the same filterName\n      const existingOptionIndex = newSelectedOptions.findIndex(option => typeof option !== 'string' && option.filterGroupName === filterName);\n\n      if (existingOptionIndex !== -1) {\n        // If an existing filter is found, update its value\n        newSelectedOptions[existingOptionIndex].value = filterValue;\n      } else {\n        // If no existing filter is found, append the new filter\n        newSelectedOptions.push({ filterGroupName: filterName, value: filterValue });\n      }\n    } else if (event.type === 'ifxFilterAccordionChange') {\n      const { filterGroupName, selectedItems } = event.detail;\n\n      // Find the existing filter group with the same filterGroupName\n      const existingOptionIndex = newSelectedOptions.findIndex(option => option.filterGroupName === filterGroupName);\n\n      if (existingOptionIndex !== -1) {\n        // If an existing filter group is found, update its selectedItems\n        newSelectedOptions[existingOptionIndex] = { filterGroupName, selectedItems };\n      } else {\n        // If no existing filter group is found, append the new filter group\n        newSelectedOptions.push({ filterGroupName, selectedItems });\n      }\n    }\n\n    // Update the state with the new selected options\n    this.selectedOptions = newSelectedOptions;\n\n    // Emit the entire selectedOptions array\n    this.ifxSidebarFilterChange.emit(this.selectedOptions);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"filter-type-group\">\n          <slot name=\"filter-search\" />\n          <slot name=\"filter-accordion\" />\n        </div>\n      </Host>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/{p-da6efe6b.entry.js → p-28fb795b.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,g as a}from"./p-c63974da.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.breadcrumb{list-style:none;padding:0px;margin:0px;display:flex;flex-direction:row;font-family:var(--ifx-font-family);font-size:0.875rem;align-items:flex-start}';const o=r;const n=class{constructor(t){e(this,t)}componentDidLoad(){const e=this.el.shadowRoot.firstChild;this.validateBreadcrumbItemStructure(e)}validateBreadcrumbItemStructure(e){if(!e){console.error("element not found");return}const t=e.querySelector("slot");if(t){const e=t.assignedNodes();for(let t=0;t<e.length;t++){const a=e[t];if(a.nodeName==="IFX-BREADCRUMB-ITEM"){const e=a;const t=e.querySelector("ifx-breadcrumb-item-label");const r=e.querySelector("ifx-dropdown-menu");if(t.hasAttribute("url")&&r){throw new Error("ifx-breadcrumb-item cannot have both a url and a dropdown menu.")}}}}}render(){return t("nav",{key:"82aec60bebf9a71d7cdcfc2916f91c0e36dee868","aria-label":"Page navigation breadcrumb"},t("ol",{key:"70bae75b26b5df4c509f16c0ab8e2b10333de8ac",class:"breadcrumb"},t("slot",{key:"1cb28e3640f20319349b4f6d3cb1568508d3b1ba"})))}get el(){return a(this)}};n.style=o;export{n as ifx_breadcrumb};
-//# sourceMappingURL=p-da6efe6b.entry.js.map
+import{r as e,h as t,g as r}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.breadcrumb{list-style:none;padding:0px;margin:0px;display:flex;flex-direction:row;font-family:var(--ifx-font-family);font-size:0.875rem;align-items:flex-start}';const o=a;const n=class{constructor(t){e(this,t)}componentDidLoad(){const e=this.el.shadowRoot.firstChild;this.validateBreadcrumbItemStructure(e)}validateBreadcrumbItemStructure(e){if(!e){console.error("element not found");return}const t=e.querySelector("slot");if(t){const e=t.assignedNodes();for(let t=0;t<e.length;t++){const r=e[t];if(r.nodeName==="IFX-BREADCRUMB-ITEM"){const e=r;const t=e.querySelector("ifx-breadcrumb-item-label");const a=e.querySelector("ifx-dropdown-menu");if(t.hasAttribute("url")&&a){throw new Error("ifx-breadcrumb-item cannot have both a url and a dropdown menu.")}}}}}render(){return t("nav",{key:"82aec60bebf9a71d7cdcfc2916f91c0e36dee868","aria-label":"Page navigation breadcrumb"},t("ol",{key:"70bae75b26b5df4c509f16c0ab8e2b10333de8ac",class:"breadcrumb"},t("slot",{key:"1cb28e3640f20319349b4f6d3cb1568508d3b1ba"})))}get el(){return r(this)}};n.style=o;export{n as ifx_breadcrumb};
+//# sourceMappingURL=p-28fb795b.entry.js.map

package/dist/infineon-design-system-stencil/{p-3e18845b.entry.js → p-2ae45c07.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,g as r}from"./p-c63974da.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{position:relative}.sidebar__title{width:100%;height:fit-content;border-top:1px solid #EEEDED;padding:12px 0}.sidebar__title.no-top-border{border-top:none}.sidebar__title-label{height:20px;font:600 0.875rem/1.25rem "Source Sans 3";text-transform:uppercase;color:#575352;letter-spacing:3px}';const i=a;const s=class{constructor(t){e(this,t)}render(){return t("div",{key:"ad873eee7f2993bfc0df215f8fe06a05f154b9e1",class:"sidebar__title"},t("div",{key:"b4fee770bee35345458ac044371a01f284cd400e",class:"sidebar__title-label"},t("slot",{key:"8b3d8c6cde7535b5df05b2a130bd169a141a3fa9"})))}get el(){return r(this)}};s.style=i;export{s as ifx_sidebar_title};
-//# sourceMappingURL=p-3e18845b.entry.js.map
+import{r as e,h as t,g as r}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{position:relative}.sidebar__title{width:100%;height:fit-content;border-top:1px solid #EEEDED;padding:12px 0}.sidebar__title.no-top-border{border-top:none}.sidebar__title-label{height:20px;font:600 0.875rem/1.25rem "Source Sans 3";text-transform:uppercase;color:#575352;letter-spacing:3px}';const i=a;const s=class{constructor(t){e(this,t)}render(){return t("div",{key:"ad873eee7f2993bfc0df215f8fe06a05f154b9e1",class:"sidebar__title"},t("div",{key:"b4fee770bee35345458ac044371a01f284cd400e",class:"sidebar__title-label"},t("slot",{key:"8b3d8c6cde7535b5df05b2a130bd169a141a3fa9"})))}get el(){return r(this)}};s.style=i;export{s as ifx_sidebar_title};
+//# sourceMappingURL=p-2ae45c07.entry.js.map

package/dist/infineon-design-system-stencil/p-2f7affbe.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as r,a}from"./p-6b122987.js";const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex;flex-direction:column}.wrapper__label{color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3"}:host(.wrapper--disabled) .wrapper__label{color:#575352}.wrapper__textarea textarea{border:1px solid #8D8786;border-radius:1px;padding:8px 16px;background-color:#FFFFFF;color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3";transition:all 100ms ease;transition-property:border-color}.wrapper__textarea textarea:hover{border:1px solid #575352}.wrapper__textarea textarea:focus-within{outline:none;border:1px solid #0A8276}:host(.wrapper--error) .wrapper__textarea textarea{border:1px solid #CD002F}:host(.wrapper--disabled) .wrapper__textarea textarea{border:1px solid #575352;background-color:#EEEDED}.wrapper__caption{color:#1D1D1D;font:400 0.75rem/1rem "Source Sans 3"}:host(.wrapper--error) .wrapper__caption{color:#CD002F}:host(.wrapper--disabled) .wrapper__caption{color:#575352}';const i=s;const o=class{constructor(r){e(this,r);this.ifxInput=t(this,"ifxInput",7);if(r.$hostElement$["s-ei"]){this.internals=r.$hostElement$["s-ei"]}else{this.internals=r.$hostElement$.attachInternals();r.$hostElement$["s-ei"]=this.internals}this.inputId=`ifx-textarea-${++d}`;this.caption=undefined;this.cols=undefined;this.disabled=false;this.error=false;this.label=undefined;this.maxlength=undefined;this.name=undefined;this.placeholder=undefined;this.readOnly=false;this.resize="both";this.rows=undefined;this.value=undefined;this.wrap="soft"}async reset(){this.resetTextarea()}formResetCallback(){this.resetTextarea();this.internals.setFormValue("")}handleOnInput(e){this.value=e.target.value;this.internals.setFormValue(this.value);this.ifxInput.emit(this.value)}resetTextarea(){this.value="";this.internals.setValidity({});this.internals.setFormValue("")}componentWillLoad(){this.internals.setFormValue(this.value)}render(){var e,t;return r(a,{key:"619d4ea0390f029bb9e972506f0fb657a1115a96",class:`wrapper \n\t\t\t\t\t\twrapper--${this.error?"error":""}\n\t\t\t\t\t\twrapper--${this.disabled?"disabled":""}`},r("label",{key:"6699012241de3df0a1b0fb05c43941b9f69945bf",class:"wrapper__label",htmlFor:this.inputId},(e=this.label)===null||e===void 0?void 0:e.trim()),r("div",{key:"5015497c95d4217498ac3fd9b4a486d5373e2665",class:"wrapper__textarea"},r("textarea",{key:"28adf1345e3bc66ccfa7b6bda2c5065186b02d5c","aria-label":"a textarea","aria-value":this.value,"aria-disabled":this.disabled,id:this.inputId,style:{resize:this.resize},name:this.name?this.name:this.inputId,cols:this.cols,rows:this.rows,maxlength:this.maxlength,wrap:this.wrap,disabled:this.disabled,readonly:this.readOnly,placeholder:this.placeholder,value:this.value,onInput:e=>this.handleOnInput(e)})),((t=this.caption)===null||t===void 0?void 0:t.trim())&&r("div",{key:"30bd589c40f5fa3d81c8861ce42a557c949b3b12",class:"wrapper__caption"},this.caption.trim()))}static get formAssociated(){return true}};let d=0;o.style=i;export{o as ifx_textarea};
+//# sourceMappingURL=p-2f7affbe.entry.js.map

package/dist/infineon-design-system-stencil/p-2f7affbe.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["textareaCss","IfxTextareaStyle0","TextArea","this","inputId","textareaId","reset","resetTextarea","formResetCallback","internals","setFormValue","handleOnInput","e","value","target","ifxInput","emit","setValidity","componentWillLoad","render","h","Host","key","class","error","disabled","htmlFor","_a","label","trim","id","style","resize","name","cols","rows","maxlength","wrap","readonly","readOnly","placeholder","onInput","_b","caption"],"sources":["src/components/textarea/textarea.scss?tag=ifx-textarea&encapsulation=shadow","src/components/textarea/textarea.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: flex;\n    flex-direction: column;\n}\n\n.wrapper__label {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n}\n:host(.wrapper--disabled) .wrapper__label {\n    color: tokens.$ifxColorEngineering500;\n}\n\n.wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering400;\n    border-radius: tokens.$ifxSpace12;\n    padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n    \n    background-color: tokens.$ifxColorBaseWhite;\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n    \n    transition: all 100ms ease;\n    transition-property: border-color;\n\n    &:hover {\n        border: 1px solid tokens.$ifxColorEngineering500;\n    }\n    \n    &:focus-within {\n        outline: none;\n        border: 1px solid tokens.$ifxColorOcean500;\n    }\n}\n:host(.wrapper--error) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering500;\n\n    background-color: tokens.$ifxColorEngineering200;\n}\n\n.wrapper__caption {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody05;\n}\n:host(.wrapper--error) .wrapper__caption {\n    color: tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__caption {\n    color: tokens.$ifxColorEngineering500;\n}","import { h, AttachInternals, Component, Event, EventEmitter, Host, Method, Prop } from \"@stencil/core\"\n\n@Component({\n\tformAssociated: true,\n\tshadow: true,\n\tstyleUrl: 'textarea.scss',\n\ttag: 'ifx-textarea'\n})\n\nexport class TextArea {\n\n\tprivate inputId: string = `ifx-textarea-${++textareaId}`;\n\n\t@AttachInternals() internals: ElementInternals;\n\n\t@Event() ifxInput: EventEmitter<String>;\n\n\t@Prop() caption: string;\n\t@Prop() cols: number;\n\t@Prop() disabled: boolean = false;\n\t@Prop() error: boolean = false;\n\t@Prop() label: string;\n\t@Prop() maxlength: number;\n\t@Prop() name: string;\n\t@Prop() placeholder: string;\n\t@Prop() readOnly: boolean = false;\n\t@Prop() resize: 'both' | 'horizontal' | 'vertical' | 'none' = 'both';\n\t@Prop() rows: number;\n\t@Prop({ mutable: true }) value: string;\n\t@Prop() wrap: 'hard' | 'soft' | 'off' = 'soft';\n\n\t@Method()\n\tasync reset() {\n\t\tthis.resetTextarea();\n\t}\n\t\n\tformResetCallback(): void {\n\t\tthis.resetTextarea();\n\t\tthis.internals.setFormValue(\"\");\n\t}\n\t\n\thandleOnInput(e: InputEvent): void {\n\t\tthis.value = (e.target as HTMLTextAreaElement).value;\n\t\tthis.internals.setFormValue(this.value);\n\t\tthis.ifxInput.emit(this.value);\n\t}\n\n\tresetTextarea() {\n\t\tthis.value = '';\n\t\tthis.internals.setValidity({});\n\t\tthis.internals.setFormValue('');\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.internals.setFormValue(this.value);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`wrapper \n\t\t\t\t\t\twrapper--${this.error ? 'error' : ''}\n\t\t\t\t\t\twrapper--${this.disabled ? 'disabled': ''}`}>\n\t\t\t\t<label class='wrapper__label' htmlFor={ this.inputId }>\n\t\t\t\t\t{ this.label?.trim() }\n\t\t\t\t</label>\n\n\t\t\t\t<div class='wrapper__textarea'>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\taria-label='a textarea'\n\t\t\t\t\t\taria-value={ this.value }\n\t\t\t\t\t\taria-disabled={ this.disabled }\n\t\t\t\t\t\tid={ this.inputId }\n\t\t\t\t\t\tstyle={ {resize: this.resize} }\n\t\t\t\t\t\tname={ this.name ? this.name : this.inputId}\n\t\t\t\t\t\tcols={ this.cols }\n\t\t\t\t\t\trows={ this.rows }\n\t\t\t\t\t\tmaxlength={ this.maxlength }\n\t\t\t\t\t\twrap={ this.wrap }\n\t\t\t\t\t\tdisabled={ this.disabled }\n\t\t\t\t\t\treadonly={ this.readOnly }\n\t\t\t\t\t\tplaceholder={ this.placeholder }\n\t\t\t\t\t\tvalue={ this.value }\n\t\t\t\t\t\tonInput={ (e) => this.handleOnInput(e) }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{ this.caption?.trim() && (\n\t\t\t\t\t<div class='wrapper__caption'>\n\t\t\t\t\t\t{ this.caption.trim() }\n\t\t\t\t\t</div> \n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n\nlet textareaId = 0;"],"mappings":"oDAAA,MAAMA,EAAc,k9BACpB,MAAAC,EAAeD,E,MCQFE,EAAQ,M,4NAEZC,KAAAC,QAAkB,kBAAkBC,I,yDAQhB,M,WACH,M,2GAKG,M,YACkC,O,mDAGtB,M,CAGxC,WAAMC,GACLH,KAAKI,e,CAGN,iBAAAC,GACCL,KAAKI,gBACLJ,KAAKM,UAAUC,aAAa,G,CAG7B,aAAAC,CAAcC,GACbT,KAAKU,MAASD,EAAEE,OAA+BD,MAC/CV,KAAKM,UAAUC,aAAaP,KAAKU,OACjCV,KAAKY,SAASC,KAAKb,KAAKU,M,CAGzB,aAAAN,GACCJ,KAAKU,MAAQ,GACbV,KAAKM,UAAUQ,YAAY,IAC3Bd,KAAKM,UAAUC,aAAa,G,CAG7B,iBAAAQ,GACCf,KAAKM,UAAUC,aAAaP,KAAKU,M,CAGlC,MAAAM,G,QACC,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,kCACCpB,KAAKqB,MAAQ,QAAU,4BACvBrB,KAAKsB,SAAW,WAAY,MACzCL,EAAA,SAAAE,IAAA,2CAAOC,MAAM,iBAAiBG,QAAUvB,KAAKC,UAC1CuB,EAAAxB,KAAKyB,SAAK,MAAAD,SAAA,SAAAA,EAAEE,QAGfT,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACVH,EAAA,YAAAE,IAAA,wDACY,aAAY,aACVnB,KAAKU,MAAK,gBACPV,KAAKsB,SACrBK,GAAK3B,KAAKC,QACV2B,MAAQ,CAACC,OAAQ7B,KAAK6B,QACtBC,KAAO9B,KAAK8B,KAAO9B,KAAK8B,KAAO9B,KAAKC,QACpC8B,KAAO/B,KAAK+B,KACZC,KAAOhC,KAAKgC,KACZC,UAAYjC,KAAKiC,UACjBC,KAAOlC,KAAKkC,KACZZ,SAAWtB,KAAKsB,SAChBa,SAAWnC,KAAKoC,SAChBC,YAAcrC,KAAKqC,YACnB3B,MAAQV,KAAKU,MACb4B,QAAW7B,GAAMT,KAAKQ,cAAcC,QAIpC8B,EAAAvC,KAAKwC,WAAO,MAAAD,SAAA,SAAAA,EAAEb,SACfT,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACRpB,KAAKwC,QAAQd,Q,2CAQrB,IAAIxB,EAAa,E","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-32fc3ce3.entry.js

@@ -0,0 +1,2 @@
+import{r,h as o}from"./p-6b122987.js";const s=".dropdown-separator{height:1px;background-color:#EEEDED;margin:8px 16px}";const a=s;const c=class{constructor(o){r(this,o)}render(){return o("div",{key:"2c7435f309112c640c3ff68a244d3c663ceb5b7a",class:"dropdown-separator"})}};c.style=a;export{c as ifx_dropdown_separator};
+//# sourceMappingURL=p-32fc3ce3.entry.js.map

package/dist/infineon-design-system-stencil/{p-a9c13b65.entry.js → p-34fb9dca.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as e,g as a}from"./p-c63974da.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.container{display:flex;align-items:center;gap:20px;flex-wrap:wrap;text-decoration:none;color:#1D1D1D;padding:0px 24px 24px 24px;word-wrap:break-word;overflow-wrap:anywhere;}.container:hover{cursor:initial}';const n=o;const t=class{constructor(e){r(this,e)}render(){return e("div",{key:"2f4e55e1890a5d5f749d0e951d6971d8cf1b0875",class:"container"},e("slot",{key:"7e0c1226088fcd91ffee21b817f89970bc3ab772"}))}get el(){return a(this)}};t.style=n;export{t as ifx_card_links};
-//# sourceMappingURL=p-a9c13b65.entry.js.map
+import{r,h as e,g as a}from"./p-6b122987.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.container{display:flex;align-items:center;gap:20px;flex-wrap:wrap;text-decoration:none;color:#1D1D1D;padding:0px 24px 24px 24px;word-wrap:break-word;overflow-wrap:anywhere;}.container:hover{cursor:initial}';const n=o;const t=class{constructor(e){r(this,e)}render(){return e("div",{key:"2f4e55e1890a5d5f749d0e951d6971d8cf1b0875",class:"container"},e("slot",{key:"7e0c1226088fcd91ffee21b817f89970bc3ab772"}))}get el(){return a(this)}};t.style=n;export{t as ifx_card_links};
+//# sourceMappingURL=p-34fb9dca.entry.js.map

package/dist/infineon-design-system-stencil/p-379a2090.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as s}from"./p-6b122987.js";const i=":host{display:inline-block}.rotate{transition:transform 0.2s ease-in-out;transform:rotate(-180deg);margin-top:0em}.icon{margin-top:0em;transition:transform 0.2s ease-in-out}";const o=i;const n=class{constructor(s){t(this,s);this.isOpen=false;this.theme="default";this.variant=undefined;this.size="m";this.disabled=undefined;this.hideArrow=false}render(){return s("ifx-button",{key:"4dc468fdf8211511a97d58441059b0ca44bb880c",variant:this.variant,theme:this.theme,size:this.size,disabled:this.disabled,class:"dropdown-trigger-button"},s("slot",{key:"5e77a7b367905623309508c784233784685caf94"}),!this.hideArrow&&s("ifx-icon",{key:"c60c753f1d57a4ab819a680c48fa1664704dc42b",icon:"chevron-down-12",class:`icon${this.isOpen?" rotate":""}`}))}};n.style=o;export{n as ifx_dropdown_trigger_button};
+//# sourceMappingURL=p-379a2090.entry.js.map

package/dist/infineon-design-system-stencil/p-379a2090.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownTriggerButtonCss","IfxDropdownTriggerButtonStyle0","DropdownItem","render","h","key","variant","this","theme","size","disabled","class","hideArrow","icon","isOpen"],"sources":["src/components/dropdown/dropdown-trigger-button/dropdown-trigger-button.scss?tag=ifx-dropdown-trigger-button&encapsulation=shadow","src/components/dropdown/dropdown-trigger-button/dropdown-trigger-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: inline-block;\n}\n\n.rotate {\n  transition: transform 0.2s ease-in-out;\n  transform: rotate(-180deg);\n  margin-top: 0em;\n}\n\n.icon {\n  margin-top: 0em;\n  transition: transform 0.2s ease-in-out;\n}\n","// dropdown-trigger-button.tsx\nimport { Component, Prop, h } from \"@stencil/core\";\nimport { IOpenable } from '../IOpenable';\n\n@Component({\n  tag: 'ifx-dropdown-trigger-button',\n  styleUrl: 'dropdown-trigger-button.scss',\n  shadow: true\n})\n\nexport class DropdownItem implements IOpenable {\n  @Prop() isOpen: boolean = false;\n\n  @Prop() theme: 'default' | 'danger' | 'inverse' = 'default';\n  @Prop() variant: 'primary';\n  @Prop() size: 's' | 'm' = 'm';\n  @Prop() disabled: boolean;\n  @Prop() hideArrow: boolean = false;\n\n  render() {\n    return (\n      <ifx-button\n        variant={this.variant}\n        theme={this.theme}\n        size={this.size}\n        disabled={this.disabled}\n        class=\"dropdown-trigger-button\"\n      >\n        <slot />\n        {!this.hideArrow &&\n          <ifx-icon icon=\"chevron-down-12\" class={`icon${this.isOpen ? ' rotate' : ''}`} />\n        }\n      </ifx-button>\n    )\n  }\n}"],"mappings":"2CAAA,MAAMA,EAA2B,gLACjC,MAAAC,EAAeD,E,MCSFE,EAAY,M,qCACG,M,WAEwB,U,iCAExB,I,uCAEG,K,CAE7B,MAAAC,GACE,OACEC,EAAA,cAAAC,IAAA,2CACEC,QAASC,KAAKD,QACdE,MAAOD,KAAKC,MACZC,KAAMF,KAAKE,KACXC,SAAUH,KAAKG,SACfC,MAAM,2BAENP,EAAA,QAAAC,IAAA,8CACEE,KAAKK,WACLR,EAAA,YAAAC,IAAA,2CAAUQ,KAAK,kBAAkBF,MAAO,OAAOJ,KAAKO,OAAS,UAAY,O","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-3c14e70d.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as t,g as s}from"./p-6b122987.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-block}.chip{position:relative}.chip__wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #BFBBBB;border-radius:9999px;background:#FFFFFF;cursor:pointer;transition:border 100ms ease;font:400 0.875rem/1.25rem "Source Sans 3"}.chip__wrapper:hover,.chip__wrapper:focus-visible{outline:none;border:1px solid #575352}.chip__wrapper:focus{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--small{padding:4px 12px}.chip__wrapper.chip__wrapper--large{padding:8px 16px}.chip__wrapper.chip__wrapper--opened{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--opened .wrapper__open-button{transform:rotate(-180deg)}.chip__wrapper.chip__wrapper--selected{outline:3px solid #0A8276;outline-offset:-3px;color:#0A8276}.chip__wrapper.chip__wrapper--selected:hover,.chip__wrapper.chip__wrapper--selected:focus-visible{outline:3px solid #08665C;color:#08665C}.wrapper__label{display:inline-flex;align-items:center;gap:4px;font:400 0.875rem/1.25rem "Source Sans 3"}.wrapper__label .label__selected-options{font:600 0.875rem/1.25rem "Source Sans 3"}.wrapper__open-button{display:flex;align-items:center;transition:all 300ms ease}.wrapper__unselect-button{display:flex;align-items:center}.chip__dropdown{position:absolute;z-index:1;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;border-radius:1px;padding:8px 0;min-width:222px;background-color:#FFFFFF}';const l=a;const n=class{constructor(t){e(this,t);this.ifxChipChange=i(this,"ifxChipChange",7);this.placeholder="";this.size="large";this.value=undefined;this.variant="single";this.readOnly=false;this.AriaLabel=undefined;this.opened=false;this.selectedOptions=[]}handleValueChange(e){this.syncSelectedOptionsWithProp(e)}handleReadOnlyChange(e){if(e){this.opened=false}}closeDropdownOnOutsideClick(e){const i=e.composedPath();const t=this.chip.shadowRoot.querySelector(".chip__wrapper");const s=this.chip.shadowRoot.querySelector(".chip__dropdown");if(!i.includes(s)&&!i.includes(t)&&this.opened){this.toggleDropdownMenu()}}handleKeyDown(e){if(e.code!=="Tab"){e.preventDefault()}if(e.target.tagName==="IFX-CHIP"){this.handleWrapperKeyDown(e)}else if(e.target.tagName==="IFX-CHIP-ITEM"){this.handleDropdownKeyDown(e)}}updateSelectedOptions(e){const i=e.detail;const t=[...this.selectedOptions];if(this.variant!=="multi"){if(i.selected){this.opened=false;const t=this.getChipItems();t.forEach((i=>{if(i.selected&&i!==e.target){i.chipState=Object.assign(Object.assign({},i.chipState),{emitIfxChipItemSelect:false});i.selected=false}}));this.selectedOptions=[i]}else{this.selectedOptions=[]}this.value=this.selectedOptions[0]?this.selectedOptions[0].value:undefined}else{if(i.selected){if(!this.selectedOptions.find((e=>e.value===i.value))){this.selectedOptions=[...this.selectedOptions,i]}}else{this.selectedOptions=this.selectedOptions.filter((e=>e.value!==i.value))}this.value=this.selectedOptions.map((e=>e.value))}if(i.emitIfxChipChange){this.ifxChipChange.emit({previousSelection:t,currentSelection:this.selectedOptions,name:this.placeholder})}}getChipItems(){return this.chip.querySelectorAll("ifx-chip-item")}getSelectedOptions(){if(this.variant!=="multi"){return this.selectedOptions.map((e=>e.label)).join("")}return this.selectedOptions.slice(0,2).map((e=>e.label)).join(", ")}toggleDropdownMenu(){if(this.readOnly)return;this.opened=!this.opened}focusChipItemAt(e=0){this.opened=true;const i=this.getChipItems();let t;if(e===-1){t=i.item(i.length-1)}else if(e>=0&&e<i.length){t=i.item(e)}else{console.error(`Invalid index: ${e}`);return}const s=t.shadowRoot.querySelector(".chip-item");if(s){setTimeout((()=>{s.focus()}),1)}}focusChip(){const e=this.chip.shadowRoot.querySelector(".chip__wrapper");e.focus()}handleUnselectButtonClick(e){e.stopPropagation();this.opened=false;let i=false;const t=this.getChipItems();t.forEach((e=>{if(e.selected){i=true;e.chipState=Object.assign(Object.assign({},e.chipState),{emitIfxChipItemSelect:false});e.selected=false}}));if(i){const e=this.selectedOptions;this.selectedOptions=[];this.value=[];this.ifxChipChange.emit({previousSelection:e,currentSelection:[],name:this.placeholder})}}handleWrapperClick(){if(!this.readOnly){this.toggleDropdownMenu()}}handleWrapperKeyDown(e){if(this.readOnly)return;if(!this.opened){switch(e.code){case"Space":case"Enter":case"ArrowDown":this.focusChipItemAt(0);break;case"ArrowUp":this.focusChipItemAt(-1);break}}else{switch(e.code){case"Escape":this.opened=false;this.focusChip();break}}}handleDropdownKeyDown(e){let i=this.getChipItems();let t=Array.from(i).indexOf(e.target);if(t===-1){console.error("Target not found in chip items");return}switch(e.code){case"ArrowDown":if(t===i.length-1)break;this.focusChipItemAt(t+1);break;case"ArrowUp":if(t===0)break;this.focusChipItemAt(t-1);break;case"Escape":this.opened=false;this.focusChip();break;case"Space":if(this.variant==="single"){this.opened=false;this.focusChip()}break;case"Enter":this.opened=false;this.focusChip();break}}syncChipState(){const e=this.getChipItems();let i=0;e.forEach((e=>{e.chipState={emitIfxChipItemSelect:true,size:this.size==="small"?"small":"large",variant:this.variant==="multi"?"multi":"single",key:i++}}))}syncSelectedOptionsWithProp(e){this.selectedOptions=[];const i=(()=>{let e=0;return()=>e++})();if(Array.isArray(e)){this.selectedOptions=e.map((e=>({value:e,label:e,selected:true,key:i(),emitIfxChipChange:true})))}else if(typeof e==="string"){this.selectedOptions=[{value:e,label:e,selected:true,key:i(),emitIfxChipChange:true}]}this.syncChipState()}componentWillLoad(){this.syncSelectedOptionsWithProp(this.value)}render(){return t("div",{key:"eaa08fdd3283cb90fa18cb810cd02681d0ae531d",class:"chip"},t("div",{key:"d4dfd0e6cf40d1acc32426c56c7d3e1ff0f18f85",class:`chip__wrapper chip__wrapper--${this.size==="small"?"small":"large"}\n                  chip__wrapper--${this.variant==="multi"?"multi":"single"}\n                  ${this.opened&&!this.readOnly?"chip__wrapper--opened":""}\n                  ${this.selectedOptions.length?"chip__wrapper--selected":""}`,tabIndex:0,onClick:!this.readOnly?()=>{this.handleWrapperClick()}:undefined,role:"combobox","aria-label":this.AriaLabel,"aria-value":this.getSelectedOptions(),"aria-haspopup":!this.readOnly?"listbox":undefined,"aria-expanded":!this.readOnly?this.opened.toString():undefined,"aria-controls":!this.readOnly?"dropdown":undefined,"aria-readonly":this.readOnly?"true":undefined,"aria-multiselectable":this.variant==="multi"?"true":undefined},t("div",{key:"4aaef2ece1dcc35bea91ef726bd76ca4aa8026fb",class:"wrapper__label"},this.selectedOptions.length===0&&`${this.placeholder}`,this.selectedOptions.length!==0&&(this.variant==="multi"||this.readOnly)&&this.placeholder!==""&&`${this.placeholder}:`,this.selectedOptions.length!==0&&t("div",{key:"2e9334d52fdb6dc76d3a57019e0ac767653b124b",class:"label__selected-options"},this.getSelectedOptions()),this.selectedOptions.length>2&&this.variant==="multi"&&t("ifx-number-indicator",{key:"fbe0db0fd96005221685ff2681dd00d98ab9cecb"},"  ",`+${this.selectedOptions.length-2}`," ")),!this.readOnly&&(this.variant!=="multi"||this.variant==="multi"&&this.selectedOptions.length===0)&&t("div",{key:"b7c0dd24b8409c2be6556b7add6befd631ad57b7",class:"wrapper__open-button"},t("ifx-icon",{key:1,icon:`chevrondown16`})),this.variant!=="multi"&&this.readOnly!==false&&this.selectedOptions.length>0&&t("div",{key:"fbf84d682a54d14da73a18b2b52fab8b947c760c",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`})),this.selectedOptions.length>=1&&this.variant==="multi"&&t("div",{key:"c21d50cf12f05d95464615449bc9cc70acdba040",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`}))),this.opened&&!this.readOnly&&t("div",{key:"c4b49602aaebdd8950646737df5fa19008870c2e",id:"dropdown",role:"listbox",class:"chip__dropdown"},t("slot",{key:"fb52f07c992f8f4c3de1ca7e0631bacd8ef7147c"})))}get chip(){return s(this)}static get watchers(){return{value:["handleValueChange"],readOnly:["handleReadOnlyChange"]}}};n.style=l;const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.chip-item{display:flex;align-items:center;gap:8px;padding:8px 16px;user-select:none;transition:all 100ms ease;transition-property:background, color}.chip-item:hover{cursor:pointer;background-color:#EEEDED}.chip-item:active{background-color:#BFBBBB}.chip-item:focus{outline:2px solid #0A8276}.chip-item.chip-item--large{font:400 1rem/1.5rem "Source Sans 3"}.chip-item.chip-item--small{font:400 0.875rem/1.25rem "Source Sans 3"}.chip-item.chip-item--selected{color:#0A8276}.chip-item.chip-item--selected .chip-item__selected-indicator{display:block}.chip-item__selected-indicator{display:none;margin-left:auto}';const c=r;const h=class{constructor(t){e(this,t);this.ifxChipItemSelect=i(this,"ifxChipItemSelect",5);this.value=undefined;this.chipState={emitIfxChipItemSelect:true,variant:"multi",size:"large"};this.selected=false}updateItemSelection(e){if(this.chipState.variant==="single"){const i=e.target;if(this.chipItem!==i&&this.chipItem.parentElement===i.parentElement){this.selected=false}}}validateSelected(e,i){if(e!==i){if(this.chipState.emitIfxChipItemSelect){this.emitIfxChipItemSelectEvent()}else{this.chipState.emitIfxChipItemSelect=true}}}getItemLabel(){return this.chipItem.innerText}toggleItemSelection(){this.selected=!this.selected}emitIfxChipItemSelectEvent(e=true){this.ifxChipItemSelect.emit({emitIfxChipChange:e,key:this.chipState.key,label:this.getItemLabel(),selected:this.selected,value:this.value})}handleItemClick(){this.toggleItemSelection()}handleItemKeyDown(e){if(e.code==="Enter"||e.code==="Space"){this.toggleItemSelection()}}handleSelectedState(){if(this.selected){this.emitIfxChipItemSelectEvent(false)}}componentWillLoad(){this.handleSelectedState()}render(){return t("div",{key:"493fe2e521f96fbe65792b4364c32a3010a4ae86",class:`chip-item chip-item--${this.chipState.size} \n                    chip-item--${(this.selected&&this.chipState.variant)==="single"?"selected":""}`,tabIndex:0,onClick:()=>{this.handleItemClick()},onKeyDown:e=>{this.handleItemKeyDown(e)},role:"option","aria-selected":this.selected.toString()},this.chipState.variant==="multi"&&t("ifx-checkbox",{key:"3f65da6457afbeca9e5e803f2569263b499fe839",checked:this.selected,tabIndex:-1,size:"s"}),t("div",{key:"02a710f81308419623960d15270f719c45f5fd11",class:"chip-item__label"}," ",t("slot",{key:"ad971a10884b08cf3775f7296a44c7aff1769a0b"})," "),t("div",{key:"2ba702249a7fc67ded010890181f5b35494df843",class:"chip-item__selected-indicator"},t("ifx-icon",{key:"887b43ff1b8c6539b01c0fc620f51d9bc04a05d9",icon:`check${this.chipState.size==="small"?"12":"16"}`}," ")))}get chipItem(){return s(this)}static get watchers(){return{selected:["validateSelected"]}}};h.style=c;const o='@charset "UTF-8";:root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.container{display:inline-flex;justify-content:center;align-items:center;gap:32px;font-family:var(--ifx-font-family)}.container .items__per-page-wrapper{display:flex;align-items:center;gap:16px}.container .items__per-page-wrapper .items__per-page-label{color:#1D1D1D;font-size:14px;font-style:normal;font-weight:600;line-height:20px}.container .items__per-page-wrapper .items__per-page-field{display:flex;flex-direction:column;align-items:flex-start}.container .items__per-page-wrapper .items__per-page-field ifx-select{width:92px}.container .items__total-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .items__total-button{display:flex;width:40px;height:40px;justify-content:center;align-items:center;border-radius:100px;border:1px solid #BFBBBB;background:#FFF}.container .items__total-wrapper .page__numbers-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item{display:flex;padding:6px;flex-direction:column;justify-content:center;align-items:center;gap:10px;border-radius:100px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active{background-color:#0A8276}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active span{color:#fff}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover{cursor:pointer}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover:not(.active){background-color:#ddd}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:active:not(.active){background-color:#575352}.container .items__total-wrapper .page__numbers-wrapper .page__number-item span{display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px}.pagination{display:flex}.pagination ifx-icon-button:first-of-type{margin-right:12px}.pagination ifx-icon-button:last-of-type{margin-left:12px}a{padding:8px;border-radius:100px}ol{list-style-type:none;padding:0;margin:0;display:inline-flex;align-items:center;gap:12px}li{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:100px}li:hover:not(.active) a{background-color:#EEEDED}li:active:not(.active) a{background-color:#575352;color:#fff}li.active{background-color:#0A8276}li.active a{color:#fff}li:hover{cursor:pointer}li a{text-decoration:none;display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px;align-items:center}.prev.disabled,.next.disabled{cursor:default}.prev.disabled:hover,.next.disabled:hover{cursor:default;text-decoration:none}.prev{margin-right:2.5px}.next{margin-left:2.5px}@media (min-width: 400px){li:first-child,li.active-sibling,li.active,li.active+li,li:last-child{display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8)~li{display:none}li:first-child:nth-last-child(n+8)~li.active-sibling:before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li.active+li:after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+5){display:inline-flex;flex-direction:row}li:first-child:nth-last-child(n+8)~li:nth-last-child(5):before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):after,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):after,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):before,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):after{display:none !important}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5){display:none}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5):before,li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5):before{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+5){display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+4):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+4):after{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(5):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(5):after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8).active:before,li:first-child:nth-last-child(n+8).active:after,li:first-child:nth-last-child(n+8)~li.active:before,li:first-child:nth-last-child(n+8)~li.active:after{display:none}}';const p=o;const d=class{constructor(t){e(this,t);this.ifxPageChange=i(this,"ifxPageChange",7);this.ifxNextPage=i(this,"ifxNextPage",7);this.ifxPrevPage=i(this,"ifxPrevPage",7);this.CLASS_DISABLED="disabled";this.CLASS_ACTIVE="active";this.CLASS_SIBLING_ACTIVE="active-sibling";this.DATA_KEY="pagination";this.currentPage=0;this.internalPage=1;this.itemsPerPage=10;this.numberOfPages=[];this.total=1}setItemsPerPage(e){if(e.detail){this.itemsPerPage=parseInt(e.detail.label)}else{this.itemsPerPage=10}}componentDidLoad(){this.calculateVisiblePageIndices();var e=this.el.shadowRoot.querySelector(".pagination");let i=e.querySelector(".prev");this.navigateSinglePage(i,true)}calculateNumberOfPages(){if(isNaN(this.currentPage)){this.currentPage=1}const e=this.total<=this.itemsPerPage?this.itemsPerPage:this.total;const i=this.itemsPerPage;const t=Math.ceil(e/i);if(this.currentPage<=0){this.internalPage=1}else if(this.currentPage>t){this.internalPage=t}else this.internalPage=this.currentPage;this.numberOfPages=Array.from({length:t},((e,i)=>i+1))}componentWillLoad(){this.calculateNumberOfPages()}componentDidUpdate(){var e=this.el.shadowRoot.querySelector(".pagination");var i=e.querySelectorAll("li");this.addEventListenersToPageItems(i,e);if(e.dataset[this.DATA_KEY]<this.numberOfPages){e.dataset[this.DATA_KEY]=e.dataset[this.DATA_KEY]}else e.dataset[this.DATA_KEY]=0;this.changePage(e,false)}componentWillUpdate(){this.calculateNumberOfPages()}handleEventEmission(e){let i=e+1;let t=this.numberOfPages.length;let s=e===0?null:e;let a=e+2>t?null:e+2;let l=this.itemsPerPage;this.ifxPageChange.emit({currentPage:i,totalPages:t,prevPage:s,nextPage:a,itemsPerPage:l})}addEventListenersToPageItems(e,i){e.forEach((e=>{e.addEventListener("click",(e=>{var t=i;let s=t.querySelectorAll("li");t.dataset[this.DATA_KEY]=Array.from(s).indexOf(e.currentTarget);this.changePage(t,false)}))}))}initPagination(e){var i=e.querySelectorAll("li");e.dataset[this.DATA_KEY]=Array.from(i).indexOf(e.querySelector(".active"));e.querySelector(".prev").addEventListener("click",(e=>this.navigateSinglePage(e,false)));e.querySelector(".next").addEventListener("click",(e=>this.navigateSinglePage(e,false)));this.addEventListenersToPageItems(i,e)}navigateSinglePage(e,i){let t=e;if(typeof e.target==="object"){t=e.target}if(!t.classList.contains(this.CLASS_DISABLED)){var s=t.closest(".pagination");var a=parseInt(s.dataset[this.DATA_KEY],10);a+=1*(t.classList.contains("prev")?-1:1);if(a===-1){a=0}s.dataset[this.DATA_KEY]=a;this.changePage(s,i)}}changePage(e,i){const t=e;var s=t.querySelectorAll("li");var a=parseInt(t.dataset[this.DATA_KEY],10);s.forEach((e=>{e.classList.remove(this.CLASS_ACTIVE);e.classList.remove(this.CLASS_SIBLING_ACTIVE)}));if(i&&this.internalPage>1){a=Math.floor(this.internalPage-1);t.dataset[this.DATA_KEY]=a}this.handleEventEmission(a);s[a].classList.add(this.CLASS_ACTIVE);if(a===0){t.querySelector(".prev").classList.add(this.CLASS_DISABLED);t.querySelector(".prev").disabled=true}else{s[a-1].classList.add(this.CLASS_SIBLING_ACTIVE);t.querySelector(".prev").classList.remove(this.CLASS_DISABLED);t.querySelector(".prev").disabled=false}if(a===s.length-1){t.querySelector(".next").classList.add(this.CLASS_DISABLED);t.querySelector(".next").disabled=true}else{t.querySelector(".next").classList.remove(this.CLASS_DISABLED);t.querySelector(".next").disabled=false}}calculateVisiblePageIndices(){var e=this.el.shadowRoot.querySelector(".pagination");this.initPagination(e)}render(){return t("div",{key:"9bd7fdf4fe55dc44d759b1ed8a762c4e2c59dd92","aria-label":"a pagination","aria-value":this.currentPage,class:"container"},t("div",{key:"56c1c63bd26330b122c8200e836e47d692cf798a",class:"items__per-page-wrapper"},t("div",{key:"52ed9e8ef5da46e7f4d2ea582773aa823738bd06",class:"items__per-page-label"},"Results per Page"),t("div",{key:"9e061fc231797a0cdae5d8238ef0219b945d4285",class:"items__per-page-field"},t("ifx-select",{key:"35d2e70bed912e00fe53caee26e8d9af0726e24f",value:"undefined",size:"s",placeholder:"false","show-search":"false","search-placeholder-value":"Search...",disabled:false,error:false,"error-message":"Error",label:"","placeholder-value":"Placeholder",options:'[{"value":"ten","label":"10","selected":true}, {"value":"Twenty","label":"20","selected":false}, {"value":"Thirty","label":"30","selected":false}]'}))),t("div",{key:"1d1ffdaa8de12c2f11cf19a1bae7b656e57ff2d4",class:"items__total-wrapper"},t("div",{key:"f0d9168c69c951c1cb5030be438bce9bea227e07",class:"page__numbers-wrapper"},t("div",{key:"5651775e0f57844392cdcc595ff26ca2fe20fdf6",class:"pagination"},t("ifx-icon-button",{key:"539ced71e1aab947618261627c55a779859b552f",variant:"secondary",class:"prev",color:"primary",icon:"arrow-left-24"}),t("ol",{key:"04aa156901294e6f609815e0534b95f68f12dc70"},this.numberOfPages.map((e=>t("li",{class:`${this.internalPage===e?"active":""}`},t("a",{href:undefined},e))))),t("ifx-icon-button",{key:"d19cb98cbebfb7cc0cea8339b71b0f44f160b854",class:"next",variant:"secondary",color:"primary",icon:"arrow-right-24"})))))}get el(){return s(this)}};d.style=p;export{n as ifx_chip,h as ifx_chip_item,d as ifx_pagination};
+//# sourceMappingURL=p-3c14e70d.entry.js.map