@infineon/infineon-design-system-stencil 37.12.1--canary.1987.efd49fa96724f4af933f59f965802c5626d3c4a9.0 → 37.12.1--canary.1988.f5eee06727d2bb5660c87b54c84ac34cbdc94b91.0

package/dist/components/ifx-basic-table.js

@@ -186,7 +186,7 @@ const Table = /*@__PURE__*/ proxyCustomElement(class Table extends H {
         return {};
     }
     render() {
-        return (h(Host, { key: '5968712e3cbe5605b5128dc19997941d18d21ffc' }, h("div", { key: '8a39d36f4006095de577777bb8c31f2ba3b9a2ee', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: '8dd8dfaa472da2cd56ade80f5105cdbebeb8013b', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
+        return (h(Host, { key: '395e4ddc1ba33a2870d67ffdcebeb5b399c69821' }, h("div", { key: 'ebc6800aeb7fd146008485363bda1be11f8de555', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: 'f1e7ec2a0a79e153304f73013ddc6f6c9ab09bfb', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ""}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
     }
     get host() { return this; }
     static get style() { return IfxBasicTableStyle0; }

package/dist/components/ifx-breadcrumb-item-label.js

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const breadcrumbItemLabelCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.breadcrumb-item-label-container{display:flex;align-items:center;gap:8px;text-decoration:none;color:#1D1D1D}.breadcrumb-item-label-container.margin{margin-left:16px}.breadcrumb-item-label-container ifx-icon:empty{display:none}.breadcrumb-item-label-container .label-icon-wrapper{display:inline-flex}.breadcrumb-item-label-container .menu-icon-wrapper{display:flex;justify-content:center;align-items:center;width:16px;height:16px}.breadcrumb-item-label-container .menu-icon-wrapper.hide{display:none}.breadcrumb-item-label-container .menu-icon-wrapper ifx-icon{transition:0.3s}.breadcrumb-item-label-container .menu-icon-wrapper.show ifx-icon{transition:0.3s;transform:rotate(180deg)}";
 const IfxBreadcrumbItemLabelStyle0 = breadcrumbItemLabelCss;
@@ -18,7 +18,7 @@ const BreadcrumbItemLabel = /*@__PURE__*/ proxyCustomElement(class BreadcrumbIte
         this.breadcrumbMenuIconWrapper.emit(menuWrapper);
     }
     render() {
-        return (h("a", { key: '856f06f931087b841e5f0350f1eb03e83b70e598', href: this.href, target: this.target, class: "breadcrumb-item-label-container", role: 'link' }, h("ifx-icon", { key: 'b67ee6634bea1f1626e073c1cf4238d12e0e8902', icon: this.icon, "aria-hidden": "true" }), h("span", { key: '270394a637cc6dd822d74d47dcc0bce51e9455c5', class: "label-wrapper" }, h("slot", { key: 'a2c15ce4581d3323d52fe931706ed86f3a777e08' })), h("span", { key: 'f013021b230b0a83a9fc1133d395f91c74cec4c4', class: "menu-icon-wrapper", "aria-hiden": "true" }, h("ifx-icon", { key: 'b22c149f7cb47f43054ba7e7a2ca669a94f2d8bc', icon: "chevron-down-16" }))));
+        return (h("a", { key: 'b1db58a07f820f1f3cf81bc1e8169694c4acc26b', href: this.href, target: this.target, class: "breadcrumb-item-label-container", role: 'link' }, h("ifx-icon", { key: '92b54db27eafce93d4ae34077273a2d0d9f4669d', icon: this.icon, "aria-hidden": "true" }), h("span", { key: '725e2350f54b94cdd6668cbc478ae59be2a0830d', class: "label-wrapper" }, h("slot", { key: '2ae0189cc69497a1ade1b91de4ab502f07d479fc' })), h("span", { key: '723d007b995282119366f201d89fcd8e021cf917', class: "menu-icon-wrapper", "aria-hiden": "true" }, h("ifx-icon", { key: '2293c222d6ca3f02e5cdc36df9a8ec18c3cf355e', icon: "chevron-down-16" }))));
     }
     get el() { return this; }
     static get style() { return IfxBreadcrumbItemLabelStyle0; }

package/dist/components/ifx-breadcrumb-item.js

@@ -102,7 +102,7 @@ const BreadcrumbItem = /*@__PURE__*/ proxyCustomElement(class BreadcrumbItem ext
         }
     }
     render() {
-        return (h("li", { key: '5779bbe0854a084c33c1bb535655fe484165784e', class: 'breadcrumb-parent', "aria-current": `${this.isLastItem ? 'page' : ""}` }, h("li", { key: '63e956424dda4002a84c7da17bfe42b3f7f830b0', role: "button", tabindex: this.hasDropdownMenu ? 0 : -1, class: "breadcrumb-wrapper", onClick: () => this.toggleDropdownMenu(), "aria-controls": this.uniqueId, "aria-haspopup": "menu", "aria-label": "Toggle dropdown menu" }, h("slot", { key: '14f66501d9ac8efc9ff9e6b771757e30c70814a6', name: 'label' }), h("div", { key: '9620ab0608dc5c74aa39fe321a332421ee4c76b3', id: this.uniqueId, class: "dropdown-menu", "aria-expanded": this.isDropdownMenuOpen(), "aria-label": "Dropdown menu" }, h("slot", { key: 'c4e6e9b1650f2467876f7824201139b369625b3d' }))), !this.isLastItem && h("span", { key: '5c028ab8720841b8a2777a84d7ad3f933ab43b79', class: "breadcrumb-divider", "aria-hidden": "true" }, "/")));
+        return (h("li", { key: '5af0a3fa94501cd75cbf71f65ee1ba7c0e35b4fe', class: 'breadcrumb-parent', "aria-current": `${this.isLastItem ? 'page' : ""}` }, h("li", { key: 'cad4a66147e8cfb08a54600bfd7b49caa73aeaf4', role: "button", tabindex: this.hasDropdownMenu ? 0 : -1, class: "breadcrumb-wrapper", onClick: () => this.toggleDropdownMenu(), "aria-controls": this.uniqueId, "aria-haspopup": "menu", "aria-label": "Toggle dropdown menu" }, h("slot", { key: '8e04912766549eb02867926b00f87ea2cfccea17', name: 'label' }), h("div", { key: '0ee67245fda42fe903e9b5d43bbf017e5e8b0be9', id: this.uniqueId, class: "dropdown-menu", "aria-expanded": this.isDropdownMenuOpen(), "aria-label": "Dropdown menu" }, h("slot", { key: '6bfd1019813184782b0ea056f5d62e94dd354aaa' }))), !this.isLastItem && h("span", { key: '5d55031d1a5be2cfe79a40ded6601ed36516a907', class: "breadcrumb-divider", "aria-hidden": "true" }, "/")));
     }
     get el() { return this; }
     static get style() { return IfxBreadcrumbItemStyle0; }

package/dist/components/ifx-breadcrumb.js

@@ -41,7 +41,7 @@ const Breadcrumb = /*@__PURE__*/ proxyCustomElement(class Breadcrumb extends H {
         }
     }
     render() {
-        return (h("nav", { key: '0b2fef450a8e44e157630158ab05ae6d06c578fd', "aria-label": "Page navigation breadcrumb" }, h("ol", { key: '365f7936e4f212fe1af6cb00452b2b97e3ac59a1', class: "breadcrumb" }, h("slot", { key: 'd8186a51bddd3d8913fb55a1b5c6202fc1c79acc' }))));
+        return (h("nav", { key: 'a4dcaa64ef482b645a469bf60243178493ba77e6', "aria-label": "Page navigation breadcrumb" }, h("ol", { key: 'ebf7f50ef36a498717b8f3f06b946ae95d60d719', class: "breadcrumb" }, h("slot", { key: '42960ed2a93d8495357010406fc83bf6454ff84a' }))));
     }
     get el() { return this; }
     static get style() { return IfxBreadcrumbStyle0; }

package/dist/components/ifx-button.js

@@ -1,4 +1,4 @@
-import { B as Button, d as defineCustomElement$1 } from './p-6462dfec.js';
+import { B as Button, d as defineCustomElement$1 } from './p-959c5e42.js';
 
 const IfxButton = Button;
 const defineCustomElement = defineCustomElement$1;

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

@@ -24,7 +24,7 @@ const CardHeadline = /*@__PURE__*/ proxyCustomElement(class CardHeadline extends
         }
     }
     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: 'e57b15dce2ae9edb507ab94eae13d7567ea2f760', class: `card__headline-wrapper ${this.hasDesc ? 'withDesc' : ""}` }, h("div", { key: '28abd2e7ea55b36c89d8708c2974b4cb267bff8e', class: `card-headline ${this.direction}` }, h("slot", { key: '61df77ff5f1a9eb22c59ca53da7fea2d8390eb63' }))));
     }
     get el() { return this; }
     static get style() { return IfxCardHeadlineStyle0; }

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

@@ -20,7 +20,7 @@ const CardImage = /*@__PURE__*/ proxyCustomElement(class CardImage extends H {
         this.handlePosition(this.position);
     }
     render() {
-        return (h("img", { key: 'e08992cdb9c62e7b4f98d58d39457702233ee300', src: this.src, alt: this.alt, class: "card-image" }));
+        return (h("img", { key: '3ca9e9494f660c533374b9a798b192f5d0aa124e', src: this.src, alt: this.alt, class: "card-image" }));
     }
     static get style() { return IfxCardImageStyle0; }
 }, [1, "ifx-card-image", {

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

@@ -10,7 +10,7 @@ const CardLinks = /*@__PURE__*/ proxyCustomElement(class CardLinks extends H {
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '2f4e55e1890a5d5f749d0e951d6971d8cf1b0875', class: 'container' }, h("slot", { key: '7e0c1226088fcd91ffee21b817f89970bc3ab772' })));
+        return (h("div", { key: 'd002b5767f2ddb0f7d74e5de5a17e54496d514f3', class: 'container' }, h("slot", { key: 'fdfc69fee5c94b0d6ac404e2d24e692861ba4545' })));
     }
     get el() { return this; }
     static get style() { return IfxCardLinksStyle0; }

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

@@ -10,7 +10,7 @@ const CardOverline = /*@__PURE__*/ proxyCustomElement(class CardOverline extends
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: 'edb86d9c621859391a960610c81ab5fa3a3558fd', class: "card-overline" }, h("slot", { key: '2b4846831c111a2b598b6632559b5346c152568f' })));
+        return (h("div", { key: '6c8dfef2d2eea31b9634528ce5731524e89deb89', class: "card-overline" }, h("slot", { key: '96157299497e82fedc9729be00b0333f5bd06382' })));
     }
     static get style() { return IfxCardOverlineStyle0; }
 }, [1, "ifx-card-overline"]);

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

