npm - @infineon/infineon-design-system-stencil - Versions diffs - 32.9.0--canary.1690.0fd1d4f3930adff7951d6ac8fa7cd8a2f129f926.0 → 32.9.0--canary.1690.068dfcbe53f27141aecedef167d7bc4258a4c9cf.0 - Mend

@infineon/infineon-design-system-stencil 32.9.0--canary.1690.0fd1d4f3930adff7951d6ac8fa7cd8a2f129f926.0 → 32.9.0--canary.1690.068dfcbe53f27141aecedef167d7bc4258a4c9cf.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (309) hide show

package/dist/infineon-design-system-stencil/{p-9ae3f322.entry.js → p-03752fe5.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,h as e,c as i,g as r}from"./p-e6edf72d.js";import{c as n}from"./p-5cdc6210.js";const o=":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=o;const a=class{constructor(e){t(this,e);this.inverted=false}render(){return e("div",{key:"d19c59bcd5fda31509a5874c28b28766f9647b43","aria-label":"spinner indicating a loading process",class:this.getClassNames()},e("div",{key:"abf8b6118c9aa0e6eb2237912b6f0570ff644bad",class:`${this.variant!=="brand"?"border":""} ${this.inverted?"inverted":""}`}),this.variant==="brand"&&e("div",{key:"9fdbcdf9dcd11586377ca5aa8e5435c6a3e4da65",class:`semiconductor ${this.inverted?"inverted":""} ${this.getSizeClass()}`},e("svg",{key:"6488ba3bede3fc51b93f6dd5b057a43cd59d6df0",width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("g",{key:"5d6f59aaf784f88ac298d69a434bff2fa2d04528",id:"spinner/conductor"},e("path",{key:"d91f65459a62e179ca4e13a9eb5a507e4e09196d",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 n("spinner",this.size&&`spinner ${this.getSizeClass()}`)}};a.style=s;const p=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.textInput__container{display:flex;flex-direction:column;align-items:flex-start;padding:0px;width:100%;flex:none;order:0;align-self:stretch;flex-grow:0;font-family:var(--ifx-font-family)}.textInput__container.disabled .textInput__top-wrapper label{color:#575352}.textInput__container.disabled .textInput__bottom-wrapper input{border:1px solid #575352;background-color:#EEEDED}.textInput__container.disabled .textInput__bottom-wrapper input::placeholder{font-size:0.875rem;color:#575352}.textInput__container .textInput__top-wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:0px;gap:4px;flex:none;order:0;align-self:stretch;flex-grow:0}.textInput__container .textInput__top-wrapper label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:0}.textInput__container .textInput__top-wrapper label .optional-required{margin-left:4px}.textInput__container .textInput__top-wrapper label .optional{margin-left:4px}.textInput__container .textInput__top-wrapper label .required{margin-left:4px}.textInput__container .textInput__top-wrapper label .required.error{color:#CD002F}.textInput__container .input-container{position:relative;display:flex;align-items:center;width:100%}.textInput__container .textInput__bottom-wrapper{flex-grow:1;position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:4px;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper input{width:100%;box-sizing:border-box;display:flex;flex-direction:row;align-items:center;padding:8px 16px;gap:8px;height:40px;background-color:#FFFFFF;color:#1D1D1D;font-family:"Source Sans 3";font-size:1rem;line-height:1.5rem;border:1px solid #8D8786;border-radius:1px;flex:none;order:0;align-self:stretch;flex-grow:0;text-overflow:ellipsis}.textInput__container .textInput__bottom-wrapper input.input-s{height:36px;font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.input-s::placeholder{font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.icon{padding-left:40px}.textInput__container .textInput__bottom-wrapper input.error{border:1px solid #CD002F}.textInput__container .textInput__bottom-wrapper input.error:focus{outline:none}.textInput__container .textInput__bottom-wrapper input.success{border:1px solid #4CA460}.textInput__container .textInput__bottom-wrapper input.success:focus{outline:none}.textInput__container .textInput__bottom-wrapper input:focus:not(.error,.success){outline:none;border:1px solid #0A8276}.textInput__container .textInput__bottom-wrapper input:hover:not(:disabled,:focus,.error,.success){border:1px solid #575352}.textInput__container .textInput__bottom-wrapper input::placeholder{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#8D8786;flex:none;order:1;flex-grow:1}.textInput__container .textInput__bottom-wrapper .input-icon{position:absolute;top:50%;transform:translateY(-50%);left:16px;transition:0.3s;color:#8D8786}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;color:#1D1D1D;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.error{color:#CD002F}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.disabled{color:#575352}.textInput__container .delete-icon{position:absolute;right:16px}.textInput__container .delete-icon :hover{cursor:pointer}';const l=p;const c=class{constructor(e){t(this,e);this.ifxInput=i(this,"ifxInput",7);if(e.$hostElement$["s-ei"]){this.internals=e.$hostElement$["s-ei"]}else{this.internals=e.$hostElement$.attachInternals();e.$hostElement$["s-ei"]=this.internals}this.placeholder="Placeholder";this.value="";this.error=false;this.label="";this.icon="";this.caption="";this.size="m";this.required=false;this.optional=false;this.success=false;this.disabled=false;this.showDeleteIcon=false;this.autocomplete="on";this.type="text"}valueWatcher(t){if(t!==this.inputElement.value){this.inputElement.value=t}}async reset(){this.value="";this.inputElement.value=""}handleDeleteContent(){this.reset();this.ifxInput.emit(this.value)}handleInput(){const t=this.inputElement.value;this.value=t;this.internals.setFormValue(t);this.ifxInput.emit(this.value)}handleTypeProp(){this.internalType=this.type==="text"||this.type==="password"?this.type:"text"}formResetCallback(){this.internals.setValidity({});this.internals.setFormValue("")}componentWillLoad(){this.handleTypeProp()}render(){return e("div",{key:"303c6c1b93aac47f53aba82a8ef06c753dea7979","aria-label":"a text field for user input","aria-value":this.value,"aria-disabled":this.disabled,class:`textInput__container ${this.disabled?"disabled":""}`},e("div",{key:"881ecc1c43b43ec7dac21e4ccf49527f9cff9b68",class:"textInput__top-wrapper"},e("label",{key:"f1f04bcfd47fd9c6ec0dd068eb84d5048f33a9a6",htmlFor:"text-field"},e("slot",{key:"672c2f3c2fdd4784ee303dbef11ab1d9dbf23b43"}),this.optional&&this.required?e("span",{class:"optional-required"},"(optional) *"):this.optional?e("span",{class:"optional"},"(optional)"):this.required?e("span",{class:`required ${this.error?"error":""}`},"*"):null)),e("div",{key:"2f0bb16916c327cec0e2de3576a796e6106ef67b",class:"textInput__bottom-wrapper"},e("div",{key:"e30b6baacdea0c54ded51d1873a330efc08ec5c9",class:"input-container"},this.icon&&e("ifx-icon",{key:"f2efb6d118c1d3d0b6c0f6dc729d795cd735e836",class:"input-icon",icon:this.icon}),e("input",{key:"7d011516706029ec86741b23b7e633750c2ee4d7",ref:t=>this.inputElement=t,disabled:this.disabled,autocomplete:this.autocomplete,type:this.internalType,id:"text-field",value:this.value,onInput:()=>this.handleInput(),placeholder:this.placeholder,maxlength:this.maxlength,class:`${this.icon?"icon":""}\n                ${this.error?"error":""} \n              ${this.size==="s"?"input-s":""}\n              ${this.success?"success":""}`}),this.showDeleteIcon&&this.value&&e("ifx-icon",{key:"a87b386e2ba0b18c9bc6288b1b4c7e7222fd8e03",class:"delete-icon",icon:"cremove16",onClick:()=>this.handleDeleteContent()})),this.caption&&!this.error&&e("div",{key:"03615f02c68fdb29147efc6d1943087f5a651497",class:`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""`},this.caption),this.error&&e("div",{key:"ed879fff52178f54ecd7abd0f9d0b3a5017aae95",class:"textInput__bottom-wrapper-caption error"},this.caption)))}static get formAssociated(){return true}get el(){return r(this)}static get watchers(){return{value:["valueWatcher"]}}};c.style=l;export{a as ifx_spinner,c as ifx_text_field};
-//# sourceMappingURL=p-9ae3f322.entry.js.map
+import{r as t,h as e,c as i,g as r}from"./p-e6edf72d.js";import{c as n}from"./p-5cdc6210.js";const o=":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=o;const a=class{constructor(e){t(this,e);this.inverted=false}render(){return e("div",{key:"652c6fe6e0a08e3cf7238af351918a0c47fed005","aria-label":"spinner indicating a loading process",class:this.getClassNames()},e("div",{key:"03c1c7e9f20a988d3be881acf2e4e392e699fab2",class:`${this.variant!=="brand"?"border":""} ${this.inverted?"inverted":""}`}),this.variant==="brand"&&e("div",{key:"84486975487322399e1558b7184827e958f68f36",class:`semiconductor ${this.inverted?"inverted":""} ${this.getSizeClass()}`},e("svg",{key:"75095cf14fc4379ad614d19f3f17fbcc45522893",width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("g",{key:"ac75f21b37bef789cac77fb0ba7ad32d137a059a",id:"spinner/conductor"},e("path",{key:"abec474d103c502e803abb0dc2b394200b6349bc",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 n("spinner",this.size&&`spinner ${this.getSizeClass()}`)}};a.style=s;const p=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.textInput__container{display:flex;flex-direction:column;align-items:flex-start;padding:0px;width:100%;flex:none;order:0;align-self:stretch;flex-grow:0;font-family:var(--ifx-font-family)}.textInput__container.disabled .textInput__top-wrapper label{color:#575352}.textInput__container.disabled .textInput__bottom-wrapper input{border:1px solid #575352;background-color:#EEEDED}.textInput__container.disabled .textInput__bottom-wrapper input::placeholder{font-size:0.875rem;color:#575352}.textInput__container .textInput__top-wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:0px;gap:4px;flex:none;order:0;align-self:stretch;flex-grow:0}.textInput__container .textInput__top-wrapper label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:0}.textInput__container .textInput__top-wrapper label .optional-required{margin-left:4px}.textInput__container .textInput__top-wrapper label .optional{margin-left:4px}.textInput__container .textInput__top-wrapper label .required{margin-left:4px}.textInput__container .textInput__top-wrapper label .required.error{color:#CD002F}.textInput__container .input-container{position:relative;display:flex;align-items:center;width:100%}.textInput__container .textInput__bottom-wrapper{flex-grow:1;position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:4px;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper input{width:100%;box-sizing:border-box;display:flex;flex-direction:row;align-items:center;padding:8px 16px;gap:8px;height:40px;background-color:#FFFFFF;color:#1D1D1D;font-family:"Source Sans 3";font-size:1rem;line-height:1.5rem;border:1px solid #8D8786;border-radius:1px;flex:none;order:0;align-self:stretch;flex-grow:0;text-overflow:ellipsis}.textInput__container .textInput__bottom-wrapper input.input-s{height:36px;font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.input-s::placeholder{font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.icon{padding-left:40px}.textInput__container .textInput__bottom-wrapper input.error{border:1px solid #CD002F}.textInput__container .textInput__bottom-wrapper input.error:focus{outline:none}.textInput__container .textInput__bottom-wrapper input.success{border:1px solid #4CA460}.textInput__container .textInput__bottom-wrapper input.success:focus{outline:none}.textInput__container .textInput__bottom-wrapper input:focus:not(.error,.success){outline:none;border:1px solid #0A8276}.textInput__container .textInput__bottom-wrapper input:hover:not(:disabled,:focus,.error,.success){border:1px solid #575352}.textInput__container .textInput__bottom-wrapper input::placeholder{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#8D8786;flex:none;order:1;flex-grow:1}.textInput__container .textInput__bottom-wrapper .input-icon{position:absolute;top:50%;transform:translateY(-50%);left:16px;transition:0.3s;color:#8D8786}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;color:#1D1D1D;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.error{color:#CD002F}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.disabled{color:#575352}.textInput__container .delete-icon{position:absolute;right:16px}.textInput__container .delete-icon :hover{cursor:pointer}';const l=p;const c=class{constructor(e){t(this,e);this.ifxInput=i(this,"ifxInput",7);if(e.$hostElement$["s-ei"]){this.internals=e.$hostElement$["s-ei"]}else{this.internals=e.$hostElement$.attachInternals();e.$hostElement$["s-ei"]=this.internals}this.placeholder="Placeholder";this.value="";this.error=false;this.label="";this.icon="";this.caption="";this.size="m";this.required=false;this.optional=false;this.success=false;this.disabled=false;this.showDeleteIcon=false;this.autocomplete="on";this.type="text"}valueWatcher(t){if(t!==this.inputElement.value){this.inputElement.value=t}}async reset(){this.value="";this.inputElement.value=""}handleDeleteContent(){this.reset();this.ifxInput.emit(this.value)}handleInput(){const t=this.inputElement.value;this.value=t;this.internals.setFormValue(t);this.ifxInput.emit(this.value)}handleTypeProp(){this.internalType=this.type==="text"||this.type==="password"?this.type:"text"}formResetCallback(){this.internals.setValidity({});this.internals.setFormValue("")}componentWillLoad(){this.handleTypeProp()}render(){return e("div",{key:"86712b12b55ed4e472bb349e23c599a47a549c5c","aria-label":"a text field for user input","aria-value":this.value,"aria-disabled":this.disabled,class:`textInput__container ${this.disabled?"disabled":""}`},e("div",{key:"e4214d0b8ae5c903cf479f0efd7154267d7bdd80",class:"textInput__top-wrapper"},e("label",{key:"d385b297f339f3127d2aff8232fee554509e9243",htmlFor:"text-field"},e("slot",{key:"ba5bbc0cc791d34f94c40d5b258d0f1af42f9bf1"}),this.optional&&this.required?e("span",{class:"optional-required"},"(optional) *"):this.optional?e("span",{class:"optional"},"(optional)"):this.required?e("span",{class:`required ${this.error?"error":""}`},"*"):null)),e("div",{key:"3b5bff7346734dfe80514d15f62017faa0e1b32a",class:"textInput__bottom-wrapper"},e("div",{key:"be2db37e7776bc58eaa235e6f0fc5b882f444ab5",class:"input-container"},this.icon&&e("ifx-icon",{key:"8dbe69bef7a98abbfeee4cafe8dc3ece39824df8",class:"input-icon",icon:this.icon}),e("input",{key:"8dbbaf7ad797df70a781311fcdb949059cdea4ed",ref:t=>this.inputElement=t,disabled:this.disabled,autocomplete:this.autocomplete,type:this.internalType,id:"text-field",value:this.value,onInput:()=>this.handleInput(),placeholder:this.placeholder,maxlength:this.maxlength,class:`${this.icon?"icon":""}\n                ${this.error?"error":""} \n              ${this.size==="s"?"input-s":""}\n              ${this.success?"success":""}`}),this.showDeleteIcon&&this.value&&e("ifx-icon",{key:"da84395b471e3b15724058b814bacd5d8b4cdd16",class:"delete-icon",icon:"cremove16",onClick:()=>this.handleDeleteContent()})),this.caption&&!this.error&&e("div",{key:"fc069368b47910abcfcfd969582041f0e36bd6fc",class:`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""`},this.caption),this.error&&e("div",{key:"5030a2e7c08001b8a8a1a82a67d812d76153d470",class:"textInput__bottom-wrapper-caption error"},this.caption)))}static get formAssociated(){return true}get el(){return r(this)}static get watchers(){return{value:["valueWatcher"]}}};c.style=l;export{a as ifx_spinner,c as ifx_text_field};
+//# sourceMappingURL=p-03752fe5.entry.js.map

package/dist/infineon-design-system-stencil/{p-dd5d3a7e.entry.js → p-1abbcdbc.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,a as s,g as r}from"./p-e6edf72d.js";const a=":host{display:flex}.filter-type-group{width:260px;align-items:flex-start;gap:8px}.filter-type-group>::slotted(*){margin-bottom:8px}";const o=a;const n=class{constructor(i){t(this,i);this.ifxSidebarFilterChange=e(this,"ifxSidebarFilterChange",7);this.selectedOptions=[];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 a=r?r.assignedNodes({flatten:true}):[];a.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)}}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:"4f530d59ead6338b06e1f913cd7124225c47123d"},i("div",{key:"6a3a1fb38642e4130ea57d39a70b90154d22d23a",class:"filter-type-group"},i("slot",{key:"0f8da1bbdf3daa62ea04cdb4643146d26552686e",name:"filter-search"}),i("slot",{key:"8f16788df7c99451d0db594342a2d8842fb0a309",name:"filter-accordion"})))}get el(){return r(this)}};n.style=o;export{n as ifx_filter_type_group};
-//# sourceMappingURL=p-dd5d3a7e.entry.js.map
+import{r as t,c as e,h as i,a as s,g as r}from"./p-e6edf72d.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.selectedOptions=[];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)}}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:"b3c13d48da96a74d05ba0af9f592fc4f4bf688fc"},i("div",{key:"d0bea155f2d083279710607bde2957fa7f2bdd41",class:"filter-type-group"},i("slot",{key:"71c60c9cdc705fb1d845b93d9871f3257090b88f",name:"filter-search"}),i("slot",{key:"d3ecbbd9e98a227cd2d6902e28ce13c1511bd451",name:"filter-accordion"})))}get el(){return r(this)}};n.style=o;export{n as ifx_filter_type_group};
+//# sourceMappingURL=p-1abbcdbc.entry.js.map

