@infineon/infineon-design-system-stencil 36.0.1--canary.1908.e3c942b5c279a59bb3e5438726fa057c76c21c04.0 → 36.0.1--canary.1908.cf3e1b7f585cf71f1fed0fcfa052b595e47b0b87.0

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

@@ -100,7 +100,7 @@ const Button = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'a220864c79a3eee88b277dd2277487581c7de8b0' }, index.h("a", { key: '4fd4cbd07205a0f538cf4d977a1b88d23d64be36', role: this.href ? 'link' : 'button', tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.focusableElement = el), class: this.getClassNames(), href: !this.disabled ? this.internalHref : undefined, target: this.target, onClick: this.handleClick, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, onFocus: (event) => this.handleFocus(event), "aria-disabled": this.disabled ? 'true' : null, "aria-describedby": this.theme === 'danger' ? 'Dangerous action' : undefined, "aria-label": this.ariaLabel || undefined }, index.h("slot", { key: 'f64f20c4b3d1af19c6276713aef4e230d7aaf0e3' }))));
+        return (index.h(index.Host, { key: 'd7b3a89dcd4240f3a44aa05346c9bce375476826' }, index.h("a", { key: '55374b7ac6ba50bc074042f49b0718be4c1442f1', role: this.href ? 'link' : 'button', tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.focusableElement = el), class: this.getClassNames(), href: !this.disabled ? this.internalHref : undefined, target: this.target, onClick: this.handleClick, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, onFocus: (event) => this.handleFocus(event), "aria-disabled": this.disabled ? 'true' : null, "aria-describedby": this.theme === 'danger' ? 'Dangerous action' : undefined, "aria-label": this.ariaLabel || undefined }, index.h("slot", { key: 'ae683451c19f6eb433211d46913f6d8b279f987a' }))));
     }
     getVariantClass() {
         return `${this.variant}` === "secondary"

package/dist/cjs/ifx-card-headline.cjs.entry.js

@@ -23,7 +23,7 @@ const CardHeadline = class {
         }
     }
     render() {
-        return (index.h("div", { key: '3599127fad1e7dc563064d38df9996bcd7bd9217', class: `card__headline-wrapper ${this.hasDesc ? 'withDesc' : ""}` }, index.h("div", { key: '643428271dec2bdf71c7059bf6e28c00cae9438b', class: `card-headline ${this.direction}` }, index.h("slot", { key: '3b7ec4e25a399e96a0db4f03d793109eabf08fff' }))));
+        return (index.h("div", { key: '47588e8b38e5eadd66a42a132b54e55b2aab2072', class: `card__headline-wrapper ${this.hasDesc ? 'withDesc' : ""}` }, index.h("div", { key: '21458ea6b7000ae25a6665b34bcefe685685d505', class: `card-headline ${this.direction}` }, index.h("slot", { key: '5867b5fadc6f8da67d4123aa4cfdb968dca9ea51' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ifx-card-image.cjs.entry.js

@@ -19,7 +19,7 @@ const CardImage = class {
         this.handlePosition(this.position);
     }
     render() {
-        return (index.h("img", { key: 'e08992cdb9c62e7b4f98d58d39457702233ee300', src: this.src, alt: this.alt, class: "card-image" }));
+        return (index.h("img", { key: '78a305df396a6aa5a1bb5c4fcd58b327f946a60f', src: this.src, alt: this.alt, class: "card-image" }));
     }
 };
 CardImage.style = cardImageCss;

package/dist/cjs/ifx-card-links.cjs.entry.js

@@ -9,7 +9,7 @@ const CardLinks = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: '2f4e55e1890a5d5f749d0e951d6971d8cf1b0875', class: 'container' }, index.h("slot", { key: '7e0c1226088fcd91ffee21b817f89970bc3ab772' })));
+        return (index.h("div", { key: '41e502507eeb40503dce46238ad0e2cd1dffeecc', class: 'container' }, index.h("slot", { key: 'ec074005fe54e49c6b6fb1ecaf12a2c1d0b6a626' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ifx-card-overline.cjs.entry.js

@@ -9,7 +9,7 @@ const CardOverline = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: 'edb86d9c621859391a960610c81ab5fa3a3558fd', class: "card-overline" }, index.h("slot", { key: '2b4846831c111a2b598b6632559b5346c152568f' })));
+        return (index.h("div", { key: '2e55a25825611cd059d62b8079faf8dce297a921', class: "card-overline" }, index.h("slot", { key: 'ff34f792d4f488c8de6bcb38a579a73cf3d4cadc' })));
     }
 };
 CardOverline.style = cardOverlineCss;

package/dist/cjs/ifx-card-text.cjs.entry.js

@@ -16,7 +16,7 @@ const CardText = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'fea1823e8000b8699142eefb127eb1716a606bcd', class: `card__text-wrapper ${this.hasBtn ? 'hasBtn' : ""}` }, index.h("div", { key: 'ee9baf1f210a6bf109669d3dbb075f56cf52ee22', class: `card-text` }, index.h("slot", { key: 'd4e94f54325b349d0a908f1812412e4a6ff1adad' }))));
+        return (index.h("div", { key: 'd3ddbfaaa3b99504f89bc8e0e0dc32c50309f5d0', class: `card__text-wrapper ${this.hasBtn ? 'hasBtn' : ""}` }, index.h("div", { key: '1d3c8311a5100e6c85c99c64a82de5520d11e61f', class: `card-text` }, index.h("slot", { key: '73182b12dab027838499e75c72026e8d6f311b0c' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -44,12 +44,12 @@ const Card = class {
         this.handleComponentAdjustment();
     }
     render() {
-        return (index.h(index.Host, { key: 'aac222aafe681f2024929060a46f5b044b65e772' }, index.h("div", { key: '9c2f93b40bad857af634c16a9a0459763fada288', "aria-label": this.ariaLabel, class: `card 
+        return (index.h(index.Host, { key: '78369f8e134ac9a5be444a126e4f1c16cf326f72' }, index.h("div", { key: '11985e2318ed0a4a10901aa4105877b5b82f052e', "aria-label": this.ariaLabel, class: `card 
           ${this.noBtns ? 'noBtns' : ""}
           ${this.direction} 
           ${this.alignment}`, role: "region" }, this.direction === 'horizontal' &&
-            index.h("div", { key: 'a9ecc08c4a5f7c2f7830256e289f485f6422160a', class: "horizontal" }, index.h("a", { key: '09b1ebffcb703fe8c72224575dd5fe172b741533', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, index.h("slot", { key: '1e7bf2700feecf9e35a2aed787f476317252413e', name: "img" })), index.h("div", { key: '15dda4cdf697bd72673fecc3ad939d30136ca82f', class: 'lower__body-wrapper' }, index.h("a", { key: '6a20bfbed8fb327cb8f2df9caa7197966362a98f', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, index.h("slot", { key: 'a8d8aa70a1ec0e06f6dcea7e34cab24563465d50' })), index.h("div", { key: '70697a5b69ba9588cd6d81fcdf47cb59d3537461' }, index.h("slot", { key: '186152dfa577d47b1edf242a27044de3470f8ae5', name: 'buttons' })))), this.direction === 'vertical' &&
-            index.h("div", { key: '7e213f66b9c1ce9d0ab67623a3c125783dd0035b', class: "vertical" }, index.h("a", { key: '3431f72726f0e0019f3dd67fb3290c7003c22ed4', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, index.h("div", { key: '1ec3dcd109dda21e13aa45ca679159f5b7b6e91d', class: `card-img ${this.noImg ? 'noImage' : ""}` }, index.h("slot", { key: '64a6aae3e828e1741fd55d6fc8b53de5fbf5b3b9', name: "img" })), index.h("div", { key: '128d6712a7792d33ad77c3761aa3a9c4702cbd49', class: 'upper-body' }, index.h("slot", { key: '8e8ea25bfb8409692b0579393045a0f5e117e0f3' }))), index.h("div", { key: '5989e1234a290faf4e1676dc53a5c009eb1e35b4', class: 'lower__body-wrapper' }, index.h("slot", { key: 'c06013bd5b0db5b8b40251bf6a2960d60205f2a0', name: 'buttons' }))))));
+            index.h("div", { key: 'a2953771fd2463dc22f61b2e0b2b74f0a72676e1', class: "horizontal" }, index.h("a", { key: '82e447ac989e6eb46da6537c6e8301d9cbc3f1fe', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, index.h("slot", { key: '283b5316652ef266cd445f78fdc5b8e2714ed41e', name: "img" })), index.h("div", { key: 'bf364c4b4c85c815d274d70dc942b2eaf90c165d', class: 'lower__body-wrapper' }, index.h("a", { key: '9cf2b564ac56722a7c69132f09c2a91d74ff49eb', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, index.h("slot", { key: '125d8b4ca59767385f3a84b5f43eaf00243b2ba6' })), index.h("div", { key: '48c5e246e17d842774d4de81c702675a6e7ffbfd' }, index.h("slot", { key: 'ec3b46c05b98ee9a45abde934cac6e91430e795f', name: 'buttons' })))), this.direction === 'vertical' &&
+            index.h("div", { key: '27bd695057b5c26376543f60945a11c8deb60e6a', class: "vertical" }, index.h("a", { key: '80f3f8ca47ad5b40ad5ec82ce4361a49ae3b38ad', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, index.h("div", { key: '8cad328c4d52256a52f5ab7c3b3d67c2f894ae13', class: `card-img ${this.noImg ? 'noImage' : ""}` }, index.h("slot", { key: '26d9ec8597f719881e6172fbfcb4ac4bf2886855', name: "img" })), index.h("div", { key: '634db847244c2ec83e5ef8795eb5103a7019157b', class: 'upper-body' }, index.h("slot", { key: 'f6a14b70ef7e679592e1481811125e5917d0924c' }))), index.h("div", { key: 'b61fbc4ae5f0e1d6275bb0f89ce0a9123368bb17', class: 'lower__body-wrapper' }, index.h("slot", { key: 'a1b5a9f6a08b440279306f2e722146021016c3cd', name: 'buttons' }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ifx-checkbox-group.cjs.entry.js

@@ -46,7 +46,7 @@ const CheckboxGroup = class {
         this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);
     }
     render() {
-        return (index.h("div", { key: '2f455a4fa40d089e1aafab0b669aa4f4ded80be0', class: 'checkbox-group-container' }, this.showGroupLabel ? index.h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', index.h("div", { key: 'eb6f16bf53e13620681c87eb7cb4062a37abd068', class: `checkbox-group ${this.alignment} ${this.size}` }, index.h("slot", { key: '00ec08507a2ef1ff8e893b6c8b9aa917a7735224', onSlotchange: this.handleSlotChange })), this.showCaption ? (index.h("div", { class: `caption ${this.hasErrors ? 'error' : 'default'}` }, this.showCaptionIcon ? index.h("div", { class: 'caption-icon' }, index.h("ifx-icon", { icon: "c-info-16" })) : '', index.h("div", { class: 'caption-text' }, this.captionText))) : ''));
+        return (index.h("div", { key: '0e1e1ee2ac0c55bf19f7a5fef5a667c49fc6bb0b', class: 'checkbox-group-container' }, this.showGroupLabel ? index.h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', index.h("div", { key: '580f2958a972d42bc3f1fb38928fc53c65a45db1', class: `checkbox-group ${this.alignment} ${this.size}` }, index.h("slot", { key: '6e55a282d938a88a89f5653a604eb155307cfb3a', onSlotchange: this.handleSlotChange })), this.showCaption ? (index.h("div", { class: `caption ${this.hasErrors ? 'error' : 'default'}` }, this.showCaptionIcon ? index.h("div", { class: 'caption-icon' }, index.h("ifx-icon", { icon: "c-info-16" })) : '', index.h("div", { class: 'caption-text' }, this.captionText))) : ''));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -106,12 +106,12 @@ const Checkbox = class {
         if (slot) {
             hasSlot = true;
         }
-        return (index.h("div", { key: 'ae37e8cf56cecc28d1d3441e4ca70a66d19fd4a9', class: "checkbox__container" }, index.h("input", { key: '210ff7879962c1df556491d83d3ebcf7238b6b50', type: "checkbox", hidden: true, ref: (el) => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), id: 'checkbox', value: `${this.value}`, disabled: this.disabled ? true : undefined }), index.h("div", { key: '2b1b2065f41003c4e627e802fa70728f7b884710', tabindex: "0", onClick: this.handleCheckbox.bind(this), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : this.internalChecked.toString(), "aria-disabled": this.disabled, "aria-labelledby": "label", class: `checkbox__wrapper 
+        return (index.h("div", { key: '149f6a9d6f3f1fbe0ed93d38484d9a7f28a05b7f', class: "checkbox__container" }, index.h("input", { key: '1d33a9ee96aa05071affc0a615d13556614b2c0e', type: "checkbox", hidden: true, ref: (el) => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), id: 'checkbox', value: `${this.value}`, disabled: this.disabled ? true : undefined }), index.h("div", { key: 'e8f8c6530a21c653b7653cc91270b06a26d7b942', tabindex: "0", onClick: this.handleCheckbox.bind(this), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : this.internalChecked.toString(), "aria-disabled": this.disabled, "aria-labelledby": "label", class: `checkbox__wrapper 
           ${this.getCheckedClassName()}
         ${this.size === "m" ? "checkbox-m" : ""}
         ${this.indeterminate ? 'indeterminate' : ""}
-        ${this.disabled ? 'disabled' : ""}` }, this.internalChecked && !this.internalIndeterminate && index.h("ifx-icon", { key: 'ca2171404ee8926623bab88b5d4abbb906d66a9d', icon: "check-16", "aria-hidden": "true" })), hasSlot &&
-            index.h("div", { key: 'efb5c73f051dceb60b79220bffd5b1694502be7b', id: "label", class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ""} `, onClick: this.handleCheckbox.bind(this) }, index.h("slot", { key: '1c3d1089dfce161a4e4c093c3211a8d772b3d90b' }))));
+        ${this.disabled ? 'disabled' : ""}` }, this.internalChecked && !this.internalIndeterminate && index.h("ifx-icon", { key: 'aed8151d75e835576bf55ff1cc352e0d94488e3c', icon: "check-16", "aria-hidden": "true" })), hasSlot &&
+            index.h("div", { key: '1dc78c4309ffeb565d4ad53c676c62c38fa38413', id: "label", class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ""} `, onClick: this.handleCheckbox.bind(this) }, index.h("slot", { key: '15efbaff9fe6791627e0c8f6df987433ea0bb97b' }))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -262,17 +262,17 @@ const Chip = class {
         this.syncSelectedOptionsWithProp(this.value);
     }
     render() {
-        return (index.h("div", { key: 'e14109cde5a4d4a9ed84c98ec91f12061c870fd7', class: 'chip' }, index.h("div", { key: 'c53a4141e3c632b7b191c473af84fcea0f1734c6', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
+        return (index.h("div", { key: '637a568cd29e50b18f38f62a48777d7c54fbffa6', class: 'chip' }, index.h("div", { key: '3a6468c99f576279dd883082ed70afa42e64c7dc', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
                   chip__wrapper--${this.variant === 'multi' ? 'multi' : 'single'}
                   ${this.opened && !this.readOnly ? 'chip__wrapper--opened' : ''}
-                  ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, index.h("div", { key: '2dd2d3efa423414c1b2f1d4bb14439ac5f79b6e3', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
+                  ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, index.h("div", { key: '22ea9cf50a3e77f19116e64e51365a8bea48dd24', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
             `${this.placeholder}:`, (this.selectedOptions.length !== 0) &&
-            index.h("div", { key: 'fa10908eb3780826670e4d571a64803d54022d6e', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
-            index.h("ifx-indicator", { key: '1f80e8bffce5a08f712d4e0b8ecb138290752ca2', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
-            index.h("div", { key: 'f9f144b629d6c21c91da36b37ac10667f30a3278', class: 'wrapper__open-button' }, index.h("ifx-icon", { key: 1, icon: `chevron-down-16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
-            index.h("div", { key: '207c2ebcf32b8f86e69d89536223e06b028942a6', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, index.h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
-            index.h("div", { key: '66b7fee014680ed354a33d7f5a3ca991370be17c', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, index.h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
-            index.h("div", { key: '3f47c1664904fa7623f830447ef8d1bb0a4975e9', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, index.h("slot", { key: 'a3fe6154c33599a9cd12f5c7f5ecff99a0330e81' }))));
+            index.h("div", { key: '778190ebe5bd68caf5594c8a9520a5cf52764cb5', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
+            index.h("ifx-indicator", { key: 'f8d961b9354940ab2dda4677539d64e858227551', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
+            index.h("div", { key: '349831d4e87ace96e02493456b6bc3d6dc3b779d', class: 'wrapper__open-button' }, index.h("ifx-icon", { key: 1, icon: `chevron-down-16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
+            index.h("div", { key: 'dec4500f0204fa9f992c12369b85e9f65778a4a7', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, index.h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
+            index.h("div", { key: '58084d5bfac1199339c2a48ea5eeb331556adfc9', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, index.h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
+            index.h("div", { key: 'ee77eb0d1345c1d14a3ae79751c34fe2449e7288', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, index.h("slot", { key: '52c9433f93905262a10496a350a055d72d290ade' }))));
     }
     get chip() { return index.getElement(this); }
     static get watchers() { return {
@@ -343,9 +343,9 @@ const ChipItem = class {
         this.handleSelectedState();
     }
     render() {
-        return (index.h("div", { key: '7ceff18d0a41b419a188d925fd854cc97d7a9ecd', class: `chip-item chip-item--${this.chipState.size} 
+        return (index.h("div", { key: '0feac58e2e7104e948633503bb6e1e41a7933963', class: `chip-item chip-item--${this.chipState.size} 
                     chip-item--${(this.selected && this.chipState.variant) === 'single' ? 'selected' : ''}`, tabIndex: 0, onClick: () => { this.handleItemClick(); }, onKeyDown: (e) => { this.handleItemKeyDown(e); }, role: "option", "aria-selected": this.selected.toString() }, this.chipState.variant === 'multi' &&
-            index.h("ifx-checkbox", { key: 'd2f717951d288aa0863081e54cabf7edd1c6f7e6', checked: this.selected, tabIndex: -1, size: 's' }), index.h("div", { key: 'fff335d9009c93863012f6a4307ed4322413c4f7', class: 'chip-item__label' }, " ", index.h("slot", { key: 'a093e9caf2eecba28c58674dde3f788be1f5849b' }), " "), index.h("div", { key: 'ea76c6b3d0bdd2a687acfbe323ebd9e6d6034a40', class: 'chip-item__selected-indicator' }, index.h("ifx-icon", { key: '5d0ae125cb1ea0297d81d773c9981bd13f0c5759', icon: 'check-16' }, " "))));
+            index.h("ifx-checkbox", { key: '5bff8f27bda9843ffbad86fed014e6f5b1df3b9c', checked: this.selected, tabIndex: -1, size: 's' }), index.h("div", { key: 'e4ed1025410e1821e1549d8f29f7cc6c5ba57a2d', class: 'chip-item__label' }, " ", index.h("slot", { key: '541c9acff7c19e816f75cea1d17de319eefb8536' }), " "), index.h("div", { key: 'e5fc6f9e1d1e40bcc2ac591f2e550abcffa4cdad', class: 'chip-item__selected-indicator' }, index.h("ifx-icon", { key: '24c75f1d1eb8927d5193875aacda59ce9117e0df', icon: 'check-16' }, " "))));
     }
     get chipItem() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ifx-content-switcher-item.cjs.entry.js

@@ -10,7 +10,7 @@ const ContentSwitcherItem = class {
         this.selected = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'cfee4bfa2e7b8f5ba6c88a99baf11e69f3fecc5f' }, index.h("button", { key: '13aa464e8f9f8b2b5cfefd3f20b5dcfdb5d04147', class: 'ifx-content-switcher-item' + (this.selected ? ' selected' : '') }, index.h("slot", { key: '605f9840e2888ba0249e294292a98216297bad0a' }))));
+        return (index.h(index.Host, { key: 'b8dc41db465e008878deb175f09f334f1a5b4723' }, index.h("button", { key: 'e8bd11e7942d2b13e0f8c781724a88d2aa2c93c3', class: 'ifx-content-switcher-item' + (this.selected ? ' selected' : '') }, index.h("slot", { key: '22923a9ed26981d1f6d708a0fc4c60b02644ffff' }))));
     }
 };
 ContentSwitcherItem.style = contentSwitcherItemCss;

package/dist/cjs/ifx-content-switcher.cjs.entry.js

@@ -157,7 +157,7 @@ const ContentSwitcher = class {
         return this.items[index].getAttribute('value') || index.toLocaleString();
     }
     render() {
-        return (index.h(index.Host, { key: '9b3bb93d639c01fa5e006228f44e28578c450e10' }, index.h("div", { key: 'eab613a4ba9055f73e96fd74e42fe3c0787418a8', class: "ifx-content-switcher", role: "group" }, index.h("slot", { key: '0578016f80517baeb8f6d19db4661046c6c43eea' }))));
+        return (index.h(index.Host, { key: '1ead12dc6ed7c2eb6f372bfe04a45419233a0d7d' }, index.h("div", { key: 'e3f5b5051f91edae637b005f2c5820ea4695f04f', class: "ifx-content-switcher", role: "group" }, index.h("slot", { key: 'd45e3aed8934209c35ed230a4ce5d11f37a304f6' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ifx-date-picker.cjs.entry.js

@@ -100,8 +100,8 @@ const DatePicker = class {
     }
     render() {
         var _a, _b;
-        return (index.h("div", { key: '4fd623e58f74d41cc7871b4971b4bd3806f310b2', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, index.h("label", { key: '75f325296e0733fbe2021718b580ed1049248ffa', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.trim(), index.h("span", { key: '02de17b70b3d0af8d59cb2d13ec7b17ea939f2db', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), index.h("div", { key: '7bf28947be09f941fb0bf4972e0c8c105366488b', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, index.h("input", { key: 'b2413ef548765a108c54c9b338c7274dde36b3f6', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ""} ${this.success ? "success" : ""}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: (e) => this.getDate(e) }), index.h("div", { key: '87880933e1ec373376f2ff4dde170ad29bd326bf', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, index.h("ifx-icon", { key: '81bd4154b84f9c1bb48fc6ac6574a915aca0dfce', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (index.h("div", { key: '371a538db6b4c5e119e436b9dfccff1c5ad35cf1', class: 'caption__wrapper' }, this.caption.trim()))));
+        return (index.h("div", { key: '6de6b7ba329d65dd1f154d0eab1d74dfd7f346cb', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, index.h("label", { key: '32b1e8e8824ad9f505b66d81d85891b7930d49e1', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.trim(), index.h("span", { key: '9803a076232a7af6ca732526b3fd948268de84b6', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), index.h("div", { key: '1ffa98681899b3672a177d1d577f17b732aa5d67', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, index.h("input", { key: 'a2b8b298f13e21c08664e04b84e1cd3129a4e722', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ""} ${this.success ? "success" : ""}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: (e) => this.getDate(e) }), index.h("div", { key: '7e69c869e18d0397ae956906f088b0f1dcdaccec', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, index.h("ifx-icon", { key: '8748fde2f3a63c89de896cb04686339a907beaae', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (index.h("div", { key: 'b38f60b8e748b644c8d153ff4bb43853b85c22e9', class: 'caption__wrapper' }, this.caption.trim()))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -17,7 +17,7 @@ const Download = class {
         const fileName = `infineon-tokens.${this.tokens}`;
         const sourceFile = fileMap[this.tokens];
         const fileUrl = `https://raw.githubusercontent.com/Infineon/public-assets/main/ifx-tokens/${sourceFile}`;
-        return (index.h("ifx-link", { key: '8a05f429c2d8c9bfcb132df3fda0aa47d7109b67', onClick: (e) => {
+        return (index.h("ifx-link", { key: 'b290832f3e1e8edc05e409bb8c606cd3fccfca51', onClick: (e) => {
                 e.preventDefault();
                 fetch(fileUrl)
                     .then(res => res.blob())
@@ -27,7 +27,7 @@ const Download = class {
                     link.download = fileName;
                     link.click();
                 });
-            }, href: fileUrl, download: fileName, class: "download__wrapper", size: "m", variant: "bold" }, index.h("slot", { key: '72d494771e43406d7f85122f22300f3524fd94b1' })));
+            }, href: fileUrl, download: fileName, class: "download__wrapper", size: "m", variant: "bold" }, index.h("slot", { key: '4b42d276756903a8fbc44c5ab2cc1221a4591982' })));
     }
 };
 Download.style = downloadCss;

package/dist/cjs/ifx-dropdown-header.cjs.entry.js

@@ -9,7 +9,7 @@ const DropdownHeader = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: 'd93c45a63fba5ca781065e118af56370ddb340eb', class: 'dropdown-header' }, index.h("span", { key: 'dbcc17303d9d0cef7daf2150ac77833498f76ae7' }, index.h("slot", { key: 'f157de72d9b164e2492fae87d457da8227eb77ce' }))));
+        return (index.h("div", { key: 'bf3070867da1052a43e62eb7ae2cf92255929fe6', class: 'dropdown-header' }, index.h("span", { key: 'a3863497b2c3809cc3de61f00916cce34bbca402' }, index.h("slot", { key: '7aed6dfd2b675c52cbfdb83d0aadd69fd101b237' }))));
     }
 };
 DropdownHeader.style = dropdownHeaderCss;

package/dist/cjs/ifx-dropdown-item.cjs.entry.js

@@ -21,7 +21,7 @@ const DropdownItem = class {
     }
     render() {
         let hrefAttr = this.href ? { href: this.href, target: this.target } : {};
-        return (index.h("a", Object.assign({ key: '7308bd850dbc2dff472b8c045d166730bcec0af3' }, hrefAttr, { onClick: () => this.handleEventEmission(), class: `dropdown-item ${this.size === 's' ? 'small' : ""} ${this.hide ? 'hide' : ""}` }), this.icon && index.h("ifx-icon", { key: '575dad93fe45d15c155e812eaed3f922a0137c18', class: "icon", icon: this.icon }), index.h("span", { key: '93497cc96543367e73f5dcb48f17c54156b71546' }, index.h("slot", { key: '1a2011575806ff7250d51bd72edacabbb64e075c' }))));
+        return (index.h("a", Object.assign({ key: 'c7b7bd06103652ae6fbededcb44dfea24647143a' }, hrefAttr, { onClick: () => this.handleEventEmission(), class: `dropdown-item ${this.size === 's' ? 'small' : ""} ${this.hide ? 'hide' : ""}` }), this.icon && index.h("ifx-icon", { key: '30905f5e873c10381da7aff35b3b69c451f00371', class: "icon", icon: this.icon }), index.h("span", { key: 'af4bd02d4eac4d31cc9237ef229dc6f2b2996971' }, index.h("slot", { key: '82719e39f672a3c6e6289ee8f681b49701f8c9c0' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ifx-dropdown-menu.cjs.entry.js

@@ -50,10 +50,10 @@ const DropdownMenu = class {
             this.hideTopPadding = false;
     }
     render() {
-        return (index.h("div", { key: '83e1663841879b35eb8083e6efc996e73af5360e', class: `dropdown-menu 
+        return (index.h("div", { key: 'b5222d062a86989e49b0fb9a26eea515fee0290a', class: `dropdown-menu 
       ${this.isOpen ? 'show' : ''} 
       ${this.hideTopPadding ? 'hideTopPadding' : ""}
-      ${this.size === 's' ? 'small' : ""}` }, index.h("slot", { key: '69f3d918fbb83a8bc474e2a13d25227726a8c179' })));
+      ${this.size === 's' ? 'small' : ""}` }, index.h("slot", { key: '5049f24687d23b4ab5a4bb084f3c0b2ef8044262' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -136,7 +136,7 @@ const Dropdown = class {
         }
     }
     render() {
-        return (index.h("div", { key: '69f27816cb5e4907952939cde18bbdaa5e7fce56', "aria-label": 'dropdown menu', class: 'dropdown' }, index.h("slot", { key: 'cd37ec9b162b6533f2a865f937976412b4d57e13' })));
+        return (index.h("div", { key: '1b7a675f72490220302616078785eab0ff7d859d', "aria-label": 'dropdown menu', class: 'dropdown' }, index.h("slot", { key: '0d7a491172eb85948b010f114401972fcb089f11' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/collection/collection-manifest.json

@@ -7,6 +7,8 @@
     "components/breadcrumb/breadcrumb-item-label.js",
     "components/breadcrumb/breadcrumb-item.js",
     "components/breadcrumb/breadcrumb.js",
+    "components/dropdown/dropdown-menu/dropdown-menu.js",
+    "components/dropdown/dropdown-item/dropdown-item.js",
     "components/button/button.js",
     "components/card/card.js",
     "components/card/card-headline/card-headline.js",
@@ -24,8 +26,6 @@
     "components/download/download.js",
     "components/dropdown/dropdown.js",
     "components/dropdown/dropdown-header/dropdown-header.js",
-    "components/dropdown/dropdown-item/dropdown-item.js",
-    "components/dropdown/dropdown-menu/dropdown-menu.js",
     "components/dropdown/dropdown-seperator/dropdown-separator.js",
     "components/dropdown/dropdown-trigger/dropdown-trigger.js",
     "components/dropdown/dropdown-trigger-button/dropdown-trigger-button.js",

package/dist/collection/components/button/button.js

@@ -93,7 +93,7 @@ export class Button {
         }
     }
     render() {
-        return (h(Host, { key: 'a220864c79a3eee88b277dd2277487581c7de8b0' }, h("a", { key: '4fd4cbd07205a0f538cf4d977a1b88d23d64be36', role: this.href ? 'link' : 'button', tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.focusableElement = el), class: this.getClassNames(), href: !this.disabled ? this.internalHref : undefined, target: this.target, onClick: this.handleClick, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, onFocus: (event) => this.handleFocus(event), "aria-disabled": this.disabled ? 'true' : null, "aria-describedby": this.theme === 'danger' ? 'Dangerous action' : undefined, "aria-label": this.ariaLabel || undefined }, h("slot", { key: 'f64f20c4b3d1af19c6276713aef4e230d7aaf0e3' }))));
+        return (h(Host, { key: 'd7b3a89dcd4240f3a44aa05346c9bce375476826' }, h("a", { key: '55374b7ac6ba50bc074042f49b0718be4c1442f1', role: this.href ? 'link' : 'button', tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.focusableElement = el), class: this.getClassNames(), href: !this.disabled ? this.internalHref : undefined, target: this.target, onClick: this.handleClick, rel: this.target === '_blank' ? 'noopener noreferrer' : undefined, onFocus: (event) => this.handleFocus(event), "aria-disabled": this.disabled ? 'true' : null, "aria-describedby": this.theme === 'danger' ? 'Dangerous action' : undefined, "aria-label": this.ariaLabel || undefined }, h("slot", { key: 'ae683451c19f6eb433211d46913f6d8b279f987a' }))));
     }
     getVariantClass() {
         return `${this.variant}` === "secondary"

package/dist/collection/components/card/card-headline/card-headline.js

@@ -15,7 +15,7 @@ export class CardHeadline {
         }
     }
     render() {
-        return (h("div", { key: '3599127fad1e7dc563064d38df9996bcd7bd9217', class: `card__headline-wrapper ${this.hasDesc ? 'withDesc' : ""}` }, h("div", { key: '643428271dec2bdf71c7059bf6e28c00cae9438b', class: `card-headline ${this.direction}` }, h("slot", { key: '3b7ec4e25a399e96a0db4f03d793109eabf08fff' }))));
+        return (h("div", { key: '47588e8b38e5eadd66a42a132b54e55b2aab2072', class: `card__headline-wrapper ${this.hasDesc ? 'withDesc' : ""}` }, h("div", { key: '21458ea6b7000ae25a6665b34bcefe685685d505', class: `card-headline ${this.direction}` }, h("slot", { key: '5867b5fadc6f8da67d4123aa4cfdb968dca9ea51' }))));
     }
     static get is() { return "ifx-card-headline"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card-image/card-image.js

@@ -10,7 +10,7 @@ export class CardImage {
         this.handlePosition(this.position);
     }
     render() {
-        return (h("img", { key: 'e08992cdb9c62e7b4f98d58d39457702233ee300', src: this.src, alt: this.alt, class: "card-image" }));
+        return (h("img", { key: '78a305df396a6aa5a1bb5c4fcd58b327f946a60f', src: this.src, alt: this.alt, class: "card-image" }));
     }
     static get is() { return "ifx-card-image"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card-links/card-links.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class CardLinks {
     render() {
-        return (h("div", { key: '2f4e55e1890a5d5f749d0e951d6971d8cf1b0875', class: 'container' }, h("slot", { key: '7e0c1226088fcd91ffee21b817f89970bc3ab772' })));
+        return (h("div", { key: '41e502507eeb40503dce46238ad0e2cd1dffeecc', class: 'container' }, h("slot", { key: 'ec074005fe54e49c6b6fb1ecaf12a2c1d0b6a626' })));
     }
     static get is() { return "ifx-card-links"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card-overline/card-overline.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class CardOverline {
     render() {
-        return (h("div", { key: 'edb86d9c621859391a960610c81ab5fa3a3558fd', class: "card-overline" }, h("slot", { key: '2b4846831c111a2b598b6632559b5346c152568f' })));
+        return (h("div", { key: '2e55a25825611cd059d62b8079faf8dce297a921', class: "card-overline" }, h("slot", { key: 'ff34f792d4f488c8de6bcb38a579a73cf3d4cadc' })));
     }
     static get is() { return "ifx-card-overline"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card-text/card-text.js

@@ -8,7 +8,7 @@ export class CardText {
         }
     }
     render() {
-        return (h("div", { key: 'fea1823e8000b8699142eefb127eb1716a606bcd', class: `card__text-wrapper ${this.hasBtn ? 'hasBtn' : ""}` }, h("div", { key: 'ee9baf1f210a6bf109669d3dbb075f56cf52ee22', class: `card-text` }, h("slot", { key: 'd4e94f54325b349d0a908f1812412e4a6ff1adad' }))));
+        return (h("div", { key: 'd3ddbfaaa3b99504f89bc8e0e0dc32c50309f5d0', class: `card__text-wrapper ${this.hasBtn ? 'hasBtn' : ""}` }, h("div", { key: '1d3c8311a5100e6c85c99c64a82de5520d11e61f', class: `card-text` }, h("slot", { key: '73182b12dab027838499e75c72026e8d6f311b0c' }))));
     }
     static get is() { return "ifx-card-text"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card.js

@@ -38,12 +38,12 @@ export class Card {
         this.handleComponentAdjustment();
     }
     render() {
-        return (h(Host, { key: 'aac222aafe681f2024929060a46f5b044b65e772' }, h("div", { key: '9c2f93b40bad857af634c16a9a0459763fada288', "aria-label": this.ariaLabel, class: `card 
+        return (h(Host, { key: '78369f8e134ac9a5be444a126e4f1c16cf326f72' }, h("div", { key: '11985e2318ed0a4a10901aa4105877b5b82f052e', "aria-label": this.ariaLabel, class: `card 
           ${this.noBtns ? 'noBtns' : ""}
           ${this.direction} 
           ${this.alignment}`, role: "region" }, this.direction === 'horizontal' &&
-            h("div", { key: 'a9ecc08c4a5f7c2f7830256e289f485f6422160a', class: "horizontal" }, h("a", { key: '09b1ebffcb703fe8c72224575dd5fe172b741533', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: '1e7bf2700feecf9e35a2aed787f476317252413e', name: "img" })), h("div", { key: '15dda4cdf697bd72673fecc3ad939d30136ca82f', class: 'lower__body-wrapper' }, h("a", { key: '6a20bfbed8fb327cb8f2df9caa7197966362a98f', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: 'a8d8aa70a1ec0e06f6dcea7e34cab24563465d50' })), h("div", { key: '70697a5b69ba9588cd6d81fcdf47cb59d3537461' }, h("slot", { key: '186152dfa577d47b1edf242a27044de3470f8ae5', name: 'buttons' })))), this.direction === 'vertical' &&
-            h("div", { key: '7e213f66b9c1ce9d0ab67623a3c125783dd0035b', class: "vertical" }, h("a", { key: '3431f72726f0e0019f3dd67fb3290c7003c22ed4', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, h("div", { key: '1ec3dcd109dda21e13aa45ca679159f5b7b6e91d', class: `card-img ${this.noImg ? 'noImage' : ""}` }, h("slot", { key: '64a6aae3e828e1741fd55d6fc8b53de5fbf5b3b9', name: "img" })), h("div", { key: '128d6712a7792d33ad77c3761aa3a9c4702cbd49', class: 'upper-body' }, h("slot", { key: '8e8ea25bfb8409692b0579393045a0f5e117e0f3' }))), h("div", { key: '5989e1234a290faf4e1676dc53a5c009eb1e35b4', class: 'lower__body-wrapper' }, h("slot", { key: 'c06013bd5b0db5b8b40251bf6a2960d60205f2a0', name: 'buttons' }))))));
+            h("div", { key: 'a2953771fd2463dc22f61b2e0b2b74f0a72676e1', class: "horizontal" }, h("a", { key: '82e447ac989e6eb46da6537c6e8301d9cbc3f1fe', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: '283b5316652ef266cd445f78fdc5b8e2714ed41e', name: "img" })), h("div", { key: 'bf364c4b4c85c815d274d70dc942b2eaf90c165d', class: 'lower__body-wrapper' }, h("a", { key: '9cf2b564ac56722a7c69132f09c2a91d74ff49eb', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: '125d8b4ca59767385f3a84b5f43eaf00243b2ba6' })), h("div", { key: '48c5e246e17d842774d4de81c702675a6e7ffbfd' }, h("slot", { key: 'ec3b46c05b98ee9a45abde934cac6e91430e795f', name: 'buttons' })))), this.direction === 'vertical' &&
+            h("div", { key: '27bd695057b5c26376543f60945a11c8deb60e6a', class: "vertical" }, h("a", { key: '80f3f8ca47ad5b40ad5ec82ce4361a49ae3b38ad', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, h("div", { key: '8cad328c4d52256a52f5ab7c3b3d67c2f894ae13', class: `card-img ${this.noImg ? 'noImage' : ""}` }, h("slot", { key: '26d9ec8597f719881e6172fbfcb4ac4bf2886855', name: "img" })), h("div", { key: '634db847244c2ec83e5ef8795eb5103a7019157b', class: 'upper-body' }, h("slot", { key: 'f6a14b70ef7e679592e1481811125e5917d0924c' }))), h("div", { key: 'b61fbc4ae5f0e1d6275bb0f89ce0a9123368bb17', class: 'lower__body-wrapper' }, h("slot", { key: 'a1b5a9f6a08b440279306f2e722146021016c3cd', name: 'buttons' }))))));
     }
     static get is() { return "ifx-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/checkbox/checkbox.js

@@ -91,12 +91,12 @@ export class Checkbox {
         if (slot) {
             hasSlot = true;
         }
-        return (h("div", { key: 'ae37e8cf56cecc28d1d3441e4ca70a66d19fd4a9', class: "checkbox__container" }, h("input", { key: '210ff7879962c1df556491d83d3ebcf7238b6b50', type: "checkbox", hidden: true, ref: (el) => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), id: 'checkbox', value: `${this.value}`, disabled: this.disabled ? true : undefined }), h("div", { key: '2b1b2065f41003c4e627e802fa70728f7b884710', tabindex: "0", onClick: this.handleCheckbox.bind(this), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : this.internalChecked.toString(), "aria-disabled": this.disabled, "aria-labelledby": "label", class: `checkbox__wrapper 
+        return (h("div", { key: '149f6a9d6f3f1fbe0ed93d38484d9a7f28a05b7f', class: "checkbox__container" }, h("input", { key: '1d33a9ee96aa05071affc0a615d13556614b2c0e', type: "checkbox", hidden: true, ref: (el) => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), id: 'checkbox', value: `${this.value}`, disabled: this.disabled ? true : undefined }), h("div", { key: 'e8f8c6530a21c653b7653cc91270b06a26d7b942', tabindex: "0", onClick: this.handleCheckbox.bind(this), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : this.internalChecked.toString(), "aria-disabled": this.disabled, "aria-labelledby": "label", class: `checkbox__wrapper 
           ${this.getCheckedClassName()}
         ${this.size === "m" ? "checkbox-m" : ""}
         ${this.indeterminate ? 'indeterminate' : ""}
-        ${this.disabled ? 'disabled' : ""}` }, this.internalChecked && !this.internalIndeterminate && h("ifx-icon", { key: 'ca2171404ee8926623bab88b5d4abbb906d66a9d', icon: "check-16", "aria-hidden": "true" })), hasSlot &&
-            h("div", { key: 'efb5c73f051dceb60b79220bffd5b1694502be7b', id: "label", class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ""} `, onClick: this.handleCheckbox.bind(this) }, h("slot", { key: '1c3d1089dfce161a4e4c093c3211a8d772b3d90b' }))));
+        ${this.disabled ? 'disabled' : ""}` }, this.internalChecked && !this.internalIndeterminate && h("ifx-icon", { key: 'aed8151d75e835576bf55ff1cc352e0d94488e3c', icon: "check-16", "aria-hidden": "true" })), hasSlot &&
+            h("div", { key: '1dc78c4309ffeb565d4ad53c676c62c38fa38413', id: "label", class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ""} `, onClick: this.handleCheckbox.bind(this) }, h("slot", { key: '15efbaff9fe6791627e0c8f6df987433ea0bb97b' }))));
     }
     static get is() { return "ifx-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/checkbox-group/checkbox-group.js

@@ -40,7 +40,7 @@ export class CheckboxGroup {
         this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);
     }
     render() {
-        return (h("div", { key: '2f455a4fa40d089e1aafab0b669aa4f4ded80be0', class: 'checkbox-group-container' }, this.showGroupLabel ? h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', h("div", { key: 'eb6f16bf53e13620681c87eb7cb4062a37abd068', class: `checkbox-group ${this.alignment} ${this.size}` }, h("slot", { key: '00ec08507a2ef1ff8e893b6c8b9aa917a7735224', onSlotchange: this.handleSlotChange })), this.showCaption ? (h("div", { class: `caption ${this.hasErrors ? 'error' : 'default'}` }, this.showCaptionIcon ? h("div", { class: 'caption-icon' }, h("ifx-icon", { icon: "c-info-16" })) : '', h("div", { class: 'caption-text' }, this.captionText))) : ''));
+        return (h("div", { key: '0e1e1ee2ac0c55bf19f7a5fef5a667c49fc6bb0b', class: 'checkbox-group-container' }, this.showGroupLabel ? h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', h("div", { key: '580f2958a972d42bc3f1fb38928fc53c65a45db1', class: `checkbox-group ${this.alignment} ${this.size}` }, h("slot", { key: '6e55a282d938a88a89f5653a604eb155307cfb3a', onSlotchange: this.handleSlotChange })), this.showCaption ? (h("div", { class: `caption ${this.hasErrors ? 'error' : 'default'}` }, this.showCaptionIcon ? h("div", { class: 'caption-icon' }, h("ifx-icon", { icon: "c-info-16" })) : '', h("div", { class: 'caption-text' }, this.captionText))) : ''));
     }
     static get is() { return "ifx-checkbox-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/chip/chip-item/chip-item.js

@@ -56,9 +56,9 @@ export class ChipItem {
         this.handleSelectedState();
     }
     render() {
-        return (h("div", { key: '7ceff18d0a41b419a188d925fd854cc97d7a9ecd', class: `chip-item chip-item--${this.chipState.size} 
+        return (h("div", { key: '0feac58e2e7104e948633503bb6e1e41a7933963', class: `chip-item chip-item--${this.chipState.size} 
                     chip-item--${(this.selected && this.chipState.variant) === 'single' ? 'selected' : ''}`, tabIndex: 0, onClick: () => { this.handleItemClick(); }, onKeyDown: (e) => { this.handleItemKeyDown(e); }, role: "option", "aria-selected": this.selected.toString() }, this.chipState.variant === 'multi' &&
-            h("ifx-checkbox", { key: 'd2f717951d288aa0863081e54cabf7edd1c6f7e6', checked: this.selected, tabIndex: -1, size: 's' }), h("div", { key: 'fff335d9009c93863012f6a4307ed4322413c4f7', class: 'chip-item__label' }, " ", h("slot", { key: 'a093e9caf2eecba28c58674dde3f788be1f5849b' }), " "), h("div", { key: 'ea76c6b3d0bdd2a687acfbe323ebd9e6d6034a40', class: 'chip-item__selected-indicator' }, h("ifx-icon", { key: '5d0ae125cb1ea0297d81d773c9981bd13f0c5759', icon: 'check-16' }, " "))));
+            h("ifx-checkbox", { key: '5bff8f27bda9843ffbad86fed014e6f5b1df3b9c', checked: this.selected, tabIndex: -1, size: 's' }), h("div", { key: 'e4ed1025410e1821e1549d8f29f7cc6c5ba57a2d', class: 'chip-item__label' }, " ", h("slot", { key: '541c9acff7c19e816f75cea1d17de319eefb8536' }), " "), h("div", { key: 'e5fc6f9e1d1e40bcc2ac591f2e550abcffa4cdad', class: 'chip-item__selected-indicator' }, h("ifx-icon", { key: '24c75f1d1eb8927d5193875aacda59ce9117e0df', icon: 'check-16' }, " "))));
     }
     static get is() { return "ifx-chip-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/chip/chip.js

@@ -255,17 +255,17 @@ export class Chip {
         this.syncSelectedOptionsWithProp(this.value);
     }
     render() {
-        return (h("div", { key: 'e14109cde5a4d4a9ed84c98ec91f12061c870fd7', class: 'chip' }, h("div", { key: 'c53a4141e3c632b7b191c473af84fcea0f1734c6', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
+        return (h("div", { key: '637a568cd29e50b18f38f62a48777d7c54fbffa6', class: 'chip' }, h("div", { key: '3a6468c99f576279dd883082ed70afa42e64c7dc', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
                   chip__wrapper--${this.variant === 'multi' ? 'multi' : 'single'}
                   ${this.opened && !this.readOnly ? 'chip__wrapper--opened' : ''}
-                  ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, h("div", { key: '2dd2d3efa423414c1b2f1d4bb14439ac5f79b6e3', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
+                  ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, h("div", { key: '22ea9cf50a3e77f19116e64e51365a8bea48dd24', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
             `${this.placeholder}:`, (this.selectedOptions.length !== 0) &&
-            h("div", { key: 'fa10908eb3780826670e4d571a64803d54022d6e', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
-            h("ifx-indicator", { key: '1f80e8bffce5a08f712d4e0b8ecb138290752ca2', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
-            h("div", { key: 'f9f144b629d6c21c91da36b37ac10667f30a3278', class: 'wrapper__open-button' }, h("ifx-icon", { key: 1, icon: `chevron-down-16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
-            h("div", { key: '207c2ebcf32b8f86e69d89536223e06b028942a6', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
-            h("div", { key: '66b7fee014680ed354a33d7f5a3ca991370be17c', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
-            h("div", { key: '3f47c1664904fa7623f830447ef8d1bb0a4975e9', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, h("slot", { key: 'a3fe6154c33599a9cd12f5c7f5ecff99a0330e81' }))));
+            h("div", { key: '778190ebe5bd68caf5594c8a9520a5cf52764cb5', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
+            h("ifx-indicator", { key: 'f8d961b9354940ab2dda4677539d64e858227551', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
+            h("div", { key: '349831d4e87ace96e02493456b6bc3d6dc3b779d', class: 'wrapper__open-button' }, h("ifx-icon", { key: 1, icon: `chevron-down-16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
+            h("div", { key: 'dec4500f0204fa9f992c12369b85e9f65778a4a7', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
+            h("div", { key: '58084d5bfac1199339c2a48ea5eeb331556adfc9', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
+            h("div", { key: 'ee77eb0d1345c1d14a3ae79751c34fe2449e7288', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, h("slot", { key: '52c9433f93905262a10496a350a055d72d290ade' }))));
     }
     static get is() { return "ifx-chip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/content-switcher/content-switcher-item.js

@@ -4,7 +4,7 @@ export class ContentSwitcherItem {
         this.selected = false;
     }
     render() {
-        return (h(Host, { key: 'cfee4bfa2e7b8f5ba6c88a99baf11e69f3fecc5f' }, h("button", { key: '13aa464e8f9f8b2b5cfefd3f20b5dcfdb5d04147', class: 'ifx-content-switcher-item' + (this.selected ? ' selected' : '') }, h("slot", { key: '605f9840e2888ba0249e294292a98216297bad0a' }))));
+        return (h(Host, { key: 'b8dc41db465e008878deb175f09f334f1a5b4723' }, h("button", { key: 'e8bd11e7942d2b13e0f8c781724a88d2aa2c93c3', class: 'ifx-content-switcher-item' + (this.selected ? ' selected' : '') }, h("slot", { key: '22923a9ed26981d1f6d708a0fc4c60b02644ffff' }))));
     }
     static get is() { return "ifx-content-switcher-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/content-switcher/content-switcher.js

@@ -150,7 +150,7 @@ export class ContentSwitcher {
         return this.items[index].getAttribute('value') || index.toLocaleString();
     }
     render() {
-        return (h(Host, { key: '9b3bb93d639c01fa5e006228f44e28578c450e10' }, h("div", { key: 'eab613a4ba9055f73e96fd74e42fe3c0787418a8', class: "ifx-content-switcher", role: "group" }, h("slot", { key: '0578016f80517baeb8f6d19db4661046c6c43eea' }))));
+        return (h(Host, { key: '1ead12dc6ed7c2eb6f372bfe04a45419233a0d7d' }, h("div", { key: 'e3f5b5051f91edae637b005f2c5820ea4695f04f', class: "ifx-content-switcher", role: "group" }, h("slot", { key: 'd45e3aed8934209c35ed230a4ce5d11f37a304f6' }))));
     }
     static get is() { return "ifx-content-switcher"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/date-picker/date-picker.js

@@ -86,8 +86,8 @@ export class DatePicker {
     }
     render() {
         var _a, _b;
-        return (h("div", { key: '4fd623e58f74d41cc7871b4971b4bd3806f310b2', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '75f325296e0733fbe2021718b580ed1049248ffa', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.trim(), h("span", { key: '02de17b70b3d0af8d59cb2d13ec7b17ea939f2db', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), h("div", { key: '7bf28947be09f941fb0bf4972e0c8c105366488b', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: 'b2413ef548765a108c54c9b338c7274dde36b3f6', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ""} ${this.success ? "success" : ""}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: (e) => this.getDate(e) }), h("div", { key: '87880933e1ec373376f2ff4dde170ad29bd326bf', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, h("ifx-icon", { key: '81bd4154b84f9c1bb48fc6ac6574a915aca0dfce', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: '371a538db6b4c5e119e436b9dfccff1c5ad35cf1', class: 'caption__wrapper' }, this.caption.trim()))));
+        return (h("div", { key: '6de6b7ba329d65dd1f154d0eab1d74dfd7f346cb', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '32b1e8e8824ad9f505b66d81d85891b7930d49e1', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.trim(), h("span", { key: '9803a076232a7af6ca732526b3fd948268de84b6', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), h("div", { key: '1ffa98681899b3672a177d1d577f17b732aa5d67', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: 'a2b8b298f13e21c08664e04b84e1cd3129a4e722', type: this.type, autocomplete: this.autocomplete, class: `date__picker-input ${this.error ? 'error' : ""} ${this.success ? "success" : ""}`, disabled: this.disabled ? true : undefined, "aria-invalid": this.error ? true : undefined, "aria-label": this.ariaLabel, max: this.max, min: this.min, value: this.value, required: this.required, onChange: (e) => this.getDate(e) }), h("div", { key: '7e69c869e18d0397ae956906f088b0f1dcdaccec', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, h("ifx-icon", { key: '8748fde2f3a63c89de896cb04686339a907beaae', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: 'b38f60b8e748b644c8d153ff4bb43853b85c22e9', class: 'caption__wrapper' }, this.caption.trim()))));
     }
     static get is() { return "ifx-date-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/download/download.js

@@ -11,7 +11,7 @@ export class Download {
         const fileName = `infineon-tokens.${this.tokens}`;
         const sourceFile = fileMap[this.tokens];
         const fileUrl = `https://raw.githubusercontent.com/Infineon/public-assets/main/ifx-tokens/${sourceFile}`;
-        return (h("ifx-link", { key: '8a05f429c2d8c9bfcb132df3fda0aa47d7109b67', onClick: (e) => {
+        return (h("ifx-link", { key: 'b290832f3e1e8edc05e409bb8c606cd3fccfca51', onClick: (e) => {
                 e.preventDefault();
                 fetch(fileUrl)
                     .then(res => res.blob())
@@ -21,7 +21,7 @@ export class Download {
                     link.download = fileName;
                     link.click();
                 });
-            }, href: fileUrl, download: fileName, class: "download__wrapper", size: "m", variant: "bold" }, h("slot", { key: '72d494771e43406d7f85122f22300f3524fd94b1' })));
+            }, href: fileUrl, download: fileName, class: "download__wrapper", size: "m", variant: "bold" }, h("slot", { key: '4b42d276756903a8fbc44c5ab2cc1221a4591982' })));
     }
     static get is() { return "ifx-download"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropdown/dropdown-header/dropdown-header.js

@@ -2,7 +2,7 @@
 import { h } from "@stencil/core";
 export class DropdownHeader {
     render() {
-        return (h("div", { key: 'd93c45a63fba5ca781065e118af56370ddb340eb', class: 'dropdown-header' }, h("span", { key: 'dbcc17303d9d0cef7daf2150ac77833498f76ae7' }, h("slot", { key: 'f157de72d9b164e2492fae87d457da8227eb77ce' }))));
+        return (h("div", { key: 'bf3070867da1052a43e62eb7ae2cf92255929fe6', class: 'dropdown-header' }, h("span", { key: 'a3863497b2c3809cc3de61f00916cce34bbca402' }, h("slot", { key: '7aed6dfd2b675c52cbfdb83d0aadd69fd101b237' }))));
     }
     static get is() { return "ifx-dropdown-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropdown/dropdown-item/dropdown-item.js

@@ -15,7 +15,7 @@ export class DropdownItem {
     }
     render() {
         let hrefAttr = this.href ? { href: this.href, target: this.target } : {};
-        return (h("a", Object.assign({ key: '7308bd850dbc2dff472b8c045d166730bcec0af3' }, hrefAttr, { onClick: () => this.handleEventEmission(), class: `dropdown-item ${this.size === 's' ? 'small' : ""} ${this.hide ? 'hide' : ""}` }), this.icon && h("ifx-icon", { key: '575dad93fe45d15c155e812eaed3f922a0137c18', class: "icon", icon: this.icon }), h("span", { key: '93497cc96543367e73f5dcb48f17c54156b71546' }, h("slot", { key: '1a2011575806ff7250d51bd72edacabbb64e075c' }))));
+        return (h("a", Object.assign({ key: 'c7b7bd06103652ae6fbededcb44dfea24647143a' }, hrefAttr, { onClick: () => this.handleEventEmission(), class: `dropdown-item ${this.size === 's' ? 'small' : ""} ${this.hide ? 'hide' : ""}` }), this.icon && h("ifx-icon", { key: '30905f5e873c10381da7aff35b3b69c451f00371', class: "icon", icon: this.icon }), h("span", { key: 'af4bd02d4eac4d31cc9237ef229dc6f2b2996971' }, h("slot", { key: '82719e39f672a3c6e6289ee8f681b49701f8c9c0' }))));
     }
     static get is() { return "ifx-dropdown-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropdown/dropdown-menu/dropdown-menu.js

@@ -43,10 +43,10 @@ export class DropdownMenu {
             this.hideTopPadding = false;
     }
     render() {
-        return (h("div", { key: '83e1663841879b35eb8083e6efc996e73af5360e', class: `dropdown-menu 
+        return (h("div", { key: 'b5222d062a86989e49b0fb9a26eea515fee0290a', class: `dropdown-menu 
       ${this.isOpen ? 'show' : ''} 
       ${this.hideTopPadding ? 'hideTopPadding' : ""}
-      ${this.size === 's' ? 'small' : ""}` }, h("slot", { key: '69f3d918fbb83a8bc474e2a13d25227726a8c179' })));
+      ${this.size === 's' ? 'small' : ""}` }, h("slot", { key: '5049f24687d23b4ab5a4bb084f3c0b2ef8044262' })));
     }
     static get is() { return "ifx-dropdown-menu"; }
     static get encapsulation() { return "shadow"; }