@@ -17,7 +17,7 @@ const CardText = /*@__PURE__*/ proxyCustomElement(class CardText extends H {
         }
     }
     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: '305718a9029d1fde13e9aa643e72f8e520402a71', class: `card__text-wrapper ${this.hasBtn ? 'hasBtn' : ""}` }, h("div", { key: 'e7d8f660da3e91d1582127574c8b33a3bad28711', class: `card-text` }, h("slot", { key: 'f80c5455c35d6cf6480e47bd8962fd8a136f9240' }))));
     }
     get el() { return this; }
     static get style() { return IfxCardTextStyle0; }

package/dist/components/ifx-card.js

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, d as Host } from './p-f8e6a4ef.js';
 import { d as detectFramework, t as trackComponent } from './p-08c92877.js';
 import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
 
-const cardCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.card{position:relative;display:inline-flex;flex-direction:column;word-wrap:break-word;background-color:#FFFFFF;background-clip:border-box;border:2px solid #EEEDED;border-radius:2px;width:350px;height:auto;font-family:var(--ifx-font-family)}.card:has(.card-href:focus),.card:has(.card-href:hover){outline:none;border-color:#0A8276}.card:has(.card-href:focus) ::slotted(ifx-card-headline),.card:has(.card-href:hover) ::slotted(ifx-card-headline){color:#0A8276}.card.noBtns .vertical .lower__body-wrapper{padding-bottom:24px}.card.noBtns .horizontal .lower__body-wrapper{padding-bottom:24px}.card .horizontal{display:flex;flex-direction:row;min-height:218px}.card .horizontal .card-img{flex:1;text-decoration:none}.card .horizontal .card-img.noImage{display:none}.card .horizontal .card-img ::slotted([slot=img]){width:100%;vertical-align:bottom}.card .horizontal .lower__body-wrapper{flex:1;display:grid;grid-template-rows:1fr auto}.card .horizontal .lower__body-wrapper .upper-body{display:flex;flex-direction:column;text-decoration:none;color:#1D1D1D;padding:24px 24px 0px 24px}.card .vertical .upper__body-wrapper{text-decoration:none;color:#1D1D1D}.card .vertical .upper__body-wrapper .card-img{height:190px}.card .vertical .upper__body-wrapper .card-img.noImage{display:none}.card .vertical .upper__body-wrapper .upper-body{padding:24px 24px 0px 24px}.card .vertical .lower__body-wrapper:hover{border-color:#EEEDED}.card.horizontal{flex-direction:row;width:538px}.card.horizontal .card-img{flex:1;order:2}.card.horizontal .card-img ::slotted([slot=img]){width:100%;height:100%;vertical-align:bottom;object-fit:cover}.card.horizontal.left .horizontal .card-img{order:1}.card.horizontal.left .horizontal .lower__body-wrapper{order:2}.card .card-href:focus{outline:none}";
+const cardCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.card{position:relative;display:inline-flex;flex-direction:column;word-wrap:break-word;background-color:#FFFFFF;background-clip:border-box;border:1px solid #EEEDED;border-radius:1px;width:350px;height:auto;font-family:var(--ifx-font-family)}.card:has(.card-href:focus),.card:has(.card-href:hover){outline:none;border-color:#0A8276}.card:has(.card-href:focus) ::slotted(ifx-card-headline),.card:has(.card-href:hover) ::slotted(ifx-card-headline){color:#0A8276}.card.noBtns .vertical .lower__body-wrapper{padding-bottom:24px}.card.noBtns .horizontal .lower__body-wrapper{padding-bottom:24px}.card .horizontal{display:flex;flex-direction:row;min-height:218px}.card .horizontal .card-img{flex:1;text-decoration:none}.card .horizontal .card-img.noImage{display:none}.card .horizontal .card-img ::slotted([slot=img]){width:100%;vertical-align:bottom}.card .horizontal .lower__body-wrapper{flex:1;display:grid;grid-template-rows:1fr auto}.card .horizontal .lower__body-wrapper .upper-body{display:flex;flex-direction:column;text-decoration:none;color:#1D1D1D;padding:24px 24px 0px 24px}.card .vertical .upper__body-wrapper{text-decoration:none;color:#1D1D1D}.card .vertical .upper__body-wrapper .card-img{height:190px}.card .vertical .upper__body-wrapper .card-img.noImage{display:none}.card .vertical .upper__body-wrapper .upper-body{padding:24px 24px 0px 24px}.card .vertical .lower__body-wrapper:hover{border-color:#EEEDED}.card.horizontal{flex-direction:row;width:538px}.card.horizontal .card-img{flex:1;order:2}.card.horizontal .card-img ::slotted([slot=img]){width:100%;height:100%;vertical-align:bottom;object-fit:cover}.card.horizontal.left .horizontal .card-img{order:1}.card.horizontal.left .horizontal .lower__body-wrapper{order:2}.card .card-href:focus{outline:none}";
 const IfxCardStyle0 = cardCss;
 
 const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
@@ -21,14 +21,24 @@ const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
     handleComponentAdjustment() {
         const image = this.el.querySelector('ifx-card-image');
         const links = this.el.querySelector('ifx-card-links');
-        this.noImg = !image;
-        this.noBtns = !links;
+        if (!image) {
+            this.noImg = true;
+        }
+        else
+            this.noImg = false;
+        if (!links) {
+            this.noBtns = true;
+        }
+        else
+            this.noBtns = false;
         if (this.href.trim() === "") {
             this.internalHref = undefined;
         }
-        else {
+        else
             this.internalHref = this.href;
-        }
+    }
+    handleClassList(el, type, className) {
+        el.classList[type](className);
     }
     componentWillLoad() {
         this.handleComponentAdjustment();
@@ -43,12 +53,12 @@ const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
         this.handleComponentAdjustment();
     }
     render() {
-        return (h(Host, { key: '7a0780953a6893b1e7178cf52bbb4a0c90808bbf' }, h("div", { key: 'c4e49dbe8a1bc2a8cef3952cf70a88d47bb2e7c9', "aria-label": this.ariaLabel, class: `card 
-            ${this.noBtns ? 'noBtns' : ""}
-            ${this.direction} 
-            ${this.alignment}`, role: "group" }, this.direction === 'horizontal' &&
-            h("div", { key: '086a7287530747bda7154ea6ed5c80984bf2b3f3', class: "horizontal" }, h("a", { key: 'a1bd2d0ab3f203f712d3222fe71199da1e5c24e9', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: 'be5e480eaebc91de9f71c6953e90362879e7319a', name: "img" })), h("div", { key: '7bd12a56a66a2219059fdc9cd8ef1a77a68ae75b', class: 'lower__body-wrapper' }, h("a", { key: '9fdb1755fd1d2932008b2618c7fd89ff3f74453e', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, id: "upper-body-content" }, h("slot", { key: '508c537f02b9f8d8a360b104d534ce35f03b8b90' })), h("div", { key: 'd1866385d1aa28b74b56d0a64cd9d9e3fd4b7c5e' }, h("slot", { key: 'b6dcc04698bf10714ad473b19087eaa52fcad056', name: 'buttons' })))), this.direction === 'vertical' &&
-            h("div", { key: 'ab2bf4432da21fcb6ea4fbd383a883aa5bb09cc1', class: "vertical" }, h("a", { key: '8ca38de22e688384623f91e43968000cd0332e2c', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, h("div", { key: 'd5ece9e569b659ae75bd734ecee28acb0ed8a524', class: `card-img ${this.noImg ? 'noImage' : ""}` }, h("slot", { key: '20f8143a1581d32bd95a44cf355668868ae33503', name: "img" })), h("div", { key: 'b233b26f896472f79f02997292cfe80d8656fa6a', class: 'upper-body', id: "upper-body-content" }, h("slot", { key: '255dcd8f6bca0ed8506e00c1ee2cbcf5a02d1023' }))), h("div", { key: '5f30be5b734b4f2467180119c366c6bb87718ca5', class: 'lower__body-wrapper', role: "group", "aria-labelledby": "upper-body-content" }, h("slot", { key: '252604784de1be77af048feba37610a5be244d50', name: 'buttons' }))))));
+        return (h(Host, { key: 'd07e98daedf904aef49a0d8cc12bfd0456432bf3' }, h("div", { key: '06fa5ab99428d284b1ea11af7addfa6c2853ab37', "aria-label": this.ariaLabel, class: `card 
+          ${this.noBtns ? 'noBtns' : ""}
+          ${this.direction} 
+          ${this.alignment}`, role: "region" }, this.direction === 'horizontal' &&
+            h("div", { key: '41c062f9414e0603cc0908a791a81a5c451eebe1', class: "horizontal" }, h("a", { key: '2f6c911923d7e2934398271580183aec74013e5d', class: `card-img ${this.noImg ? 'noImage' : ""} ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: '02e9a8e6453f4e126bf39c48bce3d25ef1c062a6', name: "img" })), h("div", { key: 'f3966dd3ae5c33b271c7127db45e19ace51ee67b', class: 'lower__body-wrapper' }, h("a", { key: '2b812db8e76e6ed0180994a9a68363c1faeeee3e', class: `upper-body ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref }, h("slot", { key: '7d8e9b4c1b8cef3a8b26b6c1869b9cbceac4de7c' })), h("div", { key: 'd9460914375c08f05c62056ce4aee49535a925af' }, h("slot", { key: '411bf1e3dd19346173beb06202390ce732bc0a13', name: 'buttons' })))), this.direction === 'vertical' &&
+            h("div", { key: '70696b98465b1b26c1d510f5d9492339f6004907', class: "vertical" }, h("a", { key: 'dc9d5d4a8d7241290f90bbe71852c6910926bbe3', class: `upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`, href: this.internalHref, target: this.target }, h("div", { key: 'e6e6d8f406349af5cb4a701157ae74f19a6153b4', class: `card-img ${this.noImg ? 'noImage' : ""}` }, h("slot", { key: 'faa6416889199bd658da8638f21c015cfd1927f1', name: "img" })), h("div", { key: 'd0baef784e032b0c5ae80dc1bfe19aeb3a3c9798', class: 'upper-body' }, h("slot", { key: 'b62ee64aa4c1e7b2d87d4a932768c92d54193faa' }))), h("div", { key: '4327daa92e4fd7d3666405f003685aa7e854fdac', class: 'lower__body-wrapper' }, h("slot", { key: 'a804832254dfa3fff3eb61d5cd709e40aa591178', name: 'buttons' }))))));
     }
     get el() { return this; }
     static get style() { return IfxCardStyle0; }

package/dist/components/ifx-card.js.map

@@ -1 +1 @@
-{"file":"ifx-card.js","mappings":"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","names":[],"sources":["src/components/card/card.scss?tag=ifx-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.card {\n  position: relative;\n  display: inline-flex;\n  flex-direction: column;\n  word-wrap: break-word;\n  background-color: tokens.$ifxColorBaseWhite;\n  background-clip: border-box;\n  border: 2px solid tokens.$ifxColorEngineering200;\n  border-radius: 2px;\n  //width: 22rem;\n  width: 350px;\n  height: auto;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n  // when the link is focused or hovered, the border color changes\n  &:has(.card-href:focus), &:has(.card-href:hover) {\n    outline: none;\n    border-color: tokens.$ifxColorOcean500;\n\n    ::slotted(ifx-card-headline) {\n      color: tokens.$ifxColorOcean500;\n    }\n  }\n\n  &.noBtns {\n    & .vertical {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n\n    & .horizontal {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n  }\n\n  & .horizontal {\n    display: flex;\n    flex-direction: row;\n    min-height: 218px;\n\n    & .card-img {\n      flex: 1;\n      text-decoration: none;\n\n      &.noImage {\n        display: none;\n      }\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        vertical-align: bottom;\n      }\n    }\n\n    & .lower__body-wrapper {\n      flex: 1;\n      display: grid;\n      grid-template-rows: 1fr auto;\n\n      & .upper-body {\n        display: flex;\n        flex-direction: column;\n        text-decoration: none;\n        color: tokens.$ifxColorBaseBlack;\n        padding: 24px 24px 0px 24px;\n      }\n    }\n  }\n\n  & .vertical {\n    & .upper__body-wrapper {\n      text-decoration: none;\n      color: tokens.$ifxColorBaseBlack;\n\n      & .card-img {\n        height: 190px;\n\n        &.noImage {\n          display: none;\n        }\n      }\n\n      & .upper-body {\n        padding: 24px 24px 0px 24px;\n      }\n    }\n\n    & .lower__body-wrapper {\n      &:hover {\n        border-color: tokens.$ifxColorEngineering200;\n      }\n    }\n  }\n\n  &.horizontal {\n    flex-direction: row;\n    width: 538px;\n\n    & .card-img {\n      flex: 1;\n      order: 2;\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        height: 100%;\n        vertical-align: bottom;\n        object-fit: cover;\n      }\n    }\n\n    &.left {\n      & .horizontal {\n        & .card-img {\n          order: 1;\n        }\n\n        & .lower__body-wrapper {\n          order: 2;\n        }\n      }\n    }\n  }\n\n  & .card-href:focus {\n    outline: none;\n  }\n}","import { Component, h, Host, Element, Prop, State, Listen } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\n\nexport class Card {\n  @Element() el;\n  @State() noBtns: boolean;\n  @Prop() direction: 'horizontal' | 'vertical' = 'vertical';\n  @State() alignment: string;\n  @State() noImg: boolean;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\";\n  @Prop() target: string = \"_self\";\n  @Prop() ariaLabel: string | null;\n\n  @Listen('imgPosition')\n  setImgPosition(event) {\n    this.alignment = event.detail;\n  }\n\n  handleComponentAdjustment() {\n    const image = this.el.querySelector('ifx-card-image');\n    const links = this.el.querySelector('ifx-card-links');\n\n    this.noImg = !image;\n    this.noBtns = !links;\n\n    if (this.href.trim() === \"\") {\n      this.internalHref = undefined;\n    } else {\n      this.internalHref = this.href;\n    }\n  }\n\n  componentWillLoad() {\n    this.handleComponentAdjustment();\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-card', await framework);\n    }\n  }\n\n  componentWillUpdate() {\n    this.handleComponentAdjustment();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div \n          aria-label={this.ariaLabel} \n          class={\n            `card \n            ${this.noBtns ? 'noBtns' : \"\"}\n            ${this.direction} \n            ${this.alignment}`\n          }\n          role=\"group\"\n        >\n\n          {this.direction === 'horizontal' &&\n            <div class=\"horizontal\">\n              <a \n                class={`card-img ${this.noImg ? 'noImage' : \"\"} ${this.internalHref ? 'card-href' : ''}`} \n                href={this.internalHref}\n              >\n                <slot name=\"img\" />\n              </a>\n\n              <div class='lower__body-wrapper'>\n                <a \n                  class={`upper-body ${this.internalHref ? 'card-href' : ''}`} \n                  href={this.internalHref}\n                  id=\"upper-body-content\"\n                >\n                  <slot />\n                </a>\n                <div>\n                  <slot name='buttons' />\n                </div>\n              </div>\n            </div>}\n\n          {this.direction === 'vertical' &&\n            <div class=\"vertical\">\n              <a \n                class={`upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`} \n                href={this.internalHref} \n                target={this.target}\n              >\n                <div class={`card-img ${this.noImg ? 'noImage' : \"\"}`}>\n                  <slot name=\"img\" />\n                </div>\n\n                <div class='upper-body' id=\"upper-body-content\">\n                  <slot />\n                </div>\n              </a>\n\n              <div class='lower__body-wrapper' role=\"group\" aria-labelledby=\"upper-body-content\">\n                <slot name='buttons' />\n              </div>\n            </div>}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ifx-card.js","mappings":"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","names":[],"sources":["src/components/card/card.scss?tag=ifx-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-flex;\n}\n\n.card {\n  position: relative;\n  display: inline-flex;\n  flex-direction: column;\n  word-wrap: break-word;\n  background-color: tokens.$ifxColorBaseWhite;\n  background-clip: border-box;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  border-radius: 1px;\n  //width: 22rem;\n  width: 350px;\n  height: auto;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n  // when the link is focused or hovered, the border color changes\n  &:has(.card-href:focus), &:has(.card-href:hover) {\n    outline: none;\n    border-color: tokens.$ifxColorOcean500;\n\n    ::slotted(ifx-card-headline) {\n      color: tokens.$ifxColorOcean500;\n    }\n  }\n\n  &.noBtns {\n    & .vertical {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n\n    & .horizontal {\n      & .lower__body-wrapper {\n        padding-bottom: 24px;\n      }\n    }\n  }\n\n  & .horizontal {\n    display: flex;\n    flex-direction: row;\n    min-height: 218px;\n\n    & .card-img {\n      flex: 1;\n      text-decoration: none;\n\n      &.noImage {\n        display: none;\n      }\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        vertical-align: bottom;\n      }\n    }\n\n    & .lower__body-wrapper {\n      flex: 1;\n      display: grid;\n      grid-template-rows: 1fr auto;\n\n      & .upper-body {\n        display: flex;\n        flex-direction: column;\n        text-decoration: none;\n        color: tokens.$ifxColorBaseBlack;\n        padding: 24px 24px 0px 24px;\n      }\n    }\n  }\n\n  & .vertical {\n    & .upper__body-wrapper {\n      text-decoration: none;\n      color: tokens.$ifxColorBaseBlack;\n\n      & .card-img {\n        height: 190px;\n\n        &.noImage {\n          display: none;\n        }\n      }\n\n      & .upper-body {\n        padding: 24px 24px 0px 24px;\n      }\n    }\n\n    & .lower__body-wrapper {\n      &:hover {\n        border-color: tokens.$ifxColorEngineering200;\n      }\n    }\n  }\n\n  &.horizontal {\n    flex-direction: row;\n    width: 538px;\n\n    & .card-img {\n      flex: 1;\n      order: 2;\n\n      & ::slotted([slot=img]) {\n        width: 100%;\n        height: 100%;\n        vertical-align: bottom;\n        object-fit: cover;\n      }\n    }\n\n    &.left {\n      & .horizontal {\n        & .card-img {\n          order: 1;\n        }\n\n        & .lower__body-wrapper {\n          order: 2;\n        }\n      }\n    }\n  }\n\n  & .card-href:focus {\n    outline: none;\n  }\n}","import { Component, h, Host, Element, Prop, State, Listen } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\n\nexport class Card {\n  @Element() el;\n  @State() noBtns: boolean;\n  @Prop() direction: 'horizontal' | 'vertical' = 'vertical';\n  @State() alignment: string;\n  @State() noImg: boolean;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\"\n  @Prop() target: string = \"_self\";\n  @Prop() ariaLabel: string | null;\n\n  @Listen('imgPosition')\n  setImgPosition(event) {\n    this.alignment = event.detail\n  }\n\n  handleComponentAdjustment() {\n    const image = this.el.querySelector('ifx-card-image')\n    const links = this.el.querySelector('ifx-card-links')\n\n    if (!image) {\n      this.noImg = true;\n    } else this.noImg = false;\n\n    if (!links) {\n      this.noBtns = true;\n    } else this.noBtns = false;\n\n    if (this.href.trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n  }\n\n\n  componentWillLoad() {\n    this.handleComponentAdjustment()\n  }\n\n  async componentDidLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-card', await framework)\n    }\n  }\n\n  componentWillUpdate() {\n    this.handleComponentAdjustment()\n  }\n\nrender() {\n    return (\n      <Host>\n        <div aria-label={this.ariaLabel} class={\n          `card \n          ${this.noBtns ? 'noBtns' : \"\"}\n          ${this.direction} \n          ${this.alignment}`\n        }\n        role=\"region\">\n\n          {this.direction === 'horizontal' &&\n            <div class=\"horizontal\">\n              <a class={`card-img ${this.noImg ? 'noImage' : \"\"} ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref}>\n                <slot name=\"img\" />\n              </a>\n\n              <div class='lower__body-wrapper'>\n                <a class={`upper-body ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref}>\n                  <slot />\n                </a>\n                <div>\n                  <slot name='buttons' />\n                </div>\n              </div>\n            </div>}\n\n          {this.direction === 'vertical' &&\n            <div class=\"vertical\">\n              <a class={`upper__body-wrapper ${this.internalHref ? 'card-href' : ''}`} href={this.internalHref} target={this.target}>\n                <div class={`card-img ${this.noImg ? 'noImage' : \"\"}`}>\n                  <slot name=\"img\" />\n                </div>\n\n                <div class='upper-body'>\n                  <slot />\n                </div>\n              </a>\n\n              <div class='lower__body-wrapper'>\n                <slot name='buttons' />\n              </div>\n            </div>}\n        </div>\n      </Host>\n    );\n  }\n}"],"version":3}

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

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h } from './p-f8e6a4ef.js';
 import { d as detectFramework, t as trackComponent } from './p-08c92877.js';
 import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const checkboxGroupCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.checkbox-group-container{display:flex;flex-direction:column}.checkbox-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.checkbox-group.horizontal{flex-direction:row;column-gap:12px}.checkbox-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem \"Source Sans 3\";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem \"Source Sans 3\";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}";
 const IfxCheckboxGroupStyle0 = checkboxGroupCss;
@@ -56,7 +56,7 @@ const CheckboxGroup = /*@__PURE__*/ proxyCustomElement(class CheckboxGroup exten
         this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);
     }
     render() {
-        return (h("div", { key: 'b3f10b860ca3a976439a7be6d24a92a4214aabbc', class: 'checkbox-group-container' }, this.showGroupLabel ? h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', h("div", { key: '4d77558d3af07c48db430b3df5fa2aeeb288ee51', class: `checkbox-group ${this.alignment} ${this.size}` }, h("slot", { key: '634221dfaef08e771d56ad17e3618e6dc2e3c59e', 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: '4505e1aa565fe9d41fa6543dc7930f5b6e362f17', class: 'checkbox-group-container' }, this.showGroupLabel ? h("div", { class: 'group-label' }, this.groupLabelText, " *") : '', h("div", { key: '3dbb044ccbb1b776d0e7c23a5e678c4edb6640ee', class: `checkbox-group ${this.alignment} ${this.size}` }, h("slot", { key: '9dd54927fe6e3c4aa9c81d1f9200d9b54879e812', 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 formAssociated() { return true; }
     get el() { return this; }

package/dist/components/ifx-checkbox.js

@@ -1,4 +1,4 @@
-import { C as Checkbox, d as defineCustomElement$1 } from './p-5043151d.js';
+import { C as Checkbox, d as defineCustomElement$1 } from './p-fd987ef1.js';
 
 const IfxCheckbox = Checkbox;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,4 +1,4 @@
-import { C as ChipItem, d as defineCustomElement$1 } from './p-6d9db6c2.js';
+import { C as ChipItem, d as defineCustomElement$1 } from './p-3ae7dd5f.js';
 
 const IfxChipItem = ChipItem;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ifx-chip.js

@@ -1,4 +1,4 @@
-import { C as Chip, d as defineCustomElement$1 } from './p-f5c2df5f.js';
+import { C as Chip, d as defineCustomElement$1 } from './p-f5c56d77.js';
 
 const IfxChip = Chip;
 const defineCustomElement = defineCustomElement$1;

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

@@ -11,7 +11,7 @@ const ContentSwitcherItem = /*@__PURE__*/ proxyCustomElement(class ContentSwitch
         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: 'eb2064876e139b5c0c2d248f44bc9e53c59ddec9' }, h("button", { key: '9d5cda815b552227151774cc86f7786138637b7c', class: 'ifx-content-switcher-item' + (this.selected ? ' selected' : '') }, h("slot", { key: '3096af4e1c58ffa64aaff80139ba55c283542f7a' }))));
     }
     static get style() { return IfxContentSwitcherItemStyle0; }
 }, [1, "ifx-content-switcher-item", {

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

@@ -166,7 +166,7 @@ const ContentSwitcher = /*@__PURE__*/ proxyCustomElement(class ContentSwitcher e
         return this.items[index].getAttribute('value') || index.toLocaleString();
     }
     render() {
-        return (h(Host, { key: 'dc8ed1e40d00b2fb5b8274f3a1be386be2b7e6ff' }, h("div", { key: '12f9002e81a381891cc9c3e89b081966edc3daff', class: "ifx-content-switcher", role: "group" }, h("slot", { key: 'b2b0b7f694d08c9b04b9c0b763d32a29778871bd' }))));
+        return (h(Host, { key: 'cfd09dc94a3a85f70c53c4d165eaa15041da87f1' }, h("div", { key: 'f69231e230af7f50c5d0e591f3d9ee547e0d49d7', class: "ifx-content-switcher", role: "group" }, h("slot", { key: '0fb55309a02e265329b7c2d2989d29cd3c6cc82f' }))));
     }
     get el() { return this; }
     static get style() { return IfxContentSwitcherStyle0; }

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

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
 import { d as detectFramework, t as trackComponent } from './p-08c92877.js';
 import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const datePickerCss = ".date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem \"Source Sans 3\"}.date__picker-container .label__wrapper .asterisk{display:none}.date__picker-container .label__wrapper .asterisk.required{display:inline;margin-left:4px}.date__picker-container .label__wrapper .asterisk.required.error{color:#CD002F}.date__picker-container.disabled .label__wrapper{color:#575352}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#575352}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem \"Source Sans 3\"}.date__picker-input{font-family:\"Source Sans 3\";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:8px 16px;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#575352;background-color:#EEEDED}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background-color:#EEEDED}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle}";
 const IfxDatePickerStyle0 = datePickerCss;
@@ -102,8 +102,8 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class DatePicker extends H {
     }
     render() {
         var _a, _b;
-        return (h("div", { key: 'f875ef689c357c95a73bb541f3ac6457d6fe564c', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '0d98faaa4319093e982a5d7eba2a4500bf8ceead', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.trim(), h("span", { key: '5b2e4e755d291daaae7c91a445f709346a6765d0', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), h("div", { key: '6de0a53bc4d96f646845b1ee45143ec0c1d8e767', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '5fdeb8217f0949e897639079dde94c898f859ed5', 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: '6461b8951ec7cfb4ef206f85d499fa787c792bc2', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, h("ifx-icon", { key: '1ad41185d7c05db70102d5c5404ef19f1758e5cd', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: 'b81efc9cd12231b7e3c1e942d2795a23fe5230e0', class: 'caption__wrapper' }, this.caption.trim()))));
+        return (h("div", { key: '5d2543b0c6c9935ff74c514cfc517100f61d43b1', class: `date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '348c335c439d0a852762d075632aaff758d7da94', class: 'label__wrapper', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.trim(), h("span", { key: 'ae2d95aebc95c2856aacb7ee5211da62b7de7da6', class: `asterisk ${this.required ? 'required' : ""} ${this.error ? 'error' : ""}` }, "*")), h("div", { key: '47ba00c29761f06303637b5ce3e04fb43f2ca9d4', class: `input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '5cc28efe6b3b0327ac1fc53719a13ffb7341c94b', 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: '166d32561b8da5fe34516a142468172dd1b7d4df', class: "icon__wrapper", role: "button", onClick: () => this.handleInputFocusOnIconClick() }, h("ifx-icon", { key: '049816d11ecd6c035b81f13402882d9cc0c249d5', icon: 'calendar16', "aria-hidden": "true" }))), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: '463a221497c43da0d00e885080e639c55f71cf8a', class: 'caption__wrapper' }, this.caption.trim()))));
     }
     static get formAssociated() { return true; }
     get el() { return this; }

