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

package/dist/collection/components/pagination/pagination.js

@@ -137,7 +137,7 @@ export class Pagination {
         this.initPagination(paginationElement);
     }
     render() {
-        return (h("div", { key: '4ec9fa157bffc6ab856a582d04607c928124f9c3', "aria-label": 'a pagination', "aria-value": this.currentPage, class: "container" }, h("div", { key: 'cc0cc98edc93210095ac4695418a3c263c38d251', class: 'items__per-page-wrapper' }, h("div", { key: 'dd3af02f33da94f549387cfaa6f70776ddc84b50', class: 'items__per-page-label' }, "Results per Page"), h("div", { key: 'a2a0593552c88a6a5af114d2c88b717c6c413b18', class: 'items__per-page-field' }, h("ifx-select", { key: 'b0e740e52c0386525f70b5cfe20a27f7fcf88b29', value: 'undefined', size: 's', placeholder: 'false', "show-search": 'false', "search-placeholder-value": 'Search...', disabled: false, error: false, "error-message": 'Error', label: '', "placeholder-value": 'Placeholder', options: '[{"value":"ten","label":"10","selected":true}, {"value":"Twenty","label":"20","selected":false}, {"value":"Thirty","label":"30","selected":false}]' }))), h("div", { key: '610ee10aefca78fcbd798e11d9cf99b1f60532f0', class: 'items__total-wrapper' }, h("div", { key: '72e303b997ab16d10ecc0a9df4ba73153a49456c', class: 'page__numbers-wrapper' }, h("div", { key: '8383cf3d859477321b01b8c02d09bcab7d3d7552', class: "pagination" }, h("ifx-icon-button", { key: '0d4c16785e157dbf6d0393b001272fcb603ca685', variant: 'secondary', class: "prev", color: 'primary', icon: 'arrow-left-24' }), h("ol", { key: '90491f5a10434d0cd5798fdad20f75fe0b0f1b03' }, this.numberOfPages.map((item) => h("li", { class: `${this.internalPage === item ? 'active' : ""}` }, h("a", { href: undefined }, item)))), h("ifx-icon-button", { key: '889f3f8900feaecfc769af6c6dd833e36690b667', class: "next", variant: 'secondary', color: 'primary', icon: 'arrow-right-24' }))))));
+        return (h("div", { key: '9bd7fdf4fe55dc44d759b1ed8a762c4e2c59dd92', "aria-label": 'a pagination', "aria-value": this.currentPage, class: "container" }, h("div", { key: '56c1c63bd26330b122c8200e836e47d692cf798a', class: 'items__per-page-wrapper' }, h("div", { key: '52ed9e8ef5da46e7f4d2ea582773aa823738bd06', class: 'items__per-page-label' }, "Results per Page"), h("div", { key: '9e061fc231797a0cdae5d8238ef0219b945d4285', class: 'items__per-page-field' }, h("ifx-select", { key: '35d2e70bed912e00fe53caee26e8d9af0726e24f', value: 'undefined', size: 's', placeholder: 'false', "show-search": 'false', "search-placeholder-value": 'Search...', disabled: false, error: false, "error-message": 'Error', label: '', "placeholder-value": 'Placeholder', options: '[{"value":"ten","label":"10","selected":true}, {"value":"Twenty","label":"20","selected":false}, {"value":"Thirty","label":"30","selected":false}]' }))), h("div", { key: '1d1ffdaa8de12c2f11cf19a1bae7b656e57ff2d4', class: 'items__total-wrapper' }, h("div", { key: 'f0d9168c69c951c1cb5030be438bce9bea227e07', class: 'page__numbers-wrapper' }, h("div", { key: '5651775e0f57844392cdcc595ff26ca2fe20fdf6', class: "pagination" }, h("ifx-icon-button", { key: '539ced71e1aab947618261627c55a779859b552f', variant: 'secondary', class: "prev", color: 'primary', icon: 'arrow-left-24' }), h("ol", { key: '04aa156901294e6f609815e0534b95f68f12dc70' }, this.numberOfPages.map((item) => h("li", { class: `${this.internalPage === item ? 'active' : ""}` }, h("a", { href: undefined }, item)))), h("ifx-icon-button", { key: 'd19cb98cbebfb7cc0cea8339b71b0f44f160b854', class: "next", variant: 'secondary', color: 'primary', icon: 'arrow-right-24' }))))));
     }
     static get is() { return "ifx-pagination"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/progress-bar/progress-bar.js

@@ -15,7 +15,7 @@ export class ProgressBar {
         this.internalValue = this.value;
     }
     render() {
-        return (h("div", { key: '1360676ba210ec95fdfb385aa9bcf358da7a7317', "aria-label": 'a progress bar', "aria-value": this.value, class: `progress-bar ${this.size}` }, h("div", { key: 'd8ec99d808b55c36c25bdbc3c398927aecdc444c', class: "progress", style: { width: `${this.internalValue}%` } }, this.showLabel && this.size !== "s" && this.internalValue !== 0 && h("span", { key: 'd5277e0a9a6f3cf021588388ad62e55a3e9dc483', class: "label" }, `${this.internalValue}%`))));
+        return (h("div", { key: '9a1fc68c768dc22c5926f0eae299862f2d2de371', "aria-label": 'a progress bar', "aria-value": this.value, class: `progress-bar ${this.size}` }, h("div", { key: '6e847900044f4bc04eacbcc194ffac8bf6b83e0a', class: "progress", style: { width: `${this.internalValue}%` } }, this.showLabel && this.size !== "s" && this.internalValue !== 0 && h("span", { key: '8e6fa2713fbcd0b956b8f27b873816adc0c3cb7f', class: "label" }, `${this.internalValue}%`))));
     }
     static get is() { return "ifx-progress-bar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -54,10 +54,10 @@ export class RadioButton {
         }
     }
     render() {
-        return (h("div", { key: 'eb9564d85cfbf52109f17dfc625afa795f46426e', "aria-label": 'a radio button', "aria-value": this.value, "aria-disabled": this.disabled, class: `radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`, onClick: this.handleRadioButtonClick.bind(this) }, h("div", { key: '02b349d4679490ffc4b17c30085b17b753054f84', class: `radioButton__wrapper 
+        return (h("div", { key: '819802746e4a0825c87d7adca77bb827a63a0baf', "aria-label": 'a radio button', "aria-value": this.value, "aria-disabled": this.disabled, class: `radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`, onClick: this.handleRadioButtonClick.bind(this) }, h("div", { key: 'f20b42f3321deeb814833a7bb031f7d069f7d1b2', class: `radioButton__wrapper 
           ${this.internalChecked ? 'checked' : ''} 
           ${this.disabled ? 'disabled' : ''} 
-          ${this.error ? 'error' : ''}`, tabIndex: this.disabled ? -1 : 0 }, this.internalChecked && h("div", { key: 'd499d0fecff0a3fb7dc17d9777b4cf31dc16c4c4', class: "radioButton__wrapper-mark" })), this.hasSlot && (h("div", { key: 'c05c54192fb889c3fc5a39adc13a0c69f901c4f9', class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '5f7c2b3a2140943974f0b0114e7ec749c7d1c7d5' }))), h("input", { key: '3e3c791991126e2273f7066d7ca9a9674125171e', type: "radio", hidden: true, ref: el => this.inputElement = el, name: this.name, value: this.value, checked: this.internalChecked, disabled: this.disabled, onClick: (e) => e.stopPropagation() })));
+          ${this.error ? 'error' : ''}`, tabIndex: this.disabled ? -1 : 0 }, this.internalChecked && h("div", { key: 'd4443d5bbf237ec4e03f2cc9552f7ec5713ff84f', class: "radioButton__wrapper-mark" })), this.hasSlot && (h("div", { key: 'f0065296ff99adbf0b1135a63aec8c073267d00f', class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '3d4ba2e80182a5361a8235a09a9e11676c36c09d' }))), h("input", { key: '464110acdb39ee7e4c412b7c3b91d24d0b032835', type: "radio", hidden: true, ref: el => this.inputElement = el, name: this.name, value: this.value, checked: this.internalChecked, disabled: this.disabled, onClick: (e) => e.stopPropagation() })));
     }
     static get is() { return "ifx-radio-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/search-bar/search-bar.js

@@ -32,7 +32,7 @@ export class SearchBar {
         this.value = event.detail;
     }
     render() {
-        return (h("div", { key: '8aeeaed36f3008374b1cdbb0d2038ba613f02fbe', "aria-label": 'a search bar', "aria-disabled": this.disabled, class: `search-bar ${this.internalState ? 'open' : 'closed'}` }, this.internalState ? (h("div", { class: "search-bar-wrapper" }, h("ifx-search-field", { disabled: this.disabled, value: this.value, maxlength: this.maxlength, onIfxInput: this.handleInput.bind(this) }, h("ifx-icon", { icon: "search-16", slot: "search-icon" })), h("a", { tabindex: "-1", href: 'javascript:void(0)', onClick: this.handleCloseButton }, "Close"))) : (h("div", { class: "search-bar__icon-wrapper", onClick: this.handleCloseButton }, h("ifx-icon", { icon: "search-16" })))));
+        return (h("div", { key: '70a67c41a1506e4fd14f87b95e23db18953dcb16', "aria-label": 'a search bar', "aria-disabled": this.disabled, class: `search-bar ${this.internalState ? 'open' : 'closed'}` }, this.internalState ? (h("div", { class: "search-bar-wrapper" }, h("ifx-search-field", { disabled: this.disabled, value: this.value, maxlength: this.maxlength, onIfxInput: this.handleInput.bind(this) }, h("ifx-icon", { icon: "search-16", slot: "search-icon" })), h("a", { tabindex: "-1", href: 'javascript:void(0)', onClick: this.handleCloseButton }, "Close"))) : (h("div", { class: "search-bar__icon-wrapper", onClick: this.handleCloseButton }, h("ifx-icon", { icon: "search-16" })))));
     }
     static get is() { return "ifx-search-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/search-field/search-field.js

@@ -45,7 +45,7 @@ export class SearchField {
             this.showDeleteIconInternalState = false;
     }
     render() {
-        return (h("div", { key: 'b4bf335d114d109dc89ac8afd5318e356e0edad4', "aria-label": "a search field for user input", "aria-disabled": this.disabled, "aria-value": this.value, class: 'search-field' }, h("div", { key: '2f2244878a1e0992518c0cc1fb9ce9b037c67841', class: this.getWrapperClassNames(), tabindex: 1, onFocus: () => this.focusInput(), onClick: () => this.focusInput() }, h("ifx-icon", { key: '245f34626f4c5ee2cb62953d82795bdaf711401d', icon: "search-16", class: "search-icon" }), h("input", { key: '2ac3d180884af394d8be42d6fd0776908abd5a4b', ref: (el) => (this.inputElement = el), type: "text", onInput: () => this.handleInput(), placeholder: this.placeholder, disabled: this.disabled, maxlength: this.maxlength, value: this.value }), this.showDeleteIcon && this.showDeleteIconInternalState ? (h("ifx-icon", { icon: "cremove16", class: "delete-icon", onClick: this.handleDelete })) : null)));
+        return (h("div", { key: 'dd5d16c933ec70acb8950279f4642ac93ab8b801', "aria-label": "a search field for user input", "aria-disabled": this.disabled, "aria-value": this.value, class: 'search-field' }, h("div", { key: '92159e695d65890de079c49c25dba47a0243e56b', class: this.getWrapperClassNames(), tabindex: 1, onFocus: () => this.focusInput(), onClick: () => this.focusInput() }, h("ifx-icon", { key: '27c96d542775740161ea3630851b0b19d90a177f', icon: "search-16", class: "search-icon" }), h("input", { key: 'df87749e87af361855083fc54ff76826d2ca12b2', ref: (el) => (this.inputElement = el), type: "text", onInput: () => this.handleInput(), placeholder: this.placeholder, disabled: this.disabled, maxlength: this.maxlength, value: this.value }), this.showDeleteIcon && this.showDeleteIconInternalState ? (h("ifx-icon", { icon: "cremove16", class: "delete-icon", onClick: this.handleDelete })) : null)));
     }
     getSizeClass() {
         return `${this.size}` === "s"

package/dist/collection/components/segmented-control/segment/segment.js

@@ -21,7 +21,7 @@ export class Segment {
         }
     }
     render() {
-        return (h("div", { key: '587e008edc3a8ea46b22c684de9a3c8260df0d3b', class: `segment ${this.selected ? 'segment--selected' : ''}`, tabIndex: 0, onClick: () => { this.handleSegmentClick(); }, onKeyDown: (e) => { this.handleSegmentKeyDown(e); } }, h("ifx-icon", { key: 'e54741c9a73bc7f8ec78d989202b2f9873177afe', icon: this.icon }), " ", h("slot", { key: '09e547f59983cf93d26458ce0f7c61d781ddaeab' })));
+        return (h("div", { key: '82774e43f27d8995c36d7d356780bbe14b76f70c', class: `segment ${this.selected ? 'segment--selected' : ''}`, tabIndex: 0, onClick: () => { this.handleSegmentClick(); }, onKeyDown: (e) => { this.handleSegmentKeyDown(e); } }, h("ifx-icon", { key: '58ea805311f071bf39562bb043a4ea4e77b6cd57', icon: this.icon }), " ", h("slot", { key: '659727a8768c1988b251d795c9a7ae5b9554b1f0' })));
     }
     static get is() { return "ifx-segment"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segmented-control/segmented-control.js

@@ -62,8 +62,8 @@ export class SegmentedControl {
         this.setActiveSegment();
     }
     render() {
-        return (h("div", { key: 'e116c609714fe9a5bbeb427121773e5155d1b699', "aria-value": this.selectedValue, "aria-label": 'segmented control', class: 'group' }, h("div", { key: '96fb1f4795698bf8670ad5b43e42bcc403d54a80', class: 'group__label' }, this.label.trim()), h("div", { key: '5d0696b0714a1a7416409ceb8f76847ca03e114f', class: 'group__controls' }, h("slot", { key: 'ebe808adc5168158272e0ca83b4643218d129b53' })), this.caption.trim() &&
-            h("div", { key: '6e9c1c678173697f3611b28de31cc642b3f1d10a', class: 'group__caption' }, h("ifx-icon", { key: '5ef9071dd99e61ba47fc02436a2472e17b03977e', icon: 'cinfo16' }), " ", this.caption.trim())));
+        return (h("div", { key: '9fb656fefd8b61e7c563ac77a20a303d40c6f146', "aria-value": this.selectedValue, "aria-label": 'segmented control', class: 'group' }, h("div", { key: 'de4f8bf1f2404f106ff180167bf4c79abd2b165b', class: 'group__label' }, this.label.trim()), h("div", { key: 'e110c6c98b981142df08e7dda574b2d3e102a19d', class: 'group__controls' }, h("slot", { key: '3dd13439a68201c2f42104c4853b371c669e18df' })), this.caption.trim() &&
+            h("div", { key: '946fe774c7cf3f9642447b9a8cb0e258d3f9d493', class: 'group__caption' }, h("ifx-icon", { key: '39f21a9eae4961da05f38d6930bcc373671e9794', icon: 'cinfo16' }), " ", this.caption.trim())));
     }
     componentDidRender() {
         this.setSegmentSize();

package/dist/collection/components/select/single-select/select.js

@@ -251,9 +251,9 @@ export class Choices {
         // destroy choices element to restore previous dom structure
         // so vdom can replace the element correctly
         this.destroy();
-        return (h("div", { key: '1c38fa61f2a05bec6421754af26f323d93400873', class: `ifx-select-container` }, this.label ? (h("div", { class: "ifx-label-wrapper" }, h("span", null, this.label))) : null, h("div", { key: '11ff0a9d233115879b7d4e3d012ceb75249ccd27', class: `${choicesWrapperClass} 
+        return (h("div", { key: '9f22a991b500016c41a63d7aa46fff087227f90b', class: `ifx-select-container` }, this.label ? (h("div", { class: "ifx-label-wrapper" }, h("span", null, this.label))) : null, h("div", { key: '259b6f62d0e5c60ea8fa11734fda41f969555a96', class: `${choicesWrapperClass} 
             ${this.disabled ? 'disabled' : ''} 
-            ${this.error ? 'error' : ''}`, onClick: this.disabled ? undefined : () => this.toggleDropdown(), onKeyDown: event => this.handleKeyDown(event) }, h("select", Object.assign({ key: '09e2ada9f99fd3d6016bc80f6672a466c4a1d66c', class: 'single__select-input-field', disabled: this.disabled }, attributes, { "data-trigger": true, onChange: () => this.handleChange() }), this.createSelectOptions(this.options)), h("div", { key: 'fd07f57f7ad103e9de02810dfd687f91345f101b', class: "single__select-icon-container" }, this.optionIsSelected && (h("div", { key: '56f260aa693b4b703a9f6c0ffbc9246319a3385a', class: "ifx-choices__icon-wrapper-delete" }, h("ifx-icon", { key: 'f8143ce0d914333662436e935ad7704550417f78', icon: "cremove16", onClick: () => this.handleDeleteSelection() }))), h("div", { key: '971685984e40b41c35d89b91d6a37aa940a28f23', class: "ifx-choices__icon-wrapper-up" }, h("ifx-icon", { key: "icon-up", icon: "chevronup-16" })), h("div", { key: '75cd00f8c34e39b3e80aa73b5d3dd58d2009fd45', class: "ifx-choices__icon-wrapper-down" }, h("ifx-icon", { key: "icon-down", icon: "chevron-down-16" })))), this.error ? (h("div", { class: "ifx-error-message-wrapper" }, h("span", null, this.errorMessage))) : null));
+            ${this.error ? 'error' : ''}`, onClick: this.disabled ? undefined : () => this.toggleDropdown(), onKeyDown: event => this.handleKeyDown(event) }, h("select", Object.assign({ key: '9358b42323bf7828676c6423c89fb5179b8e4651', class: 'single__select-input-field', disabled: this.disabled }, attributes, { "data-trigger": true, onChange: () => this.handleChange() }), this.createSelectOptions(this.options)), h("div", { key: 'f1d7ce031e84ca4c55c1b2228c7cf2501cf8c78d', class: "single__select-icon-container" }, this.optionIsSelected && (h("div", { key: '3e72d6ecf1d7a5649baa99131ac76a1287678293', class: "ifx-choices__icon-wrapper-delete" }, h("ifx-icon", { key: '7e0e78337c13e780c3c3ee80b5252fd35dd103e0', icon: "cremove16", onClick: () => this.handleDeleteSelection() }))), h("div", { key: '8037dfe8733b35760da9fba0d63886c5086819b9', class: "ifx-choices__icon-wrapper-up" }, h("ifx-icon", { key: "icon-up", icon: "chevronup-16" })), h("div", { key: 'd3d78aec55206c83b2cf81c5d43a6bf8f4a3c37f', class: "ifx-choices__icon-wrapper-down" }, h("ifx-icon", { key: "icon-down", icon: "chevron-down-16" })))), this.error ? (h("div", { class: "ifx-error-message-wrapper" }, h("span", null, this.errorMessage))) : null));
     }
     toggleDropdown() {
         const div = this.root.querySelector('.ifx-choices__wrapper');

package/dist/collection/components/slider/slider.js

@@ -143,10 +143,10 @@ export class IfxSlider {
         this.updateValuePercent();
     }
     render() {
-        return (h("div", { key: '14f5b27062610f82b256f8e73f8e3b41c05a764f', class: "ifx-slider" }, this.leftText && (h("span", { key: '9c6f305917f914fdb32b45ef840b81d8d2e0bba9', class: `left-text` }, this.leftText)), this.leftIcon && (h("ifx-icon", { key: 'd1b05c430a19703d899af1a695578b947941a4d9', icon: this.leftIcon, class: `left-icon${this.disabled ? ' disabled' : ''}` })), (this.type !== 'double') ?
+        return (h("div", { key: '3a43035d99bb5ae166d215994ba35dcc0a72f800', class: "ifx-slider" }, this.leftText && (h("span", { key: 'b5b672dd97b5fbe71f4e23ac0f35311fb4014112', class: `left-text` }, this.leftText)), this.leftIcon && (h("ifx-icon", { key: '1b167231afc1aba9165c7b0e340ba692ffb3ec04', icon: this.leftIcon, class: `left-icon${this.disabled ? ' disabled' : ''}` })), (this.type !== 'double') ?
             h("input", { type: "range", min: this.min, max: this.max, step: this.step, value: this.internalValue, disabled: this.disabled, ref: (el) => (this.inputRef = el), onInput: (event) => this.handleInputChange(event), "aria-label": 'a slider', "aria-value": this.value, "aria-disabled": this.disabled })
             :
-                h("div", { class: 'range-slider__wrapper', "aria-label": 'a range slider', "aria-value": this.value, "aria-disabled": this.disabled }, h("input", { id: 'min-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMinValue, disabled: this.disabled, ref: (el) => (this.minInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) }), h("input", { id: 'max-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMaxValue, disabled: this.disabled, ref: (el) => (this.maxInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) })), this.rightIcon && (h("ifx-icon", { key: 'b639fd71b68fe8baae478a78312b8278d9f900dc', icon: this.rightIcon, class: `right-icon${this.disabled ? ' disabled' : ''}` })), this.rightText && (h("span", { key: 'cc658600d7e18078642473f1b7ac64dfbfe0407f', class: `right-text${this.disabled ? ' disabled' : ''}` }, this.rightText)), this.showPercentage && (this.type !== "double") && (h("span", { key: 'be131d47a02d043ec98adcaf935c1c9a3cb14d3e', class: `percentage-display${this.disabled ? ' disabled' : ''}` }, this.percentage, "%"))));
+                h("div", { class: 'range-slider__wrapper', "aria-label": 'a range slider', "aria-value": this.value, "aria-disabled": this.disabled }, h("input", { id: 'min-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMinValue, disabled: this.disabled, ref: (el) => (this.minInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) }), h("input", { id: 'max-slider', type: 'range', min: this.min, max: this.max, step: this.step, value: this.internalMaxValue, disabled: this.disabled, ref: (el) => (this.maxInputRef = el), onInput: (event) => this.handleInputChangeOfRangeSlider(event), onMouseUp: (event) => this.handleOnMouseLeaveOfRangeSlider(event) })), this.rightIcon && (h("ifx-icon", { key: '7b199e3e1024289bfde3e200c3b03b1a7600f7fd', icon: this.rightIcon, class: `right-icon${this.disabled ? ' disabled' : ''}` })), this.rightText && (h("span", { key: 'a77ecafe2e47167c7014fdf5aa710d59cfc18659', class: `right-text${this.disabled ? ' disabled' : ''}` }, this.rightText)), this.showPercentage && (this.type !== "double") && (h("span", { key: '344dd484214e0a5cbd4a530cfaec229f90dc7e7a', class: `percentage-display${this.disabled ? ' disabled' : ''}` }, this.percentage, "%"))));
     }
     static get is() { return "ifx-slider"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spinner/spinner.js

@@ -7,8 +7,8 @@ export class Spinner {
         this.inverted = false;
     }
     render() {
-        return (h("div", { key: 'b5bafd6e3c09a08dd6c23fb5d3fa03e0440e9aee', "aria-label": "spinner indicating a loading process", class: this.getClassNames() }, h("div", { key: '089ab8a37fd986a0f35b358311e1ed36bce5e344', class: `${this.variant !== 'brand' ? 'border' : ""} ${this.inverted ? 'inverted' : ""}` }), this.variant === 'brand'
-            && h("div", { key: 'f06f5a41e526a865345e52218c96209c2c7cb52a', class: `semiconductor ${this.inverted ? 'inverted' : ""} ${this.getSizeClass()}` }, h("svg", { key: '4312f84ce143333595b9ac98159aa5349317cdbb', width: '40', height: '40', viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '1d46edf83d535fbab8a33153d003c65067324c91', id: "spinner/conductor" }, h("path", { key: '44f93f11c05975ef747af03b5e3225afc29447be', id: "Vector", d: "M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z" }))))));
+        return (h("div", { key: 'd81d2a7692cb71c15f4aa895abcdf0d4441d2b3a', "aria-label": "spinner indicating a loading process", class: this.getClassNames() }, h("div", { key: '7813885c276e55354c47f2ff735a16f498b1e39f', class: `${this.variant !== 'brand' ? 'border' : ""} ${this.inverted ? 'inverted' : ""}` }), this.variant === 'brand'
+            && h("div", { key: 'c4163967c2a5f58795ac974716cc4e831ec6264b', class: `semiconductor ${this.inverted ? 'inverted' : ""} ${this.getSizeClass()}` }, h("svg", { key: '0feafe9cdf7cfa8138a1d104824c8e5dff1b3caf', width: '40', height: '40', viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'ca3cdd02b91de714c12e1d2d6ad800fee938ac03', id: "spinner/conductor" }, h("path", { key: 'aedaa84532c0c51f8e0a7a8683fb7c24379b73a8', id: "Vector", d: "M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z" }))))));
     }
     getSizeClass() {
         return `${this.size}` === "s"

package/dist/collection/components/status/status.js

@@ -7,7 +7,7 @@ export class Status {
     }
     render() {
         const containerClass = this.border ? `container border-${this.color}` : 'container no-border';
-        return (h("div", { key: '8f05ba9c8552b8e2576f29f9455579b824c7a687', "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, h("span", { key: '659ad45c7d31a71c67696537017200556cf66c56', class: `dot ${this.color}` }), h("p", { key: '3469fe090dfec2df2384befb2005e7cfa28ea241', class: "text" }, this.label)));
+        return (h("div", { key: '40ca1589d26e26af2c7ae2a957d30bb45f46cf9b', "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, h("span", { key: '63b4d57f9a7deeefd61aebe66a5bdf3aaf6a8b5c', class: `dot ${this.color}` }), h("p", { key: '5a924614c128f6c578743c799084a19f46c67b02', class: "text" }, this.label)));
     }
     static get is() { return "ifx-status"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stepper/step/step.js

@@ -43,7 +43,7 @@ export class Step {
         }
     }
     render() {
-        return (h("div", { key: 'b37a3ef6ce0876ac1c667bb9e2499f9858ecbcee', "aria-current": this.active ? 'step' : false, "aria-disabled": this.active || this.complete ? false : true, onClick: (e) => this.stopOnClickPropogation(e), class: `step-wrapper ${this.stepId === 1 ? 'first-step' : ''} 
+        return (h("div", { key: 'cbee70d7f0f5c76a09d48423566bc3d485cd929a', "aria-current": this.active ? 'step' : false, "aria-disabled": this.active || this.complete ? false : true, onClick: (e) => this.stopOnClickPropogation(e), class: `step-wrapper ${this.stepId === 1 ? 'first-step' : ''} 
                         ${this.error ? 'error' : ''}
                         ${this.stepperState.variant}
                         ${this.complete ? 'complete' : ''}
@@ -51,11 +51,11 @@ export class Step {
                         indicator-${this.stepperState.indicatorPosition}
                         ${this.active ? 'active' : ''}
                         ${this.clickable ? 'clickable' : ''}
-                        ${this.disabled ? 'disabled' : ''}` }, h("div", { key: 'c64d77cc5c3bcf54065daab7738b36d3b5ecb415', class: 'step-icon-wrapper' }, this.stepperState.variant !== 'compact' && h("span", { key: '16afb1d2d212bcc30dbde9ae2c074ea1dcce4d56', class: 'step-connector-l' }), (this.stepperState.variant !== 'compact' && (!this.error || (this.error && this.active))) &&
-            h("div", { key: 'a6a2bc0b4ed13e3d66084d2c90621dfdbde23be4', class: 'step-icon' }, (this.stepperState.showStepNumber && !this.complete && !this.active) ? this.stepId : '', (this.complete && !this.active) && h("ifx-icon", { key: '95796ff6a126cc3b0d1b1e2355bfa2a67bd6504e', icon: 'check16' }), this.active && h("span", { key: '6edc3b511420e806f53af0fe7fdf2e7f38daa8f6', class: 'active-indic' })), (this.stepperState.variant !== 'compact' && this.error && !this.active) && h("ifx-icon", { key: '9d1a32b2fea2cf0d0625511062121d81a18f564f', icon: 'warningf24' }), this.stepperState.variant !== 'compact' && h("span", { key: 'b478b78fa7e74ee0c2152d52103d0ef23c20eff6', class: `step-connector-r ${this.active ? 'active' : ''}` })), 
+                        ${this.disabled ? 'disabled' : ''}` }, h("div", { key: 'fee2738c8478680320ec50c53a92d6e7b92a86e3', class: 'step-icon-wrapper' }, this.stepperState.variant !== 'compact' && h("span", { key: '96aa1a741cd013b6ae17f32de2725c368ea51618', class: 'step-connector-l' }), (this.stepperState.variant !== 'compact' && (!this.error || (this.error && this.active))) &&
+            h("div", { key: 'c9c696ac8898befd165fed334c36e7f77c91aa4f', class: 'step-icon' }, (this.stepperState.showStepNumber && !this.complete && !this.active) ? this.stepId : '', (this.complete && !this.active) && h("ifx-icon", { key: '98ff6e603c94aa1a57c5f8491dcf2a17cd4a4864', icon: 'check16' }), this.active && h("span", { key: '2fc5ce8a43ef62ecae07fbf25688af0b629b8e6d', class: 'active-indic' })), (this.stepperState.variant !== 'compact' && this.error && !this.active) && h("ifx-icon", { key: '72db4eb91a114022e470d14e035c1ff4364f6f00', icon: 'warningf24' }), this.stepperState.variant !== 'compact' && h("span", { key: '0a215fa7c2df964b4743f0fb0b16652b92003bfa', class: `step-connector-r ${this.active ? 'active' : ''}` })), 
         /* Step labels */
         (this.stepperState.variant !== 'compact' || (this.stepperState.variant === 'compact' && (this.active || this.stepId === this.stepperState.activeStep + 1))) &&
-            h("div", { key: 'efffa81e2e719874e0857e8fee134ae1fd2bbc9f', tabIndex: !this.disabled && this.complete && !this.active ? 0 : -1, class: `step-label ${this.stepperState.variant === 'compact' ? (this.active ? 'curr-label' : 'next-label') : ''}`, onClick: () => { this.handleStepClick(); }, onKeyDown: (e) => { this.handleStepKeyDown(e); } }, (this.stepperState.variant !== 'compact') && h("slot", { key: '1e1e148f80f62860a09f3fa0da09ae8224fe52f4' }), this.stepperState.variant === 'compact' && !this.active ? 'Next: ' : '', this.stepperState.variant === 'compact' && h("slot", { key: '24994dcf6e1b6ff734ebaa2720d55032e1a13f34' }))));
+            h("div", { key: '9b77faa804a42714b79535bfe530854c68ca6372', tabIndex: !this.disabled && this.complete && !this.active ? 0 : -1, class: `step-label ${this.stepperState.variant === 'compact' ? (this.active ? 'curr-label' : 'next-label') : ''}`, onClick: () => { this.handleStepClick(); }, onKeyDown: (e) => { this.handleStepKeyDown(e); } }, (this.stepperState.variant !== 'compact') && h("slot", { key: 'a84af39da90db9e59e3b614f63de9802161a0e51' }), this.stepperState.variant === 'compact' && !this.active ? 'Next: ' : '', this.stepperState.variant === 'compact' && h("slot", { key: 'bdfaff2aed9faf5503fb89b7e2105c48d721dbe2' }))));
     }
     ;
     static get is() { return "ifx-step"; }

package/dist/collection/components/stepper/stepper.js

@@ -117,10 +117,10 @@ export class Stepper {
         this.syncIfxSteps();
     }
     render() {
-        return (h("div", { key: '0be7736438a5b165ac37e4f173cb0b0c00b05f91', "aria-label": 'a stepper', role: 'navigation', class: `stepper ${(this.variant !== 'compact' && this.variant !== 'vertical') ? 'default' : this.variant} ${this.variant === 'compact' ? 'compact-' + this.indicatorPosition : ''}` }, 
+        return (h("div", { key: 'c7e51b5fe17beb80cac38fe0da1600f44b4ca111', "aria-label": 'a stepper', role: 'navigation', class: `stepper ${(this.variant !== 'compact' && this.variant !== 'vertical') ? 'default' : this.variant} ${this.variant === 'compact' ? 'compact-' + this.indicatorPosition : ''}` }, 
         /* Progress bar for compact variant. */
         (this.variant === 'compact') &&
-            h("div", { key: '8035ebeef291b23817e9ee7ae9ff24e280120c72', class: 'stepper-progress' }, h("div", { key: '51994c3caed94988c45c10d518444833362d72e3', class: 'progress-detail' }, `${Math.min(this.activeStep, this.stepsCount)} of ${this.stepsCount}`)), h("div", { key: 'eb60bf1fd1dcb221b9290bacffc9be4a5193bd9a', class: `stepper-wrapper` }, h("slot", { key: '661f3e54bb1ab32861db4f7720c4328579b82e0b' }))));
+            h("div", { key: '233c1234510997adab316ffb47e341c575036b95', class: 'stepper-progress' }, h("div", { key: '45c775b8727bac00e4c57a6e6e6129fe320e5a5b', class: 'progress-detail' }, `${Math.min(this.activeStep, this.stepsCount)} of ${this.stepsCount}`)), h("div", { key: '35ad66a86c1b1f6d008a232ae33944a3d7e122a6', class: `stepper-wrapper` }, h("slot", { key: '671a05ed6ce3927369e202f2a9218944bb6bb7cf' }))));
     }
     ;
     componentDidRender() {

package/dist/collection/components/switch/switch.js

@@ -64,7 +64,7 @@ export class Switch {
         this.internals.setFormValue(null);
     }
     render() {
-        return (h("div", { key: 'f3187a6be855f9882c079c87acbf5e9f28d137a3', class: "container", role: "switch", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-label": this.name, onClick: () => this.toggleSwitch(), onKeyDown: (event) => this.handleKeyDown(event) }, h("div", { key: 'dbb71405c630f2116058bb6e1c9269132194f2bf', class: `switch__checkbox-container ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`, tabindex: "0" }, h("div", { key: 'a204002f1ed4659f64c81910ebe86052906e83a4', class: "switch__checkbox-wrapper" }, h("input", { key: '1a35a09c8bbb5921fc161145ecb1865ea93a51d4', type: "checkbox", hidden: true, name: this.name, disabled: this.disabled, checked: this.internalChecked, value: `${this.value}` }), h("div", { key: '797a2f4b44184106336e51c0870a8c8ae41380c9', class: `switch ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}` }))), h("div", { key: '4f453d20668ac2caac69ed06cfe6fb4540f55d0a', class: `switch__label-wrapper ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '9825048844600efe0be86e5d856971de2348028b', htmlFor: "switch" }, h("slot", { key: '2b30df8bf6bdd7ac834db3e61f8b91cd59ac1e7b', onSlotchange: () => this.toggleLabelGap() })))));
+        return (h("div", { key: '0481403a878470cdb42c03be663b88f19fe59c58', class: "container", role: "switch", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-label": this.name, onClick: () => this.toggleSwitch(), onKeyDown: (event) => this.handleKeyDown(event) }, h("div", { key: 'c84f8e06349d1ffa03efb077e64881b12c4ac640', class: `switch__checkbox-container ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}`, tabindex: "0" }, h("div", { key: '533ca85af87c3edff93c76aaa0860f997b107e67', class: "switch__checkbox-wrapper" }, h("input", { key: 'fd9a8c6442c321a81161645c7e84f1d03cae3002', type: "checkbox", hidden: true, name: this.name, disabled: this.disabled, checked: this.internalChecked, value: `${this.value}` }), h("div", { key: 'ad951898b5b38de29aff0be91f734d443399f050', class: `switch ${this.internalChecked ? 'checked' : ''} ${this.disabled ? 'disabled' : ''}` }))), h("div", { key: '14219d030661fed97b8210d67ec3794147884225', class: `switch__label-wrapper ${this.disabled ? 'disabled' : ''}` }, h("label", { key: '3892d20ad28a1f1823e8302e9820973df938ee70', htmlFor: "switch" }, h("slot", { key: 'e350367180975d30978ec7c7d026b34e86c79741', onSlotchange: () => this.toggleLabelGap() })))));
     }
     static get is() { return "ifx-switch"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/filter-bar/filter-bar.js

@@ -89,7 +89,7 @@ export class FilterBar {
         // 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: '35a34ca34dd85212aed13e7b39aa8dc9aedfea23' }, h("div", { key: '2111e92aa836710a87dc3ac6d9cbb3540e99aee5', class: "search-container" }, h("slot", { key: 'b76a2f2c6c03ba37409a981ed86c629d9fade984', name: "filter-search" }), " "), h("div", { key: 'e279a2f70040fd54e91b679a00ac29c13e63fbab', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: '569dc71e0b56cf291b203563e352f653c12c54a5', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: '15595408192d1f6db0021e2f5c01cf28a2aa38c2', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: 'f3795573912575cd8139f170b577ffb6aca518ca', icon: "filter-16" }), "More filters"))))));
+        return (h(Host, { key: 'd5aad85edc16369a3487a18f3e3f24a5b914e820' }, h("div", { key: '7f49a493bd5bafec1286794e89ae67adea9e1967', class: "search-container" }, h("slot", { key: '9d7ab3a3294ac64f7cc47ae33b1839871d06df94', name: "filter-search" }), " "), h("div", { key: '9bf93a1030392d67940228df88b11b52685b757f', class: "components-container" }, slots.length > 0 ? slots : h("slot", { name: "filter-component" }), this.showMoreFiltersButton && !this.showAllFilters && (h("div", { key: 'fc4c6c9e15cf96fc1c129638688fdf2a27f91dc7', class: "more-filters-wrapper", onClick: this.handleMoreFiltersClick }, h("ifx-button", { key: '8f26ef634ef3e27d893e1998167f07a4315cb59a', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, h("ifx-icon", { key: '23cece990fc63afda2e9864887865467bec55e6f', icon: "filter-16" }), "More filters"))))));
     }
     static get is() { return "ifx-filter-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js

@@ -32,8 +32,8 @@ export class FilterAccordion {
         this.el.removeEventListener('ifxListUpdate', this.handleCheckedChange);
     }
     render() {
-        return (h("div", { key: 'aa3625120584b17c8c60dfa60d652064e3730302', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: 'd58e8752ab6427e0f7c3cffa6111b8084f06f3f7', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: 'fabff11cffb12322724123a85bb8a9fcb5d722e6', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '608f87f282eae985bfab164fa3285722f0bb7003', class: "text" }, h("span", { key: '53d4b29a76a9f2e560a5e90ac5ecaeb2bbce2e41' }, this.filterGroupName), h("ifx-number-indicator", { key: '8e05960cf2af1d6fcaadcd9dea7418b356336230' }, this.count)), h("ifx-icon", { key: '0586c6fa00fdf20ba8e9fa33c7125762f430a240', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: '6c22169af8545f711c91b13bdd138ce9121fab1c', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
-            h("div", { key: '43b2be13c353da05d9101e3dde1fc1ed7911bd7d', class: "filter-accordion-container" }, h("slot", { key: 'e738f6ed3f867f155b284e4987e526eb639ec6a7', name: "list" }))));
+        return (h("div", { key: 'b5be6a4c8e2b8406e20b4139461d75d1acc5e88c', class: `accordion ${this.expanded ? 'expanded' : ''}` }, h("div", { key: '88ce1afb0ab07d2b3b1351d698632d24521f6870', class: `header ${this.expanded ? 'expanded' : ''}`, onClick: this.toggleAccordion }, h("div", { key: '2c850d5b01d985473ba69ca347fbfcfa076670b5', class: `text-and-icon ${this.expanded ? 'expanded' : ''}` }, h("div", { key: 'b50240640314ca9d971f1db017d8f2bf4fae5cc1', class: "text" }, h("span", { key: '12a6ef3c45f33540669af8dc60f2d8c104e07953' }, this.filterGroupName), h("ifx-number-indicator", { key: '049ecf530b429920f6f977e240de3913fbd0c013' }, this.count)), h("ifx-icon", { key: 'fee323359acf051fb4bd0040c0eb1bea7a9696fe', class: this.expanded ? '' : 'hidden', icon: "minus-16", onClick: this.toggleAccordion }), h("ifx-icon", { key: 'f7b60e6232b404bc5f4345dd9db80e513c4a6dcd', class: this.expanded ? 'hidden' : '', icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded &&
+            h("div", { key: 'f802a7ec2ff47ecf22b3f69ec5b4adbcdb599522', class: "filter-accordion-container" }, h("slot", { key: '5877962924effa0e52163d9ec5a2d436ac8a3ac7', name: "list" }))));
     }
     static get is() { return "ifx-filter-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js

@@ -27,7 +27,7 @@ export class FilterSearch {
         this.ifxFilterSearchChange.emit({ filterName: this.filterName, filterValue: this.filterValue, filterKey: this.filterKey }); // Emitting filterKey along with other properties
     }
     render() {
-        return (h("div", { key: 'f8bea93373642731922b3610ef84f2e935f63584', class: `${this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'}` }, h("div", { key: 'ae500d8aa6c48584a2382df67be6bfbd92f98558', class: "filter-name" }, this.filterName), h("ifx-search-field", { key: '0c472e57c19c91b1d08eb6d32285a95298e5d4dc', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
+        return (h("div", { key: '7b5ee1b95e95e19d2fc959c2a9ed59fa1d90a4e6', class: `${this.filterOrientation === 'sidebar' ? 'sidebar-filter-search-wrapper' : 'topbar-filter-search-wrapper'}` }, h("div", { key: 'c7dfdabe9e9eb6dcea53361df02a2a5e4325f43f', class: "filter-name" }, this.filterName), h("ifx-search-field", { key: '5a396959e4ab983a06796203a3efbcc608f1a16c', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
     }
     static get is() { return "ifx-filter-search"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js

@@ -119,7 +119,7 @@ export class IfxFilterTypeGroup {
         window.removeEventListener('ifxResetFiltersEvent', this.handleResetEvent);
     }
     render() {
-        return (h(Host, { key: '2a1841c46709c17e54e96771d6159059c50a6c0d' }, h("div", { key: 'cf005fd784b233663943a78c895ce079395a1e82', class: "filter-type-group" }, h("slot", { key: '8752f642c1a78b5da5429a8a5f51d7f6369d4cad', name: "filter-search" }), h("slot", { key: 'cbd72fbc57c3935db4e5d94a7c57ec3d83560297', name: "filter-accordion" }))));
+        return (h(Host, { key: 'd794c0d53d4cdf1d9e7a233dc36da89b7407bc57' }, h("div", { key: 'f59f81f2402e974ce04c937c620907fc553b3752', class: "filter-type-group" }, h("slot", { key: '35b06d9b7d04566fce7497c81a641a76bcf987e4', name: "filter-search" }), h("slot", { key: '86614c6a09e9d42392cef57017965abd337582e4', name: "filter-accordion" }))));
     }
     static get is() { return "ifx-filter-type-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js

@@ -18,7 +18,7 @@ export class ListEntry {
         this.ifxListEntryChange.emit({ label: this.label, value: this.value, type: this.type });
     }
     render() {
-        return (h("div", { key: '5ff1bfbd21d708cd8c4b420e13f8b83728cdcf7e', class: "wrapper" }, this.type === 'checkbox' ? (h("div", { class: "list-entry" }, h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (h("div", { class: "list-entry" }, h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
+        return (h("div", { key: 'd79aed51b0aa9c96e3b99450af4a67fe9c9cd9c1', class: "wrapper" }, this.type === 'checkbox' ? (h("div", { class: "list-entry" }, h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (h("div", { class: "list-entry" }, h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
     }
     static get is() { return "ifx-list-entry"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table-advanced-version/table.js

@@ -356,12 +356,12 @@ export class Table {
             };
         }
         const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';
-        return (h(Host, { key: '64f65fe4d0a9c02526055ad1e9c22f3724cb5af2' }, h("div", { key: '963d46f2a3cfc182500f032aaa4abbf5c2dc28a9', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '39a5ba051e5fb575c6ae8f63b83393e0acb3d90d', class: "sidebar-btn" }, h("ifx-button", { key: 'adb3a252e69fa4252babf4fb50ec324699d42fc8', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '78da1aa26e80f85e33341234afe338028f54d803', icon: "cross-12" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: 'db2132ef456ca3eb4134cc3f4537fcb08297fdac', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: 'da9ca3a5de6c987df2ad497ff230695301bb4151', class: "sidebar-container" }, h("div", { key: '6d0b6748ea83383e48d50f3ad8c530722992a04f', class: "filters-title-container" }, h("span", { key: 'ddb057a5115fb4071ef085ee33abf85e0c5052ad', class: "filters-title" }, "Filters")), h("div", { key: '7790aa2e896072179744ccca118fb2e6212c5927', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '8f4720fba87057a8ae45d10cdbbbd8e1c004c860', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '99cb3ba17de6a80079de10c0139e17a093f2eed0', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '473577e20188dfe5530c5cd8a88ec8546a2cf257', name: "topbar-filter" })))), h("div", { key: '257519c45d72055387414394e1d7cbea58603419', class: "table-pagination-wrapper" }, h("div", { key: '74db02601aa4bd7e5f99dd001947418a98b49625', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
+        return (h(Host, { key: '4f8495476d194bff76a59235785c7d18a024695b' }, h("div", { key: '6deafb70c2a389f1ba91b968a2a7e2670cc6d099', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '4c802f799072feafaa15fedc4033cc9400573ac2', class: "sidebar-btn" }, h("ifx-button", { key: '4321f0411939359fdd9251044c999f433328bbe2', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '124610d08a3cc20b6abc24cce71d97e053ab7d73', icon: "cross-12" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: '34f3daded00e2b3ed322641cbe4e439af6c3b7ed', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: 'e7257305920836d4ce2301980203db32fb10bd57', class: "sidebar-container" }, h("div", { key: 'de3514a3516467a49be178a426830c48e0ce3fee', class: "filters-title-container" }, h("span", { key: '40c084bbaeb7cc95802b0bfbbab27f2aa9d2931c', class: "filters-title" }, "Filters")), h("div", { key: '85ac467d2f0eb77dececc8d39fce4e344b1894a5', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: '2cb763f1d34891cb680b604aa49d137c959fa91c', name: "sidebar-filter" }))))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: 'b43dae559e28af3ad91653f6f02101d11698940f', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (h("slot", { key: 'c640aea091c6b5134f7b8f79a1460de11dddc610', name: "topbar-filter" })))), h("div", { key: 'ec688e26065c9aec7e8456f4639a95b25b87a191', class: "table-pagination-wrapper" }, h("div", { key: 'b5b0422839c5931adbd7e6571f9b27b363c04009', class: "filter-chips" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (Object.keys(this.currentFilters).map(name => {
             const filter = this.currentFilters[name];
             const filterValues = filter.filterValues;
             const isMultiSelect = filter.type !== 'text';
             return filterValues.length > 0 ? (h("ifx-chip", { placeholder: name, size: "large", variant: isMultiSelect ? "multi" : "single", readOnly: true, value: filterValues, key: name }, filterValues.map(filterValue => (h("ifx-chip-item", { value: filterValue, selected: true, key: filterValue }, filterValue))))) : null;
-        })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '4bab4a5c525e894f6020f0c4a6046cb7386745aa', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: 'ae1699693b27fa4ef4deadc1d3da3cd6e8da772d', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '819c66a428876a63e8561e7c280cc45e9f42be34', class: "matching-results-container" }, h("span", { key: '73174d6de6561eccc7f1c3122085b4cbf29a4e79', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '682c7a4cee7f938f2614c2abf1d136b017add5ea', class: "matching-results-text" }, "matching results"))), h("div", { key: '1128702534799903d0ed4b97f59139ffcd8fd9de', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '0050008c1b7491dbf4a92c990af6e18e690e7795', id: `ifxTable-${this.uniqueKey}`, class: 'ifx-ag-grid', style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage }) : null)))));
+        })), this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (h("ifx-button", { key: '9c93977abfd7e678be81d61ef3061c895632db86', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.handleResetButtonClick() }, h("ifx-icon", { key: '488d9cbb3f5cdf473e0202636e71efca32ac2889', icon: "curved-arrow-left-16" }), "Reset all"))), this.filterOrientation !== 'none' && (h("div", { key: '08bca82a3f2bc807dd0f0a81d399cabd5cafdae8', class: "matching-results-container" }, h("span", { key: '1db4d564335411250a4838e42a34077999398316', class: "matching-results-count" }, this.matchingResultsCount), h("span", { key: '0e372e5d3f454cb4aadfba464b7463cab2fda8c1', class: "matching-results-text" }, "matching results"))), h("div", { key: '1c1bae7e26f1753d80aea015c5a58d9ba95fa265', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: 'c5590629eafc1d0e278b195bed69e1c5bc520481', id: `ifxTable-${this.uniqueKey}`, class: 'ifx-ag-grid', style: style, ref: (el) => this.container = el })), this.pagination ? h("ifx-pagination", { total: this.allRowData.length, "current-page": this.currentPage }) : null)))));
     }
     hasButtonCol() {
         return this.getColData().some(column => column.field === 'button');

package/dist/collection/components/table-basic-version/table.js

@@ -147,7 +147,7 @@ export class Table {
         return {};
     }
     render() {
-        return (h(Host, { key: '2bb06e43b3ff03850df67b2b45c0e95b1d90952f' }, h("div", { key: '85339f4b6231ae03fafdc9a5666b86792a613e60', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: 'f2a3b10a1d94122b319a27c7b997ebe898405a9f', id: `ifxTable-${this.uniqueKey}`, class: "ifx-ag-grid", style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
+        return (h(Host, { key: '56d342732bf6d49e668f0fc3e2f34f604ecc50fc' }, h("div", { key: '672ef798fa5d47b3c219a772c5256cc0a670f180', id: "table-wrapper", class: this.getClassNames() }, h("div", { key: '66c21033cebeb0df7a41d7ffe7f6b66fadd6be96', id: `ifxTable-${this.uniqueKey}`, class: "ifx-ag-grid", style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
     }
     static get is() { return "ifx-basic-table"; }
     static get originalStyleUrls() {

package/dist/collection/components/tabs/tab.js

@@ -10,7 +10,7 @@ export class IfxTab {
         this.tabHeaderChange.emit(this.header);
     }
     render() {
-        return h("slot", { key: 'e6c06cd5cc390393bfbe923168ea8469c6babe44' });
+        return h("slot", { key: '845e795d2a758c1612b8601ea2eafab0385f02dc' });
     }
     static get is() { return "ifx-tab"; }
     static get originalStyleUrls() {

package/dist/collection/components/tabs/tabs.js

@@ -194,9 +194,9 @@ export class IfxTabs {
     }
     render() {
         var _a;
-        return (h("div", { key: '2616757aeee64761cb775d7a647846f226494647', "aria-label": "navigation tabs", class: `tabs ${this.internalOrientation}` }, h("ul", { key: '37f459c65c219e7d661c567d6b75384f86c4eb22', role: "tablist", class: "tabs-list" }, (_a = this.tabObjects) === null || _a === void 0 ? void 0 :
+        return (h("div", { key: '7baac06946d2ea4b5be00be46cd99039dd2a67af', "aria-label": "navigation tabs", class: `tabs ${this.internalOrientation}` }, h("ul", { key: '518474ef80c90ef954f3c0fc23acdbec0bcbf3fc', role: "tablist", class: "tabs-list" }, (_a = this.tabObjects) === null || _a === void 0 ? void 0 :
             _a.map((tab, index) => (h("li", { class: this.getTabItemClass(index), ref: (el) => (this.tabHeaderRefs[index] = el), onMouseDown: (event) => event.preventDefault(), onClick: () => this.handleClick(tab, index), "aria-selected": index === this.internalActiveTabIndex ? 'true' : 'false', "aria-disabled": tab.disabled ? 'true' : 'false', role: "tab" }, (tab === null || tab === void 0 ? void 0 : tab.icon) ? h("ifx-icon", { icon: tab.icon }) : '', tab === null || tab === void 0 ? void 0 :
-                tab.header))), h("div", { key: '53098862bc4a64329344029c61c5652b41505db6', class: "active-border" })), h("div", { key: '5524ce0fec911af26bdeef4dc7ab2a1546aac53a', class: "tab-content" }, Array.from(this.tabObjects).map((_, index) => (h("div", { style: { display: index === this.internalActiveTabIndex ? 'block' : 'none' } }, h("slot", { name: `tab-${index}` })))))));
+                tab.header))), h("div", { key: '40b9bfd4ef5fe4ccf9601a1a7f71abba828d2050', class: "active-border" })), h("div", { key: 'e20214a729692ced82aa6df62112864848035128', class: "tab-content" }, Array.from(this.tabObjects).map((_, index) => (h("div", { style: { display: index === this.internalActiveTabIndex ? 'block' : 'none' } }, h("slot", { name: `tab-${index}` })))))));
     }
     static get is() { return "ifx-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tag/tag.js

@@ -4,7 +4,7 @@ export class Tag {
         this.icon = undefined;
     }
     render() {
-        return (h("div", { key: '8e8c782f76fb236f436d56a7b6d5d4c4c8ee6538', "aria-label": "a tag", class: "container" }, this.icon && (h("ifx-icon", { key: '8125c94d7abb8f3f76dc7e9f0b035df74846701e', icon: this.icon })), h("a", { key: '6814346272ed1c844b538c0665634d479aa87bc1', href: "javascript:void(null);", class: "label-wrapper" }, h("p", { key: '8dfc87f9e7f75e24c7c932a91a53671d242c32c5', class: "label" }, h("slot", { key: '7f894eec70a3db1fcf04189fa15addfb9d21aae2' })))));
+        return (h("div", { key: 'ebe5d8e2f3bc59ad1bdef92eb7e4fbc7a07f9c4c', "aria-label": "a tag", class: "container" }, this.icon && (h("ifx-icon", { key: 'accc8280c6248bb81a2d139e85da8a048329e917', icon: this.icon })), h("a", { key: '1282f2372cc961db61fefee89e2a21bf1a998537', href: "javascript:void(null);", class: "label-wrapper" }, h("p", { key: '76534734832475e44606e0fed6d3577802525d2f', class: "label" }, h("slot", { key: '6d422addc814889fc71d851bc2dc3ab65a7cb3e6' })))));
     }
     static get is() { return "ifx-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -39,12 +39,12 @@ export class TextField {
         this.internals.setFormValue("");
     }
     render() {
-        return (h("div", { key: '7ac496c92fa4196035b1afadf22ecbdda90a0b97', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '55c640e5c0edd2687bb36c89e435231c64b1a14b', class: "textInput__top-wrapper" }, h("label", { key: '72da6ffeed6f6e12f9b7fb549ea573618a05cd28', htmlFor: "text-field" }, h("slot", { key: 'b4cce1a1d8852ab6013e8228e51529e28fde896d' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: 'f1b84fbe7b1e5e0ca4cdaf12a7d1f32304f53975', class: "textInput__bottom-wrapper" }, h("div", { key: '894395754ae075ff0db20df81e3f9702b7c8c516', class: "input-container" }, this.icon && (h("ifx-icon", { key: '14a629a010a29d0b188c29bbdb529fcd9bf317d0', class: 'input-icon', icon: this.icon })), h("input", { key: '8801b2aa9eb132e2643c42f8d00e35698053a119', ref: (el) => (this.inputElement = el), disabled: this.disabled, type: "text", id: 'text-field', value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
+        return (h("div", { key: 'f3025fc933262f51d5ed3cd2513ec3705e751780', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '61927bc434baafbb3d15b67dccaa3ace050d132d', class: "textInput__top-wrapper" }, h("label", { key: '51002b22543dd24dc85e47ed383e6bd65ce4154d', htmlFor: "text-field" }, h("slot", { key: '5c1bbc2be79f561944c499126ca86253cc9682d9' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: '9ec3104aa199d02850c23ebeba775ba7c105ecfa', class: "textInput__bottom-wrapper" }, h("div", { key: '724f41136fc2963e991c3d924501504e9aebe11b', class: "input-container" }, this.icon && (h("ifx-icon", { key: '7ceb63bbf1e38e7e84883a34500789ebe4c496d8', class: 'input-icon', icon: this.icon })), h("input", { key: 'acea696fcab92232999da762ca8d14240a772dc2', ref: (el) => (this.inputElement = el), disabled: this.disabled, type: "text", id: 'text-field', value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
                 ${this.error ? 'error' : ""} 
               ${this.size === "s" ? "input-s" : ""}
-              ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: 'e74f5170009815c1789db1f278265c2e2b80fd15', class: "delete-icon", icon: "cremove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
-            h("div", { key: '53d770f74fcc88360d976d98dd0fe378d2947a9b', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
-            h("div", { key: 'a4aa0e607403404577fd9b42a88a093af971d4ee', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
+              ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: '00c4a0b6bb2052d5b7289c93b8a3ee922163db66', class: "delete-icon", icon: "cremove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
+            h("div", { key: '01ba707592af3d0cca13d057dcc8a294e31875fe', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
+            h("div", { key: '76340691cd5e210005147c8f56eb22300831ca69', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
     }
     static get is() { return "ifx-text-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/textarea/textarea.js

@@ -38,9 +38,9 @@ export class TextArea {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '31e0b680440ee005bfe8d26fb37f4fb0609d7af1', class: `wrapper 
+        return (h(Host, { key: '619d4ea0390f029bb9e972506f0fb657a1115a96', class: `wrapper 
 						wrapper--${this.error ? 'error' : ''}
-						wrapper--${this.disabled ? 'disabled' : ''}` }, h("label", { key: '7f0e41b25b5ac1821530230d986ad7150bd29835', class: 'wrapper__label', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 : _a.trim()), h("div", { key: '97e914a8692c57192ae36bafe761f7815f2abdab', class: 'wrapper__textarea' }, h("textarea", { key: '19f17e73239ecf1ef54bb16bf8fb6b5724280031', "aria-label": 'a textarea', "aria-value": this.value, "aria-disabled": this.disabled, id: this.inputId, style: { resize: this.resize }, name: this.name ? this.name : this.inputId, cols: this.cols, rows: this.rows, maxlength: this.maxlength, wrap: this.wrap, disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, onInput: (e) => this.handleOnInput(e) })), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: 'bb3c049d4bb19209a6dcaa006ad5975431cf1304', class: 'wrapper__caption' }, this.caption.trim()))));
+						wrapper--${this.disabled ? 'disabled' : ''}` }, h("label", { key: '6699012241de3df0a1b0fb05c43941b9f69945bf', class: 'wrapper__label', htmlFor: this.inputId }, (_a = this.label) === null || _a === void 0 ? void 0 : _a.trim()), h("div", { key: '5015497c95d4217498ac3fd9b4a486d5373e2665', class: 'wrapper__textarea' }, h("textarea", { key: '28adf1345e3bc66ccfa7b6bda2c5065186b02d5c', "aria-label": 'a textarea', "aria-value": this.value, "aria-disabled": this.disabled, id: this.inputId, style: { resize: this.resize }, name: this.name ? this.name : this.inputId, cols: this.cols, rows: this.rows, maxlength: this.maxlength, wrap: this.wrap, disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, onInput: (e) => this.handleOnInput(e) })), ((_b = this.caption) === null || _b === void 0 ? void 0 : _b.trim()) && (h("div", { key: '30bd589c40f5fa3d81c8861ce42a557c949b3b12', class: 'wrapper__caption' }, this.caption.trim()))));
     }
     static get is() { return "ifx-textarea"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tooltip/tooltip.js

@@ -149,10 +149,10 @@ export class Tooltip {
             'tooltip-extended': true,
             'visible': this.tooltipVisible,
         };
-        return (h("div", { key: '2f35138e87796c57dff7cf5eb92001781a714edc', "aria-label": "a tooltip showing important information", "aria-value": this.header, class: "tooltip__container" }, h("slot", { key: '7739a2f8c71f851d1e58c0e77518107677cd2e85' }), this.variant.toLowerCase() === 'dismissible' && h("div", { key: 'f4c340136b918db9873ca8dfe3d8cbbbc126c3ce', class: tooltipDismissible }, h("button", { key: 'ff455893ab4ccfce6382fbd304b3feb22972dffc', "aria-label": "Close Tooltip", class: "close-button", onClick: this.onDismissClick }, h("ifx-icon", { key: '52cb44e3d84fdd10fb238ff8ba567feab8f9d0c1', icon: "cross16" })), h("div", { key: 'ded62ccc8896056a6b0780474b649b7830009103', class: "tooltip-dismissible-content" }, this.header && h("div", { key: 'c8c60396c154768cd9ab9b23eaf036dd5b639ee3', class: "tooltip-dismissible-header" }, this.header), h("div", { key: '27ca68485ffb44194f4f1e74651fd28e2a45162d', class: "tooltip-dismissible-body" }, this.text)), h("svg", { key: 'd871c1cf15d1511978a9c83ef11c5ab5854f0921', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ba9d2b4b3b4434eaed8faa6db2e641b6a30f0aa3', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'compact' &&
-            h("div", { key: '5235880e4a3543e53708839bfe7577880c93e5c6', class: tooltipCompact }, this.text, h("svg", { key: '89c655f203ba0b43a29d30b84d4cbbce5437e361', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '0463ad51e72f3d994faaf8d9f46dc614525715dd', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'extended' &&
-            h("div", { key: '8d8f48ea56f1ffb6c164e2ae93777ac14749d825', class: tooltipExtended }, h("slot", { key: '8565dbb82773678e702fae9b74de36e81be53b70', name: "icon" }, this.icon ? h("div", { class: "extended_icon" }, h("ifx-icon", { icon: this.icon })) :
-                h("svg", { class: "extended_icon", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24" }, h("path", { stroke: "#fff", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.5 2.5h-16a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-16a2 2 0 0 0-2-2Z" }), h("path", { stroke: "#fff", d: "M19 17H6l2.5-4 2.097 2.516.405.486.379-.506 4.118-5.49.003-.002L19 17Z" }), h("path", { fill: "#fff", d: "M10 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" }))), h("div", { key: '4a1c19770dcf69aa9888c281f85e587812844e8e', class: "tooltip-extended-content" }, this.header && h("div", { key: 'e077cd93e962cc66722e927bb3bded9f8fabbd43', class: "tooltip-extended-header" }, this.header), h("div", { key: 'd4564db6662ce4da5bd976232cc6e46d379ab843', class: "tooltip-extended-body" }, this.text)), h("svg", { key: '5c9233e4d1c39fb4fe7522f7388d9018addbe7ca', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5e20178a7ef43d349f10d29d4fd4a1dc31166e21', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" })))));
+        return (h("div", { key: '245f013d5038ef804febc7091386efecfb605245', "aria-label": "a tooltip showing important information", "aria-value": this.header, class: "tooltip__container" }, h("slot", { key: 'fd857d4c0128cd9cf2d8cdb6595302197a9bd70f' }), this.variant.toLowerCase() === 'dismissible' && h("div", { key: 'cf9b89a328589c16d7b450c600c94f15217b5676', class: tooltipDismissible }, h("button", { key: '60726f628cd8ef248449c1abbb399a0ae19e0c9b', "aria-label": "Close Tooltip", class: "close-button", onClick: this.onDismissClick }, h("ifx-icon", { key: '7d650d5eee3ec4cd5761379be6753bfc57075f5e', icon: "cross16" })), h("div", { key: '1e6db1a138f2c72d93bd38c9aefc99423a50231f', class: "tooltip-dismissible-content" }, this.header && h("div", { key: '5cb6de3d70b38f827ddc85fb54d354b975ef3e8e', class: "tooltip-dismissible-header" }, this.header), h("div", { key: 'fffbccad3af0737ee4085184a284b255472f6dbb', class: "tooltip-dismissible-body" }, this.text)), h("svg", { key: '40727b371e53edd1b79f84bbfe7d25fecc2d76b4', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'cf35e71824f798a2418b14e92c7d2f4971076d90', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'compact' &&
+            h("div", { key: '7eb9f91ab5053f4e141cbaf1c689be51598cc22e', class: tooltipCompact }, this.text, h("svg", { key: '3b5fbaeea95ce4437c7641a6cfc774c7d53eeeaa', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '28d637ccbbe4b95a5d676cb9ab051ad5f5e03cf9', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'extended' &&
+            h("div", { key: '0358fc58170af89ce3efa6f59648e18f9dedbd47', class: tooltipExtended }, h("slot", { key: '674337fbf256e316d82ef05fa5fd5ec57e1f2674', name: "icon" }, this.icon ? h("div", { class: "extended_icon" }, h("ifx-icon", { icon: this.icon })) :
+                h("svg", { class: "extended_icon", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24" }, h("path", { stroke: "#fff", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.5 2.5h-16a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-16a2 2 0 0 0-2-2Z" }), h("path", { stroke: "#fff", d: "M19 17H6l2.5-4 2.097 2.516.405.486.379-.506 4.118-5.49.003-.002L19 17Z" }), h("path", { fill: "#fff", d: "M10 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" }))), h("div", { key: '83722d4ea9a67b65fc6dbaae237a32ec3b692a23', class: "tooltip-extended-content" }, this.header && h("div", { key: '839d14c58cfa8102ac792943a8cc92748f30e33c', class: "tooltip-extended-header" }, this.header), h("div", { key: '82b1c5388edc5898dde69672b61a66b30bdcaa5b', class: "tooltip-extended-body" }, this.text)), h("svg", { key: 'd0b1e61adfceff620c36ac515521248ff0cfb184', class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'f65f051955102b003d2c03fcc109daea55c94c0e', id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" })))));
     }
     static get is() { return "ifx-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/stories/setup-and-installation/faq/faq.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class Faq {
     render() {
-        return (h("div", { key: '738b7cb857432407faa6c5f30937ab61387f68de', class: 'container' }, h("ifx-accordion", { key: 'e1ae6351d53e781a3b41ac49e16cc2093b0b6807' }, h("ifx-accordion-item", { key: '41284177166adc4b2840f9f9c77c0a45f7199f97', caption: "What is the Infineon DDS?" }, "The Infineon Digital Design System consists of code components, design principles, tools and guidelines as well as a dedicated interdisciplinary team. Its purpose is to support internal and external colleagues create digital user interfaces with a high level of usability as well as a consistent expression of the Infineon brand. The DDS does not focus on the content of a web application but it describes how the design of the application\u2019s structure should be."), h("ifx-accordion-item", { key: '3e268136bed4d1b8ab81df1292316109a91981ce', caption: "How do I get access to the DDS?" }, "You can use the provided Figma file as a foundation for mockups and prototypes, use Storybook to view what UI components and variants are available and use code components provided via Storybook or Github."), h("ifx-accordion-item", { key: 'ae3f36e903b49a95399672c841caa346f710adf4', caption: "Can I integrate the Infineon DDS into my project?" }, "Yes, you can. We are happy to discuss with you which point in time and which scope of integration is bestsuited for updating your interface to the Infineon DDS. (To avoid that users get confused by a mixture of UI components, we recommend choosing larger updates or technology changes as opportunity to integrate the Infineon DDS.)"), h("ifx-accordion-item", { key: '74a86da45e80299dbb2c71ae24ed38786a9bbfd9', caption: "Are Infineon DDS components accessable?" }, "We have taken WCAG 2.0 Level AA as baseline level for all design decisions inside the Infineon Digital Design System. To make an online experience truly accessible you have to implement the specific code, content, and visual design according to the accessibility standard. Find an introduction to this topic here."), h("ifx-accordion-item", { key: '9ada819b3bd9aa0dac03428847ac7004139078b1', caption: "How to request a new component?" }, "Please contact us like described in the contribution section! We are planning to expand the number of components continually. If your component is also usable for multiple other projects, there is a good chance we might work together with you."))));
+        return (h("div", { key: '77991eaf504d4e891e9e6bbadb7ed25d3c6fcf44', class: 'container' }, h("ifx-accordion", { key: '86a953a5ebd22ec3be713b7cf50f879fca17b5a2' }, h("ifx-accordion-item", { key: 'f51481687b8b49004292a1dde4a77a666cfb2f19', caption: "What is the Infineon DDS?" }, "The Infineon Digital Design System consists of code components, design principles, tools and guidelines as well as a dedicated interdisciplinary team. Its purpose is to support internal and external colleagues create digital user interfaces with a high level of usability as well as a consistent expression of the Infineon brand. The DDS does not focus on the content of a web application but it describes how the design of the application\u2019s structure should be."), h("ifx-accordion-item", { key: '69dd8d8a4c446656c23ef1c4debb2d5b9d77a7ff', caption: "How do I get access to the DDS?" }, "You can use the provided Figma file as a foundation for mockups and prototypes, use Storybook to view what UI components and variants are available and use code components provided via Storybook or Github."), h("ifx-accordion-item", { key: '82491083166f9d6acdac25cd31f4138e26884118', caption: "Can I integrate the Infineon DDS into my project?" }, "Yes, you can. We are happy to discuss with you which point in time and which scope of integration is bestsuited for updating your interface to the Infineon DDS. (To avoid that users get confused by a mixture of UI components, we recommend choosing larger updates or technology changes as opportunity to integrate the Infineon DDS.)"), h("ifx-accordion-item", { key: 'c1e4c7b1958d87089ceeb7c4cd89ab0888f6392a', caption: "Are Infineon DDS components accessable?" }, "We have taken WCAG 2.0 Level AA as baseline level for all design decisions inside the Infineon Digital Design System. To make an online experience truly accessible you have to implement the specific code, content, and visual design according to the accessibility standard. Find an introduction to this topic here."), h("ifx-accordion-item", { key: '9ebe0e3f8e16cf867086c07aa044def5f4d7d6de', caption: "How to request a new component?" }, "Please contact us like described in the contribution section! We are planning to expand the number of components continually. If your component is also usable for multiple other projects, there is a good chance we might work together with you."))));
     }
     static get is() { return "ifx-faq"; }
     static get encapsulation() { return "shadow"; }

package/dist/components/ifx-alert.js

@@ -1,4 +1,71 @@
-import { A as Alert, d as defineCustomElement$1 } from './p-2ca9c3ff.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-68d90201.js';
+import { d as defineCustomElement$2 } from './p-7e430b83.js';
+
+const alertCss = ":root{--ifx-font-family:\"Source Sans 3\";font-family:var(--ifx-font-family, sans-serif)}:host{display:block}.alert__info-wrapper{display:flex;padding:16px 24px;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert__info-wrapper .info__text-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper,.alert__info-wrapper .info__text-wrapper .info__description-wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper ::slotted(p),.alert__info-wrapper .info__text-wrapper .info__description-wrapper ::slotted(p){padding:0;margin:0}.alert__info-wrapper .info__text-wrapper .info__description-wrapper{font-weight:400}.alert__info-wrapper .close-icon-wrapper{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.alert__info-wrapper .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert__info-wrapper .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert{display:flex;border:1px solid #0A8276;border-radius:1px;color:#1D1D1D;background-color:#FFFFFF;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert .close-icon-wrapper{display:flex;align-items:center;justify-content:center;min-width:40px}.alert .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert .icon-wrapper{position:relative;min-width:48px;display:flex;justify-content:center;align-items:center;background-color:#0A8276}.alert .alert-text{font-size:16px;width:100%;padding:12px 0px 12px 12px;color:#1D1D1D;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;}.alert.primary{border:1px solid #0A8276}.alert.primary .icon-wrapper{background-color:#0A8276;color:#FFFFFF}.alert.success{border:1px solid #4CA460}.alert.success .icon-wrapper{background-color:#4CA460;color:#FFFFFF}.alert.danger{border:1px solid #CD002F}.alert.danger .icon-wrapper{background-color:#CD002F;color:#FFFFFF}.alert.warning{border:1px solid #E16B25}.alert.warning .icon-wrapper{background-color:#E16B25;color:#FFFFFF}.close-icon-wrapper ifx-icon:hover{cursor:pointer}";
+const IfxAlertStyle0 = alertCss;
+
+const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.ifxClose = createEvent(this, "ifxClose", 7);
+        this.alertTypeDescription = {
+            "primary": 'Neutral alert',
+            "success": 'Success Alert',
+            "danger": 'Error Alert',
+            "warning": 'Warning Alert',
+            "info": 'Neutral alert',
+        };
+        this.variant = 'primary';
+        this.icon = undefined;
+        this.closable = true;
+        this.AriaLive = 'assertive';
+        this.uniqueId = undefined;
+    }
+    handleClose() {
+        this.ifxClose.emit();
+    }
+    renderCloseButton() {
+        return (h("div", { class: "close-icon-wrapper" }, h("button", { onClick: this.handleClose.bind(this), "aria-label": "Dismiss alert" }, h("ifx-icon", { icon: "cross-16" }))));
+    }
+    generateUniqueId(prefix = 'id') {
+        return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;
+    }
+    componentWillLoad() {
+        if (!this.uniqueId) {
+            this.uniqueId = this.generateUniqueId('alert');
+        }
+    }
+    render() {
+        return this.variant === 'info' ? (h("div", { class: "alert__info-wrapper", role: "alert", "aria-live": this.AriaLive, "aria-describedby": this.alertTypeDescription[this.variant], "aria-labelledby": "alert-text alert-description" }, h("div", { class: "info__text-wrapper" }, h("div", { class: "info__headline-wrapper" }, h("slot", { name: "headline" })), h("div", { id: `alert-description-${this.uniqueId}`, class: "info__description-wrapper" }, h("slot", { name: "desc" }))), this.closable ? this.renderCloseButton() : null)) : (h("div", { class: `alert ${this.variant}`, role: "alert" }, this.icon && (h("div", { class: "icon-wrapper" }, h("ifx-icon", { icon: this.icon }))), h("div", { class: "alert-text", id: `alert-text-${this.uniqueId}` }, h("slot", null)), this.closable ? this.renderCloseButton() : null));
+    }
+    static get style() { return IfxAlertStyle0; }
+}, [1, "ifx-alert", {
+        "variant": [1],
+        "icon": [1],
+        "closable": [4],
+        "AriaLive": [1, "aria-live"],
+        "uniqueId": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ifx-alert", "ifx-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ifx-alert":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Alert);
+            }
+            break;
+        case "ifx-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
 
 const IfxAlert = Alert;
 const defineCustomElement = defineCustomElement$1;