@infineon/infineon-design-system-stencil 30.15.1--canary.1496.014a56d3380588605dda6607d613bb2b29c87a63.0 → 30.16.0--canary.1678.82835147934b69e511828b622ed33a769b46def5.0

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

@@ -1,2 +1,2 @@
-import{r as t,h as n,a as o,g as e}from"./p-20fe9306.js";import{c as i}from"./p-5cdc6210.js";const r=":host{display:inline-flex}.btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px;gap:8px;color:#FFFFFF;flex-direction:row;font-weight:600;border-radius:1px;line-height:1.5rem;outline:none;font-family:var(--ifx-font-family);text-decoration:none;user-select:none;border:1px solid rgba(0, 0, 0, 0);font-size:1rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}.btn:not(.disabled){cursor:pointer}.btn-primary{color:#FFFFFF;background-color:#0A8276}.btn-primary:disabled,.btn-primary.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary{color:#0A8276;background-color:#FFFFFF;border-color:#0A8276}.btn-secondary:disabled,.btn-secondary.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary{background-color:transparent;color:#1D1D1D}.btn-tertiary:disabled,.btn-tertiary.disabled{color:#BFBBBB;pointer-events:none}.btn.icon-button{min-width:initial;min-height:initial;width:40px;height:40px;padding:0;justify-content:center}.btn.icon-button.btn-round{border-radius:100px}.btn.icon-button.btn-square{border-radius:1px}.btn.icon-button.btn-s{width:32px;height:32px;padding:8px}.btn.icon-button.btn-l{width:48px;height:48px;padding:8px}.btn.btn-primary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-primary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C}.btn.btn-primary:not(:disabled,.disabled):active,.btn.btn-primary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-secondary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C;color:#FFFFFF}.btn.btn-secondary:not(:disabled,.disabled):active,.btn.btn-secondary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-tertiary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;color:#1D1D1D;box-shadow:0 0 0 0px #FFFFFF, 0 0 0 2px #0A8276}.btn.btn-tertiary:not(:disabled,.disabled):hover{color:#0A8276}.btn.btn-tertiary:not(:disabled,.disabled):active,.btn.btn-tertiary:not(:disabled,.disabled).active{color:#08665C}";const s=r;const a=class{constructor(n){t(this,n);this.target="_self";this.shape="round"}handleClick(t){if(this.disabled){t.stopImmediatePropagation()}}async setFocus(){this.focusableElement.focus()}componentWillLoad(){if(this.shape===""){this.shape="round"}}render(){return n(o,{key:"a13463972d971f052edc7c7483283b9beb150955"},this.href?n("a",{"aria-disabled":this.disabled,"aria-label":"a clickable icon button",ref:t=>this.focusableElement=t,class:this.getClassNames(),href:!this.disabled?this.href:undefined,target:this.target,rel:this.target==="_blank"?"noopener noreferrer":undefined},n("ifx-icon",{icon:this.icon})):n("button",{class:this.getClassNames(),type:"button"},n("ifx-icon",{icon:this.icon})))}getVariantClass(){return`${this.variant}`==="secondary"?`secondary`:`${this.variant}`==="tertiary"?`tertiary`:`primary`}getSizeClass(){if(`${this.size}`==="xs"){return"xs"}else if(`${this.size}`==="s"){return"s"}else if(`${this.size}`==="l"){return"l"}else return""}getClassNames(){return i("btn icon-button",`btn-${this.shape}`,this.size&&`btn-${this.getSizeClass()}`,`btn-${this.getVariantClass()}`,this.disabled?"disabled":"")}get el(){return e(this)}};a.style=s;export{a as ifx_icon_button};
-//# sourceMappingURL=p-1e83fe61.entry.js.map
+import{r as t,h as n,a as o,g as e}from"./p-e244bae4.js";import{c as i}from"./p-5cdc6210.js";const r=":host{display:inline-flex}.btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px;gap:8px;color:#FFFFFF;flex-direction:row;font-weight:600;border-radius:1px;line-height:1.5rem;outline:none;font-family:var(--ifx-font-family);text-decoration:none;user-select:none;border:1px solid rgba(0, 0, 0, 0);font-size:1rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}.btn:not(.disabled){cursor:pointer}.btn-primary{color:#FFFFFF;background-color:#0A8276}.btn-primary:disabled,.btn-primary.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary{color:#0A8276;background-color:#FFFFFF;border-color:#0A8276}.btn-secondary:disabled,.btn-secondary.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary{background-color:transparent;color:#1D1D1D}.btn-tertiary:disabled,.btn-tertiary.disabled{color:#BFBBBB;pointer-events:none}.btn.icon-button{min-width:initial;min-height:initial;width:40px;height:40px;padding:0;justify-content:center}.btn.icon-button.btn-round{border-radius:100px}.btn.icon-button.btn-square{border-radius:1px}.btn.icon-button.btn-s{width:32px;height:32px;padding:8px}.btn.icon-button.btn-l{width:48px;height:48px;padding:8px}.btn.btn-primary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-primary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C}.btn.btn-primary:not(:disabled,.disabled):active,.btn.btn-primary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-secondary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C;color:#FFFFFF}.btn.btn-secondary:not(:disabled,.disabled):active,.btn.btn-secondary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-tertiary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;color:#1D1D1D;box-shadow:0 0 0 0px #FFFFFF, 0 0 0 2px #0A8276}.btn.btn-tertiary:not(:disabled,.disabled):hover{color:#0A8276}.btn.btn-tertiary:not(:disabled,.disabled):active,.btn.btn-tertiary:not(:disabled,.disabled).active{color:#08665C}";const s=r;const a=class{constructor(n){t(this,n);this.target="_self";this.shape="round"}handleClick(t){if(this.disabled){t.stopImmediatePropagation()}}async setFocus(){this.focusableElement.focus()}componentWillLoad(){if(this.shape===""){this.shape="round"}}render(){return n(o,{key:"a13463972d971f052edc7c7483283b9beb150955"},this.href?n("a",{"aria-disabled":this.disabled,"aria-label":"a clickable icon button",ref:t=>this.focusableElement=t,class:this.getClassNames(),href:!this.disabled?this.href:undefined,target:this.target,rel:this.target==="_blank"?"noopener noreferrer":undefined},n("ifx-icon",{icon:this.icon})):n("button",{class:this.getClassNames(),type:"button"},n("ifx-icon",{icon:this.icon})))}getVariantClass(){return`${this.variant}`==="secondary"?`secondary`:`${this.variant}`==="tertiary"?`tertiary`:`primary`}getSizeClass(){if(`${this.size}`==="xs"){return"xs"}else if(`${this.size}`==="s"){return"s"}else if(`${this.size}`==="l"){return"l"}else return""}getClassNames(){return i("btn icon-button",`btn-${this.shape}`,this.size&&`btn-${this.getSizeClass()}`,`btn-${this.getVariantClass()}`,this.disabled?"disabled":"")}get el(){return e(this)}};a.style=s;export{a as ifx_icon_button};
+//# sourceMappingURL=p-eeccb158.entry.js.map