package/dist/components/ifx-download.js

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$2 } from './p-031c3ed3.js';
+import { d as defineCustomElement$2 } from './p-76234df0.js';
 
 const downloadCss = "";
 const IfxDownloadStyle0 = downloadCss;
@@ -19,7 +19,7 @@ const Download = /*@__PURE__*/ proxyCustomElement(class Download extends H {
         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: '44eba159092f96289f859562ff3321cf0427dc23', onClick: (e) => {
                 e.preventDefault();
                 fetch(fileUrl)
                     .then(res => res.blob())
@@ -29,7 +29,7 @@ const Download = /*@__PURE__*/ proxyCustomElement(class Download extends H {
                     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: 'e6faaaad767343dbd49f0b7947b517482bc4b87e' })));
     }
     static get style() { return IfxDownloadStyle0; }
 }, [1, "ifx-download", {

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

@@ -10,7 +10,7 @@ const DropdownHeader = /*@__PURE__*/ proxyCustomElement(class DropdownHeader ext
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: 'd93c45a63fba5ca781065e118af56370ddb340eb', class: 'dropdown-header' }, h("span", { key: 'dbcc17303d9d0cef7daf2150ac77833498f76ae7' }, h("slot", { key: 'f157de72d9b164e2492fae87d457da8227eb77ce' }))));
+        return (h("div", { key: '21b562fffd6883e6dc65b3d659e0b01d9d31f977', class: 'dropdown-header' }, h("span", { key: '1444751539fcd37f5aad4103d30263bbf3df955b' }, h("slot", { key: '55367ac5d32d6dae9687905552d35b16baa1eabc' }))));
     }
     static get style() { return IfxDropdownHeaderStyle0; }
 }, [1, "ifx-dropdown-header"]);

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

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const dropdownItemCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:var(--ifx-font-family)}.dropdown-item:focus{outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}";
 const IfxDropdownItemStyle0 = dropdownItemCss;