package/dist/infineon-design-system-stencil/p-1b59a7f9.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as c,g as a}from"./p-e6edf72d.js";const d='*{font-family:"Source Sans 3";box-sizing:border-box}body{margin:0;padding:0;overflow-x:hidden}header{margin-bottom:15px;display:flex;justify-content:center}.header__info-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.infoboard__wrapper{display:flex;gap:15px;background-color:#f1f1f1;padding:5px 10px;border-radius:10px}.title{font-size:30px;font-weight:bold}.view{margin:auto}.wrapper{position:relative;width:100%;height:calc(100vh - var(--header-height) - 15px);overflow:auto}table{width:100%;table-layout:fixed;border-spacing:0}thead tr th{border-top:1px solid #dddddd}td,th{padding:10px;background-color:white;border:none;box-shadow:0 0 0 1px #dddddd;box-sizing:border-box}table th:nth-child(1){width:150px}table th:not(:nth-child(1)){width:240px}th{position:sticky;top:0;background-color:white}.sticky-col{position:sticky;z-index:1}th.sticky-col{z-index:2}.second-col{left:0;border-left:1px solid #ddd}.wrapped-content{width:250px;white-space:normal}a{text-decoration:none;color:black}.basic__info{display:flex;gap:5px}ul{padding:0 5px;margin:0 15px;list-style-type:none}tr:nth-child(even) td{background-color:#f1f1f1}ul li{font-size:12px;display:flex;gap:5px;line-height:13px}li.planned__component-wrapper{align-items:center;line-height:16px}.version__wrapper{display:flex;flex-direction:column}ifx-icon{color:rgb(10, 130, 118)}.check__icon{width:10px;height:10px}.planned__icon{width:12px;height:12px;vertical-align:sub}';const f=d;const b=class{constructor(c){e(this,c);this.getPlannedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".planned__component");return e.length};this.setPlannedComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-planned");c.innerHTML=e};this.getCompletedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".completed__component");return e.length};this.setCompletedComponentsNumber=()=>{const e=this.getCompletedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-completed");c.innerHTML=e};this.setTotalComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.getCompletedComponents();const a=this.el.shadowRoot.getElementById("number__indicator-total");const d=e+c;a.innerHTML=d}}componentWillLoad(){let e=this.el.parentElement;if(e){e=e.parentElement;e.style.padding="0px"}}componentDidLoad(){const e=this.el.shadowRoot.querySelector("header");const c=e.offsetHeight;const a=this.el.shadowRoot.querySelector(".wrapper");a.style.setProperty("--header-height",`${c}px`);this.setPlannedComponentsNumber();this.setCompletedComponentsNumber();this.setTotalComponentsNumber()}render(){return c("div",{key:"603e805dcac3fd75ef82ef45b16cae3c36dce4ba",class:"container"},c("header",{key:"18ec7ba5cffa773ed7453ddf1ff3f030b874d56c",class:"header"},c("div",{key:"c71fe9ed18e82728673fbcb020d470dafd26161f",class:"header__info-wrapper"},c("div",{key:"ef822146c63f0ff453fa35460558790ced6e3b15",class:"title"},"DDS Components Overview"),c("div",{key:"af185071aae69efbd0977db909137d37a6c2946b",class:"infoboard__wrapper"},c("div",{key:"99f50c659a82070e5a8476edae48ab47fb052ea3",class:"basic__info"},c("div",{key:"c1cfd28b37ecf4a5429d26dc4e7b2683c201710f"},"Total Number:"),c("div",{key:"c9d36f053a86acf1a82e2df2cd190e6ffde0daea"},c("ifx-number-indicator",{key:"be1366083938fbb2e292ffd31f7d3555d6772133",id:"number__indicator-total"}))),c("div",{key:"d2c7da1dcecdca582bffcc19e3f4d632a6a5f7eb",class:"basic__info"},c("div",{key:"f432c12b09645a0a03f67bddbb5a88226813f963"},"Completed:"),c("div",{key:"a0ed665497cb615ea9f2ed020a1ededc74a6448d"},c("ifx-number-indicator",{key:"0221c38d7e69cc7884499698f669cc9dcabc320a",id:"number__indicator-completed"}))),c("div",{key:"3aa6c638767b233865578c027a1f6bedfc962957",class:"basic__info"},c("div",{key:"8f6c91f6bfa2e22b6eab29fcf36e27895e1876b2"},"In Progress:"),c("div",{key:"577785108461e13d59d6da7cab5da2c66a76cd6d"},c("ifx-number-indicator",{key:"af7ab865eb50f22e0b0a8b58dfec6febd6f2df44",id:"number__indicator-planned"})))))),c("div",{key:"83bd08d547194d3d9ab4325660aa0c81bd759751",class:"view"},c("div",{key:"cedd4f3f2d7be6acba7ac3518dbdbc9db1b12a72",class:"wrapper"},c("table",{key:"6e75c4e50f270a7d38d1ca59fd0883db152cf159"},c("thead",{key:"c894896bd84402aa18395ceaa6f922c937e71e6d"},c("tr",{key:"308276d091e9d069c686ef464e70cc8fb7aaecd9"},c("th",{key:"7ee96bdd186f7a5540533f2584dd01c2ad22eb33",class:"sticky-col second-col"},"Component"),c("th",{key:"ee1f9f5c679e606e221851b0073bc3ab1f35d579"},c("div",{key:"eb5590384e96a049695c9160d87307ed41830724",class:"version__wrapper"},c("span",{key:"ad0ef64dce27a530dfdb7a31c5e22f13d703f7f8"},"Version 1"))),c("th",{key:"6328ca8be6d93def1e462789f0f9f19f055277f9"},c("div",{key:"4cf23f9465a7c261c913e4ff0496e6d9c1fbd139",class:"version__wrapper"},c("span",{key:"4e57f184b77866113676f69b439ca2b679f431b0"},"Version 2"))),c("th",{key:"338da96601484266e63a05bc2d97814733548145"},"Version 3"))),c("tbody",{key:"d0fcd6b1ab25a66428b2a4bd59ee582147af952d"},c("tr",{key:"270103b738ccbd43c5dd611391a635099c1c2032"},c("td",{key:"d18f5f1856d19aba217830040ca5eda7fb910421",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"af239c4c527e7f363eb5fd519363679fc33f55d9",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-accordion--development",size:"s",variant:"bold"},"Accordion")),c("td",{key:"e60f5fcf78ba965ca86910106e84e760b8a36148"},c("ul",{key:"6ba8411cca03b88474adedc2c479bde281da11ae"},c("li",{key:"a9451c0bcc3860f4d48a0cfd8e91b4244f1aac69"},c("span",{key:"5ee7eddfbd25fb738181e1156e9561861c22fe8a"},c("ifx-icon",{key:"f0e26cbba445969936e38f22ddd4d5717a371d43",class:"check__icon",icon:"check12"})),c("span",{key:"25f63d07dd86be03e59c871f687bd8329b2eacd5"},"Includes essential functionality such as expand/collapse behavior and minimal customization options")),c("li",{key:"a681323676abab0babdf5d937b75470e724f03f9"},c("span",{key:"1b1135502102af11973bd750fc1f85411c3e5ad1"},c("ifx-icon",{key:"9765d41f74286c47ac66f1c7cbabaeb7a5dcec44",class:"check__icon",icon:"check12"})),c("span",{key:"621038b4abb44b4654bc03c9a87bbf196e2bf6bc"},"Adheres to web standards")),c("li",{key:"e4267acf4ae388d6e9f0c7e82d09913790297646"},c("span",{key:"9eb3eef870c9417dc6174bcc5b31263d72f2e8c7"},c("ifx-icon",{key:"515bfedadb7232e604e8d98673069600b10358ab",class:"check__icon",icon:"check12"})),c("span",{key:"7018f632b6f2685054b2745c39360cd6fdf6b6d7"},"Provides a simple and lightweight way to organize and display collapsible content")))),c("td",{key:"eefe4661dc86ee2e12579cec3d69547c33c2ee8a"},c("ul",{key:"ee1e36f082c3c6d802e04434e17ae08c1741eea9"},c("li",{key:"9e6cd96b5c49a34e57a7dc2da343da1effd5ba9b"},c("span",{key:"ff7e80fbafaedeace2b18cdbd61ff10d96859c7b"},c("ifx-icon",{key:"ee4cc0522ccecd01916b3a0035fe33bfe384050a",class:"check__icon",icon:"check12"})),c("span",{key:"a571ead8e66e0312af4a212d728dc84f8db34aae"},"Auto collapse feature")),c("li",{key:"d501d9a1046cfcd4b6b546f45007128e5fb26fa0"},c("span",{key:"4d5fc0d152f5c37507e4cc0995ec0cf622fb99f8"},c("ifx-icon",{key:"d85ac6660e05cfca78e989fcc0084129a2c9b476",class:"check__icon",icon:"check12"})),c("span",{key:"035b7d3a5b0b30798d1eeefce18aabb3d765badc"},"Initial collapse feature")),c("li",{key:"ae41112e9a3269e90a0888f7b08c13f26d702f65"},c("span",{key:"f721177e66c17e786dc1e9871d45817c94bfda93"},c("ifx-icon",{key:"9edcb3349b1079ee296c620b5858fb5a11e43819",class:"check__icon",icon:"check12"})),c("span",{key:"61fe4fa2bb4c2432c751e4d6b28061dbdc777f3c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b14575af354e7517aa5f98ecd760ee9f3bb8c761"})),c("tr",{key:"9fd0d035e82c19ae6558d39658e8caebe1808eaf"},c("td",{key:"53fe8ed7b75ea344b4ca4f5286e7217f730f7460",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"403712f0f947a089ea5e40a8c409bf760ccc7414",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-alert--development",size:"s",variant:"bold"},"Alert")),c("td",{key:"f13fa8d914e2979c7a07c1d08190263f31a1860b"},c("ul",{key:"4ff5caba274d3802a864cc816ea632342c71f41b"},c("li",{key:"3190a6e03d2ab76f3cb9d270086c9d5a16f9e1f1"},c("span",{key:"85072b211fac4337f59d2d6cf11fc6d96714d60f"},c("ifx-icon",{key:"2cf3177df23f95ffbbb533cefe35f4fda006e2ba",class:"check__icon",icon:"check12"})),c("span",{key:"4161a2ef332c1d3866d18f534bbeed21e29c29cd"},"Provides a lightweight and customizable interface for presenting alerts, including options for different alert types (e.g., primary, success, danger, warning) and basic styling configurations")),c("li",{key:"8f5496143c6979635bd0a9f4563c2ef85c2705b9"},c("span",{key:"c95a6ea45f24986b9eb4c5d1bcaad8da016e8863"},c("ifx-icon",{key:"5de9126f1ee551605b5eeb1bf3e3ef56f834ba47",class:"check__icon",icon:"check12"})),c("span",{key:"c0a76306d390236ed846abfb8903b5df10c3716f"},"Adheres to web standards")))),c("td",{key:"845ecf42bd7bf14e208ace3795ddd435f990bdba"},c("ul",{key:"da1bef69be3c194fa0afe275ea52aae4c379efef"},c("li",{key:"564eaf02fe03456a293a7ee9d629d13121666eef"},c("span",{key:"e290b7e539786813e7d4b2f81c3dd74ab457803f"},c("ifx-icon",{key:"5c5deb5a03398b7c7377ef9ba28fbf93f4bcaa82",class:"check__icon",icon:"check12"})),c("span",{key:"9a54375080334c423d8cbf85174a407e4a75ec5d"},"Configurable close button")),c("li",{key:"d6ddf180165af193ce01ce9e9584b53c2fe45242"},c("span",{key:"90eb5ffab9202da3f895ce51a335c12dfc6c5e7c"},c("ifx-icon",{key:"b6b6f59fdb49a62a422c88b6a9daa5d05adb2253",class:"check__icon",icon:"check12"})),c("span",{key:"c4231ab5632f3209cf73b16cfcf5140d1264bc0e"},"Additional Info variant")),c("li",{key:"10f1719c92a72aede56aa35880aa8f4fc6cf9dba"},c("span",{key:"0f275b41a2ce5388052ecf962c49d6a84b1ee0c1"},c("ifx-icon",{key:"9cf1f1e948651c3d77ed929f7ba0c0c84c36c228",class:"check__icon",icon:"check12"})),c("span",{key:"21979af1c1254d635516939c593e80ffc09bb022"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4b6918f5000962e7c81c8e651e04180b904a03bf"})),c("tr",{key:"feffd10748cc820efb64c0b2bd2637a89cb411df"},c("td",{key:"df93ee0eda92918b9df9df2556553a8604c06655",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ed79f49730d8c95765f3427af0b005bfadcf3245",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-badge--development",size:"s",variant:"bold"},"Badge")),c("td",{key:"ff6acd299e0a5b3f2670ae410b4c02ee0caaeeab"},c("ul",{key:"130a7019abe91012170494876052638a5e53711c"},c("li",{key:"43d9ea415ffcbfc61b03f0bf2e84bf002e431172"},c("span",{key:"d8b616dcbbc7f0510d833706871fc8d57d9a4d58"},c("ifx-icon",{key:"00d6701b50e5ea96455b5011338baea389b4bd97",class:"check__icon",icon:"check12"})),c("span",{key:"025e1f3519e46583d30f0af4d6ab523c21faa0da"},"Offers simple customization options for displaying badges, allowing developers to indicate specific actions, statuses, or categories with visual cues")),c("li",{key:"ff7e3089f1a255beb5978e91d6ef8a11140193e7"},c("span",{key:"9d5b10daa8b124e65825fac32235ac46be03fd9a"},c("ifx-icon",{key:"b29eacd152604045d214eea0d480f542a60de4e5",class:"check__icon",icon:"check12"})),c("span",{key:"44dfa4f22a03cc3e7e768c77e568d45876e9cef2"},"Designed to seamlessly integrate with existing UI elements and adhere to web standards")))),c("td",{key:"c47d197b3d274bcdec3c32b9edd228924da93b3f"},c("ul",{key:"184f912b56115fe9744a34db00da68537068ed8d"},c("li",{key:"287c935e0c63e0b9fd5d06965a481169f6253f2c"},c("span",{key:"97b77f5823abcbe01ce6a1de49c711351af095d1"},c("ifx-icon",{key:"5eaafb9385a9d41dfc8fc45eb72e0f145694dbbc",class:"check__icon",icon:"check12"})),c("span",{key:"4cc92c9256d6aa5104ee9826e2021ff3e6247c10"},"React, Vue and Angular wrapper integration")))),c("td",{key:"e42b5179fd71c6d844ddd98c0b225a213454f114"})),c("tr",{key:"8869bae6f673417ef089af82f847f07ce521991e"},c("td",{key:"ac513f2b4f327276cf2168125b7942632de84d7f",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"38c10deac8dbc0099d2dae523903a2573ffbcaf9",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-breadcrumb--development",size:"s",variant:"bold"},"Breadcrumb")),c("td",{key:"d9d12f529b95dbafcc8654e86db6f6b7aab6194d"},c("ul",{key:"0bda9aa7a42d080453fa159b847d886f24d0ae53"},c("li",{key:"b3416567e8203872edc9733aa6d2d2e26db97dcd"},c("span",{key:"b1d13b3269ecfd68e59995f80f5d2abb3e9d3b2e"},c("ifx-icon",{key:"5cf2159cf6180437e7299768bc6eda2b5d785cd8",class:"check__icon",icon:"check12"})),c("span",{key:"976999aa51fd38d7b75765d8e4807ddec8400150"},"Provides a simple and customizable way to display a sequential trail of links or indicators, representing the user's current location within a hierarchy of content")),c("li",{key:"8823f5c65c5be9764f792d20bc0adda3a6281143"},c("span",{key:"7ba6c6cdf9b46e05e8612239f53091ef08af363e"},c("ifx-icon",{key:"1e3f7f7313515fdd2a83f0f568e3088b4e44f26b",class:"check__icon",icon:"check12"})),c("span",{key:"6aba9f49dce00be635541bbd04d05d43bc5ec3c2"},"Adheres to web standards")))),c("td",{key:"0d950b7990bd181b1b8396289a5a2aa1496f41b4"},c("ul",{key:"68030d5d9730c263aa878c345f77465de99439b2"},c("li",{key:"79d49e03cda100af0cd39a3ef2e70d8b3763c4b5"},c("span",{key:"2d3174bfdf178ada3097d981fd46f0a81f62bae5"},c("ifx-icon",{key:"6db40ccf9b83868fd1e73dc71acdc92baffeca0c",class:"check__icon",icon:"check12"})),c("span",{key:"701769dcfe65e68d7e93b625162295da84fb9559"},"Possibility to add an icon")),c("li",{key:"7231cea46a4ab18ccd03d9186842d472bd93728b"},c("span",{key:"8a80404cd17c1d7279f4ca6b2068c548f1e09e78"},c("ifx-icon",{key:"f4c87fbc66958fd51f3397e7033cfb3f1e2c4f19",class:"check__icon",icon:"check12"})),c("span",{key:"903bbaaadcb7f3d0c49ec7e6b67a5c07ab69c77f"},"Incorporated dropdown-menu for individual items")),c("li",{key:"7cdc151cf14ab10328f70f5622f7aa118459bec2"},c("span",{key:"d51edadf26caff1e46b21cca1b5dd6ce3c36e903"},c("ifx-icon",{key:"4d71d5c36f3740155b1d6d966ae154d9b50cfa0c",class:"check__icon",icon:"check12"})),c("span",{key:"9bff766e6c28afd15b78b34062d92a6d126f83bd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c4eb08162f4ab822a56935790e5e80cd48917e97"})),c("tr",{key:"7a1351d05babc26c92e94dd690d4080ab778c3ee"},c("td",{key:"999cfdb1803e71bd216a2b63033fe36e4450ecef",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"75affc804f8f9ba037821157ca432dcb8ae2967d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-button--development",size:"s",variant:"bold"},"Button")),c("td",{key:"132e77301869777cd6aa177ac034ac1ae821911f"},c("ul",{key:"448e6e6b200f73a0bebf550688a7b6b4e8df1d1c"},c("li",{key:"6c2c680e65c5cfb9080b872e1139631fb3c42fe8"},c("span",{key:"9d3ff97520833f1d4aaeecc2069d014ea7d4df66"},c("ifx-icon",{key:"faafc496c9300e6538cd3f879d2924b7ccb7fc06",class:"check__icon",icon:"check12"})),c("span",{key:"64777c133650a1e4c6451c9509d957f45075fe99"},"Includes basic styling options such as colors, sizes, and states, providing essential functionality for initiating actions")),c("li",{key:"8b5c21c4c66f064d2fb27a129781aab7b6ab46aa"},c("span",{key:"c6504e9d330a25dc766c6861ee0ae07e75f0e1f0"},c("ifx-icon",{key:"bf81aa87cd764ca732451635f2c6d421683c171c",class:"check__icon",icon:"check12"})),c("span",{key:"3ec2619a8282452d3ff5aa343e7abb0fbc79300d"},"Adheres to web standards")))),c("td",{key:"347cef4f28e3fbf888c562fd460f0b02d14fac92"},c("ul",{key:"3fb33f24219b048996e67f0fd313511035e3e993"},c("li",{key:"817f6b835b09ebf2a6b4ad599361c0de4f1fb375"},c("span",{key:"343120b8fb0be0113f988ec6b86dca29c3ad507f"},c("ifx-icon",{key:"3dd0e12af254fafd97387cf184af5fab6025da15",class:"check__icon",icon:"check12"})),c("span",{key:"8b7bddcd28a89c4751ada1d7bc5e429659c8c354"},"fullWidth feature")),c("li",{key:"499af654e557532830852fcdbff2b3df34be1541"},c("span",{key:"aad8a2b248bc8423e8c6704bab2a834108fe33c7"},c("ifx-icon",{key:"bc2b52d37aa0afbd43ad02c9bdb1cca21c96e200",class:"check__icon",icon:"check12"})),c("span",{key:"5aebf1b35d04b545e9f4005e5e50711a88d41ffc"},"Icon integration")),c("li",{key:"f7f684b83b13c63b336c02ff5425699ffb8bbc0d"},c("span",{key:"5d2ea107947696d64846ce24a28b411fe7e14ccc"},c("ifx-icon",{key:"cceaaa06ca28ecbb179ab1a71d4657d05466fa65",class:"check__icon",icon:"check12"})),c("span",{key:"9552e03847c55fece2ed25702266a8416f85d983"},"Link integration")),c("li",{key:"3b18b73d93b344e8b5e67e400401215da3539df7"},c("span",{key:"d331430c2c4c8481257615fb7f7c23251b0ab0f8"},c("ifx-icon",{key:"75efc55055ec0525e7d1b1155aa4d95bc7f0975c",class:"check__icon",icon:"check12"})),c("span",{key:"5e228e9454251d43ee63394d4e45ecac17dac5b3"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c3dfa9842c1937f7ea637284fd2d6a206d9033ff"},c("ul",{key:"77e8dccb108a7b78eb73937eb27117a7bf518b8e"},c("li",{key:"4973b8486700406cf47455dfa7a60e04303d07ba"},c("span",{key:"b290e825bac04143d88fa634003b4ff2444da401"},c("ifx-icon",{key:"6694c498f6ea5edfff66c585d31b108f457236a0",class:"check__icon",icon:"check12"})),c("span",{key:"14adff5b6147d2e8c117f47ca6467b2a9fa1de92"},"Form integration"))))),c("tr",{key:"0be794a95057fdc5003650956f536e244a1a0652"},c("td",{key:"62af82266b4d17c3abc447786b845e8aaa61d4f1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"85776a0cb23279d3e2ac18fb6abc54e651ee6611",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-card--development",size:"s",variant:"bold"},"Card")),c("td",{key:"022d5dfbb2c0fd6219f0304885602759148f668f"},c("ul",{key:"0ea30720b906699bc4e3bd4acc48d369cd73e894"},c("li",{key:"1b468638f4ae41fc9c221195703fa6e7444d26e9"},c("span",{key:"3ca696e8c34f5e44daa1c757d9eed41ad7d9f7be"},c("ifx-icon",{key:"e8da600ba45f665f4c66b8ca505ea3e673f6c60d",class:"check__icon",icon:"check12"})),c("span",{key:"c6dafe3d3784caa8f0ca08fd4211299f76f517b9"},"Provides a structured and customizable layout, featuring elements such as headings, images, text, and buttons")),c("li",{key:"4d49378d5c64012ebf97275785910214b986faf2"},c("span",{key:"b42f48a884cd1df611437387a490020e6bade6d3"},c("ifx-icon",{key:"8061a06986e18b5bc82f05bbffbe72a84ec7d36a",class:"check__icon",icon:"check12"})),c("span",{key:"a294b6c9f65b2e26d034cab1562412b77a147e67"},"Adheres to web standards")),c("li",{key:"d348f00da81cbe594e0efb8929f582775cae977b"},c("span",{key:"8f8eebca7919c51607770698f0af00671ba6ebf9"},c("ifx-icon",{key:"d48277750ec468bbf4b912b4a3a3338b8b005dee",class:"check__icon",icon:"check12"})),c("span",{key:"3581471c3eab1a97a02fa3a3b0ad0f7502ca020c"},"Horizontal and Vertical layout")))),c("td",{key:"a4b4b6d3d35bf7ef59431244ed8dc308a9e336ee"},c("ul",{key:"58cc8fddd45b3f1a487627acf345d7f774d65b8c"},c("li",{key:"0a5c071d9c70df0f520f9520e2d540d670df0419"},c("span",{key:"c8df7b21ee77e75eca33397f86db058d2ed598f5"},c("ifx-icon",{key:"752d1a7c3b6b20823d499653713e583a4048f611",class:"check__icon",icon:"check12"})),c("span",{key:"4b452f0f8c1b0c9b1b8b3072cea2200349e6a27c"},"Possibility to embed multiple buttons")),c("li",{key:"e6c74cc8afe22ef517c0f51d34f5d303ecec89dd"},c("span",{key:"4afc0d114ead1d34eadfc78e4b606382a69f7729"},c("ifx-icon",{key:"ea89d2b592a20ad3e84aaa395b3ae9ba6c337d88",class:"check__icon",icon:"check12"})),c("span",{key:"3a943a26a09dc8d6869fd572f5f39b721b8459bc"},"A switch between a Link and a Button")),c("li",{key:"b7363a9be5a02fb5867e84c8ba67aa568c7ae579"},c("span",{key:"9bdd7bd9b3531f58615fe2128a6fa7f1e911409a"},c("ifx-icon",{key:"2d02273daac2dced660603eeb4a889118cce3399",class:"check__icon",icon:"check12"})),c("span",{key:"2917056f9fe3422ade1c39d36fe6803f69c2a5aa"},"Enhanced stylying behavior")),c("li",{key:"85b55b99f1d27b19a3b134018bfe8523922f50d4"},c("span",{key:"fbc1c8ef5b211a8725238f1b8e2e7db75279dd24"},c("ifx-icon",{key:"e7d805d346d21c348a53bf671a060730cc7d80d1",class:"check__icon",icon:"check12"})),c("span",{key:"75bcca9f205750cce40a0911647ffe9ed4e8394c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"31827cd5c3fceb22db305b7a7cbe8844f326ddf6"})),c("tr",{key:"8f3a9ecdb52f5fb211c2a0135667f8cf1b122e07"},c("td",{key:"75ea7effb2e1ac9c71ed59d194695fd69c1f0de0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6a9d8acf700c7d106d1d3b326b91909a7e6d0a6e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox--development",size:"s",variant:"bold"},"Checkbox")),c("td",{key:"11970570a3209e0775cae73c4ae3a5fef4da9cb0"},c("ul",{key:"6e44406a579beab9aa121ff1bf7dc1b729d0ce60"},c("li",{key:"c0ce721f90d4c603f480814649c62fa9a940fd72"},c("span",{key:"45db9c2d87a8d471c87f5b209ba4ef0388f414ec"},c("ifx-icon",{key:"01781ce215c876d5f3c1fca9bdb4f16b30965453",class:"check__icon",icon:"check12"})),c("span",{key:"c6c35121ab12bacd18dc9844d00e37499cf33a90"},"Offers a simple and customizable checkbox input, allowing users to toggle between checked and unchecked states")),c("li",{key:"5b4645d9352e3e0416387f8409bc1bd1676dec00"},c("span",{key:"251f7a3689ee0d1765541078d2c53f4506ffc8f1"},c("ifx-icon",{key:"55cbfa9ad13571449b45d98c7fe62b05569eab14",class:"check__icon",icon:"check12"})),c("span",{key:"8cdf96e1377ec61a4e5ecb95ce7fd8d5df3d1368"},"Adheres to web standards")))),c("td",{key:"bc02e4e89d8f71a9a429d7d893411ac5de0815f8"},c("ul",{key:"4f6596cef1fb3ad6d8f14a92efef14f9b94cf244"},c("li",{key:"3e4d0995ae3f30f9ef3b569cdbb773cb1075276e"},c("span",{key:"c99d951efb5df3e6be126a45a7c85f899f32ba94"},c("ifx-icon",{key:"fdd35faf09dd24dee9a98ef92e713e441d793c91",class:"check__icon",icon:"check12"})),c("span",{key:"9e38ab8d490f37ebf194df872dabc2633ad40be1"},"Indeterminate state variant")),c("li",{key:"3958f74870d2b6d688bb5715f244d9c4d15644d3"},c("span",{key:"b0796fa5f3af61e3489486bcba56f16065b4c279"},c("ifx-icon",{key:"a349745a84ee383787ed965c15675b8f33f18bea",class:"check__icon",icon:"check12"})),c("span",{key:"fc69f6f1c96899a5dd219f7aa6d65b7c0160c35c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"9628a9d72313d62e5b0a48cbc843ae2945e0b6df"})),c("tr",{key:"ba643922c486493716b97259e0a4eac49dc02818"},c("td",{key:"696c55e08be7010dc2cab96769274d60ffa11b76",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"25c44d02cb69a8205e65f053661ddfbd9785d3ac",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox-group--development",size:"s",variant:"bold"},"Checkbox Group")),c("td",{key:"fe554e0e3f9653285c514d656fb415ef51dfd946"},c("ul",{key:"adeebcb7f157e258d536be3bf5ac440214e32b2c"},c("li",{key:"7458f53daf3c04b6e225457e16304ddd59c485f6"},c("span",{key:"b635929a0299a9f03ce6631b1e93c5ca8ed154b2"},c("ifx-icon",{key:"05a5070bcb35dfbdf956221eed0cc11472ffd3f6",class:"check__icon",icon:"check12"})),c("span",{key:"9cea072545ba4f3a1918cb6935d4b086d95356e2"},"Provides a simple and customizable interface for grouping multiple checkbox inputs")),c("li",{key:"b7af0fca81b8b0b3f3112911fe8594f635a13a71"},c("span",{key:"552eef2b7d0bef4f3eedb547fb598fa96ee78caf"},c("ifx-icon",{key:"ca926503d15f014d94428ea8e18a891212ffb335",class:"check__icon",icon:"check12"})),c("span",{key:"aad05c925bc73d3a6759f1a42b2bebae08725078"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"2e303fb40a67217b2c11590230b78417d43d76dd"},c("span",{key:"02aa3b54225e35164490f30c6846b7b17ddbde91"},c("ifx-icon",{key:"fd2401d0e1f0f8642e8514691aef1595c896feb6",class:"check__icon",icon:"check12"})),c("span",{key:"0db72d3e5425e82b4eecc6a356177aac16ff22c3"},"Allows to display individual or group error")),c("li",{key:"80d15e8671c9fd07923a31026b706cd67f6c0702"},c("span",{key:"b832830fd97e5b450fef41db3e007644e5841435"},c("ifx-icon",{key:"a5bbd7ba3105adaefd9428bb972349016bd72f1a",class:"check__icon",icon:"check12"})),c("span",{key:"0889e6130dc14e1100ca560a813be72faf35994e"},"React, Vue and Angular wrapper integration")),c("li",{key:"7fefb3f78425b196d1830a34516c549eb3fc3406"},c("span",{key:"9a918711552bd8a38b638debc2f013dca36561bc"},c("ifx-icon",{key:"8ef17fa302e4392b2a4e4da0f847606890ae2c95",class:"check__icon",icon:"check12"})),c("span",{key:"0b0902ee51b7fc3b7687782f634fbc5b1342cfb9"},"Adheres to web standards")))),c("td",{key:"9384820d374ec35882a2fb3cb36cda0b0f900a41"}),c("td",{key:"a278f8807d46fbbfa37faf454cc5bccb06e132e5"})),c("tr",{key:"35b35021a5e1d53342c8f22023be8a88fccf5d69"},c("td",{key:"4b722b32ed1f9e14148268d4b6a7a05897295cc3",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d7d9a47088baaa269a5da05c5cd05b1968ee8ec1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Chip")),c("td",{key:"c05c1c606b55fa601d69d7dfcbf700ba93d049d6"},c("ul",{key:"3c30bde8bdefc098fb505aa1be27fb84eef68090"},c("li",{key:"5bcea974984c3cf022ce6ecacb0998578af7ca1b"},c("span",{key:"f907a33a9a9bc12ef91debf81df665b4050c512c"},c("ifx-icon",{key:"cedd9dfce9847b67b0fad02f3c8390823fd04be5",class:"check__icon",icon:"check12"})),c("span",{key:"69c8bb2d28515d148ff9f41f9a77ea6645917e47"},"Provides a simple and customizable interface, representing discrete units of information or user interactions, such as labels, categories, or removable entities")),c("li",{key:"b43fca7dfc484f9a67fc727cb049a416802e921e"},c("span",{key:"452219499b00d118c9aaad5a42d003c19684f556"},c("ifx-icon",{key:"10afdf90b5fd54ee7940ed77c486b23e939352ef",class:"check__icon",icon:"check12"})),c("span",{key:"a655680c0d637524747bef55fd9250847d18969f"},"Adheres to web standards")))),c("td",{key:"91a88ab53411910df47af8e63047510aae2ca092"},c("ul",{key:"0021e0c81fa673d6c0efa98a2402de89bc8c46d0"},c("li",{key:"c2e169aca5103aebe727c7abcd5f6ba74cb0346b"},c("span",{key:"536f8451517f65f0be547d0e6f186a939e8b43a7"},c("ifx-icon",{key:"ae8cff6b8b86ddbf35e5ba7e2a844610eb0e6186",class:"check__icon",icon:"check12"})),c("span",{key:"178fa8b2b762a4bedf1fbbf57dba4f2134d40f5f"},"Incorporated dropdown-menu for individual item selection")),c("li",{key:"1f5718338fd15f559ffa6837382710a546215988"},c("span",{key:"522aec5308f344d23876b7b67e3e22a158835ecf"},c("ifx-icon",{key:"7e047ddb606bc6e942daae95e9c597882518fee9",class:"check__icon",icon:"check12"})),c("span",{key:"44f6fc2ef273477e665a2c5e9632fe8897d69ada"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d0f778f9a7923a229e256551e38cb2ef2e101309"})),c("tr",{key:"5d2e9ede5b5c8b52969a35b9183604fd547434d0"},c("td",{key:"347270516be2c520ccd35566d8a34e665f0dcf61",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"bfdbe54f4330ae982b125bb8040a4d9a69a807a1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Date Picker")),c("td",{key:"4d1d9e4dab5a4d570c29128d28d0da78b954af4c"},c("ul",{key:"27fa9eae0f2768183f09eec83d486a369193a163"},c("li",{key:"2ec1650c5c80d6ad417d3b17cead9d1093b1baf5"},c("span",{key:"57a8862939f9dcc8713d2d0b0716e07e0a4426a9"},c("ifx-icon",{key:"09db03722ab304051b541db05acefa6a8ba9a171",class:"check__icon",icon:"check12"})),c("span",{key:"acc3211b7d4624d6928831f2073e8558df7c30a1"},"Provides a customized wrapper and theming for the standard date picker element, enhancing its appearance and user interaction")),c("li",{key:"76b8743090be245f19cc12743aa233f71aca25d1"},c("span",{key:"2e49cb3c4b6b6c59c5e6dc567b4cac89155286fd"},c("ifx-icon",{key:"95771f4629f637055683afff875d313328edd32a",class:"check__icon",icon:"check12"})),c("span",{key:"698a2a9a8675f6452e9dba409252b655ffb3566a"},"Cross browser compatibility")),c("li",{key:"6986eac1b39760f7a4b6e8df7dc838c1986d9c6a"},c("span",{key:"2314f4f71e8e4b62a8b2159dd2786cd8d1ff9781"},c("ifx-icon",{key:"6a088065d0b26d23780c42cd7fead41f57ca9f47",class:"check__icon",icon:"check12"})),c("span",{key:"7cc846d064e012d9d94a32590e61c42b8b8c26e1"},"Form integration")),c("li",{key:"c8d65354629edfc0f0cb907ad25c32521f3fd065"},c("span",{key:"f357748dbe62b8d53d2c9e617aa18afec625cf28"},c("ifx-icon",{key:"ab8a67d3db5315975f1330a1483f6017d41d0010",class:"check__icon",icon:"check12"})),c("span",{key:"38a9c7bec01630cddda108c7e801132d94a6cf49"},"Adheres to web standards")))),c("td",{key:"c06cf5e87596ce79ca31315f6476f0035859ef45"},c("ul",{key:"d3c606c2c43dae82e89b5298a2f4f5b0b65aaef6"},c("li",{key:"aec5e8de0463beeed8b2f7f2236c6781d2b8f07a"},c("span",{key:"75bfe9da85487d7c653baeeb7a4924c238f222d9"},c("ifx-icon",{key:"80e6a66d6e49a34a2061a601c24abdda30c62b5f",class:"check__icon",icon:"check12"})),c("span",{key:"5447b2b9c4eb437f808dd3c22e6ab010ed8234c0"},"Range")),c("li",{key:"cf532bffe29ffb7d22ef1802cc284cdf2fed07bd"},c("span",{key:"bd38ce4d4fdc43b1e9d909a5c99c1b52d30d5df4"},c("ifx-icon",{key:"a0bcc1ebd4082d27c7213515843d22dc98bc28e5",class:"check__icon",icon:"check12"})),c("span",{key:"a4c727c17652e341641dd9454958788e74e698d7"},"Default value")))),c("td",{key:"748e1c4c170d7fccc509f219751b0fae2fc6c242"})),c("tr",{key:"5bfcf3a9a48fff1a263348b51d465d1aed7c22b5"},c("td",{key:"e0142a3d925f4c574c82d0afdda76df2546710b6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"51cf2440260de6d62bb2c74c8e74969174cea09f",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-dropdown--development",size:"s",variant:"bold"},"Dropdown")),c("td",{key:"7a37a87051a3a15fab0a00128acc9883ad44ecff"},c("ul",{key:"1e0145b1e4f8658276d387ff9a90125578b917e1"},c("li",{key:"eae3335035418197bb66d6dcdff87a6e701910d6"},c("span",{key:"0a476c3d26b95f7b880def4c2a41d6e476841c25"},c("ifx-icon",{key:"cc7f38e657b079142d251e45b0d118881f51f252",class:"check__icon",icon:"check12"})),c("span",{key:"9f1016bad872b70d252aefc58b98fcb0daa225de"},"Offers a versatile and interactive user interface element for presenting a list of options or actions")),c("li",{key:"375373e07b6a41f46fbcc5f9ce724aca1bc0883c"},c("span",{key:"5ccc2545c24c531ea49b3385a7e81f0129684fd2"},c("ifx-icon",{key:"3173c5ffeddf9ddfda35649ccb08fbb685d643ca",class:"check__icon",icon:"check12"})),c("span",{key:"fe1e602ba4bf3ffc52bb8550eda6a66080ec255d"},"Ensures consistent behavior and compatibility with web standards for a reliable user experience, while intentionally limiting customization options to emphasize a standardized appearance and behavior")))),c("td",{key:"95e58097090c49efec39a37c42fa9dffe9a76444"},c("ul",{key:"c66aa1ead65b49931cc4dc0369487c783a0aaf76"},c("li",{key:"10da6af088e7dbc7b50fdd1a9c0743f558f49772"},c("span",{key:"b64fabcbd38c3646a0a8fc66b25900ab29ac6f64"},c("ifx-icon",{key:"edd5ce45283cc0c54f2c77df13d418db6ec6c063",class:"check__icon",icon:"check12"})),c("span",{key:"b925b005ce9472a8297df12b8a8ab532a2b4808a"},"Search filter")),c("li",{key:"6fdd7615f6d35ee64343a697260201e681768eed"},c("span",{key:"9c0cd5d3f485bb0940849510cbb1ac6f43fec64b"},c("ifx-icon",{key:"b3cf15368b5bda8a40f43a8280e00798578e9090",class:"check__icon",icon:"check12"})),c("span",{key:"cf4a1b568e4e1a29bf147b9db519d2c54b5c7781"},"Header section")),c("li",{key:"1c8670e92969258cf91210abf30c6c5b2be504cb"},c("span",{key:"d04d1d8f8df188ec5876792714e715e1e70e8a76"},c("ifx-icon",{key:"08dfb122221fda6016f6084060f09c227c5a31dd",class:"check__icon",icon:"check12"})),c("span",{key:"9b71ccc425d32e2375faf498349eaefd8a6d0206"},"Menu Item Divider")),c("li",{key:"d64e56ece035e8443442226820217314c090c87b"},c("span",{key:"25311ec1e39b7ae7a9a268647b7d9f72c08281d6"},c("ifx-icon",{key:"6a0536d02de69063d1b7c05d1b596d20acac752e",class:"check__icon",icon:"check12"})),c("span",{key:"1b7b1abb7bf8315bfdf13dd23c2b0582db80355e"},"Icon incorporated")),c("li",{key:"7d45e3ad95fb267ecf0c159ae604d3520d3d2008"},c("span",{key:"7eeb2303e32d53daf97aafb1a7549979cb3f4b45"},c("ifx-icon",{key:"353a8adb28346bd764482a1f985abf7d7d5e3ec9",class:"check__icon",icon:"check12"})),c("span",{key:"9bed7a7e3c7257f8092149caa243a770eff710f3"},"Extended customization and configurations")),c("li",{key:"d412cc38418bac304c3c4cc969e15f3d0c2ec0db"},c("span",{key:"a490c16cae1825ac1c7a65874827ddcc41bd627a"},c("ifx-icon",{key:"be9c74f25b4429abf16b15142877bb729d0f6ee6",class:"check__icon",icon:"check12"})),c("span",{key:"79f7c6ea95a7cf833f270c0c092ec948ba43d439"},"Separate label trigger")),c("li",{key:"2e0b8f134e7127e37dadf0d610cca8e3a6727ad0"},c("span",{key:"fa78f110963e01ffc7972c30385c0e89e1085647"},c("ifx-icon",{key:"e253deb8615add44189da391624a21519dce6b4a",class:"check__icon",icon:"check12"})),c("span",{key:"356d5dec4fdade23b5e0d03750c0e63ad0fe110a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"409b02b734fb6f3d3dbbc305b1a842c24008f520"})),c("tr",{key:"ca789b182e1ae27cc75bd16a7c8a23566f5dc5f6"},c("td",{key:"b6f6d58c302588214e174837f4adc5acaf2202be",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"c1d6db48ebaf085f8178c2c85aaa231c6b257dde",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-footer--development",size:"s",variant:"bold"},"Footer")),c("td",{key:"73b4aff851ad3c11dd826e09ed2ad655f5a102ce"},c("ul",{key:"1c8f4ee85d322b4d9370e29895e60c01bffe5801"},c("li",{key:"f9d31ae16cab7151d89c7b5f855d3cd91127b916"},c("span",{key:"f6b1e99d21be66a1ea6f823f2b5ff63c1551fa61"},c("ifx-icon",{key:"6535b4f9bcf0eed424ae7bf003e728f4d11cc484",class:"check__icon",icon:"check12"})),c("span",{key:"724a1ba0b564289c51c0ffb64139141d274acfc2"},"Provides a standardized and customizable way to display essential information, navigation links, and branding at the bottom of web pages or application interfaces")),c("li",{key:"7a1c3a9a8fe8bf63da0e2a6c08bce15a83936518"},c("span",{key:"7a9fb83c24aa777ed4e8f848780babda206a7b59"},c("ifx-icon",{key:"1385939a67a95fd2a454ebff29e31673399b35c1",class:"check__icon",icon:"check12"})),c("span",{key:"99e3221bebefa67bc79f094b2398852fe3c169a0"},"Offers a flexible and configurable layout for organizing copyright notices, contact details, sitemap links, and other pertinent information")),c("li",{key:"cfd02f9ac1f58752f38e4cde6d53484ab9a074cb"},c("span",{key:"1cb9b6c383085c122542ca8f2a1eaccb1cd688b7"},c("ifx-icon",{key:"411c683739c6966615381d7915c40a0f22e71688",class:"check__icon",icon:"check12"})),c("span",{key:"1996a3d4c9b60a38da98e226e55e83f536947c93"},"Adheres to web standards")))),c("td",{key:"fae5d647c1804a554177af07577a928e9ce17204"},c("ul",{key:"0aed01f42ce4ae2863498dfe4d8e7b6ce0557feb"},c("li",{key:"60bf8a33692682274fa11a8dd0721012baae679c"},c("span",{key:"d3b108addfe7ec8bed98a4c1d41938003ec6f511"},c("ifx-icon",{key:"d650839c2b137313983238e19de9d60d4b40301f",class:"check__icon",icon:"check12"})),c("span",{key:"2b2e06e2db64549f6720c42eab60fa1936b72371"},"Small, Medium and Large variants")),c("li",{key:"216ba7f08ea8e98ab0bef53738ea900c4004b71e"},c("span",{key:"c51932bd7553b128da064a2170ebc9196ad02e08"},c("ifx-icon",{key:"e94ca1db23e3802de6cf444b60020b5770e1b969",class:"check__icon",icon:"check12"})),c("span",{key:"deefce460f00890f8b6ec05cd7b7d06225f52664"},"React, Vue and Angular wrapper integration")))),c("td",{key:"9a9ea3fc88f774398ff8aabd397e0e9d5c3f2ab1"},c("ul",{key:"ee55c1be8425c8c0f5bd60a1d1a0adb96b4ed010"},c("li",{key:"93937702636a48394701a9087c8052a2282d2d8c"},c("span",{key:"991f386de6b0c1dd84255f84c25cbd05a927608d"},c("ifx-icon",{key:"1aa896f1be705136f7696c40b5dbeeab6078c2ab",class:"check__icon",icon:"check12"})),c("span",{key:"adbafce36a3f64394452833e861ec0b60961834e"},"Customizable and removable links"))))),c("tr",{key:"71c2cbb265b4a9c7d14e5ceeeec3626c8b5586c8"},c("td",{key:"40a0741b7efc646028733eae7157e2c00a06de90",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8c248f391db704d94f9ac902549a716dc3737f9b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon-button--development",size:"s",variant:"bold"},"Icon Button")),c("td",{key:"b24388202176a01e2fe33f6c8f8a03e5d98dba90"},c("ul",{key:"a6caead4736da19e5530e6fea731ac4fd42b02c2"},c("li",{key:"e251541cf0f76363356020e97ecb0c2fee765b62"},c("span",{key:"223fa0fb4553029e263cd01212d06f6fe2cb5659"},c("ifx-icon",{key:"00a46127d3654e62c6fb3d2b0c3df1d872e61add",class:"check__icon",icon:"check12"})),c("span",{key:"76d86097d9fc01091e1e982dba20dabf40c80efb"},"Offers a compact and interactive icon-based button element")),c("li",{key:"08038c0d42d36a3a2688a2b5b6b75e651349077c"},c("span",{key:"e85095a1937d862e7ba58063ba628795b6db5dd8"},c("ifx-icon",{key:"c00c48bec2c16a71a2c881711e314169caaa5897",class:"check__icon",icon:"check12"})),c("span",{key:"acd6169b85d8d4a8bd5ac8e65640a994a7c3391b"},"Provides a limited scope of customization")),c("li",{key:"3d8c312ef5fdc9a1cdc206706d3d50880448dee6"},c("span",{key:"e56ce8e919474e3c18a284229650336938c2264f"},c("ifx-icon",{key:"f1b13d850ced3e84df5e74794d88078f200ca85c",class:"check__icon",icon:"check12"})),c("span",{key:"8c0db03d86fb47490b35b8c423e027b936945a7f"},"Adheres to web standards")))),c("td",{key:"fb0a86aaf8777e2327be9e873a03b2e279b8565c"},c("ul",{key:"e940220ef9912e7473a12e646de12f40c55797a1"},c("li",{key:"20b9a750444ed021e57792865fb503eaedbc5457"},c("span",{key:"99c1659356fed5fe1c72d7ffa92d1203e7a5e3a2"},c("ifx-icon",{key:"a266a62e602f18c5c47cbf0512251bca138dcaf9",class:"check__icon",icon:"check12"})),c("span",{key:"6ea2050c4c6b4c25d66bbf78dfbe1f57c70ef2a5"},"Additional Round and Square shape variants")),c("li",{key:"f8502c2e609827607f5703b949cca898b4b07982"},c("span",{key:"66f38ffaa4d2bf2117ae56762fdbc4faeb3b5f28"},c("ifx-icon",{key:"753d7e5cba8d52c4c62e31e8133a9ece3a7bc67e",class:"check__icon",icon:"check12"})),c("span",{key:"d8e0462c75465ea22843630ab973a7c459d219f5"},"Small, Medium and Large size")),c("li",{key:"2d89170f99dd57dcaf4352a43daa988ec614c62a"},c("span",{key:"cae8cc9ebc58520466c08a452d1bf127fccb190d"},c("ifx-icon",{key:"88d0e6c328b253a855ccbb19aead8fe6316397d9",class:"check__icon",icon:"check12"})),c("span",{key:"940f26fa1b8fa65a9853bcd3b8670b2917f11341"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1da09e7e85072b3fdfc9b7a742f1f93219196132"})),c("tr",{key:"be6df5a26a5f6898259a6d10ef8b60944de96527"},c("td",{key:"6dcf26f529767797a3af5074548361fa489b022e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"fc69f823660b9dccd2688b9c3027e31882dd828d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon--development",size:"s",variant:"bold"},"Icon")),c("td",{key:"84d5dcc5cbce911deb2b57a8570d727b547bc06a"},c("ul",{key:"162a6bda681df4a022b33b44e61ccb3fc78fb166"},c("li",{key:"5ca7b02068f5640a2b695c8ce379a1a828ba92ce"},c("span",{key:"3919f21538010a962fbe523ce70b06e385aa754a"},c("ifx-icon",{key:"58694fb695da20bab8a2472b03330ac0c6501197",class:"check__icon",icon:"check12"})),c("span",{key:"dbd158b1b66686894f28cb66c49f1d37ebfef2ca"},"Offers a wide range of iconography options, allowing developers to easily incorporate symbols, glyphs, or visual indicators to enhance the user interface and convey information or actions effectively")))),c("td",{key:"b300372d84e19ddacc79cd47eb2bb6e56813c610"},c("ul",{key:"3cc97e3d156402cac1fbf757abb3760ddc29be0c"},c("li",{key:"012944b351ae58898b2140171fba932c7f989415"},c("span",{key:"f45b886c6d20d47474bfb7405480707cab03b699"},c("ifx-icon",{key:"f3f5ab71d612cfe8a10d976305768585d74abbdb",class:"check__icon",icon:"check12"})),c("span",{key:"0e6d962a452986715004ffffd0a657699c26461e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"221398df7a0d44fd17dfd0d574486a6e0cf7f992"})),c("tr",{key:"dbbb65dc8c160c147682a52d7bd09728ba346097"},c("td",{key:"c664c031c7046b18ff8f1a3aeeab2f896408f8de",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"646382a72ac3ab2e2b46ff129900b883b9418d4e",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-link--development",size:"s",variant:"bold"},"Link")),c("td",{key:"5ed3e0be31096545eaabf6491957ddbac8ff8ebb"},c("ul",{key:"2517e86039c7a490669a0b441a3040f51ecc4046"},c("li",{key:"801800ecf9b1c865c52f6ccf2b349b450db0c774"},c("span",{key:"e4fd7bb17f5ec305b6aa552bd0f4d65773b0ae44"},c("ifx-icon",{key:"e58eb6cba3c19025a51466bc748e095268b3a002",class:"check__icon",icon:"check12"})),c("span",{key:"13e049aa6bfea5910e4d139310feed8c6a58d10f"},"Provides a flexible and customizable element for creating hyperlinks within a web application")),c("li",{key:"ff84ea5104a645025a2e5b9ed5034d7e7dfc6346"},c("span",{key:"2cbefc54a691e8035079918dc5b9092821939aeb"},c("ifx-icon",{key:"0b6f1a8197545e3d8f65b2a54ea0340fe22fff4e",class:"check__icon",icon:"check12"})),c("span",{key:"b6addbba75640aad63dde74d1607ef6f24a824bc"},"Offers essential functionality for defining clickable text or elements")),c("li",{key:"ec9e134a933923b5bf33d99415284cd445345211"},c("span",{key:"286f317df7cf335bd7649f483ee570663767d4b9"},c("ifx-icon",{key:"5e88371d9c059e4cf6e6570c70ca44b35b681adb",class:"check__icon",icon:"check12"})),c("span",{key:"a3276939bcad4cbbddbd82d35432a722e594f89c"},"Adheres to web standards")))),c("td",{key:"70cb692932d991c09aa08dea1bc5e0f89a57490f"},c("ul",{key:"e9e55a15b1c542bdfe4369172790604fca56bfd9"},c("li",{key:"c15c953b09f34583c114fec57f4febdef563ac65"},c("span",{key:"df539b9e176db898cb6ae6b46e654454997d4857"},c("ifx-icon",{key:"1e17382a9a7f31d5fc014123794ff03f4a141856",class:"check__icon",icon:"check12"})),c("span",{key:"189ad0c20725e685edd62fa6492a0228aa6a04b1"},"Small, Medium, Large, Extra Large size variants")),c("li",{key:"c51ebb9c7236b2618cc91c80cc1c94f57d317569"},c("span",{key:"87bffa5af647ef260a6dd3a8ab6dc238fa966710"},c("ifx-icon",{key:"a17a9c09c9212fca97cc943474ff257fa71600d5",class:"check__icon",icon:"check12"})),c("span",{key:"973b8ff6e3afb1e29c8854364d217285d1a6b8eb"},"Icon incorporated")),c("li",{key:"4ccf865a2983f7cb9138cf3a3cc6e9cf32dff969"},c("span",{key:"77cefee26b22f534dbde0d5f9bf8a6cb0b14e5f5"},c("ifx-icon",{key:"11a44833f0706787425a46266270b93b2658aa72",class:"check__icon",icon:"check12"})),c("span",{key:"c1faf0bfe5ef9cb9fd7b224fde2bc1300eacaf74"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d005d5c1d284a8aef0a7c0acb3e76fc2ad4e8be2"},c("ul",{key:"0a1034032c1675e4d04385164ab8b89ddad5afa2"},c("li",{key:"ce14a7aeafe0d6fe691634fa7beb09a3420ab50f"},c("span",{key:"edbe9cba38cd180a061bd8026def8ef6ebb382da"},c("ifx-icon",{key:"5ca4cc9c3e7800cff4307458ebae18b7a705f0a7",class:"check__icon",icon:"check12"})),c("span",{key:"82e235d541eae112f5637934a6bfb3b8ffd3437c"},"Bold, Underlined, Title, Menu state variants"))))),c("tr",{key:"ed0362554072b69e70fb4ec8c8e53fa4401ece85"},c("td",{key:"989f10e343b60fa1d088fc792f0bba23a01bf697",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"923d3237ebe8d1965b772cd51e5857beeb7b0605",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-modal--development",size:"s",variant:"bold"},"Modal")),c("td",{key:"d79a8dbf935044192f20de032b80f72d2479a9b2"},c("ul",{key:"775e3796a7450971b92878e7aa7ea7e4d474d032"},c("li",{key:"92091085aa83c144a9c39a8d268dd13327c4e25e"},c("span",{key:"d54d51ccbe5064efce330dcb159bcaa1634c308d"},c("ifx-icon",{key:"e9f64ea61ed32b1e5dd5521b5b387e1de42fe136",class:"check__icon",icon:"check12"})),c("span",{key:"3494b2f3da6b0674d6cb270cfb45ee355090cf7a"},"Provides a customizable modal window, typically used for displaying contextual information, user interactions, or additional content without navigating away from the current context")),c("li",{key:"8e73500776cbfba054fe11b5fcf97cccafcf9fe4"},c("span",{key:"1c4a0073ef50803214ee3ad46f258efa51c53cee"},c("ifx-icon",{key:"7338d9c2116cff6110a8a73c9892f7da90507690",class:"check__icon",icon:"check12"})),c("span",{key:"244fd32eb6259e58cf259eaa581df74b30eca771"},"Adheres to webstandards")))),c("td",{key:"d8e6706fa56e53b79723cdd200158f239699b75a"},c("ul",{key:"b82dd7cff6c5253ded0354278cf51c7320aae5ea"},c("li",{key:"5ff5c0dabea5bc973496516ed9492082993a7426"},c("span",{key:"94af1f1aee0940ec504e5715ced98946d6296451"},c("ifx-icon",{key:"052bc462a8c62a35fce5be2c0a27912f5098550d",class:"check__icon",icon:"check12"})),c("span",{key:"56e32c9864d7134a343ab5985c342ab1aa4b3ab7"},"Alert-brand and Alert-danger theme variants")),c("li",{key:"f6ee3ad31012f7dfe2c0cd84ad9a89a6c79fdde0"},c("span",{key:"edf3e99127e3601360bf6ad821e23b8c7193db31"},c("ifx-icon",{key:"793a1120b35c9bc603083263da81c62a3ec44ba6",class:"check__icon",icon:"check12"})),c("span",{key:"c5fd94c0e3b65040f6f8b0b8b573695ab08d6f27"},"Extended customization")),c("li",{key:"86c52eab350851c9035e17ddd71da293e3fd75b8"},c("span",{key:"b557ca45c93f47d4ca4d9f51b8b044c72c921000"},c("ifx-icon",{key:"6eb9195a33ad9b0b1c91162d06c17166727273ab",class:"check__icon",icon:"check12"})),c("span",{key:"39d6c21e6f12f26dfbc0af1ff81560d63693e2ee"},"React, Vue and Angular wrapper integration")))),c("td",{key:"dc1344dee7840d685e83c2d866c3034c139d2a05"},c("ul",{key:"9b6e6f2484652fc22795a68963477824456f33bf"},c("li",{key:"2b99f272a6c94c77cced51cea96ce09c5d6d0f3c"},c("span",{key:"6ab7fe40dbc87f7cd481df936d6ca1c7784a15cc"},c("ifx-icon",{key:"e664c52dfbc4c376722e7ada58b2372e59f1cb3e",class:"check__icon",icon:"check12"})),c("span",{key:"bd4b19b3cb738cca0dfc4a6699d84c6f9834c570"},"Removable close button"))))),c("tr",{key:"6d049f5c7912809e0119a8bbe975545db51d1af7"},c("td",{key:"1240cd38f144fff19d8dac7a1b566aaeca8fd247",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"f76d7023642566e8a1637bf5beb568b6326bf956",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-navbar--development",size:"s",variant:"bold"},"Navbar")),c("td",{key:"20b2dda7c708736f2c372e7648437cd267803af8"},c("ul",{key:"107d96e61b4d89ccb27ca1b2352ab04bc2e30c5b"},c("li",{key:"7d7a7022ad5d01c7f2cdcdeb5b93d6ef22266759"},c("span",{key:"8dc10c5ced36ff35852b7221ff900bf29b9e4c8b"},c("ifx-icon",{key:"d1b6134d3975a723de22955865c14a32b0bd9471",class:"check__icon",icon:"check12"})),c("span",{key:"3ebaf3ce825da6d9328fb0f02821189a5b753c60"},"Provides a standardized and customizable navigation bar for organizing and presenting essential links, menus, branding, and interactive elements within a web application")),c("li",{key:"2ad0cabf3343ca7ebca9a11c9dfba518c75aaaad"},c("span",{key:"7e103726b77bbdb2c3703363f30fd1be5d91d676"},c("ifx-icon",{key:"5f37a8901299d379654d30913c2f6f2a75596987",class:"check__icon",icon:"check12"})),c("span",{key:"80d398bbd71b4f26b1e40a2fb141ae80be9e4a0c"},"Adheres to web stadards")))),c("td",{key:"788ab2a045b8b15f873856239d43891ae8d0cdc4"},c("ul",{key:"1296a642817c717ee06d96a79040932d3b947a61"},c("li",{key:"7d9f69fac56ad363845e285764c9d4c1e8324463"},c("span",{key:"d1dc40bec028f68ab288fc8f7807bfea06356daf"},c("ifx-icon",{key:"905f52cab456aca1ec92485afc97b426098f1f17",class:"check__icon",icon:"check12"})),c("span",{key:"8ff7a39af5990f576802ca51e0c6f2c081f5a33e"},"Navbar-profile component")),c("li",{key:"765c6f18bc72a8bd1ff7aa21070de83fdcafd624"},c("span",{key:"c1879386df1f6a83f8cfd8df3413ad57df2b2e84"},c("ifx-icon",{key:"da74304d6e682154c6fca5fc08e0c36785780e03",class:"check__icon",icon:"check12"})),c("span",{key:"290c2ad59854e3f56b7811905f964e8919df55f7"},"Mobile Responsiveness")),c("li",{key:"64171d2afc68e133fa749d475f9192d0b066b162"},c("span",{key:"988c58e140c792d984a0e4c28b7a227b5ac8a27c"},c("ifx-icon",{key:"3a2dbf26bc5eb463bbeaab95ae635d85e69be31d",class:"check__icon",icon:"check12"})),c("span",{key:"8be83e5939b152cd0a7beb27b024c912edc44f81"},"Mobile Sidebar")),c("li",{key:"910bd61c4036725a5906363932d261020f893a40"},c("span",{key:"2a19020f8da8208190e33651a93d5a4996baf36c"},c("ifx-icon",{key:"c789c4ec2e059c1602803ba6891166faa03ad1c2",class:"check__icon",icon:"check12"})),c("span",{key:"edb13433f9b3c2092d5433c08f3a6def65d60408"},"Extended customization")),c("li",{key:"f4e3610dc125cd3a0756bb516104bcb78ad9e787"},c("span",{key:"c01fbc5ce9412416d175aa3f4c59a81be8eb18a3"},c("ifx-icon",{key:"08b7d47791663beacc4c6336b9148083b8083eaf",class:"check__icon",icon:"check12"})),c("span",{key:"4b09b05e80d57735022102dca5839b4509d42c62"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c13c1be911fe6fcb927400c501854470b96a24d9"})),c("tr",{key:"ceea673e4a653662c942767bdee32c653e59ac6b"},c("td",{key:"85cc3ece97ff52742ef8cf86e4e2234c277b3236",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3c4d7b0d881ae076a631584d8ca221aa31ee5fb5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-number-indicator--development",size:"s",variant:"bold"},"Number Indicator")),c("td",{key:"73280b6a09dd3394fcd7330a480f19f173fb5be8"},c("ul",{key:"3479edcca0e025053b0443e978fd9d0a912eea63"},c("li",{key:"a850a608c313b644d92f3067906e441f4e30bca2"},c("span",{key:"9293d25e8b76f28d851d51abd4ed14b613857192"},c("ifx-icon",{key:"e15590a1be4bc449913429b7a9a21e87d3b09c0b",class:"check__icon",icon:"check12"})),c("span",{key:"bb61b1c257b1de28e8bb277b1533797b879d5d8c"},"Provides a compact and configurable display for showcasing numeric data")),c("li",{key:"76f02d07c01bfe7bce93c55ea5d33d624526cae3"},c("span",{key:"49ed604f634b8dafdb625f309e63f6a702702c1f"},c("ifx-icon",{key:"3e38e7ddeeeb98618856fe246582d6e4e252266b",class:"check__icon",icon:"check12"})),c("span",{key:"b659652556a9152474b6c655463182268321e460"},"Adheres to web standards")))),c("td",{key:"7e5a23fc88be33822417dfd58d6f71a9ee18ddef"},c("ul",{key:"0d7ada8d111b315667dd03dda6f60f886069eb86"},c("li",{key:"624295a6aa0ae1f545fd21c0ee03c0d19127d15b"},c("span",{key:"1101cbc71dbc24f19a28b48b155ba249ba55f1e6"},c("ifx-icon",{key:"a95f4f8425574302c6db6d53d213ccfa96331f35",class:"check__icon",icon:"check12"})),c("span",{key:"698ea73f2eb7a883a1f02979aabe2f7e122feffc"},"Inverted option")),c("li",{key:"e488487e9a7b3bce6b5e69ffb2bdc6f326778452"},c("span",{key:"a6372015b2242d06f56c02e599d518548227c9bf"},c("ifx-icon",{key:"59c572e1b968ba93760670e7a8d0416da153454c",class:"check__icon",icon:"check12"})),c("span",{key:"46428b4c3224520124a9244eb6d754bd52a21e77"},"React, Vue and Angular wrapper integration")))),c("td",{key:"134cb7bf6cfd9492d1f2abd57bda2861cc8b53a3"})),c("tr",{key:"735c0622028687b2bb34207bd5a4023a9cc1623b"},c("td",{key:"fe40a3ebcd4acb6e75652fd349454b4e0c5831fe",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"f6bc1a86b3aa29f0212029b7b121d3cdef038801",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-pagination--development",size:"s",variant:"bold"},"Pagination")),c("td",{key:"ceae9c7e7f5d3487b6c116037950d21c734c0c19"},c("ul",{key:"ca05c8579f3c79ebd85ad1a2589f27dccb6117d8"},c("li",{key:"be241e811ce5546ed4157a8cb5eb95edef5a4326"},c("span",{key:"da6e4b66c8c73927368310215fe1253195ed464a"},c("ifx-icon",{key:"7e6c17ff052d02c1bcf762c2b910ece2b81366f2",class:"check__icon",icon:"check12"})),c("span",{key:"e97404f0c4c74890b2ebaee77ee23d920cefe87f"},"Offers a configurable set of controls for navigating through sequential pages of content, typically used for displaying large datasets or segmented information")),c("li",{key:"5e3edc11ae91cdd995a44dcd83a8e2a68da7b5ad"},c("span",{key:"7de00ce8c26a451459bbfb620eac1841fc484e14"},c("ifx-icon",{key:"22692062e572422b9330081c9732669798753986",class:"check__icon",icon:"check12"})),c("span",{key:"20425b290008f0aaae43823c3d8dc36f97bfdb2f"},"Adheres to web standards")))),c("td",{key:"04cd98b9536ef5fe5d7c566a75f68c13a78045d1"},c("ul",{key:"65b6b4c6d3dd69f3b95890896f7424f40902a882"},c("li",{key:"9f35f64126edee8def6ecf4ba24b8a07938b513c"},c("span",{key:"86492d135567bfd638d73f068def74a881ef5e12"},c("ifx-icon",{key:"41ebf2dafac4008303bca3c56ece5765303e42e3",class:"check__icon",icon:"check12"})),c("span",{key:"8b17f3584446e3caf3e2f46c22595d518a3186f9"},"Extended customization")),c("li",{key:"8d322098bc8a17fde0fe0e2897bc8b4ec90498b1"},c("span",{key:"6d89888decca081f88257376d3b5e798a2833892"},c("ifx-icon",{key:"aa1701d589e176e78c4dde5a4e159e486ce7f855",class:"check__icon",icon:"check12"})),c("span",{key:"70948ea58cc3b5ebfeb94e2b99eea1cdd8a7be2e"},"Configurable Results Per Page option")),c("li",{key:"7878aa5f6e1d9ac3ede094ebc5f5a566bba31b8f"},c("span",{key:"21cd3f84efd03c96850a530d6ede7dc32d2bccc3"},c("ifx-icon",{key:"efa0ad962f2bbc7cd0d88b58006cf47fa25ff18d",class:"check__icon",icon:"check12"})),c("span",{key:"03e28390b38ccd5404aa632ca7d7a7edfc5952d3"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d92ebdc6f6bfe6a39f1e629e92184e7b57094d8e"})),c("tr",{key:"10d670a2b5938bfc95b285e0ce10f7d3f82b7be7"},c("td",{key:"2bb88c2bf014b44b33e562ddba4edc626e644aa0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"30cee15e6ce1aa9ea9d948b1daf3d057fa6db0ec",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-progress-bar--development",size:"s",variant:"bold"},"Progress Bar")),c("td",{key:"d1b8a6b5ca79b2d109ff6ec02d75d269c6bdf95a"},c("ul",{key:"330fdbc5801ead69dc63c98e84abb397a2bb30fb"},c("li",{key:"d751a7d54c7ca3fa92cdb99c020c0874b525a12e"},c("span",{key:"6a1937aef68af58fde21ea2a054cc7a910fe1d1c"},c("ifx-icon",{key:"8b9fa84353dd7eede96289f14955d7f06d48c19b",class:"check__icon",icon:"check12"})),c("span",{key:"f7679d98f57399943107af6c089a859f25cb17af"},"Offers a customizable and dynamic bar that visually represents the advancement of a process, typically used to convey loading status, or task completion")),c("li",{key:"40ddca5e02d896bb692b91a964808530ed38c13d"},c("span",{key:"7b1a9e31cb7326a4264b611dfb80f1302edb9b66"},c("ifx-icon",{key:"93f1cd9d8d867c55ccd761e667f1ea2e4b5915cb",class:"check__icon",icon:"check12"})),c("span",{key:"4f731090c29ef9faaa966620f9039b676d195c4d"},"Adheres to web standards")))),c("td",{key:"f879e6e890e08ab3a1fbaeaf7f51f37310ae0a4f"},c("ul",{key:"2dab3aa105a2b9b353f8de1dcd017c966c033db3"},c("li",{key:"a448723b20929e6753029e1bae5adaba3f4ea6ac"},c("span",{key:"80690c7a05225cdfdb2acf3883e36c9234ccb951"},c("ifx-icon",{key:"758f728349c79c27731a1856424dbdb248c9db0e",class:"check__icon",icon:"check12"})),c("span",{key:"eb457375369a14969989eb1580bcdacb4c1e462f"},"Extended customization")),c("li",{key:"6168caab3e83461653cbf7c531c8651d458f6f81"},c("span",{key:"76b4d2b58be5c07aa1db6adb10f135876f200813"},c("ifx-icon",{key:"e136d215691460b7c66c972404096574108d2636",class:"check__icon",icon:"check12"})),c("span",{key:"52d3874af568198eaa1809211ec8156bc29ac341"},"Show percentage option")),c("li",{key:"3b7d043deef1054c4e0c674d3328eb825c9d23a6"},c("span",{key:"42082c0f6a0187e93a3449ff8108e7c43c373839"},c("ifx-icon",{key:"222f9e44751a87b4fdf2a2fd3c94ea9708adede9",class:"check__icon",icon:"check12"})),c("span",{key:"d722049ca7163dc91bc0ebfc7f7377c189bd7d38"},"Small and With Label variants included")),c("li",{key:"3d98a8da594288c91997a7017019c24c946b92c5"},c("span",{key:"87d3984d263c5d3a957949a914d4be57cbd9ef63"},c("ifx-icon",{key:"1d68711e3ecfcdfaa95b0dc74b9aa292a29b44a3",class:"check__icon",icon:"check12"})),c("span",{key:"2ef74ca7dd7d02845614b33cb361db44afdd0cbd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"1e3c53a7acdfbed5a0a176382f689b18ecc1990c"})),c("tr",{key:"31ef0eda3a188e3f359c92477437573bfb823e71"},c("td",{key:"87fd9146f730c9355963d82ffbcbf74ccb0476a4",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"78d9dce688693ec9fcfc8bbd42f2d92f8dd83843",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button--development",size:"s",variant:"bold"},"Radio Button")),c("td",{key:"03c2230dca9f159e1fbaf07b75b65e76924fbdde"},c("ul",{key:"fafa10102261b7f28d0997abc927f83515f81e4f"},c("li",{key:"498abb51c0df69833554fe95b600f8a0bf69490b"},c("span",{key:"98320b9b38fdc71a10614188cb3a2350d415b3a9"},c("ifx-icon",{key:"9ac8c09106a1efab77b72e492ac38dfee31f6e31",class:"check__icon",icon:"check12"})),c("span",{key:"1f74ecd9e6e1b1e884aa0856c98b1f7f9f5a6f7b"},"Offers a customizable radio input, allowing users to make a single selection from a predefined list of options, typically used for multiple-choice selection or exclusive input")),c("li",{key:"7811ad0db472fd0fed0a997582a4bb1ef033d3ef"},c("span",{key:"90d74040d8b59d2ba6fa46889e3081f638f1efcd"},c("ifx-icon",{key:"0d12f9abf7df468c6d6a509f086af63b502b4c1a",class:"check__icon",icon:"check12"})),c("span",{key:"aff4ea27783f504a42941b3f3842f608c760363e"},"Adheres to web standards")))),c("td",{key:"6e0e773e6f33f74551eb9c5a0cf262c3624901d7"},c("ul",{key:"d187f5bc27305b6f0a4a205feffb28a7d78776a6"},c("li",{key:"be4f644022b36c912c89021726a1d599506be7c3"},c("span",{key:"09acffbaceec535a3d832a8f4693614f96b0c906"},c("ifx-icon",{key:"05a22ca3818b6e1c06e8c2072987deb2db48c428",class:"check__icon",icon:"check12"})),c("span",{key:"90b9257c32467113cf455a6a6492388690fff443"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3563909b26ac0d9385e9c84a6ea5efeee416e3a3"})),c("tr",{key:"622a9a46a2aea8be66228069eb98e885d795ae75"},c("td",{key:"df8dd0328260f6bb31bc8d902ba34264db019b31",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"7cc52c7ebe9696e2953158e1da2483b3259550a5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button-group--development",size:"s",variant:"bold"},"Radio Button Group")),c("td",{key:"b8dfc6856a64577a9f74038a16f0b52c36754ddb"},c("ul",{key:"68756bf193fbe2d7abe115621cf72bd5c1b17861"},c("li",{key:"d0163be54873e18520e1f91ef5cd4f90917cd126"},c("span",{key:"20a8e129d935e5b7cf422351bae10aaeb0f07af4"},c("ifx-icon",{key:"ce8cd2fb9c6c23b88df5c552e4c0935dd1c7f627",class:"check__icon",icon:"check12"})),c("span",{key:"50cef76d540401d1f1b159355a66862b41169904"},"Provides a customizable interface for grouping multiple radio-button inputs")),c("li",{key:"958df4a2c8b45808beec7a881a57f71fbe3c97c2"},c("span",{key:"ce131de94bcf05c1bd619c4fcdd80aa2e03dc0f5"},c("ifx-icon",{key:"d670bdd2c23ed9e04c3824cd8c963a4febb3f9e8",class:"check__icon",icon:"check12"})),c("span",{key:"0f948fe3acf0e56264555e400a399da5c1af0189"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"fe8c152e9876dcbc2086dca22136d02d57185993"},c("span",{key:"e3b28cbc044e016bc289eb9b0d7182cd4e129e16"},c("ifx-icon",{key:"a9bdf53050a8e593f521c129f1a39a1075f57b3c",class:"check__icon",icon:"check12"})),c("span",{key:"938d1c6f76286255e2e2009b2af60316ff8b458f"},"Allows to display individual or group error")),c("li",{key:"311c30b0db3b3b65edfe5642e0e38a47248e2079"},c("span",{key:"fcdc896b401101778cfc81ed6588248b014273a2"},c("ifx-icon",{key:"4fd314040e077ee0447e60675416d50c27bd2f23",class:"check__icon",icon:"check12"})),c("span",{key:"1769793f1dd5a742897b20cee6959f514f88ee70"},"React, Vue and Angular wrapper integration")),c("li",{key:"a26e8731782602a6ff585ed0578d8cc76b1a9746"},c("span",{key:"ab4a45d0af8315a47da7e2a1524d0a9424651bff"},c("ifx-icon",{key:"9ec3a52b57983c2ec3f0fd63345424ea20eea0ad",class:"check__icon",icon:"check12"})),c("span",{key:"a70ba5b4634c17233286de307af37e8425c5cb2b"},"Adheres to web standards")))),c("td",{key:"e9317f29470db6836b1407108e9e1eb74dedcd39"}),c("td",{key:"f0aedae9d4b1523c21c58f2652e9c9a60443c088"})),c("tr",{key:"49a6869b295315cb3b6f3a94f7dc98a3f223b663"},c("td",{key:"211afce6d66e77a2947c9c00768d988704ae374c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"cd5dec22b9cf9cede1d88546d3bc2eb320f919b2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-bar--development",size:"s",variant:"bold"},"Search Bar")),c("td",{key:"6cce1188efdbf0c6c27ca2c4979165478651cce1"},c("ul",{key:"96381b57a29065501ed4173fa4c0db50926103d5"},c("li",{key:"ac0c4cf6d3968a1ba62075611e91311835388849"},c("span",{key:"80d06ff4e119e0e9b2b711e4fb0de98a0e528eab"},c("ifx-icon",{key:"f62b9b97d832f9d8150f286f3cda0615bd4de495",class:"check__icon",icon:"check12"})),c("span",{key:"12bfd63cdcf2ebca4c233f0d895a56f140bfeeba"},"Offers a dynamic and customizable input area that allows users to input search terms and trigger search actions, typically used for querying and filtering content within the application")),c("li",{key:"963dac03d4e327ae2d8c7528fd6ae7b3f1101738"},c("span",{key:"7d359ecde8d4a32732e0bf86ec2ea92fa929e8ae"},c("ifx-icon",{key:"86d2fad653bb6dbd7cb8365324acb4fdfc7131a1",class:"check__icon",icon:"check12"})),c("span",{key:"6cda65c029c7192ebf8f4e74dad72d68eabb5fe4"},"Adheres to web standards")))),c("td",{key:"298d8a75cc80d62f3cfdfe7f6d5bac3524865942"},c("ul",{key:"d197481fb9ed8f565c272b382907fe3675018f92"},c("li",{key:"9d6d5a7ebe9e4975d8fe1d5d64100f777f0a2349"},c("span",{key:"27cdca452bba104149aba359bc3c631ee434f9ed"},c("ifx-icon",{key:"d1337cd3a29e4de380b4c047353541f930b8a344",class:"check__icon",icon:"check12"})),c("span",{key:"cb05c70921dd088aa009bbb74aab6b1b36a5ee71"},"Collapsable option")),c("li",{key:"6af3fb6992bafd078d25f1eb8a5fc568438c077b"},c("span",{key:"71c3201c1bc6aad7707a955621dc81d117139444"},c("ifx-icon",{key:"a5f6036e0a668cea15b88b0a095c7b1ad23435d9",class:"check__icon",icon:"check12"})),c("span",{key:"c2fb1926f150c87e7750b9cdeed5542d948d6f29"},"React, Vue and Angular wrapper integration")))),c("td",{key:"658968c7e70b4090aaf8dce5b156bd9165473f9f"})),c("tr",{key:"e6303bab5d588f7485efe2ce797240e1209c1a96"},c("td",{key:"6c2643b9d74355146aa37003fe40a630220c877a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"1e07784c11eed06ea3037a6ef89e9ab8e55a0c15",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-field--development",size:"s",variant:"bold"},"Search Field")),c("td",{key:"0e7c582bd62d878edccf7caa583de0a7ef549d1d"},c("ul",{key:"75113ddfaa0139019474ddba21318ec36ab5a6f5"},c("li",{key:"2702fddbb446285b7a4d52f603725743eb07d46d"},c("span",{key:"e578ab87a96c65345c45066196f6d210e3782dfc"},c("ifx-icon",{key:"6e2c5a196085414977dfc1f74db5c38706616a8e",class:"check__icon",icon:"check12"})),c("span",{key:"645fcef24893d610607db448ebe4c4100cfb3aa7"},"Offers an interactive and adaptable input area that allows users to enter search terms and trigger search actions, facilitating efficient querying and filtering of content within the application")),c("li",{key:"790eddb62835ea232d46d5f8226936de6fd24d3c"},c("span",{key:"cf7029f7cff8c8778b22e37b449f0211acc3f4c5"},c("ifx-icon",{key:"e6710a7d3734a588b6d88430a171d8809ef228b5",class:"check__icon",icon:"check12"})),c("span",{key:"e86ccfc8cd74ab58f8b14be80ad4fe0a5cd1dfa0"},"Adheres to web standards")))),c("td",{key:"a0322bdef6b033894711d4f4535c5448578b2984"},c("ul",{key:"e5494c7dcffb5cb0165719484f5606b5daea99c1"},c("li",{key:"af383508f5820eeffe13639e145aafaebafd7729"},c("span",{key:"abe3531734dba12d84800dd1a60e52107310a319"},c("ifx-icon",{key:"e6eac85e49641a90ca3f9d409dbe85397742c22e",class:"check__icon",icon:"check12"})),c("span",{key:"140906f76f10a0be0aa258414ef1e2620c39af0f"},"Show Delete Icon option")),c("li",{key:"8b783f9833da03ffbf0da4e4725721c8e41219e7"},c("span",{key:"d3fa765d461c1ef550664464871addf209cafd7a"},c("ifx-icon",{key:"d6eb2a4c74d72dc1371d63a6dc312b2e6e2f9cd7",class:"check__icon",icon:"check12"})),c("span",{key:"84787074a2bf28bdbd07c9158552913e71e1833d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f2790b5adef47e60f51308dc1271e39a23beaa5c"})),c("tr",{key:"e4a0023fc7db84b10de4e8b08a1c0137833a7316"},c("td",{key:"08845963a1e92eabbc87b291821d78cfa1cfbf1a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"56142a69dc1272e488647b72087b4caa7f304da5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-single-select--development",size:"s",variant:"bold"},"Single Select")),c("td",{key:"a0cf7a1f54e7f9f5854771dc722a53d46b0d7f87"},c("ul",{key:"582371f0ccd4840699086a9c9dc99256bd5bd8df"},c("li",{key:"0805caa04e8f05b9b51fc1ae769d8d35ab452747"},c("span",{key:"157efdcf25c9b61f58583d3c50ec633cd0cd8609"},c("ifx-icon",{key:"ecc973eaafd6244d23af4720026e2a14e92f4733",class:"check__icon",icon:"check12"})),c("span",{key:"255aca9567436ebb652d537c4ae6058a8fe14bba"},"Provides a user-friendly and interactive dropdown list for selecting a single option from a set of choices within a web application")))),c("td",{key:"9f8d4dc7b40028e1231f86ac882560843d29d697"},c("ul",{key:"5d3c0d8b24c18939015e2514f1cabe0b92e254ed"},c("li",{key:"fabc35fb610ff175998745fa0b26ed4125d278ef"},c("span",{key:"e4f5f9c802a77d95354caca54649eb46985fb1cb"},c("ifx-icon",{key:"25c245c5ae970ac501a26d0ce350f7aef2d7112b",class:"check__icon",icon:"check12"})),c("span",{key:"be86275565666a7d50fb2716162586de894382e6"},"Extended customization")),c("li",{key:"5579ae45dbac07cfbab1b501a43b794c5987cf94"},c("span",{key:"c703cf597be5ef3a774e7c601e1fa270ab284511"},c("ifx-icon",{key:"0ed38735a0f8307af8b0cd95de7632a171176e9b",class:"check__icon",icon:"check12"})),c("span",{key:"a6ba2f6c572f5cd8a2dbf5ef2ce679afc6c240a4"},"Option to enable and disable the search")),c("li",{key:"6389c7b33f89a0d521644f8476e1a9257f61822a"},c("span",{key:"15bd3c5c1225d329bdb2bfd84aa0c6f97a9462c1"},c("ifx-icon",{key:"a7ff6a3ad991494b15421a2724646e860faba96b",class:"check__icon",icon:"check12"})),c("span",{key:"bdfc247acd303a8d065594773c37f3c3d57f8923"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2a575b56d2e37e92a381f76278d61b64f1585265"})),c("tr",{key:"22e891947cdadbfc6a51a91c6c319ca20978299c"},c("td",{key:"b7a368cc925b50938d1ca4342e0da1fd2e6a18cf",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6a0c1fb269e84299c0df353a093ea678518f1810",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-multi-select--development",size:"s",variant:"bold"},"Multi Select")),c("td",{key:"46ca0c682e7cd1bb1226a66658717536ff8a55cf"},c("ul",{key:"6ae85c025c001dd8027bf753b1f43afcad146cd9"},c("li",{key:"d36a4680c82c0289a00e0507e6274e85538b2996"},c("span",{key:"03b8120cc368c3205c1e31ca183e9247d0ceb25c"},c("ifx-icon",{key:"23eb517f6648b6b6ecf54381d75676e898a74a4b",class:"check__icon",icon:"check12"})),c("span",{key:"6885a6ce93742a388f1c2058860e29e0be531881"},"Provides a dynamic and customizable dropdown list that allows users to make multiple selections from a list of options")),c("li",{key:"ecc03d652e1e4570f9c4b5653fe565ce34ccf1ef"},c("span",{key:"5b6f49d8047e4603ecbf22d801c89324c3a1a146"},c("ifx-icon",{key:"21fa1762df115b0e4a06cadedaa0dcc0e64d551f",class:"check__icon",icon:"check12"})),c("span",{key:"59fa0c05addace458606bcff86a5eb29e013236d"},"Adheres to web standards")))),c("td",{key:"d9ee48306a197520ac597446039f8c62576c148b"},c("ul",{key:"61c0b1af6410e86ffbbcc3ad5744aedac81908ab"},c("li",{key:"8619305a6b217dbf009a1c24d3f9ac42f8b105af"},c("span",{key:"8e497c6e4dd4f8c18b4b26036a26967837d3a206"},c("ifx-icon",{key:"bd4e32b1ef4e5e14e057b603dca9ce2bb9c44f2d",class:"check__icon",icon:"check12"})),c("span",{key:"cc921a22c42ccf41353530331131c423699aaec0"},"Extended customization")),c("li",{key:"795b5f86b3218a8f597ff2f8dc30ba825c96d34e"},c("span",{key:"77c509046a9db2bf5d3f8f704849a2a71a5c79ad"},c("ifx-icon",{key:"7e1526f4eed100352ac15b6845da5f9990acf2dc",class:"check__icon",icon:"check12"})),c("span",{key:"c2de446236561fc588ab00421e42a9352ce79f93"},"Nestable options")),c("li",{key:"9425aadaa17eb25096e3305067800ef2a902fda6"},c("span",{key:"2472c707737effdf10dbb0eef6204db59bae16a8"},c("ifx-icon",{key:"af093b739f13f4e95ad04092313596dd8fbc1cf5",class:"check__icon",icon:"check12"})),c("span",{key:"7a1de65cf67ea9768c5d59813a4558a2b7f6eea0"},"React, Vue and Angular wrapper integration")))),c("td",{key:"5d805fc9522d26bb09ea63de04fb9d951a11b8ef"},c("ul",{key:"97aaa557086e3eba735ad65ff01f77dc685da55a"},c("li",{key:"5bb545fc8d44843a23770a15542b9aa9ae5db678"},c("span",{key:"c26372a6eed2e59f1e80e3f4ae65a92dcc2f20e0"},c("ifx-icon",{key:"b899131bbc146ece50290e707a52e5c577d410b8",class:"check__icon",icon:"check12"})),c("span",{key:"9e64a7be06e497f43fb8e27353e3c52989820f3a"},"Option to enable and disable the search"))))),c("tr",{key:"12dbd10a64863c58495f675e4eb9fd138787c0f0"},c("td",{key:"457e50b76e6e77ef71f3dbf6c538fea339a4216c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"87f4bf098503071f4d691d730b03e7b68daa5ba9",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-sidebar--development",size:"s",variant:"bold"},"Sidebar")),c("td",{key:"b20359e6e3f4cf29a1630417f282b4cec2e5eefb"},c("ul",{key:"9ac5d0dfcb82d96c4fe09295ae3dd3f6f4d1a453"},c("li",{key:"96db9ec3a594ab771efad9e7ca6531adbd74cc58"},c("span",{key:"3913887c83a881b8da5a9944a680d735e3264e5f"},c("ifx-icon",{key:"720e62183810f4c7e0d9a89662eaeca63311cd37",class:"check__icon",icon:"check12"})),c("span",{key:"e999e91c5c21aaa198a1612a2abf4c3ef6f28199"},"Offers a configurable and collapsible panel that typically occupies the side of the screen, allowing users to access additional sections, or menus while maintaining the main content area")),c("li",{key:"e91745365a0cc8d6677e8c8b049bae19f4b74f71"},c("span",{key:"8d5e9cd6ce63bd4063a138c6fdc8d283a9db1f18"},c("ifx-icon",{key:"96e2a7d551a89059b4ccb6eeb96ea7dedeaf4d1e",class:"check__icon",icon:"check12"})),c("span",{key:"2f68377ce5dec85419112caac736483e14a9166f"},"Adheres to web standards")))),c("td",{key:"7d26af0ece28ada4ffd17cd7be4284192a8b2c99"},c("ul",{key:"ad7567e43276e0d773f1fa141303a58712c38b9d"},c("li",{key:"bc836520101d988169fd0d35c6e3b2db4f121182"},c("span",{key:"96e5b581a654cb302090b5ac328c91861a3c2058"},c("ifx-icon",{key:"29d089a11e4b393f878176e98d9e507a5afe9f95",class:"check__icon",icon:"check12"})),c("span",{key:"76807a45806fc9482e3894ab846b3bcf75fc967f"},"Extended customization")),c("li",{key:"b0933eadb90d0080795bacab9e26d21cdf17c596"},c("span",{key:"e7cbe81139b910ee56a4a37dbeb4683e66b05076"},c("ifx-icon",{key:"758412192cc5f10c6bef8ff2411d620a60a9276a",class:"check__icon",icon:"check12"})),c("span",{key:"31a339b29012309275fcf49fbd60abef6432078b"},"Multi-layer nestable items and menu")),c("li",{key:"34af34f74b39789c196aedc51775af81679d98cb"},c("span",{key:"eeae6d75d65fe1ad59cbfd5787fad3eb3458cf8e"},c("ifx-icon",{key:"57276ec92476391756e001ea8a52c39e4119237f",class:"check__icon",icon:"check12"})),c("span",{key:"f2d0c51f4292569a5db2567b7c903187dfadb299"},"Initial collapse option")),c("li",{key:"2d78279739b0c4da656c76f7db0e5a214486dbdd"},c("span",{key:"b5319c4ac174c029d3b753a4f14c87a4db5261d4"},c("ifx-icon",{key:"89f42fd040985c35cca1340d61e0d2dd3f587528",class:"check__icon",icon:"check12"})),c("span",{key:"e386dd7df0f596fa11b1ca89f6030a85987ee277"},"Active and action item feature")),c("li",{key:"3c9f6cc7c86b89c579190856e7162437d7e1f96a"},c("span",{key:"3b21a1056b32d169f7e6d867e25ad9597ece97d5"},c("ifx-icon",{key:"c88cc79575bc74be0092a9c8a37ef0c18245e560",class:"check__icon",icon:"check12"})),c("span",{key:"1e2c6763d8639f066a41f547082312c1b1b234b6"},"Number indicator integration")),c("li",{key:"07ad3f304968fc0716f542700d25c648f409077f"},c("span",{key:"e214322292342ae959e5feca395553a63d7c8e13"},c("ifx-icon",{key:"74412cf34bf091ce6c9e2d46f59b896b3f7ba86e",class:"check__icon",icon:"check12"})),c("span",{key:"6939eefdd02eb2f1dea1d4942c694dc9e40c6d64"},"React, Vue and Angular wrapper integration")))),c("td",{key:"64050d0276d02859725a7b014f401f628fd9c632"},c("ul",{key:"06e760eba7a79db6b5e5495cf5aad970967f575e"},c("li",{key:"e1d0df0532b976170168e4e8bbd0422a9cafc0b6"},c("span",{key:"b7a577602f99ab16d0fa81939acfc58493cb9825"},c("ifx-icon",{key:"48a2c25d921d97fe193b7d1fc39604d6cb2eb37e",class:"check__icon",icon:"check12"})),c("span",{key:"bf83ded35818f348ced9c97c2e4c6d538ac2373f"},"Removable Footer, Header and Logo")),c("li",{key:"a70f291587969fea85d27445f6349710686a4bc2"},c("span",{key:"3603f2e1ca6114423a99a535aee836794a59c59d"},c("ifx-icon",{key:"7e69b718ea44065b032f5a9c2d00b47373a16ca4",class:"check__icon",icon:"check12"})),c("span",{key:"3f663023bb95130366705cdf3dd022035fc34d84"},"Removable and customizable Links"))))),c("tr",{key:"0b16e3f09c194a065fe4980e5a8ead287093a7b6"},c("td",{key:"9640786bed51413188cad47478f31caeb1358089",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a0c6ab9fb9507e686f894b1ff4091a3c96413aa2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-slider--development",size:"s",variant:"bold"},"Slider")),c("td",{key:"36be165d577756ac1f019a495584cc39e6595eb2"},c("ul",{key:"bb30769db429aaea9c8d4818b7f2a7728a4deb96"},c("li",{key:"62f95587477344a573785d0468776b355ef183e6"},c("span",{key:"e304cecb5e97e64614b268272ffec6b4cc3943f9"},c("ifx-icon",{key:"495ba0c350cc49ca4bac7a7442b25c74a528e686",class:"check__icon",icon:"check12"})),c("span",{key:"1179ad8cec70ca7033f6f8d504ce121c322e6d9b"},"Provides an interactive and customizable input control for selecting a value within a defined range, often used for settings such as volume control, data selection, or numerical input")),c("li",{key:"cbf355a13fe61b0616411acc34574ced63c70c29"},c("span",{key:"2ce3302dd178f17096e76820e6f2d5e74ce77627"},c("ifx-icon",{key:"79083246194878147243a4c1bd7e2d7cd04cebc9",class:"check__icon",icon:"check12"})),c("span",{key:"09e5c67f9dce2aebf539ba873cd78d1ef1ace25c"},"Adheres to web standards")))),c("td",{key:"dafc40b637b712940019ec34cd2cea6cc186ed50"},c("ul",{key:"ca5a7bb736cfe00fa081fc935ce358eb521bdbde"},c("li",{key:"82dc358980e90322d8252d6e208eba490121a286"},c("span",{key:"24bb4fd53defe5efd921e785eb9e7c426e582de1"},c("ifx-icon",{key:"8d1398d08e63d0e3545bf7f462afb8b6be3d9fb2",class:"check__icon",icon:"check12"})),c("span",{key:"422742d92e00e8954243f24d96658ef64218c7fd"},"Icon incorporated")),c("li",{key:"d2ad78e5b8341234b7ef0010a2d51b39923072ae"},c("span",{key:"f5ae42396b4abce058ec3cf8b50b6b79e28aa348"},c("ifx-icon",{key:"4e3f223503dca9ca609dbdb454a91a9e36a4e12b",class:"check__icon",icon:"check12"})),c("span",{key:"47899e5e8ff7b60a5ac42dc7283fe8d55b6f506d"},"Percentage variant")),c("li",{key:"e43d01a5c9f826bf7f0f8550359c5156fa2bd0e5"},c("span",{key:"7e36b01f73b830b3ac9ff3230943b1816bb025c2"},c("ifx-icon",{key:"99f11e373dfef19aee13bfa777e23542f0199a6f",class:"check__icon",icon:"check12"})),c("span",{key:"893a64840492f9f0053229b1744ebe8a2f567917"},"Text variant")),c("li",{key:"9911264b7390c10be73b63312b9beeaf263a405a"},c("span",{key:"4a09197b35247ab48906201331b4d26645669833"},c("ifx-icon",{key:"872ef2633cd51fadb89e82df55ad953bda27471c",class:"check__icon",icon:"check12"})),c("span",{key:"815e99934eba63d0fe2cb85c9516eae16740a20c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"5193d43301d1986f467d5ed96570582929983c98"})),c("tr",{key:"27eb14e6435c70859b5e9de57369a31e686939ae"},c("td",{key:"d7944d8dae84ee371e92b0db14f49d42d4de6fe2",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"33d1fb29196334105e04d716374d97a7b3be72bb",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-spinner--development",size:"s",variant:"bold"},"Spinner")),c("td",{key:"f2877a6edab8cd7188c9d98ff22a3c0f49a19b25"},c("ul",{key:"7caa7409deaf2e737bc03ee86dd46af5d180aeef"},c("li",{key:"475fd212f3d7947db83a934ffac76468b92517bd"},c("span",{key:"b8a8e2db3af1c27364af6f5773341b2dedd5bd46"},c("ifx-icon",{key:"dee499dbbf20a82c88d1d5152785c0975abcd992",class:"check__icon",icon:"check12"})),c("span",{key:"666aa04400867c3ea0fd48f629a5a1d8aae3a93f"},"Offers a customizable and animated symbol that conveys to users that a task is in progress, typically used to signify loading content, data retrieval, or pending operations")),c("li",{key:"76a5c772f609d5a68ecfa163d155cc5570b5f0ad"},c("span",{key:"f62f43220ae43ef4bcbeaab45e367748b2eaa699"},c("ifx-icon",{key:"6b736ccfdb1cee74afae63bdeae17df01721ff97",class:"check__icon",icon:"check12"})),c("span",{key:"1036e05378ff6893480ba869cf94f3add63627bc"},"Adheres to web standards")))),c("td",{key:"1a87111caf85bdffc233d7ee41eaf38df26cb4f5"},c("ul",{key:"872b0e34da8723fbc5f773ccf7f55a6253aa4ea3"},c("li",{key:"b8d9f8b2f189ff60b07b8e434086452af36e48fc"},c("span",{key:"af55828215c456d111e2b66f191cdf41c810a91b"},c("ifx-icon",{key:"38b2207a4f105bf13cebaa6bb4a91b26177d2403",class:"check__icon",icon:"check12"})),c("span",{key:"cdcb8ceeb76c85911baf3bfe2957771df272ad56"},"Brand variant")),c("li",{key:"56a8e843e67dab123a84c8cbc38a064b4f493984"},c("span",{key:"a0f494f69ea5729ca48f9e6c8a700005324bf4a1"},c("ifx-icon",{key:"2625e05e7f5a585f109b7e443179481f935e1e29",class:"check__icon",icon:"check12"})),c("span",{key:"f99278ddf8e96907620228942435101a26ab17c4"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d31224ebb7ae167814afcfc4ebcd6c9ff3bcc7cf"})),c("tr",{key:"ead5f2e3ab01dcd9d5a08badc6a55a45520e29ae"},c("td",{key:"0311faba3cadcb581b5cd86d379c0b4630cd306c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ad21bb346fdd4d1d7886272cfd3a248c43d44cf1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-status--development",size:"s",variant:"bold"},"Status")),c("td",{key:"78b96650d6c765360daa2d118083d32f71fa6a75"},c("ul",{key:"73959cc57f483d48103edc3bfd3863465abadac8"},c("li",{key:"1f85512a4712ea331e095f63341a98c73c6e6b6f"},c("span",{key:"2614bb1f16e19b77ef457344d0906944093df0e3"},c("ifx-icon",{key:"65c40d6745a121a2bea258c1111cd16134a94a25",class:"check__icon",icon:"check12"})),c("span",{key:"56c73e1bac7650529421f803430a0de95b65b303"},"Provides a visual indicator for conveying the state, status, or condition of an item, process, or entity within a web application")))),c("td",{key:"d2f6045f63760e635ee1e4c8717dc91fdb5c25bc"},c("ul",{key:"7fd6e4794485910ed4f8c906eff344fd2eb068e6"},c("li",{key:"0278b4860070f99403204d50dce77a54002f6e7f"},c("span",{key:"28b30ca70976ff92e22891426dcb86544ff19f6a"},c("ifx-icon",{key:"a5c75bf154097f7f39fd4943f798b5bae78e1b5b",class:"check__icon",icon:"check12"})),c("span",{key:"4b8e637bfe23fd831b65e95ae8cf24c4248aa701"},"Ocean, Orange, Grey, Light-grey, Red, Green and Berry color variants")),c("li",{key:"f0d0dfa7ce06bd460316d4082bbbad51bdc0fb63"},c("span",{key:"61d6eaaed180f0b9469944a2435f3009c6ab776a"},c("ifx-icon",{key:"2be5bac9e96f8cc6cb5effa0f3ad4a0a18e3d263",class:"check__icon",icon:"check12"})),c("span",{key:"80b76571f49f1c17876e6e354933ccc1320c30b1"},"Removable border")),c("li",{key:"554fb98db1c019f75835f01a33bdc409744a5674"},c("span",{key:"74ad7affab3c8caf5ba8ff909ecffb96c97f3245"},c("ifx-icon",{key:"94346b6d3cd9c25c8638a9f59d658e84740d6c13",class:"check__icon",icon:"check12"})),c("span",{key:"05ba4abaa73adf6a93077c0c3981c8235d7921b0"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c895df22b823d1ae7ddead15603b9ebb81f5a21a"})),c("tr",{key:"0bd38bd7d9ddbd1b96ff65cd38a7055e92f8c44a"},c("td",{key:"880b498142ad576b9bbbea9b5e492e26f3daa41a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"0be1f9b06185148dbef17ad9e7004caa8b65d81d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-stepper--development",size:"s",variant:"bold"},"Stepper")),c("td",{key:"256e36e8f6ec65e664d325b46ef4fd137d5cb203"},c("ul",{key:"2e5a86ce158a6a91b7796340c90629a56ca894c9"},c("li",{key:"538f2d71a914ff6ff5753a34dd66082864c22e71"},c("span",{key:"f36a4fbdedb92d3bcc82d4ddd3f31ef34352e073"},c("ifx-icon",{key:"87bd14994aa0490686894efa6c0245e2d7e96a61",class:"check__icon",icon:"check12"})),c("span",{key:"89217f3eda803752945bbad991524bb9dd47744f"},"Offers a customizable and intuitive control that allows users to navigate through sequential steps")),c("li",{key:"7c4a8d1727731bff22db39bcef5108da9e736950"},c("span",{key:"2925314b267a6012f84acc5c85b3afaeced6c9bb"},c("ifx-icon",{key:"dcf6d5f768371e23fb755659ffba924dd5f14c5c",class:"check__icon",icon:"check12"})),c("span",{key:"8f77a72bb620aa1e7e51c97fc9c356266e331b55"},"Default and Compact variants")),c("li",{key:"26ec50c7cd325259d2bc46ed47195930c30b4131"},c("span",{key:"3925e37868f2fee42baa984f1e551a4948f04beb"},c("ifx-icon",{key:"27afb4f8e908c6d1b7dd49e1e0500de173fe542c",class:"check__icon",icon:"check12"})),c("span",{key:"37ab1386ed657d5ef1a2c37903724fb402cbbcac"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b52588da28e80add8ea5c1e24e108e36112cd825"},c("ul",{key:"692c8c4eb54b15103aa776aa4408351e2c251fe5"},c("li",{key:"450ca66ac9ba7070b3c9a1d0bb0ef74d52be9158"},c("span",{key:"b1cae7ef4895c43a845755d9c1e6c5750d903b58"},c("ifx-icon",{key:"67f2b963e01324b6cfb2e28cae2def62be85dad5",class:"check__icon",icon:"check12"})),c("span",{key:"d919bbeae361a4fef4dfc9defdf43741b737cc52"},"Vertical variant")))),c("td",{key:"5c2d4c727297bfc9a96c1e749a6c8d89d7ecf940"})),c("tr",{key:"c6225443b4bc1147b3fbeee9cf9fee9f6c52e119"},c("td",{key:"030e55b591504c48bcc2187815abe5120886787a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"171fe6710cb488a8583efe2dde01141d8b8536f2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-switch--development",size:"s",variant:"bold"},"Switch")),c("td",{key:"f6124e8169cb851f302181cbaaba216bb464a9d5"},c("ul",{key:"1bb54e5e55c2445c1ce4b9b1dada41134b03f335"},c("li",{key:"4cfd9a4b0444ccf473226ecbcee7049dff07e061"},c("span",{key:"8b4bc02e01c7140ffd6401b9d72fd82911fd7d68"},c("ifx-icon",{key:"3523102bb665afda9726d422028fe1061a961560",class:"check__icon",icon:"check12"})),c("span",{key:"1673eae9f5078a8d828c2f198c735d69f280e3db"},"Provides an interactive and customizable interface for toggling between two states, typically representing an on/off or active/inactive status within a web application")),c("li",{key:"db835a70a037b91653952bde97e8d432a6649470"},c("span",{key:"43a4d310caf85ea1678d689e54a5955228d48098"},c("ifx-icon",{key:"becd748eedb07232562dfedb4f7f2554229dc0ad",class:"check__icon",icon:"check12"})),c("span",{key:"29544bca48351ed03491282838abf58aa89d9ca8"},"Adheres to web standards")))),c("td",{key:"6d588ab53ac96a164f6c25ef992f41015ccb3e45"},c("ul",{key:"8fb26bacacff4a46b798ef36bc6a776b1b040627"},c("li",{key:"7c712d1cd20510ed10b8ec22d484f22befc4b2ff"},c("span",{key:"c7a513018f5b857d71c8fc4774d87f7f66ae51dc"},c("ifx-icon",{key:"b0d41ac5690fcb124e006df83c031bc72a4ba5e3",class:"check__icon",icon:"check12"})),c("span",{key:"7a9bf2ad0462b86348fc199d41e19a95790fd234"},"Incorporated label feature")),c("li",{key:"590dde1603f7805f8b55a3ab23740323e558aab9"},c("span",{key:"75e761bde2ac25bd09c8e81885b9759442116423"},c("ifx-icon",{key:"3d689da9e0b7a8cbfa39e34d68427a9af289c717",class:"check__icon",icon:"check12"})),c("span",{key:"c3178a28fb7a556c1433b94369cea190aa45a5b2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"c1a78bf34d9fdb19853b591d3747e2aec5e803a0"})),c("tr",{key:"7bb37a4dfdb07c412457d6ed8974cb6bffc83890"},c("td",{key:"4d050625890d05b02aaf2f2c679cc524710b9957",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8ff534eaaa216d0c810380300d3f142dab4f781b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-basic--development",size:"s",variant:"bold"},"Basic Table")),c("td",{key:"98be896bb3e2c913bbf3040168b1508e6996e046"},c("ul",{key:"3caa61ea4df08f404ddd686c774af74b67ad2f89"},c("li",{key:"674561354f03c90addea489309f9faf9f09ca64d"},c("span",{key:"f91ea795aacb401d6de3eb5d5dd471daf71e1aad"},c("ifx-icon",{key:"cfe8e298548778777792d58582f6122d78bb4a79",class:"check__icon",icon:"check12"})),c("span",{key:"6574030859eda7346ccf35796d02d5e9cec1d917"},"Offers essential functionality for organizing data into rows and columns, allowing users to view, sort, and interact with structured information efficiently")),c("li",{key:"bd9d8dfd13c338fc59c0834ea2ceaf1c7d822cbc"},c("span",{key:"76d8a6188e63ffd02c05fb1f4d422d135310c846"},c("ifx-icon",{key:"1a53d29366e54086c97e2896cc2d88287cc23f49",class:"check__icon",icon:"check12"})),c("span",{key:"858446164f53d818ee4b6b3d11f642cfd9d8384a"},"Includes basic features such as column sorting")))),c("td",{key:"e112b00573e333b432fd2e78a2c440de1562cb36"},c("ul",{key:"536186a0876a306129bdeec5d78e9d89cb0bfeeb"},c("li",{key:"6abb7a85661d621998f0012498ed2d29471e63ad"},c("span",{key:"0690c84fa6cc5ac058f7d22e406cd35453115df3"},c("ifx-icon",{key:"c2be19d87fdfeb4cd9b838128816efc30989276d",class:"check__icon",icon:"check12"})),c("span",{key:"99b23424ecf843740381fe997574762de11293ba"},"Compact and Default variant")),c("li",{key:"753f716f42e0f412197ccf6d45eea45e07bd792f"},c("span",{key:"9c89a5bf23b2be35969b1a133a4f4675498cc857"},c("ifx-icon",{key:"69fffacd75bf6c57a0cc0897c68447c81dcf825d",class:"check__icon",icon:"check12"})),c("span",{key:"c5056442616596c9584106fb868c6a89c447912c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2d96fff1896b4e76fd1d21a5bf2bfcd8fb6cc293"})),c("tr",{key:"ec2ef01a84d9f58d7149de3bfe511b80e27b5a3f"},c("td",{key:"5c6a60b31d9b0a0aec20f177e7ebecc3bc7d9759",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9bbc0a559270b9a3884d15a29e3e987b8904b921",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-advanced--development",size:"s",variant:"bold"},"Advanced Table")),c("td",{key:"ac4735101d2473ab3e520c8f3cc3635ed091d517"},c("ul",{key:"f15c9d926af80fa15ca35333ee800f3226f27f0e"},c("li",{key:"fd34f848faafed53c9a026c77404c1ddf56c600e"},c("span",{key:"79652bd86f94a21dc7a58755f90a5041c3bbc1c1"},c("ifx-icon",{key:"16609b0e4d53cd3258dbee4eab8ac0fe22248a31",class:"check__icon",icon:"check12"})),c("span",{key:"e72d3d5e193dbb534e9ed6d36f10124d399335e7"},"Pagination")),c("li",{key:"370d55fecc73cd778b5d4da9cb38a07748f4eb94"},c("span",{key:"f6303a14a3168aed05bfc71e4ea6bc991fbae1af"},c("ifx-icon",{key:"24b385d06cdc0dd846cf32401ba950a49ba5444b",class:"check__icon",icon:"check12"})),c("span",{key:"7546d3e8f9383bce9d05535625df7aed2f4c3b5d"},"Sidebar filter")),c("li",{key:"e426a04a31536854d848a66b2fc5353a3671f762"},c("span",{key:"d2101a875913138b16295a96bc8232d6164c0c8b"},c("ifx-icon",{key:"6b4c05f571eef4d18ef71c2a8fd6ca2fe7a40348",class:"check__icon",icon:"check12"})),c("span",{key:"c228fffe98c5155ebb6990aa407a19ff9a1ad794"},"Topbar filter")),c("li",{key:"151e95630e7df5327173ee3e2dc43939d4988526"},c("span",{key:"e3bea51facdbbb9d1a18ea38bbae707314fa7906"},c("ifx-icon",{key:"38460f4db690248a1571b9d04a69443c8be35a53",class:"check__icon",icon:"check12"})),c("span",{key:"c11a18c05f1f79e4716a3914878a28b20b4f1bf1"},"Nestable buttons")))),c("td",{key:"2619fc80f9171f9a44a373026fdd3e7aabb87872"}),c("td",{key:"5306dd72dc6ede8986e478151541561111820a51"})),c("tr",{key:"28993dd316eabc8b698f9aaf443926d8b2c988b7"},c("td",{key:"ce35bad33cf0750f477c5d30a9ca5b385199f991",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3b634813f7f96f8dfb590e57479716a827f08946",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tabs--development",size:"s",variant:"bold"},"Tabs")),c("td",{key:"e82ecebc44c931620028e2c090236e9d1743280a"},c("ul",{key:"d2585e529ed3e13b64524de1eeb96775becc02d5"},c("li",{key:"c9b3736cd901d142e5a124052b366809f51f2ad2"},c("span",{key:"fc1684c651fd003f3493c2c99c716cb98d4e2694"},c("ifx-icon",{key:"3ad1a0c1b9bd947bf57c616775aa8178a11211d4",class:"check__icon",icon:"check12"})),c("span",{key:"423390fb929074112101a328a7c30cc16126b2cc"},"Offers a customizable and interactive layout that allows users to switch between different content panels, typically used for organizing related information or functional sections")),c("li",{key:"1d197a4a2135e4d90c079877bda5f13da719c3c3"},c("span",{key:"f7a1685b35cb4e5816e1127c0fbbdd97b272d220"},c("ifx-icon",{key:"42b5b3d069a73d3eab8c99ea07f4f11dc67e3b0e",class:"check__icon",icon:"check12"})),c("span",{key:"11bcd9ad80b3638d4c9b4da99d871930e693beeb"},"Adheres to web standards")))),c("td",{key:"81d03e4475f1d14602d0050cdad6091d16b60dd1"},c("ul",{key:"c46847e7d13b164d260261e6714f5052ec5543d5"},c("li",{key:"97783acbfff2668208e1298f6d1ab7f2d4a54eff"},c("span",{key:"89f9497237447c3eedd8656f4d0509ac2c2822cc"},c("ifx-icon",{key:"78a72741da482d36201180035f5b397d488be17a",class:"check__icon",icon:"check12"})),c("span",{key:"e51237eecdfa4244de600e0d292de490c7a3f5cf"},"Horizontal and Vertical orientation")),c("li",{key:"6923ec5634b2576c789d50ee745b0cbfa81fbb58"},c("span",{key:"2c930bcd7bf400fb09888d0c43d27e76fd233b27"},c("ifx-icon",{key:"d5b12d7c98361bcd5b9912d1a7d0d8eb919b3827",class:"check__icon",icon:"check12"})),c("span",{key:"696a851a9ad82015ce66d3380315af30fa59c25f"},"Extended customization")),c("li",{key:"bdd565c2d8ab23913dc26cbef7c189d5fb91d945"},c("span",{key:"fd81c95bbac5f5371156ab7a44c7f560e210471c"},c("ifx-icon",{key:"3953b31e90ed684f12e368875cda9922e7f62e4a",class:"check__icon",icon:"check12"})),c("span",{key:"19cb83c91b48477b336bea81858ad91d07c59012"},"React, Vue and Angular wrapper integration")))),c("td",{key:"4b3794a9e1dd61115c89270cd458c39a6e8c6ee9"})),c("tr",{key:"7deb82d435b44d77da39cfcb57ee1deee638fd73"},c("td",{key:"4adaeb6abb7352c4c4a8114ac05453e99e7a1af8",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"8ac9e3cbe8628ae334413da919707b57abc5f7a2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tag--development",size:"s",variant:"bold"},"Tag")),c("td",{key:"638c9ae0a144de252143a941cb4ad5e3be1e830f"},c("ul",{key:"51deca74d116e59a8c05117a1a5c06edbe87d559"},c("li",{key:"047db1420957c0956d39f59841d0a074abfabace"},c("span",{key:"e8fb8efc3cc38c0353597d8ec7cbd4f640565df0"},c("ifx-icon",{key:"c6d748e5be7ab06b3aeeeca4fcf5e00b41442c39",class:"check__icon",icon:"check12"})),c("span",{key:"e66db376974c13e3c6253f87a8cc1f8627a2d963"},"Offers a customizable and stylized marker that allows users to quickly identify and associate specific items or content with descriptive labels or categories")))),c("td",{key:"a7fef143a6382313a256661a6f687003b37e7dde"},c("ul",{key:"c112d3533da2c1120050b44143eae111ee437c5c"},c("li",{key:"9513a3b39b56fd31693a65749b0f0aa2ac5e2aaa"},c("span",{key:"f9a2fac06397d3a1f7668f8519f5fa819cbef0fe"},c("ifx-icon",{key:"4cbec999df87951f37cca83d449b43292a0e94bc",class:"check__icon",icon:"check12"})),c("span",{key:"1993e486a5a4e7e7c43eddcda9e4ff5711a3245d"},"Icon incorporated")),c("li",{key:"02e06f84954390d2a38b7d03ae8e060e0c9a403e"},c("span",{key:"72026bdf5228a33bd7baa4a8495767bd03406e34"},c("ifx-icon",{key:"1cb8471b5d08042eaae787f78c24f29e889b9eb4",class:"check__icon",icon:"check12"})),c("span",{key:"c508eb1d63d1c4d108fe8ceab58b0c0d4372dc87"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0ec02891636ee3a364d463ce38e3a308769c620e"})),c("tr",{key:"9e3e748bbbccba9acedcdf43a6d6799752625cd0"},c("td",{key:"5c129ef35c3402123fbf03069f49bb6380c35b7c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"7c7706f4b0829428e51af85218f2c7ae89966086",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-text-field--development",size:"s",variant:"bold"},"Text Field")),c("td",{key:"b4ded3dd01ba0ceeeb3349e9cd8ff836012ddf89"},c("ul",{key:"cdc7f039a2d727548796318f4b026c4bda1225d6"},c("li",{key:"3c06014996206e4d16a662f1a5482a37dad71404"},c("span",{key:"5146adecfaad61c04485b425af836c7e6e5f8754"},c("ifx-icon",{key:"d0a7c1626c9dd8bb4a37ba545aa38f29fdeb6c03",class:"check__icon",icon:"check12"})),c("span",{key:"24adc1b318c762f2681959c20fe0429d3693401f"},"Offers a customizable and accessible interface that allows users to input and modify text, facilitating various data entry and form submission tasks")),c("li",{key:"d4485858ff4769c0ad323a66cb8058f183bb7991"},c("span",{key:"e72b9efab3cbf3c76186df3a8b378721ef95a347"},c("ifx-icon",{key:"9427b48de2a1e4be7d3d1454b703cd6076c56a97",class:"check__icon",icon:"check12"})),c("span",{key:"298aa2823881713d16d27ceb7879ceb20b61ed24"},"Adheres to web standards")))),c("td",{key:"639401c681fc575fd1d4fb8d05e3f8645e13c7a8"},c("ul",{key:"cb672d7e5a821c88db64465eb50d4f4d5dfc4551"},c("li",{key:"82484f24c26cb07a0f6f0620f1912f806f1c9ab8"},c("span",{key:"e2c757c2a1a202ccedfba660546390eea21237a5"},c("ifx-icon",{key:"1935672993c37be6c996482b6e5f2320a17edc75",class:"check__icon",icon:"check12"})),c("span",{key:"8876659fa5a5bba5d2b0b059229ab21209b41051"},"Extended customization")),c("li",{key:"bd8e401c10de7d7c2fd7f93d3b3e11598da791e5"},c("span",{key:"96938b475fa6465ebf7bb146c3cecbfeed86ad62"},c("ifx-icon",{key:"2052929ce16b43852949845c1f342e7206c17c71",class:"check__icon",icon:"check12"})),c("span",{key:"bfab3b113540bcd443c970d83f07b250a71b1999"},"Possibility for icon configuration")),c("li",{key:"733c597444e588671f467ca65652acef9daac04f"},c("span",{key:"7a9feef1106bf615d50182e19a7c522c50dcd031"},c("ifx-icon",{key:"88808bc5be8724458b62223bbd7910eadda29b70",class:"check__icon",icon:"check12"})),c("span",{key:"bebb762b4c691886ff09118d263bea13e502c67a"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f9285a8a3f765bf7ca9f0dfde19c2d278488bd9d"},c("ul",{key:"f0fe3a47f4096c38bff48809e7b6e39512412433"},c("li",{key:"6015e05aef3d67e09f8432c4688c0074f3b1080b"},c("span",{key:"a458010647ba994a87f75178ad2ca0b5b32389e7"},c("ifx-icon",{key:"6902054bde46c2b917ad6189f2e0e2ff3cd3261b",class:"check__icon",icon:"check12"})),c("span",{key:"7d81c75efbd79d2adfc92d7c5878392cf67253d3"},"Form integration"))))),c("tr",{key:"594dd71a08bee563687c60c3d7f7c739ba377e21"},c("td",{key:"ae01ae298b333c60e74361b338cd52352cdbcb96",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"b19b7c8bb06a21dc0b6eab7f236208ec99b47d37",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tooltip--development",size:"s",variant:"bold"},"Tooltip")),c("td",{key:"c51aa4874d8353082870243f02f56f1a99646c36"},c("ul",{key:"b2f24b41951a573335da4abd8530325e7a871477"},c("li",{key:"60596a17e5af3f2f84de121ad322d4bf8e793f69"},c("span",{key:"ff7214224e7cb29ea884d2bc6b5aa884d5599abd"},c("ifx-icon",{key:"5d0282e4e02c351a14179342b7edc14b6c02bbd9",class:"check__icon",icon:"check12"})),c("span",{key:"fa7ec9a3b8da6acf74a8036cc3770ef6b03aeeee"},"Provides a simple and informative interface for displaying supplementary text or contextual information when users interact with specific elements within a web application")),c("li",{key:"d6f9310690093ffb9ea7fb80dee7577070d57063"},c("span",{key:"2f4847f8f5e6b8911a8c34e1d55bc78c45773eed"},c("ifx-icon",{key:"88c5756b97cd19236d627544231d7affa6c4cb16",class:"check__icon",icon:"check12"})),c("span",{key:"d6d33b9cc220e1d94b77eb7f6be8dbe3761cb25c"},"Adheres to web standards")))),c("td",{key:"a5ae4d13ebc706e0534112fe08a74024438cf114"},c("ul",{key:"fa1ecace2641f777278e7b6ae52d36f4ffe0532c"},c("li",{key:"399baf22ae2f1a4702e2b38b511de11ce8a7bcba"},c("span",{key:"517d110a5b33c58e1af852581e2f4107bf8ee299"},c("ifx-icon",{key:"9aa920f4178cd7f1b83be08717924746b683b760",class:"check__icon",icon:"check12"})),c("span",{key:"9db0342549a618344c871d3d918130c3ec70a697"},"Compact, dismissible and Extended variants")),c("li",{key:"3f5dc52e653f3f8507d7fecf003a92d75bee6d6c"},c("span",{key:"692ca5f094677bd810216df35741270201341465"},c("ifx-icon",{key:"086f57242ed4c1c40079c0735315426b295e3b34",class:"check__icon",icon:"check12"})),c("span",{key:"99dbacc6d925707c997ced5ca933f35e695d6daf"},"Auto-adjusting position")),c("li",{key:"7fb9a82325635e0ae39cf0311790721e380cc2d0"},c("span",{key:"dcece30cd17df6cfeec32884e43a051dc9df070c"},c("ifx-icon",{key:"4df349fbc60cfb3bc6ab48ff0ef6d94d9b2c3327",class:"check__icon",icon:"check12"})),c("span",{key:"1b6a40decf920fc9483105f87247abe0b8bed768"},"Icon incorporated")),c("li",{key:"4bab81a7511b2b80503a8484a522ca63c4e89c4f"},c("span",{key:"31303d7e5b51afa9c6783cf2d9ba30c463a845a7"},c("ifx-icon",{key:"ac0c85c0fe667093ebcbe0cf8258abfa40f48aa4",class:"check__icon",icon:"check12"})),c("span",{key:"5578af07c62225dbfce6ce281f254918ad896342"},"React, Vue and Angular wrapper integration")))),c("td",{key:"90e7c05b7f7f81206f0ce3abd881135468b1a602"})),c("tr",{key:"2d907f1d4a86c53f3c3c971e32320c115b0ba299"},c("td",{key:"639a02aa9efcd7a5d9463a0c9fcade8f543fe1e1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"673577a60376edeaec3997d3cc1872f9c01f021d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-notification--development",size:"s",variant:"bold"},"Notification")),c("td",{key:"325966e3f9363dbde31bd8f73c5285a64351effb"},c("ul",{key:"d3343f18ab579f70de6b31044a9df5a5d6880171"},c("li",{key:"3626a831f48357ee5c7d0e0965de8515930100d5"},c("span",{key:"6cf42139f65c76b0006e84ee6664dcff490284f2"},c("ifx-icon",{key:"4c72c6bd339ef2c61596d02f163d65b01dd6a6de",class:"check__icon",icon:"check12"})),c("span",{key:"435e219cd9e8c4a588fd7f2d19d44ee23b07c4b6"},"Offers a flexible and visually distinct container for presenting informative, warning, or error messages to users, enhancing the overall user experience with timely and relevant feedback")),c("li",{key:"51c5d311b0056ee3513d16000454b46873d3bb0a"},c("span",{key:"3281e26fe7df7a2a398d09de30cb2c88aaa97a47"},c("ifx-icon",{key:"11c4f2d01f29ffaf7ccc96a49dc9bba424f7c530",class:"check__icon",icon:"check12"})),c("span",{key:"38e1ec4ba102165e2b4582485574c32cac6f8bf9"},"Adheres to web standards")))),c("td",{key:"4e7ee5cd0c528348e52901214b92819422af8e85"}),c("td",{key:"dd85d4144e744b05fd1066744409e31bf33440f0"})),c("tr",{key:"94eb03015e7e43184db94985a0d16b04b6b13036"},c("td",{key:"e8bcfe7dd0d5a03f50d00ebedb080c119e6c5c9b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"712000ca37fdd25c159fe92cc568047ce8bce341",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-content-switcher--development",size:"s",variant:"bold"},"Content Switcher")),c("td",{key:"ce0a073736cec07b819894a8c90f80c75275f307"},c("ul",{key:"95851f1e877569ef4badd93b685e43c0b7a60c2a"},c("li",{key:"11c8b74bfcc301f2a5a17e2c09f8628f118c85d4"},c("span",{key:"4955fd30b70101ed0547d6f749f0a0a24a68f31f"},c("ifx-icon",{key:"db90d5dc20b544ba3a2ca6dd42b08c358c541172",class:"check__icon",icon:"check12"})),c("span",{key:"824712d51e9ce22bb2be11aecdd4b523030da36a"},"Provides a flexible and intuitive interface for dynamically switching between different content sections or views within a web application")),c("li",{key:"7665f2f05c5ee6549e2ff36263fd26cab6b2ecf6"},c("span",{key:"13a73dd4f58083af918ea51e61c0f817ec86393d"},c("ifx-icon",{key:"73a6495e999453ab7f2132c9a77c0290d48eeaad",class:"check__icon",icon:"check12"})),c("span",{key:"35e21baab1ee556df9d8f02433c40f978b4179b8"},"Offers a customizable mechanism for users to toggle and display diverse content panels, facilitating seamless navigation and interaction with varying information or functional contexts")),c("li",{key:"7cdd4b988bf566d7da37cb80729f08839da5a295"},c("span",{key:"0e5f04feb0090341556d98680daf8e9059fea39c"},c("ifx-icon",{key:"3ae093e8bfd46560904aab9dbbc7936f06e2c153",class:"check__icon",icon:"check12"})),c("span",{key:"dd622e7266dc28cea856c59bd87a1f9ce0bf22a5"},"Adheres to web standards")))),c("td",{key:"21be26840d1e6cdd0946a4adbe13eafddc02638b"}),c("td",{key:"941a67e5c7bd0819080ddc37274efed1e7141b91"})),c("tr",{key:"edcd0b7a7d60784430debbea5b8a37fa1eecc381"},c("td",{key:"43aeda0a50173fa76588ec092e04052e95c78864",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"474e409bfea3b43d50eb094a0df096ee20e67c77",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-control--development",size:"s",variant:"bold"},"Segmented Control")),c("td",{key:"f09c4f24cca74dee36bb07f103272d65dad5b7f0"},c("ul",{key:"cf2faeb646298eb3a937a3a7714e94c7a5a001fb"},c("li",{key:"7356207aba8229aa038603f9f172c6a1b7783754"},c("span",{key:"98b0a83dc9474c04b5c90894241033ea0f606472"},c("ifx-icon",{key:"f927a4fecbdb6a0d1068261bbcf0c9b97627ce30",class:"check__icon",icon:"check12"})),c("span",{key:"6c18d697a1d38d5aa4863a23c1df106da747804c"},"Provides a clear and interactive interface for users to make mutually exclusive selections among multiple options within a web application")),c("li",{key:"9b9c682d37c0e9efac81b5044274029e9a69fb38"},c("span",{key:"4fb1009d19fb8157e7a814affe69f0337d925e7c"},c("ifx-icon",{key:"b78ba9ef29da12bd74aa0b6ea002f48cc939e6ec",class:"check__icon",icon:"check12"})),c("span",{key:"06f53119e0f03dd7ad5f303bf51ee6ca84a6a4bb"},"Offers a customizable set of segmented buttons or tabs, allowing users to toggle between different choices or views, typically used for filtering, categorization, or navigation purposes")),c("li",{key:"7b412dfa370306fd44ac822fd52f89cb01e0663b"},c("span",{key:"8bec06fb87478efc47fdcceac2f78f80c7274297"},c("ifx-icon",{key:"f7ea20e98594669eb5fa243bb4c6264a90920369",class:"check__icon",icon:"check12"})),c("span",{key:"47d55f15558fe445a34e4e9f542de9547a066aa2"},"Adheres to web standards")))),c("td",{key:"35712d605cdeb36aa1c520e74f5a9e702788be37"}),c("td",{key:"d2838bad05f99d41d2d18fc9d5de6167b8c14384"})),c("tr",{key:"e920065b9118aec6cd3f02ef328e55ec3316164a"},c("td",{key:"26c9d459553337397d851e273ce08f3900561c4e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9faa7e711754e8f2e818a8499b1e72dc9cfa04b1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-controls--development",size:"s",variant:"bold"},"Textarea")),c("td",{key:"281ddf1ab6c7218d63ba7cd3ef9632a223e9f5cc"},c("ul",{key:"74328408dfa6121b00b449ce04c9368841f642bc"},c("li",{key:"fbc2771eca41b01363d56ec0cd0699c8aef73e21"},c("span",{key:"970125cb3b375d1ac221f601013cc38122708a48"},c("ifx-icon",{key:"d048e97ba534a8dc627d42e958c0786733835df2",class:"check__icon",icon:"check12"})),c("span",{key:"f19ff879fce8a36144d9fc792a661fdcf00612ec"},"Provides a customizable multi-line text input interface, enabling users to input, edit, and view large amounts of text, while adhering to web standards for accessibility and usability.")),c("li",{key:"94ec253422332db71e275707d272b94e8794cc13"},c("span",{key:"be93a877985ed0002d00b0a2d6db1fb120f3c5a9"},c("ifx-icon",{key:"2d243ee9c5ef5ecf5d1c6f60709585b85e4a04fd",class:"check__icon",icon:"check12"})),c("span",{key:"015dd79ee0ecf209b5898a3dcab1624df6f5204f"},"Form integration")))),c("td",{key:"c759a92b761fdd164216e148ab93ecd18b685de8"}),c("td",{key:"76369690ccebe44fe4de0feeaec4c899407b38fd"})),c("tr",{key:"4e76c1cc70b0c092e3047da4e0ed021ae11cfc09"},c("td",{key:"5911307a6c22e28e63651c215ebcb43d2e8c3407",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"d1779a2f7b3d0a90794a30dd31402ce0d9beeb64",href:"",size:"s",variant:"bold"},"Card Group")),c("td",{key:"a530d3cec1d5ed3624ca6235845b9568a443b031"},c("ul",{key:"2635ba22858219e525ea33bf4d27442cb72b065f"},c("li",{key:"2151e1c1fa5686c343f002acc33dcabcc3823014",class:"planned__component-wrapper"},c("span",{key:"31b2a002407a8a7203cb7edb5e860079c8d50530"},c("ifx-icon",{key:"010bdf79637e90114bb8cdf9604ce876dec3c7cf",class:"planned__icon",icon:"clock24"})),c("span",{key:"f23fa62cd7c965fe97c9fa2d64639926b2708b01"},"On Hold")))),c("td",{key:"a573db14579be40dd3dcc4949abd24e499cc86dd"}),c("td",{key:"1c07bfa238cae1308d8f33620e08ac644e1cdc44"})),c("tr",{key:"bb63b1bf0d82799ed5742a782086a0e722fc0315"},c("td",{key:"7c3e0e454619c56876247bab138c67098cf50b33",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"eb2fb476a6dc990000ab4d62ddc94f814edef982",href:"",size:"s",variant:"bold"},"Upload")),c("td",{key:"b620cda7b4c4e16816d850b3d590209abbec29b8"},c("ul",{key:"9500db182fa5b12086afdab761ebb068fcb6d0e7"},c("li",{key:"65feb684f0d18d830b2aa1d9784a0aa537dc4521",class:"planned__component-wrapper"},c("span",{key:"1e90a76d5793be9cdeaaf64894411ffca5172a64"},c("ifx-icon",{key:"6ec66ba93d4ce1c11d42ddbb39ddaff003b227f1",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"5d269f01d8676269c3a65ecb55ad408c37b10ef3"},"In Progress")))),c("td",{key:"486bea8ed7c5476eb81ddc54dfd4415cadcc4d55"}),c("td",{key:"12f0452e5962cb20f2ab1eed0f191b4db8dd1681"})),c("tr",{key:"684539d330e1b47c5ae040ee95492abf0d955893"},c("td",{key:"9b6a2b94e62e68bf243bebf78d4cb67639d532f2",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"98f168ab97d678e4cde535418e691767f10b40c9",href:"",size:"s",variant:"bold"},"Tree View")),c("td",{key:"3a5bf65543c7eba63c239296877b12912071c964"},c("ul",{key:"27aa577d94e9dff4a5f0ff4c582c3fcf837e6711"},c("li",{key:"47b8742bfca6f2241f0e039fcc30c2ab1c17dc48",class:"planned__component-wrapper"},c("span",{key:"3bc559329d1be175fcbf4c3f4dfe46307654eca6"},c("ifx-icon",{key:"63c7187341332484bd29820de79d076ba9dc327c",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"e52af8f2757bef605dee6e24def0fd559b02b6e1"},"In Progress")))),c("td",{key:"59a01018836f0d72e89aa920173959af0cab26b6"}),c("td",{key:"f02a0b785cc92c3e796f6146f820aede09febd39"})),c("tr",{key:"f079dfb52646b2ffead3d8693e44f4bffcb66161"},c("td",{key:"2e9aea2e08bf5a5ed070ed9cdfb4b237fb1efcbf",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"d3ca6ec81491a0510b56480cb4e43e472d53ff5c",href:"",size:"s",variant:"bold"},"Popover")),c("td",{key:"8f1f58114930058217f7325dc80d71680bce6133"},c("ul",{key:"d62260a70bcc0f06fc3ca8b40bc96ad9605bc00e"},c("li",{key:"282d1b21726e45ee56a8d2d58657c87d1d6d3e52",class:"planned__component-wrapper"},c("span",{key:"6a62841eea9617edbd663e6871b6eaed4ad0bf26"},c("ifx-icon",{key:"88637171a026eb6c10a177084d764aa554f5527d",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"a200dad83524b9c09b7ea1dff3eef690b9c99671"},"In Progress")))),c("td",{key:"632a4879645a6a752e0341391c78bad2003105bf"}),c("td",{key:"b031da3c35bd85b24e7257d063bc8ca8e0f6a7e5"})))))))}get el(){return a(this)}};b.style=f;export{b as ifx_overview_table};
2	+ //# sourceMappingURL=p-1b59a7f9.entry.js.map

package/dist/infineon-design-system-stencil/p-1c19f8ce.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as s}from"./p-e6edf72d.js";const t=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex;width:100%}.progress-bar{height:16px;bottom:0;right:0;top:0;left:0;display:flex;height:20px;border-radius:1px;width:100%;overflow:hidden;background-color:#EEEDED;font-family:var(--ifx-font-family, sans-serif)}.progress-bar.s{height:4px}.progress-bar .label{font-style:normal;font-size:0.875rem;font-weight:400;line-height:1.25rem;color:#FFFFFF}.progress-bar .progress{display:flex;align-items:center;justify-content:center;min-width:fit-content;height:100%;background-color:#0A8276;transition:width 0.2s ease}';const r=t;const i=class{constructor(s){e(this,s);this.value=0;this.showLabel=false}valueChanged(e,s){if(e!==s){this.internalValue=e}}componentWillLoad(){this.internalValue=this.value}render(){return s("div",{key:"e1978cda672a5b004cd0520c099041172ec5e819","aria-label":"a progress bar","aria-value":this.value,class:`progress-bar ${this.size}`},s("div",{key:"2e9094099e63479b88f5b832ec55f5eb51ab0d13",class:"progress",style:{width:`${this.internalValue}%`}},this.showLabel&&this.size!=="s"&&this.internalValue!==0&&s("span",{key:"d7f1ecd1109f03379ffa36626e27f50f9ef7ca72",class:"label"},`${this.internalValue}%`)))}static get watchers(){return{value:["valueChanged"]}}};i.style=r;export{i as ifx_progress_bar};
2	+ //# sourceMappingURL=p-1c19f8ce.entry.js.map

package/dist/infineon-design-system-stencil/{p-32b1a855.entry.js → p-1de4f93c.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,h as t}from"./p-e6edf72d.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.step-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;gap:8px;font:400 1rem/1.5rem "Source Sans 3"}.step-wrapper.vertical{flex-direction:row;gap:12px;width:unset;height:100%}.step-wrapper.vertical .step-icon-wrapper{flex-direction:column;width:unset;height:100%}.step-wrapper.compact{gap:0;max-width:100%}.step-wrapper.compact .step-label{max-width:100%;cursor:auto;align-self:flex-start}.step-wrapper.compact.indicator-left{align-items:flex-end;text-align:right}.step-wrapper.compact.indicator-right{align-items:flex-start}.step-wrapper .step-label{max-width:90%;color:#8D8786;word-wrap:break-word}.step-wrapper .step-label.curr-label{font:600 1.25rem/1.75rem "Source Sans 3"}.step-wrapper .step-label.next-label{font:400 0.75rem/1rem "Source Sans 3"}.step-wrapper .step-label :hover{color:#8D8786}.step-wrapper.first-step .step-connector-l{height:0px}.step-wrapper.last-step .step-connector-r{height:0px}.step-wrapper.vertical.first-step .step-connector-l,.step-wrapper.vertical.last-step .step-connector-r{width:0px}.step-wrapper.complete .step-connector-l,.step-wrapper.complete .step-connector-r,.step-wrapper.complete .step-icon{background:#0A8276}.step-wrapper.complete .step-connector-l.active,.step-wrapper.complete .step-connector-l.error,.step-wrapper.complete .step-connector-r.active,.step-wrapper.complete .step-connector-r.error,.step-wrapper.complete .step-icon.active,.step-wrapper.complete .step-icon.error{background:#8D8786}.step-wrapper.complete:not(.disabled) .step-label{cursor:pointer;color:#1D1D1D}.step-wrapper.complete:not(.disabled) .step-label :hover{color:#08665C}.step-wrapper.disabled .step-connector-l,.step-wrapper.disabled .step-connector-r,.step-wrapper.disabled .step-icon{background-color:#8D8786}.step-wrapper.disabled .step-label,.step-wrapper.disabled .step-label :hover{color:#8D8786}.step-wrapper.active .step-connector-l,.step-wrapper.active .step-connector-r,.step-wrapper.active .step-icon{background:#0A8276}.step-wrapper.active .step-connector-l.active,.step-wrapper.active .step-connector-l.error,.step-wrapper.active .step-connector-r.active,.step-wrapper.active .step-connector-r.error,.step-wrapper.active .step-icon.active,.step-wrapper.active .step-icon.error{background:#8D8786}.step-wrapper.active .step-label,.step-wrapper.active .step-label :hover{color:#1D1D1D}.step-wrapper.active.complete .step-label{cursor:auto}.step-wrapper.clickable:not(.active) .step-label{cursor:pointer}.step-wrapper.error:not(.active){color:#CD002F}.step-wrapper.error:not(.active) .step-label{color:#CD002F}.step-wrapper.error:not(.active) .step-label :hover{color:#0A8276}.step-wrapper.disabled .step-label{cursor:auto}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon{background:#08665C}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.error{background:#8D8786}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-label{color:#08665C}.active-indic{width:16px;height:16px;border-radius:9999px;background:white}.step-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%}.step-icon{width:24px;height:24px;background-color:#8D8786;border-radius:9999px;display:flex;align-items:center;justify-content:center;color:white}.step-connector-r,.step-connector-l{height:2px;min-width:40px;flex-grow:1;background-color:#8D8786}.vertical .step-connector-r,.vertical .step-connector-l{height:unset;min-width:unset;width:2px;min-height:40px}';const p=r;const s=class{constructor(t){e(this,t);this.complete=false;this.disabled=false;this.error=false;this.lastStep=false;this.stepId=1;this.stepperState={activeStep:1,showStepNumber:false,variant:"default",indicatorPosition:"left"};this.clickable=false}onStepChange(e){const t=e.detail.previousActiveStep;if(t===this.stepId&&this.error){this.clickable=true}}updateCurrentStep(e){this.active=e.activeStep===this.stepId}updateErrorState(){if(this.active){this.error=false}}handleStepClick(){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)){this.stepperState.setActiveStep(this.stepId,true)}}handleStepKeyDown(e){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)&&e.key==="Enter"){this.stepperState.setActiveStep(this.stepId,true)}}stopOnClickPropogation(e){if(this.disabled){e.stopPropagation()}}render(){return t("div",{key:"364a032e686431e9133a02a19e52862acc9b23b1","aria-current":this.active?"step":false,"aria-disabled":this.active||this.complete?false:true,onClick:e=>this.stopOnClickPropogation(e),class:`step-wrapper ${this.stepId===1?"first-step":""} \n                        ${this.error?"error":""}\n                        ${this.stepperState.variant}\n                        ${this.complete?"complete":""}\n                        ${this.lastStep?"last-step":""}\n                        indicator-${this.stepperState.indicatorPosition}\n                        ${this.active?"active":""}\n                        ${this.clickable?"clickable":""}\n                        ${this.disabled?"disabled":""}`},t("div",{key:"518a0ac21fe3528bdee9fafe1f467489bdaf5aed",class:"step-icon-wrapper"},this.stepperState.variant!=="compact"&&t("span",{key:"b0552bdebbdfecc2b6d3f0151619af9260d77b80",class:"step-connector-l"}),this.stepperState.variant!=="compact"&&(!this.error||this.error&&this.active)&&t("div",{key:"8d30112a289f31a2170db9c07f0395f59a1b0148",class:"step-icon"},this.stepperState.showStepNumber&&!this.complete&&!this.active?this.stepId:"",this.complete&&!this.active&&t("ifx-icon",{key:"044f676e8df2d0fcc1f3b78afdbc6794d0c45e5b",icon:"check16"}),this.active&&t("span",{key:"5c53fc0e1b0f60c89897823cae0b1d78ee849060",class:"active-indic"})),this.stepperState.variant!=="compact"&&this.error&&!this.active&&t("ifx-icon",{key:"d23979508dd93d22f3fb3d233382a2d12a8dae4e",icon:"warningf24"}),this.stepperState.variant!=="compact"&&t("span",{key:"6f526e33d4267627df881b5f7db3f13b4fb3b8f3",class:`step-connector-r ${this.active?"active":""}`})),(this.stepperState.variant!=="compact"||this.stepperState.variant==="compact"&&(this.active||this.stepId===this.stepperState.activeStep+1))&&t("div",{key:"09e2b7c9a12e067578b8f21a4f0776ea6cef21be",tabIndex:!this.disabled&&this.complete&&!this.active?0:-1,class:`step-label ${this.stepperState.variant==="compact"?this.active?"curr-label":"next-label":""}`,onClick:()=>{this.handleStepClick()},onKeyDown:e=>{this.handleStepKeyDown(e)}},this.stepperState.variant!=="compact"&&t("slot",{key:"de42efe1e5494ae851c8166f10b13b139668a497"}),this.stepperState.variant==="compact"&&!this.active?"Next: ":"",this.stepperState.variant==="compact"&&t("slot",{key:"57f8bf9ce42bea19041696d594dd5407cc1b4ed9"})))}static get watchers(){return{stepperState:["updateCurrentStep"],active:["updateErrorState"]}}};s.style=p;export{s as ifx_step};
-//# sourceMappingURL=p-32b1a855.entry.js.map
+import{r as e,h as t}from"./p-e6edf72d.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.step-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;gap:8px;font:400 1rem/1.5rem "Source Sans 3"}.step-wrapper.vertical{flex-direction:row;gap:12px;width:unset;height:100%}.step-wrapper.vertical .step-icon-wrapper{flex-direction:column;width:unset;height:100%}.step-wrapper.compact{gap:0;max-width:100%}.step-wrapper.compact .step-label{max-width:100%;cursor:auto;align-self:flex-start}.step-wrapper.compact.indicator-left{align-items:flex-end;text-align:right}.step-wrapper.compact.indicator-right{align-items:flex-start}.step-wrapper .step-label{max-width:90%;color:#8D8786;word-wrap:break-word}.step-wrapper .step-label.curr-label{font:600 1.25rem/1.75rem "Source Sans 3"}.step-wrapper .step-label.next-label{font:400 0.75rem/1rem "Source Sans 3"}.step-wrapper .step-label :hover{color:#8D8786}.step-wrapper.first-step .step-connector-l{height:0px}.step-wrapper.last-step .step-connector-r{height:0px}.step-wrapper.vertical.first-step .step-connector-l,.step-wrapper.vertical.last-step .step-connector-r{width:0px}.step-wrapper.complete .step-connector-l,.step-wrapper.complete .step-connector-r,.step-wrapper.complete .step-icon{background:#0A8276}.step-wrapper.complete .step-connector-l.active,.step-wrapper.complete .step-connector-l.error,.step-wrapper.complete .step-connector-r.active,.step-wrapper.complete .step-connector-r.error,.step-wrapper.complete .step-icon.active,.step-wrapper.complete .step-icon.error{background:#8D8786}.step-wrapper.complete:not(.disabled) .step-label{cursor:pointer;color:#1D1D1D}.step-wrapper.complete:not(.disabled) .step-label :hover{color:#08665C}.step-wrapper.disabled .step-connector-l,.step-wrapper.disabled .step-connector-r,.step-wrapper.disabled .step-icon{background-color:#8D8786}.step-wrapper.disabled .step-label,.step-wrapper.disabled .step-label :hover{color:#8D8786}.step-wrapper.active .step-connector-l,.step-wrapper.active .step-connector-r,.step-wrapper.active .step-icon{background:#0A8276}.step-wrapper.active .step-connector-l.active,.step-wrapper.active .step-connector-l.error,.step-wrapper.active .step-connector-r.active,.step-wrapper.active .step-connector-r.error,.step-wrapper.active .step-icon.active,.step-wrapper.active .step-icon.error{background:#8D8786}.step-wrapper.active .step-label,.step-wrapper.active .step-label :hover{color:#1D1D1D}.step-wrapper.active.complete .step-label{cursor:auto}.step-wrapper.clickable:not(.active) .step-label{cursor:pointer}.step-wrapper.error:not(.active){color:#CD002F}.step-wrapper.error:not(.active) .step-label{color:#CD002F}.step-wrapper.error:not(.active) .step-label :hover{color:#0A8276}.step-wrapper.disabled .step-label{cursor:auto}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon{background:#08665C}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-l.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-connector-r.error,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.active,.step-wrapper:hover.complete:not(.disabled):not(.active) .step-icon.error{background:#8D8786}.step-wrapper:hover.complete:not(.disabled):not(.active) .step-label{color:#08665C}.active-indic{width:16px;height:16px;border-radius:9999px;background:white}.step-icon-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%}.step-icon{width:24px;height:24px;background-color:#8D8786;border-radius:9999px;display:flex;align-items:center;justify-content:center;color:white}.step-connector-r,.step-connector-l{height:2px;min-width:40px;flex-grow:1;background-color:#8D8786}.vertical .step-connector-r,.vertical .step-connector-l{height:unset;min-width:unset;width:2px;min-height:40px}';const p=r;const s=class{constructor(t){e(this,t);this.complete=false;this.disabled=false;this.error=false;this.lastStep=false;this.stepId=1;this.stepperState={activeStep:1,showStepNumber:false,variant:"default",indicatorPosition:"left"};this.clickable=false}onStepChange(e){const t=e.detail.previousActiveStep;if(t===this.stepId&&this.error){this.clickable=true}}updateCurrentStep(e){this.active=e.activeStep===this.stepId}updateErrorState(){if(this.active){this.error=false}}handleStepClick(){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)){this.stepperState.setActiveStep(this.stepId,true)}}handleStepKeyDown(e){if(!this.disabled&&this.stepperState.variant!=="compact"&&(this.clickable||this.complete)&&e.key==="Enter"){this.stepperState.setActiveStep(this.stepId,true)}}stopOnClickPropogation(e){if(this.disabled){e.stopPropagation()}}render(){return t("div",{key:"9914ec28d308a59dae9f0f6117b2aece72ac6438","aria-current":this.active?"step":false,"aria-disabled":this.active||this.complete?false:true,onClick:e=>this.stopOnClickPropogation(e),class:`step-wrapper ${this.stepId===1?"first-step":""} \n                        ${this.error?"error":""}\n                        ${this.stepperState.variant}\n                        ${this.complete?"complete":""}\n                        ${this.lastStep?"last-step":""}\n                        indicator-${this.stepperState.indicatorPosition}\n                        ${this.active?"active":""}\n                        ${this.clickable?"clickable":""}\n                        ${this.disabled?"disabled":""}`},t("div",{key:"6017ac474bcbc1afa7ed1ec416bf0302fdbd5cdd",class:"step-icon-wrapper"},this.stepperState.variant!=="compact"&&t("span",{key:"0a90ed22e8b55a0a20d463347edd656ece131992",class:"step-connector-l"}),this.stepperState.variant!=="compact"&&(!this.error||this.error&&this.active)&&t("div",{key:"c21888305852d7434847c329a7f7569ff2ac3b7d",class:"step-icon"},this.stepperState.showStepNumber&&!this.complete&&!this.active?this.stepId:"",this.complete&&!this.active&&t("ifx-icon",{key:"1a97cd47db4fe64eda55a1418511bb1e78bc1332",icon:"check16"}),this.active&&t("span",{key:"2b918fa4f3052c7e6c5597f175956802ec2f34bb",class:"active-indic"})),this.stepperState.variant!=="compact"&&this.error&&!this.active&&t("ifx-icon",{key:"b515f8cab0008f14c9e1ba9a5f085792a440a2cc",icon:"warningf24"}),this.stepperState.variant!=="compact"&&t("span",{key:"772ef8271ffb3398a7bcfedb732a12e43250ae98",class:`step-connector-r ${this.active?"active":""}`})),(this.stepperState.variant!=="compact"||this.stepperState.variant==="compact"&&(this.active||this.stepId===this.stepperState.activeStep+1))&&t("div",{key:"b16463d3fb54cafc520cb7799f647884f28989f0",tabIndex:!this.disabled&&this.complete&&!this.active?0:-1,class:`step-label ${this.stepperState.variant==="compact"?this.active?"curr-label":"next-label":""}`,onClick:()=>{this.handleStepClick()},onKeyDown:e=>{this.handleStepKeyDown(e)}},this.stepperState.variant!=="compact"&&t("slot",{key:"81c8b0a1310dcb02c0c668c2ac7ed84902e31a8f"}),this.stepperState.variant==="compact"&&!this.active?"Next: ":"",this.stepperState.variant==="compact"&&t("slot",{key:"c20034f2bee0fea186754be2480b75552f4ea9e9"})))}static get watchers(){return{stepperState:["updateCurrentStep"],active:["updateErrorState"]}}};s.style=p;export{s as ifx_step};
+//# sourceMappingURL=p-1de4f93c.entry.js.map

package/dist/infineon-design-system-stencil/p-1fca1eb2.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as i,h as s}from"./p-e6edf72d.js";import{c as r}from"./p-5cdc6210.js";const t=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.search-field{box-sizing:border-box;background-color:#FFFFFF;width:100%;font-family:var(--ifx-font-family)}.search-field .search-field__wrapper{box-sizing:border-box;height:40px;display:flex;align-items:center;border:1px solid #8D8786;border-radius:1px;padding:8px 16px;gap:12px;flex:none;order:0;align-self:stretch;flex-grow:0;position:relative;width:100%;outline:none;color:#8D8786}.search-field .search-field__wrapper.focused{border:1px solid #0A8276}.search-field .search-field__wrapper.focused ifx-icon{color:#575352}.search-field .search-field__wrapper.search-field__wrapper-s{height:36px}.search-field .search-field__wrapper:hover:not(.focused,:focus){border:1px solid #3C3A39}.search-field .search-field__wrapper:focus{outline:none;border:1px solid #0A8276}.search-field .search-field__wrapper .delete-icon{right:12px;cursor:pointer}.search-field .search-field__wrapper input[type=text]{font-style:normal;font-weight:400;font-size:16px;color:#8D8786;border:none;width:100%;outline:none;height:16px}.search-field .search-field__wrapper input[type=text]:focus{outline:none;color:#1d1d1d}.search-field .search-field__wrapper input[type=text]:disabled{background-color:#EEEDED}.search-field .search-field__wrapper:has(input[disabled]){background-color:#EEEDED}';const a=t;const l=class{constructor(s){e(this,s);this.ifxInput=i(this,"ifxInput",7);this.value="";this.insideDropdown=false;this.showDeleteIcon=false;this.showDeleteIconInternalState=false;this.disabled=false;this.size="l";this.isFocused=false;this.placeholder="Search...";this.autocomplete="on";this.maxlength=null;this.handleInput=()=>{const e=this.inputElement.value;this.value=e;this.ifxInput.emit(this.value)};this.handleDelete=()=>{this.inputElement.value="";this.value="";this.ifxInput.emit(this.value)}}handleOutsideClick(e){const i=e.composedPath();if(!i.includes(this.inputElement)){this.isFocused=false}}valueWatcher(e){if(e!==this.inputElement.value){this.inputElement.value=e}}focusInput(){this.inputElement.focus();this.isFocused=true}componentWillUpdate(){if(this.value!==""){this.showDeleteIconInternalState=true}else this.showDeleteIconInternalState=false}render(){return s("div",{key:"69bfbbbb91d0d918c9d62f1023babc630325882e","aria-label":"a search field for user input","aria-disabled":this.disabled,"aria-value":this.value,class:"search-field"},s("div",{key:"0bd284139b40d1c6b2288c74fb4f65235e470ab1",class:this.getWrapperClassNames(),tabindex:1,onFocus:()=>this.focusInput(),onClick:()=>this.focusInput()},s("ifx-icon",{key:"a472e315073ad3d92fd55a5689f84e31bb57271c",icon:"search-16",class:"search-icon"}),s("input",{key:"0e4d8258fe7058ee1ad9b12605ccd7ba14f23ce2",ref:e=>this.inputElement=e,type:"text",autocomplete:this.autocomplete,onInput:()=>this.handleInput(),placeholder:this.placeholder,disabled:this.disabled,maxlength:this.maxlength,value:this.value}),this.showDeleteIcon&&this.showDeleteIconInternalState?s("ifx-icon",{icon:"cremove16",class:"delete-icon",onClick:this.handleDelete}):null))}getSizeClass(){return`${this.size}`==="s"?"search-field__wrapper-s":""}getWrapperClassNames(){return r(`search-field__wrapper`,`search-field__wrapper ${this.getSizeClass()}`,`${this.isFocused?"focused":""}`)}static get watchers(){return{value:["valueWatcher"]}}};l.style=a;export{l as ifx_search_field};
2	+ //# sourceMappingURL=p-1fca1eb2.entry.js.map

package/dist/infineon-design-system-stencil/p-1fca1eb2.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["searchFieldCss","IfxSearchFieldStyle0","SearchField","constructor","hostRef","this","value","insideDropdown","showDeleteIcon","showDeleteIconInternalState","disabled","size","isFocused","placeholder","autocomplete","maxlength","handleInput","query","inputElement","ifxInput","emit","handleDelete","handleOutsideClick","event","path","composedPath","includes","valueWatcher","newValue","focusInput","focus","componentWillUpdate","render","h","key","class","getWrapperClassNames","tabindex","onFocus","onClick","icon","ref","el","type","onInput","getSizeClass","classNames"],"sources":["src/components/search-field/search-field.scss?tag=ifx-search-field&encapsulation=shadow","src/components/search-field/search-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.search-field {\n box-sizing: border-box;\n background-color: tokens.$ifxColorBaseWhite;\n width: 100%;\n font-family: var(--ifx-font-family);\n\n\n .search-field__wrapper {\n box-sizing: border-box;\n height: tokens.$ifxSize500;\n display: flex;\n align-items: center;\n border: 1px solid #8D8786;\n border-radius: tokens.$ifxBorderRadius12;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace150;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n position: relative;\n width: 100%;\n outline: none;\n color: tokens.$ifxColorEngineering400;\n\n &.focused {\n border: 1px solid tokens.$ifxColorOcean500;\n\n & ifx-icon {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n &.search-field__wrapper-s {\n height: 36px;\n }\n\n\n &:hover:not(.focused, :focus) {\n border: 1px solid #3C3A39;\n }\n\n &:focus {\n outline: none;\n border: 1px solid #0A8276;\n }\n\n\n .delete-icon {\n right: 12px;\n cursor: pointer;\n }\n\n input[type='text'] {\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n //line-height: 24px;\n color: #8D8786;\n border: none;\n width: 100%;\n outline: none;\n //height: 100%;\n height: 16px;\n\n &:focus {\n outline: none;\n color: #1d1d1d;\n }\n\n &:disabled {\n background-color: #EEEDED;\n }\n }\n\n &:has(input[disabled]) {\n background-color: #EEEDED;\n }\n }\n}","import { Component, EventEmitter, h, Event, Prop, Watch, State, Listen } from '@stencil/core';\nimport classNames from 'classnames';\n \n\n\n@Component({\n tag: 'ifx-search-field',\n styleUrl: 'search-field.scss',\n shadow: true\n})\n\n\nexport class SearchField {\n private inputElement: HTMLInputElement;\n @Prop({ mutable: true }) value: string = '';\n\n @Event() ifxInput: EventEmitter<String>;\n @State() insideDropdown: boolean = false;\n\n @Prop() showDeleteIcon: boolean = false;\n @State() showDeleteIconInternalState: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() size: string = 'l';\n @State() isFocused: boolean = false;\n @Prop() placeholder: string = \"Search...\";\n @Prop() autocomplete: string = \"on\";\n @Prop() maxlength?: number = null; \n\n @Listen('mousedown', { target: 'document' })\n handleOutsideClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.inputElement)) {\n this.isFocused = false;\n }\n }\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n\n handleInput = () => {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.ifxInput.emit(this.value);\n };\n\n handleDelete = () => {\n this.inputElement.value = '';\n this.value = \"\";\n this.ifxInput.emit(this.value);\n }\n\n focusInput() {\n this.inputElement.focus();\n this.isFocused = true;\n }\n \n\n\n\n componentWillUpdate() {\n if (this.value !== \"\") {\n this.showDeleteIconInternalState = true;\n } else this.showDeleteIconInternalState = false;\n }\n\n render() {\n return (\n <div aria-label=\"a search field for user input\" aria-disabled={this.disabled} aria-value={this.value} class='search-field'>\n <div class={this.getWrapperClassNames()}\n tabindex={1}\n onFocus={() => this.focusInput()}\n onClick={() => this.focusInput()}\n >\n <ifx-icon icon=\"search-16\" class=\"search-icon\"></ifx-icon>\n <input\n ref={(el) => (this.inputElement = el)}\n type=\"text\"\n autocomplete={this.autocomplete}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n disabled={this.disabled}\n maxlength={this.maxlength}\n value={this.value} // bind the value property to input element\n />\n {this.showDeleteIcon && this.showDeleteIconInternalState ? (\n <ifx-icon icon=\"cremove16\" class=\"delete-icon\" onClick={this.handleDelete}>\n </ifx-icon>\n ) : null}\n </div>\n </div>\n );\n }\n\n getSizeClass() {\n return `${this.size}` === \"s\"\n ? \"search-field__wrapper-s\"\n : \"\";\n }\n\n\n getWrapperClassNames() {\n return classNames(\n `search-field__wrapper`,\n `search-field__wrapper ${this.getSizeClass()}`,\n `${this.isFocused ? 'focused' : \"\"}`\n );\n }\n}"],"mappings":"sFAAA,MAAMA,EAAiB,61CACvB,MAAAC,EAAeD,E,MCWFE,EAAW,MAPxB,WAAAC,CAAAC,G,6CAS2BC,KAAAC,MAAgB,GAGhCD,KAAAE,eAA0B,MAE3BF,KAAAG,eAA0B,MACzBH,KAAAI,4BAAuC,MACxCJ,KAAAK,SAAoB,MACpBL,KAAAM,KAAe,IACdN,KAAAO,UAAqB,MACtBP,KAAAQ,YAAsB,YACtBR,KAAAS,aAAuB,KACvBT,KAAAU,UAAqB,KAkB7BV,KAAAW,YAAc,KACZ,MAAMC,EAAQZ,KAAKa,aAAaZ,MAChCD,KAAKC,MAAQW,EACbZ,KAAKc,SAASC,KAAKf,KAAKC,MAAM,EAGhCD,KAAAgB,aAAe,KACbhB,KAAKa,aAAaZ,MAAQ,GAC1BD,KAAKC,MAAQ,GACbD,KAAKc,SAASC,KAAKf,KAAKC,MAAM,C,CAxBhC,kBAAAgB,CAAmBC,GACjB,MAAMC,EAAOD,EAAME,eACnB,IAAKD,EAAKE,SAASrB,KAAKa,cAAe,CACrCb,KAAKO,UAAY,K,EAKrB,YAAAe,CAAaC,GACX,GAAIA,IAAavB,KAAKa,aAAaZ,MAAO,CACxCD,KAAKa,aAAaZ,MAAQsB,C,EAiB9B,UAAAC,GACExB,KAAKa,aAAaY,QAClBzB,KAAKO,UAAY,I,CAMnB,mBAAAmB,GACE,GAAI1B,KAAKC,QAAU,GAAI,CACrBD,KAAKI,4BAA8B,I,MAC9BJ,KAAKI,4BAA8B,K,CAG5C,MAAAuB,GACE,OACEC,EAAA,OAAAC,IAAA,wDAAgB,gCAA+B,gBAAgB7B,KAAKK,SAAQ,aAAcL,KAAKC,MAAO6B,MAAM,gBAC1GF,EAAA,OAAAC,IAAA,2CAAKC,MAAO9B,KAAK+B,uBACfC,SAAU,EACVC,QAAS,IAAMjC,KAAKwB,aACpBU,QAAS,IAAMlC,KAAKwB,cAEpBI,EAAA,YAAAC,IAAA,2CAAUM,KAAK,YAAYL,MAAM,gBACjCF,EAAA,SAAAC,IAAA,2CACEO,IAAMC,GAAQrC,KAAKa,aAAewB,EAClCC,KAAK,OACL7B,aAAcT,KAAKS,aACnB8B,QAAS,IAAMvC,KAAKW,cACpBH,YAAaR,KAAKQ,YAClBH,SAAUL,KAAKK,SACfK,UAAWV,KAAKU,UAChBT,MAAOD,KAAKC,QAEbD,KAAKG,gBAAkBH,KAAKI,4BAC3BwB,EAAA,YAAUO,KAAK,YAAYL,MAAM,cAAcI,QAASlC,KAAKgB,eAE3D,M,CAMZ,YAAAwB,GACE,MAAO,GAAGxC,KAAKM,SAAW,IACtB,0BACA,E,CAIN,oBAAAyB,GACE,OAAOU,EACL,wBACA,yBAAyBzC,KAAKwC,iBAC9B,GAAGxC,KAAKO,UAAY,UAAY,K","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-33b93a7c.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,c as t,h as i,g as n}from"./p-e6edf72d.js";const a=':host(.hidden){display:none}.navbar__item{position:relative;display:flex;flex-direction:row;align-items:center;padding:0px 8px;flex:none;order:0;flex-grow:0;font-family: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 .number__indicator-wrapper{position:relative;top:-11px}.navbar__item .dot__indicator-wrapper{display:flex;width:8px;height:8px;justify-content:center;align-items:center;flex-shrink:0;border-radius:50%;background-color:#0A8276;position:relative;top:-11px}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0px;gap:8px;flex:none;order:0;flex-grow:0}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .username__tooltip{display:none;position:absolute;top:35px;right:0;text-wrap:nowrap;padding:1px 5px;font-size:13px;font-family:"Source Sans 3";background-color:black;color:#fff;z-index:99}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper:hover .username__tooltip{display:block}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper{display:flex;width:24px;height:24px;justify-content:center;align-items:center;border-radius:100%;background-color:#0A8276}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper .initials__wrapper .initials{color:#FFF;text-align:center;font-family:"Source Sans 3";font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper img{width:24px;height:24px;border-radius:100%}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.removeWrapper{display:none}.navbar__item .navbar__container-right-content-navigation-item-icon-wrapper.hide{display:none}.container{position:relative}.container .sub__layer-back-button{display:none}.container .sub__layer-back-button.show{display:flex;justify-content:flex-start}.container .sub__layer-back-button.show .back__button-wrapper{display:flex;align-items:center;gap:8px;padding:8px 0 16px 0;color:#0A8276;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.container .sub__layer-back-button.show .back__button-wrapper span:hover,.container .sub__layer-back-button.show .back__button-wrapper ifx-icon:hover{cursor:pointer}.container.hide{display:none}.container .inner__content-wrapper{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px}.container .inner__content-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .navbar__container-right-content-navigation-item-icon-wrapper.no-gap{gap:0px}.container .inner__content-wrapper .number__indicator-wrapper{position:relative;top:-11px}.navbar-menu{position:absolute;display:none;list-style-type:none;visibility:visible;flex-direction:column;width:224px;min-width:224px;background:#FFFFFF;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;padding:8px 0px;font-family: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.dotIndicator=false}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();this.removeEmptyItem()}componentDidLoad(){this.handleItemGap();this.handleLabelWrapper();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")}}}}handleLabelWrapper(){const e=this.el.shadowRoot.querySelector(".label__wrapper");const t=this.getNavBarItem();const i=e.querySelector("slot");if(!i.assignedNodes().length){t.classList.add("removeLabel")}else if(this.showLabel&&t.classList.contains("removeLabel")){t.classList.remove("removeLabel")}}handleItemGap(){const e=this.el.shadowRoot.querySelector(".navbar__item");const t=e.querySelector(".navbar__container-right-content-navigation-item-icon-wrapper");if(this.numberIndicator\|\|this.dotIndicator){this.handleClassList(t,"add","no-gap")}else{this.handleClassList(t,"remove","no-gap")}}removeEmptyItem(){const e=this.el.shadowRoot.host;if(!this.showLabel&&!this.icon){this.handleClassList(e,"add","hidden")}}render(){return i("div",{key:"98a3a5584ce6970b42c1362533aeceb82009e91b",class:"container",onMouseLeave:e=>this.handleNestedLayerMenu(e),onMouseEnter:e=>this.handleNestedLayerMenu(e)},i("div",{key:"21eeccfc5a01721c14033b98c3ebe38522ba6ab9",class:"sub__layer-back-button"},i("div",{key:"08825ed5d7c6c3a1e0dd582a7e6528b201240959",class:"back__button-wrapper",onClick:()=>this.returnToFirstLayer()},i("ifx-icon",{key:"5763b65a915c8bf0d554e79cae52dabe8b810986",icon:"arrow-left-16"}),i("span",{key:"300ddc647f93f8ef78921ba67ce12233affe3cb4"},"Back"))),i("a",{key:"dab2a111f7170f50b30de5824cdcdd471899adfc",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:"f2c6800d93b7607cf2952e63aa5ab34ecaae48be",class:"inner__content-wrapper"},i("div",{key:"fafd3d1472c2dfca443e655e1acd2dc697489621",class:`navbar__container-right-content-navigation-item-icon-wrapper ${!this.icon?"removeWrapper":""}`},this.icon&&i("ifx-icon",{key:"6f00f8d13482ab9ecd74db4de66f4367abcd255e",icon:this.icon}),this.icon&&!this.showLabel&&!isNaN(this.numberIndicator)&&i("div",{key:"f0d7d1be990c6583be95b5d65569381c85195bff",class:"number__indicator-wrapper"},i("ifx-number-indicator",{key:"d0139e514dadeefdc09f2ace9ba1bc754a42ecfc"},this.numberIndicator)),this.icon&&!this.showLabel&&!this.numberIndicator&&this.dotIndicator&&i("div",{key:"1d616918f156bc28a91c9e734b04df5facc45ee8",class:"dot__indicator-wrapper"})),this.itemPosition==="left"&&this.hasChildNavItems&&this.isMenuItem&&i("div",{key:"c23a19ba3b2b6fe3c5eb79a3a004c0d0107d682b",class:"menuItemLeftIconWrapper"},i("ifx-icon",{key:"373e318e386e976213fbd9592a37b7afa7488d7b",icon:"chevron-left-12"})),i("span",{key:"a4463d2ee853ca5731b276f14c9e6cbe3b7f8108",class:"label__wrapper"},i("slot",{key:"d682377d8e98e612bf2597e4b749c0ff18b10774"}))),this.showLabel&&this.numberIndicator&&!isNaN(this.numberIndicator)?i("div",{class:"number__indicator-wrapper"},i("ifx-number-indicator",null,this.numberIndicator)):"",this.showLabel&&!this.numberIndicator&&this.dotIndicator?i("div",{class:"dot__indicator-wrapper"}):"",i("div",{key:"0dade0d6eb4062bd0e31804ff501a93711dccd43",class:`navItemIconWrapper ${this.hasChildNavItems&&!this.isMenuItem&&!this.isSidebarMenuItem?"":"hide"}`},i("ifx-icon",{key:"8ec6bff717321e37a8e36ae8623f9d9cd5506ed0",icon:"chevron-down-12"})),i("div",{key:"6d75cd61b28fa198e55436d0b783725943c5d314",class:`menuItemRightIconWrapper ${this.itemPosition==="right"&&this.hasChildNavItems&&this.isMenuItem\|\|this.isSidebarMenuItem&&this.hasChildNavItems?"":"hide"}`},i("ifx-icon",{key:"26c1d540a395b96c4d699bb050065f7e104d263b",icon:"chevron-right-12"}))),this.hasChildNavItems&&!this.isSidebarMenuItem&&i("ul",{key:"35c6a68f085200d3b1c3da2d994448b87201d7f9",class:"navbar-menu"}," ",i("slot",{key:"a7fff45b205883f0a7e83a1d2b98f52e40e3caa0",name:"first__layer"})," "),this.isSidebarMenuItem&&i("ul",{key:"1af92bb3811e89b576b7794e214d750bb7e340c2",class:"sub__layer-menu"}," ",i("slot",{key:"629fb9090d0382885b248ed1b98a260b969e3b43",name:"second__layer"})," "))}get el(){return n(this)}};o.style=s;export{o as ifx_navbar_item};
2	+ //# sourceMappingURL=p-33b93a7c.entry.js.map