package/dist/infineon-design-system-stencil/{p-790da64b.entry.js → p-f20951d0.entry.js}

@@ -1,2 +1,2 @@
-import{r as n,h as e}from"./p-20fe9306.js";const r=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.numberIndicator__container{display:inline-flex;padding:0px 4px;max-height:16px;justify-content:center;align-items:center;border-radius:100px;background-color:#0A8276;font-family:var(--ifx-font-family)}.numberIndicator__container span{color:#FFFFFF;text-align:center;font-size:0.875rem;font-style:normal;font-weight:600;line-height:16px}.numberIndicator__container.inverted{background-color:#FFFFFF}.numberIndicator__container.inverted span{color:#0A8276}';const a=r;const i=class{constructor(e){n(this,e);this.inverted=false}render(){return e("div",{key:"6a3da8cb8451752f9852a79e19a49fdb425ff5e3","aria-label":"a number indicator",class:`numberIndicator__container ${this.inverted?"inverted":""}`},e("span",{key:"99a1835f799ec5b16560776ff02a4f8469d6f084"},e("slot",{key:"a7fe661eb175d006b97782c50d522aff1908cc20"})))}};i.style=a;export{i as ifx_number_indicator};
-//# sourceMappingURL=p-790da64b.entry.js.map
+import{r as n,h as e}from"./p-e244bae4.js";const a=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.numberIndicator__container{display:inline-flex;padding:0px 4px;max-height:16px;justify-content:center;align-items:center;border-radius:100px;background-color:#0A8276;font-family:var(--ifx-font-family)}.numberIndicator__container span{color:#FFFFFF;text-align:center;font-size:0.875rem;font-style:normal;font-weight:600;line-height:16px}.numberIndicator__container.inverted{background-color:#FFFFFF}.numberIndicator__container.inverted span{color:#0A8276}';const r=a;const i=class{constructor(e){n(this,e);this.inverted=false}render(){return e("div",{key:"6a3da8cb8451752f9852a79e19a49fdb425ff5e3","aria-label":"a number indicator",class:`numberIndicator__container ${this.inverted?"inverted":""}`},e("span",{key:"99a1835f799ec5b16560776ff02a4f8469d6f084"},e("slot",{key:"a7fe661eb175d006b97782c50d522aff1908cc20"})))}};i.style=r;export{i as ifx_number_indicator};
+//# sourceMappingURL=p-f20951d0.entry.js.map

package/dist/infineon-design-system-stencil/{p-ea8e705e.entry.js → p-f42bc9c8.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as a}from"./p-20fe9306.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.container{display:inline-flex;align-items:center;padding:4px 16px;border:1px solid #BFBBBB;border-radius:9999px;background-color:#FFFFFF;gap:8px;font-family:var(--ifx-font-family)}.container:hover{cursor:pointer;border-color:#8D8786}.container:active,.container.active{border-color:#1D1D1D}.container:focus:not(:active,.active){outline:none;border-color:#1D1D1D}.container .label-wrapper{text-decoration:none}.container .label-wrapper .label{margin:0;font-weight:400;font-size:1rem;line-height:20px;color:#1D1D1D}';const r=o;const i=class{constructor(a){e(this,a)}render(){return a("div",{key:"41331d90004cb31b76563b71e0614e11635badca","aria-label":"a tag",class:"container"},this.icon&&a("ifx-icon",{key:"a05f1a5ab32772e4ab2b0571def479a48fdcf35f",icon:this.icon}),a("a",{key:"e5f810e31d7650a90dcecd657d5a9955c41b1fbf",href:"javascript:void(null);",class:"label-wrapper"},a("p",{key:"526a2ea2b178bc583f0ab93351df949fc5c8e667",class:"label"},a("slot",{key:"384383d1bd6f44f9f7bc409858eb54356c48bd51"}))))}};i.style=r;export{i as ifx_tag};
-//# sourceMappingURL=p-ea8e705e.entry.js.map
+import{r as e,h as a}from"./p-e244bae4.js";const o=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.container{display:inline-flex;align-items:center;padding:4px 16px;border:1px solid #BFBBBB;border-radius:9999px;background-color:#FFFFFF;gap:8px;font-family:var(--ifx-font-family)}.container:hover{cursor:pointer;border-color:#8D8786}.container:active,.container.active{border-color:#1D1D1D}.container:focus:not(:active,.active){outline:none;border-color:#1D1D1D}.container .label-wrapper{text-decoration:none}.container .label-wrapper .label{margin:0;font-weight:400;font-size:1rem;line-height:20px;color:#1D1D1D}';const r=o;const i=class{constructor(a){e(this,a)}render(){return a("div",{key:"41331d90004cb31b76563b71e0614e11635badca","aria-label":"a tag",class:"container"},this.icon&&a("ifx-icon",{key:"a05f1a5ab32772e4ab2b0571def479a48fdcf35f",icon:this.icon}),a("a",{key:"e5f810e31d7650a90dcecd657d5a9955c41b1fbf",href:"javascript:void(null);",class:"label-wrapper"},a("p",{key:"526a2ea2b178bc583f0ab93351df949fc5c8e667",class:"label"},a("slot",{key:"384383d1bd6f44f9f7bc409858eb54356c48bd51"}))))}};i.style=r;export{i as ifx_tag};
+//# sourceMappingURL=p-f42bc9c8.entry.js.map

package/dist/infineon-design-system-stencil/{p-459d293b.entry.js → p-f63ce1bc.entry.js}

@@ -1,2 +1,2 @@
-import{r as a,c as e,h as r,g as s}from"./p-20fe9306.js";const i=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{width:100%;display:flex}.search-bar{box-sizing:border-box;height:40px;background-color:#FFFFFF;display:flex;flex-direction:row;align-items:center;width:100%;font-family:var(--ifx-font-family)}.search-bar.closed{display:flex;width:auto;justify-content:flex-start}.search-bar .search-bar-wrapper{display:flex;align-items:center;gap:16px;width:100%}.search-bar .search-bar-wrapper a{text-decoration:none;font-size:1rem;font-style:normal;font-weight:600;line-height:1.5rem;color:#0A8276;cursor:pointer}.search-bar .search-bar-wrapper ifx-search-field{width:100%}.search-bar .search-bar__icon-wrapper{display:none;flex-direction:row;align-items:center}.search-bar .search-bar__icon-wrapper ifx-icon:hover{cursor:pointer}.search-bar.closed .search-bar__icon-wrapper{display:flex}.search-bar.closed .search-bar-wrapper{display:none}';const t=i;const h=class{constructor(r){a(this,r);this.ifxInput=e(this,"ifxInput",7);this.ifxSearchBarIsOpen=e(this,"ifxSearchBarIsOpen",7);this.isOpen=true;this.disabled=false;this.handleCloseButton=()=>{this.internalState=!this.internalState;this.ifxSearchBarIsOpen.emit(this.internalState)};this.handleFocus=()=>{this.internalState=true}}async onNavbarMobile(){this.ifxSearchBarIsOpen.emit(false);this.internalState=false}handlePropChange(){this.internalState=this.isOpen}setInitialState(){this.internalState=this.isOpen}componentWillLoad(){this.setInitialState();this.ifxSearchBarIsOpen.emit(this.internalState)}handleInput(a){this.value=a.detail}render(){return r("div",{key:"9beeaf23e29792116ade1a8d08a291251a2037e4","aria-label":"a search bar","aria-disabled":this.disabled,class:`search-bar ${this.internalState?"open":"closed"}`},this.internalState?r("div",{class:"search-bar-wrapper"},r("ifx-search-field",{disabled:this.disabled,value:this.value,maxlength:this.maxlength,onIfxInput:this.handleInput.bind(this)},r("ifx-icon",{icon:"search-16",slot:"search-icon"})),r("a",{tabindex:"-1",href:"javascript:void(0)",onClick:this.handleCloseButton},"Close")):r("div",{class:"search-bar__icon-wrapper",onClick:this.handleCloseButton},r("ifx-icon",{icon:"search-16"})))}get el(){return s(this)}static get watchers(){return{isOpen:["handlePropChange"]}}};h.style=t;export{h as ifx_search_bar};
-//# sourceMappingURL=p-459d293b.entry.js.map
+import{r as a,c as e,h as r,g as s}from"./p-e244bae4.js";const i=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{width:100%;display:flex}.search-bar{box-sizing:border-box;height:40px;background-color:#FFFFFF;display:flex;flex-direction:row;align-items:center;width:100%;font-family:var(--ifx-font-family)}.search-bar.closed{display:flex;width:auto;justify-content:flex-start}.search-bar .search-bar-wrapper{display:flex;align-items:center;gap:16px;width:100%}.search-bar .search-bar-wrapper a{text-decoration:none;font-size:1rem;font-style:normal;font-weight:600;line-height:1.5rem;color:#0A8276;cursor:pointer}.search-bar .search-bar-wrapper ifx-search-field{width:100%}.search-bar .search-bar__icon-wrapper{display:none;flex-direction:row;align-items:center}.search-bar .search-bar__icon-wrapper ifx-icon:hover{cursor:pointer}.search-bar.closed .search-bar__icon-wrapper{display:flex}.search-bar.closed .search-bar-wrapper{display:none}';const t=i;const h=class{constructor(r){a(this,r);this.ifxInput=e(this,"ifxInput",7);this.ifxSearchBarIsOpen=e(this,"ifxSearchBarIsOpen",7);this.isOpen=true;this.disabled=false;this.handleCloseButton=()=>{this.internalState=!this.internalState;this.ifxSearchBarIsOpen.emit(this.internalState)};this.handleFocus=()=>{this.internalState=true}}async onNavbarMobile(){this.ifxSearchBarIsOpen.emit(false);this.internalState=false}handlePropChange(){this.internalState=this.isOpen}setInitialState(){this.internalState=this.isOpen}componentWillLoad(){this.setInitialState();this.ifxSearchBarIsOpen.emit(this.internalState)}handleInput(a){this.value=a.detail}render(){return r("div",{key:"9beeaf23e29792116ade1a8d08a291251a2037e4","aria-label":"a search bar","aria-disabled":this.disabled,class:`search-bar ${this.internalState?"open":"closed"}`},this.internalState?r("div",{class:"search-bar-wrapper"},r("ifx-search-field",{disabled:this.disabled,value:this.value,maxlength:this.maxlength,onIfxInput:this.handleInput.bind(this)},r("ifx-icon",{icon:"search-16",slot:"search-icon"})),r("a",{tabindex:"-1",href:"javascript:void(0)",onClick:this.handleCloseButton},"Close")):r("div",{class:"search-bar__icon-wrapper",onClick:this.handleCloseButton},r("ifx-icon",{icon:"search-16"})))}get el(){return s(this)}static get watchers(){return{isOpen:["handlePropChange"]}}};h.style=t;export{h as ifx_search_bar};
+//# sourceMappingURL=p-f63ce1bc.entry.js.map

package/dist/infineon-design-system-stencil/{p-8c9771b2.entry.js → p-f9bf9346.entry.js}

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

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

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

package/dist/infineon-design-system-stencil/{p-2c7718b1.entry.js.map → p-fb455026.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["cardLinksCss","IfxCardLinksStyle0","CardLinks","render","h","key","class"],"sources":["src/components/card/card-links/card-links.scss?tag=ifx-card-links&encapsulation=shadow","src/components/card/card-links/card-links.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.container {\n  display: flex;\n  align-items: center;\n  gap: tokens.$ifxSpace250;\n  flex-wrap: wrap;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  padding: 0px 24px 24px 24px;\n\n  /* wraps text at spaces and within words */\n  word-wrap: break-word;\n  /* breaks text within a word if necessary */\n  overflow-wrap: anywhere;\n  /* breaks text at arbitrary points when needed */\n\n  &:hover {\n    cursor: initial;\n  }\n}","import { Component, h, Element } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-links',\n  styleUrl: 'card-links.scss',\n  shadow: true,\n})\n\nexport class CardLinks {\n  @Element() el;\n\n  render() {\n    return (\n      <div class='container'>\n        <slot />\n      </div>\n    )\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAe,wSACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,yBAGpB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,aACTF,EAAA,QAAAC,IAAA,6C","ignoreList":[]}
+{"version":3,"names":["cardLinksCss","IfxCardLinksStyle0","CardLinks","render","h","key","class"],"sources":["src/components/card/card-links/card-links.scss?tag=ifx-card-links&encapsulation=shadow","src/components/card/card-links/card-links.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n.container {\n  display: flex;\n  align-items: center;\n  gap: tokens.$ifxSpace250;\n  flex-wrap: wrap;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  padding: 0px 24px 24px 24px;\n\n  /* wraps text at spaces and within words */\n  word-wrap: break-word;\n  /* breaks text within a word if necessary */\n  overflow-wrap: anywhere;\n  /* breaks text at arbitrary points when needed */\n\n  &:hover {\n    cursor: initial;\n  }\n}","import { Component, h, Element } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-card-links',\n  styleUrl: 'card-links.scss',\n  shadow: true,\n})\n\nexport class CardLinks {\n  @Element() el;\n\n  render() {\n    return (\n      <div class='container'>\n        <slot />\n      </div>\n    )\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAe,wSACrB,MAAAC,EAAeD,E,MCOFE,EAAS,M,yBAGpB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,aACTF,EAAA,QAAAC,IAAA,6C","ignoreList":[]}

package/dist/types/components/status/status.d.ts

@@ -1,6 +1,6 @@
 export declare class Status {
     label: string;
     border: boolean;
-    color: 'orange' | 'ocean' | 'grey' | 'light-grey' | 'red' | 'green' | 'berry';
+    color: 'engineering-100' | 'engineering-200' | 'engineering-300' | 'engineering-400' | 'engineering-500' | 'engineering-600' | 'ocean-100' | 'ocean-200' | 'ocean-300' | 'ocean-400' | 'ocean-500' | 'ocean-600' | 'ocean-700' | 'red-500' | 'red-600' | 'red-700' | 'orange-500' | 'green-500' | 'lawn-400' | 'lawn-500' | 'lawn-700' | 'berry-400' | 'berry-500' | 'sun-400' | 'sun-500' | 'sand-400' | 'sand-500';
     render(): any;
 }

package/dist/types/components.d.ts

@@ -458,7 +458,7 @@ export namespace Components {
     }
     interface IfxStatus {
         "border": boolean;
-        "color": 'orange' | 'ocean' | 'grey' | 'light-grey' | 'red' | 'green' | 'berry';
+        "color": 'engineering-100' | 'engineering-200' | 'engineering-300' | 'engineering-400' | 'engineering-500' | 'engineering-600' | 'ocean-100' | 'ocean-200' | 'ocean-300' | 'ocean-400' | 'ocean-500' | 'ocean-600' | 'ocean-700' | 'red-500' | 'red-600' | 'red-700' | 'orange-500' | 'green-500' | 'lawn-400' | 'lawn-500' | 'lawn-700' | 'berry-400' | 'berry-500' | 'sun-400' | 'sun-500' | 'sand-400' | 'sand-500';
         "label": string;
     }
     interface IfxStep {
@@ -508,13 +508,6 @@ export namespace Components {
     interface IfxTag {
         "icon": string;
     }
-    interface IfxTemplate {
-        "name": string;
-        "thumbnail": string;
-        "toggleTemplate": (currTemp: any) => Promise<void>;
-    }
-    interface IfxTemplatesUi {
-    }
     interface IfxTextField {
         "caption": string;
         "disabled": boolean;
@@ -703,10 +696,6 @@ export interface IfxTabsCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIfxTabsElement;
 }
-export interface IfxTemplateCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLIfxTemplateElement;
-}
 export interface IfxTextFieldCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIfxTextFieldElement;
@@ -1561,30 +1550,6 @@ declare global {
         prototype: HTMLIfxTagElement;
         new (): HTMLIfxTagElement;
     };
-    interface HTMLIfxTemplateElementEventMap {
-        "toggleTemplates": any;
-        "fieldError": any;
-    }
-    interface HTMLIfxTemplateElement extends Components.IfxTemplate, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLIfxTemplateElementEventMap>(type: K, listener: (this: HTMLIfxTemplateElement, ev: IfxTemplateCustomEvent<HTMLIfxTemplateElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLIfxTemplateElementEventMap>(type: K, listener: (this: HTMLIfxTemplateElement, ev: IfxTemplateCustomEvent<HTMLIfxTemplateElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
-    }
-    var HTMLIfxTemplateElement: {
-        prototype: HTMLIfxTemplateElement;
-        new (): HTMLIfxTemplateElement;
-    };
-    interface HTMLIfxTemplatesUiElement extends Components.IfxTemplatesUi, HTMLStencilElement {
-    }
-    var HTMLIfxTemplatesUiElement: {
-        prototype: HTMLIfxTemplatesUiElement;
-        new (): HTMLIfxTemplatesUiElement;
-    };
     interface HTMLIfxTextFieldElementEventMap {
         "ifxInput": String;
     }
@@ -1697,8 +1662,6 @@ declare global {
         "ifx-table": HTMLIfxTableElement;
         "ifx-tabs": HTMLIfxTabsElement;
         "ifx-tag": HTMLIfxTagElement;
-        "ifx-template": HTMLIfxTemplateElement;
-        "ifx-templates-ui": HTMLIfxTemplatesUiElement;
         "ifx-text-field": HTMLIfxTextFieldElement;
         "ifx-textarea": HTMLIfxTextareaElement;
         "ifx-tooltip": HTMLIfxTooltipElement;
@@ -2146,7 +2109,7 @@ declare namespace LocalJSX {
     }
     interface IfxStatus {
         "border"?: boolean;
-        "color"?: 'orange' | 'ocean' | 'grey' | 'light-grey' | 'red' | 'green' | 'berry';
+        "color"?: 'engineering-100' | 'engineering-200' | 'engineering-300' | 'engineering-400' | 'engineering-500' | 'engineering-600' | 'ocean-100' | 'ocean-200' | 'ocean-300' | 'ocean-400' | 'ocean-500' | 'ocean-600' | 'ocean-700' | 'red-500' | 'red-600' | 'red-700' | 'orange-500' | 'green-500' | 'lawn-400' | 'lawn-500' | 'lawn-700' | 'berry-400' | 'berry-500' | 'sun-400' | 'sun-500' | 'sand-400' | 'sand-500';
         "label"?: string;
     }
     interface IfxStep {
@@ -2198,14 +2161,6 @@ declare namespace LocalJSX {
     interface IfxTag {
         "icon"?: string;
     }
-    interface IfxTemplate {
-        "name"?: string;
-        "onFieldError"?: (event: IfxTemplateCustomEvent<any>) => void;
-        "onToggleTemplates"?: (event: IfxTemplateCustomEvent<any>) => void;
-        "thumbnail"?: string;
-    }
-    interface IfxTemplatesUi {
-    }
     interface IfxTextField {
         "caption"?: string;
         "disabled"?: boolean;
@@ -2317,8 +2272,6 @@ declare namespace LocalJSX {
         "ifx-table": IfxTable;
         "ifx-tabs": IfxTabs;
         "ifx-tag": IfxTag;
-        "ifx-template": IfxTemplate;
-        "ifx-templates-ui": IfxTemplatesUi;
         "ifx-text-field": IfxTextField;
         "ifx-textarea": IfxTextarea;
         "ifx-tooltip": IfxTooltip;
@@ -2399,8 +2352,6 @@ declare module "@stencil/core" {
             "ifx-table": LocalJSX.IfxTable & JSXBase.HTMLAttributes<HTMLIfxTableElement>;
             "ifx-tabs": LocalJSX.IfxTabs & JSXBase.HTMLAttributes<HTMLIfxTabsElement>;
             "ifx-tag": LocalJSX.IfxTag & JSXBase.HTMLAttributes<HTMLIfxTagElement>;
-            "ifx-template": LocalJSX.IfxTemplate & JSXBase.HTMLAttributes<HTMLIfxTemplateElement>;
-            "ifx-templates-ui": LocalJSX.IfxTemplatesUi & JSXBase.HTMLAttributes<HTMLIfxTemplatesUiElement>;
             "ifx-text-field": LocalJSX.IfxTextField & JSXBase.HTMLAttributes<HTMLIfxTextFieldElement>;
             "ifx-textarea": LocalJSX.IfxTextarea & JSXBase.HTMLAttributes<HTMLIfxTextareaElement>;
             "ifx-tooltip": LocalJSX.IfxTooltip & JSXBase.HTMLAttributes<HTMLIfxTooltipElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@infineon/infineon-design-system-stencil",
-  "version": "30.15.1--canary.1496.014a56d3380588605dda6607d613bb2b29c87a63.0",
+  "version": "30.16.0--canary.1678.82835147934b69e511828b622ed33a769b46def5.0",
   "private": false,
   "description": "Infineon design system Stencil web components",
   "homepage": "https://infineon.github.io/infineon-design-system-stencil",

package/dist/cjs/ifx-alert_2.cjs.entry.js

@@ -1,195 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5a25fafd.js');
-
-const alertCss = ":root{--ifx-font-family:\"Source Sans 3\";font-family:var(--ifx-font-family, sans-serif)}:host{display:block}.alert__info-wrapper{display:flex;padding:16px 24px;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert__info-wrapper .info__text-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper,.alert__info-wrapper .info__text-wrapper .info__description-wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper ::slotted(p),.alert__info-wrapper .info__text-wrapper .info__description-wrapper ::slotted(p){padding:0;margin:0}.alert__info-wrapper .info__text-wrapper .info__description-wrapper{font-weight:400}.alert__info-wrapper .close-icon-wrapper{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.alert__info-wrapper .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert__info-wrapper .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert{display:flex;border:1px solid #0A8276;border-radius:1px;color:#1D1D1D;background-color:#FFFFFF;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert .close-icon-wrapper{display:flex;align-items:center;justify-content:center;min-width:40px}.alert .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert .icon-wrapper{position:relative;min-width:48px;display:flex;justify-content:center;align-items:center;background-color:#0A8276}.alert .alert-text{font-size:16px;width:100%;padding:12px 0px 12px 12px;color:#1D1D1D;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;}.alert.primary{border:1px solid #0A8276}.alert.primary .icon-wrapper{background-color:#0A8276;color:#FFFFFF}.alert.success{border:1px solid #4CA460}.alert.success .icon-wrapper{background-color:#4CA460;color:#FFFFFF}.alert.danger{border:1px solid #CD002F}.alert.danger .icon-wrapper{background-color:#CD002F;color:#FFFFFF}.alert.warning{border:1px solid #E16B25}.alert.warning .icon-wrapper{background-color:#E16B25;color:#FFFFFF}.close-icon-wrapper ifx-icon:hover{cursor:pointer}";
-const IfxAlertStyle0 = alertCss;
-
-const Alert = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.ifxClose = index.createEvent(this, "ifxClose", 7);
-        this.variant = 'primary';
-        this.closable = true;
-        this.AriaLive = 'assertive';
-        this.alertTypeDescription = {
-            "primary": 'Neutral alert',
-            "success": 'Success Alert',
-            "danger": 'Error Alert',
-            "warning": 'Warning Alert',
-            "info": 'Neutral alert',
-        };
-    }
-    handleClose() {
-        this.ifxClose.emit();
-    }
-    renderCloseButton() {
-        return (index.h("div", { class: "close-icon-wrapper" }, index.h("button", { onClick: this.handleClose.bind(this), "aria-label": "Dismiss alert" }, index.h("ifx-icon", { icon: "cross-16" }))));
-    }
-    generateUniqueId(prefix = 'id') {
-        return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;
-    }
-    componentWillLoad() {
-        if (!this.uniqueId) {
-            this.uniqueId = this.generateUniqueId('alert');
-        }
-    }
-    render() {
-        return this.variant === 'info' ? (index.h("div", { class: "alert__info-wrapper", role: "alert", "aria-live": this.AriaLive, "aria-describedby": this.alertTypeDescription[this.variant], "aria-labelledby": "alert-text alert-description" }, index.h("div", { class: "info__text-wrapper" }, index.h("div", { class: "info__headline-wrapper" }, index.h("slot", { name: "headline" })), index.h("div", { id: `alert-description-${this.uniqueId}`, class: "info__description-wrapper" }, index.h("slot", { name: "desc" }))), this.closable ? this.renderCloseButton() : null)) : (index.h("div", { class: `alert ${this.variant}`, role: "alert" }, this.icon && (index.h("div", { class: "icon-wrapper" }, index.h("ifx-icon", { icon: this.icon }))), index.h("div", { class: "alert-text", id: `alert-text-${this.uniqueId}` }, index.h("slot", null)), this.closable ? this.renderCloseButton() : null));
-    }
-};
-Alert.style = IfxAlertStyle0;
-
-const templateCss = ".react__template-wrapper{display:flex;width:300px;height:200px;border-radius:3px;border:1px solid #ccc}.react__template-wrapper.hide{display:none}.react__template-wrapper:hover{cursor:pointer}.template__page-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.template__page-wrapper .repository__url{text-decoration:none}.input__fields-wrapper{display:flex;flex-direction:column;gap:10px}.details__wrapper{display:flex;flex-direction:column;gap:10px}.selection__buttons-wrapper{display:flex;gap:10px;padding-top:10px;align-items:center}.selection__buttons-wrapper .vue__label{color:#ccc}.selection__buttons-wrapper label:not(.vue__label):hover{cursor:pointer}.selection__buttons-wrapper .selection__input{display:flex;align-items:center;gap:5px}.selection__buttons-wrapper .selection__input input{margin:0;height:20px;width:20px}.selection__buttons-wrapper .selection__input input:hover:not(.vue__input){cursor:pointer}.image__wrapper img{position:relative;width:300px;height:100%;border-radius:3px;object-fit:contain;transition:transform 0.2s}.image__wrapper img:hover{transform:scale(2);top:50px;z-index:100}";
-const IfxTemplateStyle0 = templateCss;
-
-const Template = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.toggleTemplates = index.createEvent(this, "toggleTemplates", 7);
-        this.fieldError = index.createEvent(this, "fieldError", 7);
-        this.repoDetails = { name: "", desc: "", framework: "" };
-        this.showDetails = false;
-        this.isTemplatePage = false;
-        this.isLoading = true;
-    }
-    authUser() {
-        const clientId = undefined;
-        const redirectUri = 'http://localhost:6262/?path=/docs/dds-templates--development';
-        const scope = undefined;
-        const state = undefined;
-        const authorizationUrl = `https://github.com/login/oauth/authorize?` +
-            `client_id=${clientId}&` +
-            `redirect_uri=${redirectUri}&` +
-            `scope=${scope}&` +
-            `state=${state}`;
-        window.open(authorizationUrl, '_blank');
-    }
-    componentDidLoad() {
-        const url = new URL(window.location.href);
-        const code = url.searchParams.get('code');
-        const { templateName } = this.getLocalStorageValues();
-        if (code && this.name === templateName) {
-            this.isTemplatePage = true;
-            this.toggleTemplates.emit('details');
-            this.getUserToken(code);
-        }
-    }
-    getLocalStorageValues() {
-        const repoName = localStorage.getItem('repo_name');
-        const repoDesc = localStorage.getItem('repo_desc');
-        const repoFramework = localStorage.getItem('repo_framework');
-        const templateName = localStorage.getItem('selectedTemplate');
-        return { repoName, repoDesc, repoFramework, templateName };
-    }
-    async getUserToken(authCode) {
-        const { repoName, repoDesc, repoFramework, templateName } = this.getLocalStorageValues();
-        fetch(`http://dds-templates.eu-central-1.elasticbeanstalk.com/token/${authCode}/${repoName}/${repoDesc}/${repoFramework}/${templateName}`)
-            .then(response => {
-            if (response.ok) {
-                return response.text();
-            }
-            else {
-                return response.text().then(errorMessage => {
-                    throw new Error(errorMessage);
-                });
-            }
-        })
-            .then(data => {
-            if (data) {
-                this.isLoading = false;
-                this.repoUrl = data;
-                localStorage.clear();
-            }
-        })
-            .catch(error => {
-            this.repoError = error.message;
-            console.error('Error:', error.message);
-        });
-    }
-    handleUserInput(e, type) {
-        if (type === 'name') {
-            this.repoDetails = Object.assign(Object.assign({}, this.repoDetails), { name: e.target.value });
-        }
-        else if (type === 'desc') {
-            this.repoDetails = Object.assign(Object.assign({}, this.repoDetails), { desc: e.target.value });
-        }
-        else if (type === 'framework') {
-            this.repoDetails = Object.assign(Object.assign({}, this.repoDetails), { framework: e.target.value });
-        }
-    }
-    submitUserData() {
-        if (this.repoDetails.name && this.repoDetails.desc && this.repoDetails.framework) {
-            localStorage.setItem('repo_name', this.repoDetails.name);
-            localStorage.setItem('repo_desc', this.repoDetails.desc);
-            localStorage.setItem('repo_framework', this.repoDetails.framework);
-            localStorage.setItem('selectedTemplate', this.name);
-            this.fieldError.emit(false);
-            this.authUser();
-        }
-        else {
-            this.fieldError.emit('All fields are mandatory');
-        }
-    }
-    togglePadding(action) {
-        let parent = this.el.parentElement;
-        if (parent) {
-            const rootNode = parent.getRootNode();
-            if (rootNode instanceof ShadowRoot) {
-                parent = rootNode.host.parentElement;
-            }
-            else {
-                parent = parent.parentElement;
-            }
-            if (action === 'remove') {
-                parent.parentElement.style.padding = '0px';
-            }
-            else if (action === 'add') {
-                parent.parentElement.style.padding = '4rem 20px';
-            }
-        }
-    }
-    handleCurrentTemplate(e) {
-        if (e && !this.showDetails) {
-            this.togglePadding('remove');
-            const targetTemplate = e.currentTarget;
-            this.toggleTemplates.emit(targetTemplate);
-            this.showDetails = true;
-        }
-    }
-    async toggleTemplate(currTemp) {
-        const templateWrapper = this.el.shadowRoot.querySelector('.react__template-wrapper');
-        if (templateWrapper) {
-            if (!templateWrapper.classList.contains('hide') && currTemp) {
-                if (templateWrapper !== currTemp) {
-                    templateWrapper.classList.add('hide');
-                }
-            }
-            else {
-                if (this.showDetails) {
-                    this.showDetails = false;
-                }
-                this.togglePadding('add');
-                templateWrapper.classList.remove('hide');
-            }
-        }
-    }
-    render() {
-        return (index.h("div", { key: 'df42f1a8fd4452e706e259c0229d623903393a37' }, this.isTemplatePage
-            ?
-                index.h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError &&
-                    index.h("div", null, index.h("h3", null, "Your repository is getting ready.."), index.h("p", null, "This will only take a minute.")), this.isLoading && !this.repoError && index.h("div", null, index.h("ifx-spinner", { variant: 'default', size: 's' })), this.repoUrl && index.h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository"), this.repoError && index.h("div", null, this.repoError))
-            :
-                index.h("div", { class: "react__template-container" }, index.h("div", { class: "react__template-wrapper", onClick: (e) => this.handleCurrentTemplate(e) }, index.h("div", { class: "image__wrapper" }, index.h("img", { src: this.thumbnail }))), this.showDetails &&
-                    index.h("div", { class: "details__wrapper" }, index.h("div", { class: "selection__buttons-wrapper" }, index.h("div", { class: "selection__input" }, index.h("input", { type: "radio", id: "react", name: "chosen_framework", value: "react", onInput: (e) => this.handleUserInput(e, 'framework') }), index.h("label", { htmlFor: "react" }, "React")), index.h("div", { class: "selection__input vue" }, index.h("input", { class: "vue__input", disabled: true, type: "radio", id: "vue", name: "chosen_framework", value: "vue", onInput: (e) => this.handleUserInput(e, 'framework') }), index.h("label", { class: "vue__label", htmlFor: "vue" }, "Vue"), " (Soon)")), index.h("div", { class: "input__fields-wrapper" }, index.h("ifx-text-field", { required: true, onInput: (e) => this.handleUserInput(e, 'name'), size: "m", icon: "c-info-16", placeholder: "Your repository name" }, "Repository Name"), index.h("ifx-text-field", { required: true, size: "m", icon: "c-info-16", onInput: (e) => this.handleUserInput(e, 'desc'), placeholder: "Your repository description" }, "Repository Description"), index.h("ifx-button", { fullWidth: true, onClick: () => this.submitUserData(), variant: 'primary' }, "Generate template"))))));
-    }
-    get el() { return index.getElement(this); }
-};
-Template.style = IfxTemplateStyle0;
-
-exports.ifx_alert = Alert;
-exports.ifx_template = Template;
-
-//# sourceMappingURL=ifx-alert_2.cjs.entry.js.map

package/dist/cjs/ifx-alert_2.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"ifx-alert.ifx-template.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/alert/alert.scss?tag=ifx-alert&encapsulation=shadow","src/components/alert/alert.tsx","src/components/templates/template/template.scss?tag=ifx-template&encapsulation=shadow","src/components/templates/template/template.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: block;\n}\n\n.alert__info-wrapper {\n  display: flex;\n  padding: 16px 24px;\n  font-family: var(--ifx-font-family);\n  box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n\n\n  & .info__text-wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: tokens.$ifxSpace100;\n    width: 100%;\n\n    & .info__headline-wrapper {\n      display: -webkit-box;\n      -webkit-line-clamp: 1;\n      line-clamp: 1;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    & .info__headline-wrapper,\n    .info__description-wrapper {\n      color: #1D1D1D;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 24px;\n\n      ::slotted(p) {\n        padding: 0;\n        margin: 0;\n      }\n    }\n\n    & .info__description-wrapper {\n      font-weight: 400;\n    }\n  }\n\n  & .close-icon-wrapper {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    justify-content: flex-start;\n    //min-width: tokens.$ifxSize500;\n\n    & button {\n      all: unset;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      line-height: 0;\n      color: tokens.$ifxColorBaseBlack;\n      height: tokens.$ifxSize300;\n      width: tokens.$ifxSize300;\n\n\n      &:focus {\n        outline: 2px solid tokens.$ifxColorOcean500;\n        outline-offset: 2px;\n      }\n    }\n  }\n}\n\n.alert {\n  display: flex;\n  border: 1px solid tokens.$ifxColorOcean500;\n  border-radius: tokens.$ifxBorderRadius12;\n  color: tokens.$ifxColorBaseBlack;\n  background-color: tokens.$ifxColorBaseWhite;\n  font-family: var(--ifx-font-family);\n  box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n\n\n  & .close-icon-wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-width: tokens.$ifxSize500;\n\n    & button {\n      all: unset;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      line-height: 0;\n      color: tokens.$ifxColorBaseBlack;\n      height: tokens.$ifxSize300;\n      width: tokens.$ifxSize300;\n\n      &:focus {\n        outline: 2px solid tokens.$ifxColorOcean500;\n        outline-offset: 2px;\n      }\n    }\n  }\n\n  & .icon-wrapper {\n    position: relative;\n    min-width: tokens.$ifxSize600;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background-color: tokens.$ifxColorOcean500;\n  }\n\n  & .alert-text {\n    font-size: 16px;\n    width: 100%;\n    padding: 12px 0px 12px 12px;\n    color: tokens.$ifxColorBaseBlack;\n\n    white-space: pre-wrap;\n    /* wraps text at spaces and within words */\n    word-wrap: break-word;\n    /* breaks text within a word if necessary */\n    overflow-wrap: anywhere;\n    /* breaks text at arbitrary points when needed */\n  }\n\n  &.primary {\n    border: 1px solid tokens.$ifxColorOcean500;\n\n    & .icon-wrapper {\n      background-color: tokens.$ifxColorOcean500;\n      color: tokens.$ifxColorBaseWhite;\n    }\n  }\n\n  &.success {\n    border: 1px solid tokens.$ifxColorGreen500;\n\n    & .icon-wrapper {\n      background-color: tokens.$ifxColorGreen500;\n      color: tokens.$ifxColorBaseWhite;\n    }\n  }\n\n  &.danger {\n    border: 1px solid tokens.$ifxColorRed500;\n\n    & .icon-wrapper {\n      background-color: tokens.$ifxColorRed500;\n      color: tokens.$ifxColorBaseWhite;\n    }\n  }\n\n  &.warning {\n    border: 1px solid tokens.$ifxColorOrange500;\n\n    & .icon-wrapper {\n      background-color: tokens.$ifxColorOrange500;\n      color: tokens.$ifxColorBaseWhite;\n    }\n  }\n}\n\n.close-icon-wrapper {\n  & ifx-icon {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n}","import { Component, Prop, h, Event, EventEmitter, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-alert',\n  styleUrl: 'alert.scss',\n  shadow: true,\n})\nexport class Alert {\n  @Prop() variant: 'primary' | 'success' | 'danger' | 'warning' | 'info' = 'primary';\n  @Prop() icon: string;\n  @Event() ifxClose: EventEmitter;\n  @Prop() closable: boolean = true;\n  @Prop() AriaLive = 'assertive';\n  @State() uniqueId: string;\n\n  alertTypeDescription = {\n    \"primary\": 'Neutral alert',\n    \"success\": 'Success Alert',\n    \"danger\": 'Error Alert',\n    \"warning\": 'Warning Alert',\n    \"info\": 'Neutral alert',\n  };\n\n  handleClose() {\n    this.ifxClose.emit();\n  }\n\n  renderCloseButton() {\n    return (\n      <div class=\"close-icon-wrapper\">\n        <button onClick={this.handleClose.bind(this)} aria-label=\"Dismiss alert\">\n          <ifx-icon icon=\"cross-16\" />\n        </button>\n      </div>\n    );\n  }\n\n  generateUniqueId(prefix = 'id') {\n    return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n  }\n\n  componentWillLoad() { \n    if (!this.uniqueId) {\n      this.uniqueId = this.generateUniqueId('alert');\n    }\n  }\n\n  render() {\n    return this.variant === 'info' ? (\n      <div class=\"alert__info-wrapper\" role=\"alert\" aria-live={this.AriaLive} aria-describedby={this.alertTypeDescription[this.variant]} aria-labelledby=\"alert-text alert-description\">\n        <div class=\"info__text-wrapper\">\n          <div class=\"info__headline-wrapper\">\n            <slot name=\"headline\" />\n          </div>\n          <div id={`alert-description-${this.uniqueId}`} class=\"info__description-wrapper\">\n            <slot name=\"desc\" />\n          </div>\n        </div>\n        {this.closable ? this.renderCloseButton() : null}\n      </div>\n    ) : (\n      <div class={`alert ${this.variant}`} role=\"alert\">\n        {this.icon && (\n          <div class=\"icon-wrapper\">\n            <ifx-icon icon={this.icon} />\n          </div>\n        )}\n        <div class=\"alert-text\" id={`alert-text-${this.uniqueId}`}>\n          <slot />\n        </div>\n        {this.closable ? this.renderCloseButton() : null}\n      </div>\n    );\n  }\n}\n","\n.react__template-wrapper { \n  display: flex;\n  width: 300px;\n  height: 200px;\n  border-radius: 3px;\n  border: 1px solid #ccc;\n\n  &.hide { \n    display: none;\n  }\n  \n  &:hover { \n    cursor: pointer;\n  }\n}\n\n.template__page-wrapper {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  & .repository__url { \n    text-decoration: none;\n  }\n}\n\n.input__fields-wrapper { \n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n\n}\n\n.details__wrapper { \n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n\n.selection__buttons-wrapper { \n  display: flex;\n  gap: 10px;\n  padding-top: 10px;\n  align-items: center;\n  & .vue__label { \n    color: #ccc;\n  }\n\n  & label:not(.vue__label) { \n    &:hover { \n      cursor: pointer;\n    }\n  }\n\n  & .selection__input { \n    display: flex;\n    align-items: center;\n    gap: 5px;\n    & input { \n      margin: 0;\n      height: 20px;\n      width: 20px;\n      &:hover:not(.vue__input) { \n        cursor: pointer;\n      }\n    }\n  }\n}\n\n.image__wrapper { \n  img { \n    position: relative;\n    width: 300px;\n    height: 100%;\n    border-radius: 3px;\n    object-fit: contain;\n    transition: transform .2s;\n    &:hover { \n      transform: scale(2);\n      top: 50px;\n      z-index: 100;\n    }\n  }\n}","import { Component, h, Element, State, Prop, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-template',\n  styleUrl: 'template.scss',\n  shadow: true,\n})\nexport class Template {\n  @Element() el: HTMLElement;\n  @State() repoDetails: { name: string, desc: string, framework: string } = { name: \"\", desc: \"\", framework: \"\" };\n  @State() repoUrl: string;\n  @State() showDetails: boolean = false;\n  @State() isTemplatePage: boolean = false;\n  @State() isLoading: boolean = true;\n  @State() repoError: string;\n  @Prop() name: string;\n  @Event() toggleTemplates: EventEmitter;\n  @Event() fieldError: EventEmitter;\n  @Prop() thumbnail: string;\n\n  authUser() { \n    const clientId = process.env.CLIENT_ID;\n    const redirectUri = 'http://localhost:6262/?path=/docs/dds-templates--development';\n    const scope = process.env.SCOPE;\n    const state = process.env.STATE;\n\n    const authorizationUrl = `https://github.com/login/oauth/authorize?` +\n      `client_id=${clientId}&` +\n      `redirect_uri=${redirectUri}&` +\n      `scope=${scope}&` +\n      `state=${state}`;\n    \n      window.open(authorizationUrl, '_blank'); \n  }\n\n  componentDidLoad() { \n    const url = new URL(window.location.href);\n    const code = url.searchParams.get('code');\n    const { templateName } = this.getLocalStorageValues()\n    if(code && this.name === templateName) { \n      this.isTemplatePage = true;\n      this.toggleTemplates.emit('details')\n      this.getUserToken(code)\n    } \n  }\n\n  getLocalStorageValues() { \n    const repoName = localStorage.getItem('repo_name');\n    const repoDesc = localStorage.getItem('repo_desc');\n    const repoFramework = localStorage.getItem('repo_framework');\n    const templateName = localStorage.getItem('selectedTemplate');\n    return { repoName, repoDesc, repoFramework, templateName }\n  }\n\n  async getUserToken(authCode) {\n    const { repoName, repoDesc, repoFramework, templateName } = this.getLocalStorageValues();\n\n    fetch(`http://dds-templates.eu-central-1.elasticbeanstalk.com/token/${authCode}/${repoName}/${repoDesc}/${repoFramework}/${templateName}`)\n    .then(response => {\n      if (response.ok) {\n        return response.text();\n      } else {\n        return response.text().then(errorMessage => {\n          throw new Error(errorMessage);\n        });\n      }\n    })\n    .then(data => { \n      if(data) { \n        this.isLoading = false;\n        this.repoUrl = data;\n        localStorage.clear();\n      } \n    })\n    .catch(error => {\n      this.repoError = error.message;\n      console.error('Error:', error.message)\n    });\n  }\n\n  handleUserInput(e, type) { \n    if (type === 'name') {\n      this.repoDetails = { ...this.repoDetails, name: e.target.value };\n    } else if (type === 'desc') {\n      this.repoDetails = { ...this.repoDetails, desc: e.target.value };\n    } else if(type === 'framework') { \n      this.repoDetails = { ...this.repoDetails, framework: e.target.value };\n    }\n  }\n\n  submitUserData() { \n    if(this.repoDetails.name && this.repoDetails.desc && this.repoDetails.framework) { \n      localStorage.setItem('repo_name', this.repoDetails.name);\n      localStorage.setItem('repo_desc', this.repoDetails.desc);\n      localStorage.setItem('repo_framework', this.repoDetails.framework);\n      localStorage.setItem('selectedTemplate', this.name);\n      this.fieldError.emit(false)\n      this.authUser()\n    } else { \n      this.fieldError.emit('All fields are mandatory')\n    }\n  }\n\n  togglePadding(action) { \n    let parent = this.el.parentElement;\n    if (parent) {\n      const rootNode = parent.getRootNode();\n      if (rootNode instanceof ShadowRoot) {\n        parent = rootNode.host.parentElement;\n      } else {\n        parent = parent.parentElement;\n      }\n      if(action === 'remove') { \n        parent.parentElement.style.padding = '0px';\n      } else if(action === 'add') { \n        parent.parentElement.style.padding = '4rem 20px';\n      }\n    }\n  }\n\n  handleCurrentTemplate(e) { \n    if(e && !this.showDetails) { \n      this.togglePadding('remove')\n      const targetTemplate = e.currentTarget;\n      this.toggleTemplates.emit(targetTemplate)\n      this.showDetails = true;\n    } \n  }\n\n  @Method()\n  async toggleTemplate(currTemp) { \n    const templateWrapper = this.el.shadowRoot.querySelector('.react__template-wrapper');\n    if(templateWrapper) { \n      if(!templateWrapper.classList.contains('hide') && currTemp ) { \n        if(templateWrapper !== currTemp) {\n          templateWrapper.classList.add('hide')\n        }\n      } else { \n        if(this.showDetails) { \n          this.showDetails = false;\n        }\n        this.togglePadding('add')\n        templateWrapper.classList.remove('hide')\n      }\n    }\n  }\n\n \n  render() {\n      return (\n        <div>\n          {this.isTemplatePage \n          ? \n          <div class=\"template__page-wrapper\">\n            {!this.repoUrl && !this.repoError && \n            <div>\n              <h3>Your repository is getting ready..</h3>\n              <p>This will only take a minute.</p>\n            </div>}\n            {this.isLoading && !this.repoError && <div><ifx-spinner variant='default' size='s' /></div>}\n            {this.repoUrl && <ifx-link href={this.repoUrl} target=\"_parent\" size=\"m\" variant=\"underlined\">Your repository</ifx-link>}\n            {this.repoError && <div>{this.repoError}</div>}\n          </div> \n          : \n          <div class=\"react__template-container\">\n              <div class=\"react__template-wrapper\" onClick={(e) => this.handleCurrentTemplate(e)}>\n                <div class=\"image__wrapper\">\n                  <img src={this.thumbnail} />\n                </div>\n              </div>\n            {this.showDetails && \n            <div class=\"details__wrapper\">\n              <div class=\"selection__buttons-wrapper\">\n                <div class=\"selection__input\">\n                  <input type=\"radio\" id=\"react\" name=\"chosen_framework\" value=\"react\" onInput={(e) => this.handleUserInput(e, 'framework')}  />\n                  <label htmlFor=\"react\">React</label>\n                </div>\n                <div class=\"selection__input vue\">\n                  <input class=\"vue__input\" disabled type=\"radio\" id=\"vue\" name=\"chosen_framework\" value=\"vue\" onInput={(e) => this.handleUserInput(e, 'framework')}/>\n                  <label class=\"vue__label\" htmlFor=\"vue\">Vue</label> (Soon)\n                </div>\n              </div>\n           \n\n              <div class=\"input__fields-wrapper\">\n                <ifx-text-field required={true} onInput={(e) => this.handleUserInput(e, 'name')} size=\"m\" icon=\"c-info-16\" placeholder=\"Your repository name\">Repository Name</ifx-text-field>\n\n                <ifx-text-field required={true} size=\"m\" icon=\"c-info-16\" onInput={(e) => this.handleUserInput(e, 'desc')} placeholder=\"Your repository description\">Repository Description</ifx-text-field>\n\n                <ifx-button fullWidth={true} onClick={() => this.submitUserData()} variant='primary'>Generate template</ifx-button>\n              </div>\n              \n            </div>}\n          </div>}\n        </div>\n      );\n  }\n}"],"version":3}