@@ -30,7 +30,7 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
         };
         if (!hasHref)
             common.tabIndex = 0;
-        return (h("a", Object.assign({ key: '8c3181f70b9263475ece29eb06e6363d8d022d1d' }, common, (hasHref ? { href: this.href, target: this.target } : {})), this.icon && h("ifx-icon", { key: '39d3b51a44e783e2ddd9cc2ecd105cd527449de9', class: "icon", icon: this.icon }), h("span", { key: 'bc073b63fc18557f41143a4e201d93fd3d024a0e' }, h("slot", { key: 'bc4e3e17a343248dc565a884af34345e191fafa9' }))));
+        return (h("a", Object.assign({ key: '79e584b02453c7c8758c50b631899b0797197d40' }, common, (hasHref ? { href: this.href, target: this.target } : {})), this.icon && h("ifx-icon", { key: 'b514d09ed04f7dd00ad3699b9bebc684e5a63035', class: "icon", icon: this.icon }), h("span", { key: 'e1bebe8d9fad683c42ab2159b3ee5e9b2fb19b90' }, h("slot", { key: 'aa1cc58f0dae60a7c7026be13ff3815355a0433d' }))));
     }
     get el() { return this; }
     static get style() { return IfxDropdownItemStyle0; }

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

@@ -51,10 +51,10 @@ const DropdownMenu = /*@__PURE__*/ proxyCustomElement(class DropdownMenu extends
             this.hideTopPadding = false;
     }
     render() {
-        return (h("div", { key: 'b9d6e51e53529ca6a57c45f0b9aa432afa8dd8c6', class: `dropdown-menu 
+        return (h("div", { key: '997c9f53aa8f99d54ce4a5e7996cb899fa54ac3c', class: `dropdown-menu 
       ${this.isOpen ? 'show' : ''} 
       ${this.hideTopPadding ? 'hideTopPadding' : ""}
-      ${this.size === 's' ? 'small' : ""}` }, h("slot", { key: '9d49836883d453647c6c3e146f177cdf00337ffc' })));
+      ${this.size === 's' ? 'small' : ""}` }, h("slot", { key: '8c9b7d147c9384f287d920fb9456f7a27915a752' })));
     }
     get el() { return this; }
     static get style() { return IfxDropdownMenuStyle0; }

package/dist/components/ifx-dropdown-separator.js

@@ -10,7 +10,7 @@ const DropdownSeparator = /*@__PURE__*/ proxyCustomElement(class DropdownSeparat
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: 'f842407a72dcfa69c2e05b821bab2f9ec3e2702f', class: 'dropdown-separator' }));
+        return (h("div", { key: '4fce89470119fcc2f22988dc414c82cd122de8bf', class: 'dropdown-separator' }));
     }
     static get style() { return IfxDropdownSeparatorStyle0; }
 }, [1, "ifx-dropdown-separator"]);

package/dist/components/ifx-dropdown-trigger-button.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$3 } from './p-6462dfec.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$3 } from './p-959c5e42.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const dropdownTriggerButtonCss = ":host{display:inline-block}.rotate{transition:transform 0.2s ease-in-out;transform:rotate(-180deg);margin-top:0em}.icon{margin-top:0em;transition:transform 0.2s ease-in-out}";
 const IfxDropdownTriggerButtonStyle0 = dropdownTriggerButtonCss;
@@ -16,8 +16,8 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
         this.hideArrow = false;
     }
     render() {
-        return (h("ifx-button", { key: 'a039a16f7329ab9af57d92555f54d27153936aa9', variant: this.variant, theme: this.theme, size: this.size, disabled: this.disabled, class: "dropdown-trigger-button" }, h("slot", { key: '06b448d35be0c0afbedde160f92824d9df4977ea' }), !this.hideArrow &&
-            h("ifx-icon", { key: '9b10c74e101533527e30e520a48db498bebe0715', icon: "chevron-down-16", class: `icon${this.isOpen ? ' rotate' : ''}` })));
+        return (h("ifx-button", { key: 'cfb95b28f92d30d5fd6d6a6d62f2f3d53e2c0165', variant: this.variant, theme: this.theme, size: this.size, disabled: this.disabled, class: "dropdown-trigger-button" }, h("slot", { key: 'c0c12c581865af00907908c3bfd52de337ed4060' }), !this.hideArrow &&
+            h("ifx-icon", { key: '4c9294e8a32d335c1f48bfc562888ad8a5d76205', icon: "chevron-down-16", class: `icon${this.isOpen ? ' rotate' : ''}` })));
     }
     static get style() { return IfxDropdownTriggerButtonStyle0; }
 }, [1, "ifx-dropdown-trigger-button", {

package/dist/components/ifx-dropdown-trigger.js

@@ -11,7 +11,7 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
         this.isOpen = false;
     }
     render() {
-        return (h("slot", { key: 'ef3ea59efc3e4cd4779f4e8dc50fae826c760015' }));
+        return (h("slot", { key: 'b1725954265277d9b3c6a1d02e127551e68e5372' }));
     }
     static get style() { return IfxDropdownTriggerStyle0; }
 }, [1, "ifx-dropdown-trigger", {

package/dist/components/ifx-dropdown.js

@@ -212,7 +212,7 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class Dropdown extends H {
         }
     }
     render() {
-        return (h("div", { key: 'd86aec49c4c83d1c374ea23ec11fc9587eb04e07', "aria-label": 'dropdown menu', class: 'dropdown' }, h("slot", { key: '1e4f399b01e7992c9c9ce198150416f9ac35c727' })));
+        return (h("div", { key: '9c54f90b3fcea70c3bf4b7fcb8babccc4014021d', "aria-label": 'dropdown menu', class: 'dropdown' }, h("slot", { key: 'e31ebbe5be5c815f8d5ead3d49edf4253e7c7579' })));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/ifx-faq.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$4 } from './p-76f13a4a.js';
-import { d as defineCustomElement$3 } from './p-ba5aa15c.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$4 } from './p-1084db51.js';
+import { d as defineCustomElement$3 } from './p-c59b5f3a.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const faqCss = ".container{padding-top:10px}";
 const IfxFaqStyle0 = faqCss;

package/dist/components/ifx-file-upload.js

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
 import { d as detectFramework, t as trackComponent } from './p-08c92877.js';
 import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
-import { d as defineCustomElement$5 } from './p-6462dfec.js';
-import { d as defineCustomElement$4 } from './p-6ca4e3f8.js';
-import { d as defineCustomElement$3 } from './p-91c41731.js';
-import { d as defineCustomElement$2 } from './p-67efc4cd.js';
+import { d as defineCustomElement$5 } from './p-959c5e42.js';
+import { d as defineCustomElement$4 } from './p-7452cb10.js';
+import { d as defineCustomElement$3 } from './p-eb553516.js';
+import { d as defineCustomElement$2 } from './p-3ecf457d.js';
 
 const fileUploadCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{font-family:var(--ifx-font-family, sans-serif)}.file-upload-wrapper{display:flex;flex-direction:column}.file-upload-wrapper.disabled{pointer-events:none}.file-upload-wrapper.disabled label,.file-upload-wrapper.disabled .file-upload-info{color:#575352}.file-upload-label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#1D1D1D}.file-upload-label .required{display:inline-block;margin-left:4px}.file-upload-label .required.error{color:#CD002F}.upload-dropzone{border:1px dashed #BFBBBB;padding:40px;text-align:center;cursor:pointer;color:#1D1D1D;transition:border-color 0.3s ease;border-radius:1px;background:#FFFFFF}.upload-dropzone ifx-icon{color:#0A8276}.upload-dropzone:hover{border:1px dashed #8D8786}.upload-dropzone.drag-over{border:1px solid #0A8276;background:#F7F7F7}.upload-dropzone.drag-over.error{border:1px solid #0A8276}.upload-dropzone.error{border-color:#CD002F}.disabled .upload-dropzone{pointer-events:none;border-color:#BFBBBB;color:#BFBBBB}.disabled .upload-dropzone ifx-icon{color:#BFBBBB}.upload-dropzone input{display:none}.file-upload-info{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0em;color:#1D1D1D;margin:0;margin-top:4px}.file-upload-status{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;margin-top:8px}.file-upload-status.file-upload-status__error{display:flex;align-items:center;color:#CD002F}.file-upload-status.file-upload-status__error ifx-icon{position:relative;top:-1px;color:#CD002F;margin-right:8px}.upload-heading{font:600 1.125rem/1.625rem \"Source Sans 3\";margin-bottom:8px}.file-list-wrapper{margin-top:16px}.file-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}.file-item{border:1px solid #BFBBBB;padding-top:12px;padding-right:16px;padding-bottom:8px;padding-left:16px;display:flex;gap:8px}.file-info{width:100%;min-width:0}.file-top-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:-8px}.file-top-row ifx-icon{flex-shrink:0}.file-name-wrapper{display:flex;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;font-weight:400;font-size:0.875rem}.file-name-base{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:1;min-width:0}.file-name-ext{flex-shrink:0;margin-left:0}.file-middle-row{display:flex;align-items:center;font-size:0.75rem;line-height:1rem;flex-wrap:wrap;color:#575352}.file-middle-row .file-status{margin-left:12px}.file-middle-row .file-status ifx-icon{margin-right:8px}.file-progress-row{margin-top:4px}.file-progress-row ifx-progress-bar{width:100%}.upload-success{border-color:#0A8276}.upload-success .file-status ifx-icon{position:relative;top:1px;color:#4CA460}.upload-failed{border-color:#CD002F}.upload-failed .file-status{color:#CD002F;margin-left:0}";
 const IfxFileUploadStyle0 = fileUploadCss;
@@ -537,10 +537,10 @@ const FileUpload = /*@__PURE__*/ proxyCustomElement(class FileUpload extends H {
         this.validateRequired();
     }
     render() {
-        return (h("div", { key: 'f98ff0d0152f1b8f2d7a96f4b4860a9836398dfe', class: {
+        return (h("div", { key: 'e4988037eb2b200f08f2ec23bf8a82c332fc4963', class: {
                 'file-upload-wrapper': true,
                 'disabled': this.disabled
-            } }, this.label && (h("label", { key: '2639246e2dc34728aa25c44ba7a9c4786f56552c', class: "file-upload-label", htmlFor: this.internalId }, this.label, this.required && (h("span", { key: '2b0a0e62e815f75b5a2e5d7ac886a809ad46d031', class: `required ${this.requiredError ? 'error' : ''}` }, "*")))), this.dragAndDrop ? this.renderDragAndDropArea() : this.renderUploadArea(), (this.files.length > 0 || this.rejectedSizeFiles.length > 0 || this.rejectedTypeFiles.length > 0) && (h("div", { key: 'd32153fac7ad16ed56ca6d388032883ba31355ea', class: "file-list-wrapper" }, h("div", { key: 'b3f72dc0e9b46933b192f31a98dd6eb2d3778bef', class: "upload-heading" }, this.labelUploadedFilesHeading), h("ul", { key: '23b8539f0d7d38a9c434d95a10eee392d57b2b23', class: "file-list" }, this.rejectedSizeFiles.map(fileName => (h("li", { class: "file-item upload-failed", key: `rejected-size-${fileName}` }, h("div", { class: "file-icon" }, h("ifx-icon", { icon: "file-16" })), h("div", { class: "file-info" }, h("div", { class: "file-top-row" }, h("span", { class: "file-name-wrapper" }, h("span", { class: "file-name-base" }, this.splitFileNameParts({ name: fileName }).base), h("span", { class: "file-name-ext" }, this.splitFileNameParts({ name: fileName }).ext)), h("div", { class: "file-actions" }, h("ifx-icon-button", { shape: "square", variant: "tertiary", icon: "delete-forever-16", size: "s", "aria-label": this.ariaLabelRemoveFile, onClick: () => this.clearRejectedFile(fileName, 'size') }))), h("div", { class: "file-middle-row" }, h("span", { class: "file-status", "aria-label": this.labelFileTooLarge.replace('{{size}}', this.maxFileSizeMB.toString()) }, this.getFormattedFileTooLargeText())))))), this.rejectedTypeFiles.map(fileName => (h("li", { class: "file-item upload-failed", key: `rejected-type-${fileName}` }, h("div", { class: "file-icon" }, h("ifx-icon", { icon: "file-16" })), h("div", { class: "file-info" }, h("div", { class: "file-top-row" }, h("span", { class: "file-name-wrapper" }, h("span", { class: "file-name-base" }, this.splitFileNameParts({ name: fileName }).base), h("span", { class: "file-name-ext" }, this.splitFileNameParts({ name: fileName }).ext)), h("div", { class: "file-actions" }, h("ifx-icon-button", { shape: "square", variant: "tertiary", icon: "delete-forever-16", size: "s", "aria-label": this.ariaLabelRemoveFile, onClick: () => this.clearRejectedFile(fileName, 'type') }))), h("div", { class: "file-middle-row" }, h("span", { class: "file-status", "aria-label": this.labelUnsupportedFileType }, this.labelUnsupportedFileType)))))), this.files.map((file) => {
+            } }, this.label && (h("label", { key: 'decb1bce2f08cd93a3c0d2ca8d4e6f543bd11dd8', class: "file-upload-label", htmlFor: this.internalId }, this.label, this.required && (h("span", { key: 'd9d30c4195dfdc5f910143b75b7ca61a25cf16e9', class: `required ${this.requiredError ? 'error' : ''}` }, "*")))), this.dragAndDrop ? this.renderDragAndDropArea() : this.renderUploadArea(), (this.files.length > 0 || this.rejectedSizeFiles.length > 0 || this.rejectedTypeFiles.length > 0) && (h("div", { key: 'e58f0b4bb11acb6ee51ea635bfb297b4b7d2108c', class: "file-list-wrapper" }, h("div", { key: '9699c607fef5cacefa9c7d7028126f75527812f9', class: "upload-heading" }, this.labelUploadedFilesHeading), h("ul", { key: '48641aaf54514f6a3aa6163aceeeccf87be3987a', class: "file-list" }, this.rejectedSizeFiles.map(fileName => (h("li", { class: "file-item upload-failed", key: `rejected-size-${fileName}` }, h("div", { class: "file-icon" }, h("ifx-icon", { icon: "file-16" })), h("div", { class: "file-info" }, h("div", { class: "file-top-row" }, h("span", { class: "file-name-wrapper" }, h("span", { class: "file-name-base" }, this.splitFileNameParts({ name: fileName }).base), h("span", { class: "file-name-ext" }, this.splitFileNameParts({ name: fileName }).ext)), h("div", { class: "file-actions" }, h("ifx-icon-button", { shape: "square", variant: "tertiary", icon: "delete-forever-16", size: "s", "aria-label": this.ariaLabelRemoveFile, onClick: () => this.clearRejectedFile(fileName, 'size') }))), h("div", { class: "file-middle-row" }, h("span", { class: "file-status", "aria-label": this.labelFileTooLarge.replace('{{size}}', this.maxFileSizeMB.toString()) }, this.getFormattedFileTooLargeText())))))), this.rejectedTypeFiles.map(fileName => (h("li", { class: "file-item upload-failed", key: `rejected-type-${fileName}` }, h("div", { class: "file-icon" }, h("ifx-icon", { icon: "file-16" })), h("div", { class: "file-info" }, h("div", { class: "file-top-row" }, h("span", { class: "file-name-wrapper" }, h("span", { class: "file-name-base" }, this.splitFileNameParts({ name: fileName }).base), h("span", { class: "file-name-ext" }, this.splitFileNameParts({ name: fileName }).ext)), h("div", { class: "file-actions" }, h("ifx-icon-button", { shape: "square", variant: "tertiary", icon: "delete-forever-16", size: "s", "aria-label": this.ariaLabelRemoveFile, onClick: () => this.clearRejectedFile(fileName, 'type') }))), h("div", { class: "file-middle-row" }, h("span", { class: "file-status", "aria-label": this.labelUnsupportedFileType }, this.labelUnsupportedFileType)))))), this.files.map((file) => {
             var _a;
             const task = this.uploadTasks.find(t => t.file.name === file.name);
             const progress = (_a = task === null || task === void 0 ? void 0 : task.progress) !== null && _a !== void 0 ? _a : 100;

package/dist/components/ifx-filter-accordion.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$3 } from './p-6ca4e3f8.js';
-import { d as defineCustomElement$2 } from './p-612f4440.js';
+import { d as defineCustomElement$3 } from './p-7452cb10.js';
+import { d as defineCustomElement$2 } from './p-d0e83b05.js';
 
 // utils.ts
 function getInitiallySelectedItems(el) {
@@ -53,8 +53,8 @@ const FilterAccordion = /*@__PURE__*/ proxyCustomElement(class FilterAccordion e
         this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
     }
     render() {
-        return (h("div", { key: '3d0fd2cc850927fc6cc458867b049a582f47a0f5', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '0bc0dafdcfd874ae01fd7bb8446036ad34c07603', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '5b8a0a61ca1b4b5c640933b7e81e6c5f3f406ba1', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '16e29f1f8ca7870e1e62cd5bcd56766a8a6ac512', class: "text" }, h("span", { key: '69687b082848bebb93647219eb8c1908b21d2c03' }, this.filterGroupName), h("ifx-indicator", { key: 'ede8211d6cee49e3a5af93e377b05863b324ab52', variant: 'number', number: this.count })), h("ifx-icon", { key: '27394e246008a8cefc69782b50885973cb548ce6', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'c517b29a5a66c8747a724af163ca761d3a7e11d9', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
-            h("div", { key: '289e7251b83c88a26445be01f22575c85c5689e3', class: "filter-accordion-container" }, h("slot", { key: 'd63dbb79d3676b8881afaa318b6d642563935baa', name: "list" }))));
+        return (h("div", { key: '177f8719342f1d94c6cfb283445a1d7bae40069c', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '1b63679c024856b6c4605e5ce04560712a23cf47', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '3d483679275683ee858f4948fe7af9e357cb8e63', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '2646244c9d7f43f49b367e9790a08d3e6a3901ff', class: "text" }, h("span", { key: '4d427f047445902743cfdf4fb7c856e4a15a9a34' }, this.filterGroupName), h("ifx-indicator", { key: '9175f3336763be04cda2e33c52d80bcd4b2979fa', variant: 'number', number: this.count })), h("ifx-icon", { key: '32e11abee6aae6a12f26058826cc7ea7cd7d4a34', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: '49e62e09693f8e5c07c07a0be762735800caadb3', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
+            h("div", { key: '75a011645adcb0d5f8bb0905e34554fea1543311', class: "filter-accordion-container" }, h("slot", { key: '1ac065aa2a58e8cfa1be304e9b89fce136bfb0a4', name: "list" }))));
     }
     get el() { return this; }
     static get style() { return IfxFilterAccordionStyle0; }

package/dist/components/ifx-filter-bar.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f8e6a4ef.js';
-import { d as defineCustomElement$3 } from './p-6462dfec.js';
-import { d as defineCustomElement$2 } from './p-6ca4e3f8.js';
+import { d as defineCustomElement$3 } from './p-959c5e42.js';
+import { d as defineCustomElement$2 } from './p-7452cb10.js';
 
 const filterBarCss = ":host{display:block;width:100%}.search-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-start;margin-bottom:16px}.components-container{display:flex;width:calc(100% - 48px);padding-left:24px;padding-right:24px;flex-direction:row;align-items:flex-end;align-content:flex-end;flex-wrap:wrap;gap:16px}.filter-slot-wrapper{flex-grow:1;flex-basis:100%;max-width:100%}@media (max-width: 1024px){.more-filters-wrapper{order:3;width:100%;display:flex;justify-content:center;padding-top:16px;}}@media (min-width: 720px) and (max-width: 1024px){.filter-slot-wrapper{flex-basis:calc((100% - 16px) / 2);max-width:calc((100% - 16px) / 2)}}@media (min-width: 1025px){.filter-slot-wrapper{flex-basis:auto;max-width:200px}::slotted([slot=filter-search]){max-width:828px}}::slotted([slot=filter-search]){flex-grow:1;flex-basis:100%;width:100%}";
 const IfxFilterBarStyle0 = filterBarCss;
@@ -97,7 +97,7 @@ const FilterBar = /*@__PURE__*/ proxyCustomElement(class FilterBar extends H {
         // Calculate slotsToShow safely
         const slotsToShow = Math.min(safeVisibleSlots, actualNumberOfComponents, Number.MAX_SAFE_INTEGER);
         const slots = Array.from({ length: slotsToShow }, (_, i) => (h("div", { class: "filter-slot-wrapper" }, h("slot", { name: `filter-component-${i + 1}` }))));
-        return (h(Host, { key: '61ff68bcd216de78c9cb8e602a0c458d2e8d8c80' }, h("div", { key: '16ad48a609a86177bf091353c2d1e2930f8cd511', class: "search-container" }, h("slot", { key: '5cf1d5ee6b7abe44edbd6826eb521ab491b6f621', name: "filter-search" }), " "), h("div", { key: '22bf6b2805f8c0a2db88b18905a5216c5091cc31', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: '3873323683c5115d92be0735b283e082e052622a', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: '3628211cca4ec943829f4964b9f49ae4e9b89ad3', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: 'c659f861b2223ae50f23dedfe7b1a8d0e52aadba', icon: "filter-16" }), "More filters"))))));
+        return (h(Host, { key: '690d82a5f589f9f01efaee16296ff558ae04e06c' }, h("div", { key: '153b9a14d4c963822f48dcbbebeaa8076a40bea7', class: "search-container" }, h("slot", { key: '762fbea72141393b72246957b356d08ab30a9d2c', name: "filter-search" }), " "), h("div", { key: '2fb9fcaf7364430d5b64ec9d291a9fa059f1f530', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: 'e5dc4a6d4cc6a75ef0353afcc32d6e4be98b3b86', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: 'f8d269e7e1188d6992fd3665ef9d7c492acac0c2', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: '53d129bcf639226942efa3e02794c76144fe8441', icon: "filter-16" }), "More filters"))))));
     }
     get el() { return this; }
     static get style() { return IfxFilterBarStyle0; }