@infineon/infineon-design-system-stencil 40.10.0 → 40.10.1

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

@@ -208,7 +208,7 @@ const Template = class {
         }
     }
     render() {
-        return (index.h("div", { key: '8c6473e57327c89d3e4c0fe15af6349aff54bba0' }, this.isTemplatePage ? (index.h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError && (index.h("div", null, index.h("h3", null, "Your repository is getting ready.."), index.h("p", null, "This will only take a minute."))), this.isLoading && !this.repoError && (index.h("div", null, index.h("ifx-spinner", { variant: "default", size: "s" }))), this.repoUrl && (index.h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository")), this.repoError && index.h("div", null, this.repoError))) : (index.h("div", { class: "react__template-container" }, index.h("div", { class: "react__template-wrapper", onClick: (e) => this.handleCurrentTemplate(e) }, index.h("div", { class: "image__wrapper" }, index.h("img", { src: this.thumbnail }))), this.showDetails && (index.h("div", { class: "details__wrapper" }, index.h("div", { class: "selection__buttons-wrapper" }, index.h("div", { class: "selection__input" }, index.h("input", { type: "radio", id: "react", name: "chosen_framework", value: "react", onInput: (e) => this.handleUserInput(e, "framework") }), index.h("label", { htmlFor: "react" }, "React")), index.h("div", { class: "selection__input vue" }, index.h("input", { class: "vue__input", disabled: true, type: "radio", id: "vue", name: "chosen_framework", value: "vue", onInput: (e) => this.handleUserInput(e, "framework") }), index.h("label", { class: "vue__label", htmlFor: "vue" }, "Vue"), " ", "(Soon)")), index.h("div", { class: "input__fields-wrapper" }, index.h("ifx-text-field", { required: true, onInput: (e) => this.handleUserInput(e, "name"), size: "m", icon: "c-info-16", placeholder: "Your repository name" }, "Repository Name"), index.h("ifx-text-field", { required: true, size: "m", icon: "c-info-16", onInput: (e) => this.handleUserInput(e, "desc"), placeholder: "Your repository description" }, "Repository Description"), index.h("ifx-button", { fullWidth: true, onClick: () => this.submitUserData(), variant: "primary" }, "Generate template"))))))));
+        return (index.h("div", { key: '4ffe86153582c357a09ae41463511b649eb832de' }, this.isTemplatePage ? (index.h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError && (index.h("div", null, index.h("h3", null, "Your repository is getting ready.."), index.h("p", null, "This will only take a minute."))), this.isLoading && !this.repoError && (index.h("div", null, index.h("ifx-spinner", { variant: "default", size: "s" }))), this.repoUrl && (index.h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository")), this.repoError && index.h("div", null, this.repoError))) : (index.h("div", { class: "react__template-container" }, index.h("div", { class: "react__template-wrapper", onClick: (e) => this.handleCurrentTemplate(e) }, index.h("div", { class: "image__wrapper" }, index.h("img", { src: this.thumbnail }))), this.showDetails && (index.h("div", { class: "details__wrapper" }, index.h("div", { class: "selection__buttons-wrapper" }, index.h("div", { class: "selection__input" }, index.h("input", { type: "radio", id: "react", name: "chosen_framework", value: "react", onInput: (e) => this.handleUserInput(e, "framework") }), index.h("label", { htmlFor: "react" }, "React")), index.h("div", { class: "selection__input vue" }, index.h("input", { class: "vue__input", disabled: true, type: "radio", id: "vue", name: "chosen_framework", value: "vue", onInput: (e) => this.handleUserInput(e, "framework") }), index.h("label", { class: "vue__label", htmlFor: "vue" }, "Vue"), " ", "(Soon)")), index.h("div", { class: "input__fields-wrapper" }, index.h("ifx-text-field", { required: true, onInput: (e) => this.handleUserInput(e, "name"), size: "m", icon: "c-info-16", placeholder: "Your repository name" }, "Repository Name"), index.h("ifx-text-field", { required: true, size: "m", icon: "c-info-16", onInput: (e) => this.handleUserInput(e, "desc"), placeholder: "Your repository description" }, "Repository Description"), index.h("ifx-button", { fullWidth: true, onClick: () => this.submitUserData(), variant: "primary" }, "Generate template"))))))));
     }
 };
 Template.style = templateCss();

package/dist/cjs/ifx-basic-table.cjs.entry.js

@@ -211,7 +211,7 @@ const Table = class {
         return {};
     }
     render() {
-        return (index.h(index.Host, { key: 'f434a12b54096ef0bf16dc63529be142c01255bc' }, index.h("div", { key: 'f14909833fc59f3fefc16afe28fced7ddb0e1d97', id: "table-wrapper", class: this.getClassNames() }, index.h("div", { key: '3214b878306b674fea59d765ef31950516eee820', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === "zebra" ? "zebra" : ""} ${this.columnValuePosition === "center" ? "center" : "left"}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
+        return (index.h(index.Host, { key: 'bd759a569fb161179a08fc713a932d8ceadbadd8' }, index.h("div", { key: '98ee8079b81380efb6afa8837b1b49b526616ddc', id: "table-wrapper", class: this.getClassNames() }, index.h("div", { key: '87819b217b39820fc60e01005f8b52617b4f2e6d', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === "zebra" ? "zebra" : ""} ${this.columnValuePosition === "center" ? "center" : "left"}`, style: this.getTableStyle(), ref: (el) => (this.container = el) }))));
     }
 };
 Table.style = tableCss();

package/dist/cjs/ifx-chip-item_2.cjs.entry.js

@@ -374,8 +374,8 @@ const Pagination = class {
         this.initPagination();
     }
     render() {
-        return (index.h("div", { key: '7d67acafebeaebd67ea430a13c2140a9434166a8', class: "container" }, this.showItemsPerPage && (index.h("div", { key: 'c2338e93bb45cb8c15d84bda0acee8da6cb33295', class: "items__per-page-wrapper" }, index.h("div", { key: 'd0d5535868dbb1442d0826ca0f794c70281a4e5e', class: "items__per-page-label" }, this.itemsPerPageLabel), index.h("div", { key: '23976e8723b540f266ea8854abf6530ccf82260f', class: "items__per-page-field" }, index.h("ifx-select", { key: '1eac6bf4b77b9797aa93ca4395bf99bd5a09ca11', id: "itemsPerPageSelect", placeholder: "false", "show-search": "false", value: undefined, disabled: false, error: false, size: "s", options: this.filteredItemsPerPage, "placeholder-value": "Select" })))), index.h("div", { key: '6c56ad832ae9c1702004940857e881eaebad9484', class: "items__total-wrapper" }, index.h("div", { key: '3c292e08a3667f0522ed56a2fe6d5dee4ca317e4', class: "pagination" }, index.h("ifx-icon-button", { key: '76bd477dd3893bb5af1ea5715e8219a640249e00', class: "prev", icon: "arrow-left-16", "aria-label": "Previous Page", onClick: () => this.changePage(this.internalPage - 1), variant: "secondary" }), index.h("ol", { key: '7e4003942663309863cbd864704e711b774789a3' }, this.visiblePages.map((page, i) => typeof page === "number" ? (index.h("li", { key: `page-${page}`, class: { [this.CLASS_ACTIVE]: page === this.internalPage }, "data-page": page }, index.h("span", { class: "page__button", role: "button", tabindex: "0", "aria-current": page === this.internalPage ? "page" : undefined, "aria-label": `Page ${page}`, onClick: () => this.changePage(page), onKeyDown: (e) => (e.key === "Enter" || e.key === " ") &&
-                this.changePage(page) }, page))) : (index.h("li", { class: "ellipsis", key: `ellipsis-${i}` }, index.h("span", { "aria-hidden": "true" }, "..."))))), index.h("ifx-icon-button", { key: '2d654579f5c8d3bffa305706860af25e50cdd044', class: "next", icon: "arrow-right-16", "aria-label": "Next Page", onClick: () => this.changePage(this.internalPage + 1), variant: "secondary" })))));
+        return (index.h("div", { key: 'd89601708602427a959a1d20649675048f8ece92', class: "container" }, this.showItemsPerPage && (index.h("div", { key: '4a2c9c4f7bcc45a1f9defaf4f5f331d30deda7e9', class: "items__per-page-wrapper" }, index.h("div", { key: '7bff7f93116141a39d971c0705b27ff3cf75b928', class: "items__per-page-label" }, this.itemsPerPageLabel), index.h("div", { key: '65ce554254477f6ec1eddf00c9487c8d042be1fa', class: "items__per-page-field" }, index.h("ifx-select", { key: '61262a3969ff0bcf3743c72d53abfea210f3550d', id: "itemsPerPageSelect", placeholder: "false", "show-search": "false", value: undefined, disabled: false, error: false, size: "s", options: this.filteredItemsPerPage, "placeholder-value": "Select" })))), index.h("div", { key: 'aaf157db76bd2c4f7310bd17e886b4d911b36156', class: "items__total-wrapper" }, index.h("div", { key: 'd3deabdb8ebb85a561fab88a4b14c14beeb5e14f', class: "pagination" }, index.h("ifx-icon-button", { key: 'c1cdd340a713c2ec2231684d0c00b1882af73541', class: "prev", icon: "arrow-left-16", "aria-label": "Previous Page", onClick: () => this.changePage(this.internalPage - 1), variant: "secondary" }), index.h("ol", { key: '5c4a9ceb3c223994b1f7f0cbc65941064fc0c14e' }, this.visiblePages.map((page, i) => typeof page === "number" ? (index.h("li", { key: `page-${page}`, class: { [this.CLASS_ACTIVE]: page === this.internalPage }, "data-page": page }, index.h("span", { class: "page__button", role: "button", tabindex: "0", "aria-current": page === this.internalPage ? "page" : undefined, "aria-label": `Page ${page}`, onClick: () => this.changePage(page), onKeyDown: (e) => (e.key === "Enter" || e.key === " ") &&
+                this.changePage(page) }, page))) : (index.h("li", { class: "ellipsis", key: `ellipsis-${i}` }, index.h("span", { "aria-hidden": "true" }, "..."))))), index.h("ifx-icon-button", { key: 'ec82ddcf76dbe8d4a4b2e584bc3e2bd5c6f79480', class: "next", icon: "arrow-right-16", "aria-label": "Next Page", onClick: () => this.changePage(this.internalPage + 1), variant: "secondary" })))));
     }
     static get watchers() { return {
         "total": [{

package/dist/cjs/ifx-filter-accordion.cjs.entry.js

@@ -59,7 +59,7 @@ const FilterAccordion = class {
         this.expanded = !this.expanded;
     };
     render() {
-        return (index.h("div", { key: 'bbfb5d3e25b47b1bd1812bdc026f179ddcaf60f1', class: `accordion ${this.expanded ? "expanded" : ""}` }, index.h("div", { key: '69a6875e8809b1b189a7976b026d0b87a5535274', class: `header ${this.expanded ? "expanded" : ""}`, onClick: this.toggleAccordion }, index.h("div", { key: '17327d1f66bac42a02e556f2eb744cf48e837d81', class: `text-and-icon ${this.expanded ? "expanded" : ""}` }, index.h("div", { key: 'd200af2e2b9439e535609db5f8b144f6b6a9c51e', class: "text" }, index.h("span", { key: '02f7deedba22b3960727cd0a3f5c5fa67e74395f' }, this.filterGroupName), index.h("ifx-indicator", { key: '1d94338d9caf2fce95aef1ab0b45bbcf961d941c', variant: "number", number: this.count })), index.h("ifx-icon", { key: '938f11a59590c14477de41f81c713e8b15f596da', class: this.expanded ? "" : "hidden", icon: "minus-16", onClick: this.toggleAccordion }), index.h("ifx-icon", { key: '1bbbb7646d3678604b243eadc536209dd75e0548', class: this.expanded ? "hidden" : "", icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded && (index.h("div", { key: '2ef202100252a61f1208e882878a48dcdccac7cb', class: "filter-accordion-container" }, index.h("slot", { key: '9e63608f6ad747fcb661a60ed27dfd6cfe8bcba0', name: "list" })))));
+        return (index.h("div", { key: '3636a8e232d066f60f1fa75bcc1d355da119d607', class: `accordion ${this.expanded ? "expanded" : ""}` }, index.h("div", { key: '1bc0a0ae111c097687095967212ade7f741106f5', class: `header ${this.expanded ? "expanded" : ""}`, onClick: this.toggleAccordion }, index.h("div", { key: '6e524c414e34a289db635dccd04387a209b09c1d', class: `text-and-icon ${this.expanded ? "expanded" : ""}` }, index.h("div", { key: '1b50358930c2388e6fb83fd2c6f0744328e1531f', class: "text" }, index.h("span", { key: '373b367a8ca23c8e41e37c859b3fd6022899132e' }, this.filterGroupName), index.h("ifx-indicator", { key: '95c7887d571e31fca3a2f791b65b0acaa9b79ca2', variant: "number", number: this.count })), index.h("ifx-icon", { key: 'ffaf0ada6464f3222405149b997734469ec3a468', class: this.expanded ? "" : "hidden", icon: "minus-16", onClick: this.toggleAccordion }), index.h("ifx-icon", { key: '20026275802faedeeeab76bbb808f1de967ca366', class: this.expanded ? "hidden" : "", icon: "plus-16", onClick: this.toggleAccordion }))), this.expanded && (index.h("div", { key: '40f5f0aa1452dbe451b977f79e49e73bf093aabd', class: "filter-accordion-container" }, index.h("slot", { key: '683dd602c69fd6d4e1742ebd3c8a0174b143c838', name: "list" })))));
     }
 };
 FilterAccordion.style = filterAccordionCss();

package/dist/cjs/ifx-filter-bar.cjs.entry.js

@@ -111,7 +111,7 @@ const FilterBar = class {
         // Calculate slotsToShow safely
         const slotsToShow = Math.min(safeVisibleSlots, actualNumberOfComponents, Number.MAX_SAFE_INTEGER);
         const slots = Array.from({ length: slotsToShow }, (_, i) => (index.h("div", { class: "filter-slot-wrapper" }, index.h("slot", { name: `filter-component-${i + 1}` }))));
-        return (index.h(index.Host, { key: 'e4b7fdf9ca3181293be458b2e3c676068273d3c3' }, index.h("div", { key: 'd6c542508f1cb2e00603b62a9a4e899129290475', class: "search-container" }, index.h("slot", { key: 'd556bbac9cacd8dc8b3b2899f352bcaea86d4194', name: "filter-search" }), " "), index.h("div", { key: 'c007ab99731311e5265d58ae73b27b772ff8b818', class: "components-container" }, slots.length > 0 ? slots : index.h("slot", { name: "filter-component" }), this.showMoreFilters && (index.h("div", { key: '8e00d560dfbbeb5ab879d97fa3632bd5a6aeb1b3', class: "filter-buttons-wrapper", onClick: () => this.handleFilterButtonsClick(!this.showAllFilters) }, index.h("ifx-button", { key: '0da93723d7dc9f5ffff1a3bbfc825edd066ebd72', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, index.h("ifx-icon", { key: '0d80c9f1e06cbbe11f753a36dcd03ed9c7425b4f', icon: "filter-16" }), this.showAllFilters ? "Less filters" : "More filters"))))));
+        return (index.h(index.Host, { key: '731c45953cc2f55cb553a6686b5bfa03fe94d6dd' }, index.h("div", { key: '8a0e2293dca4d5dd164c6aa81b9ae2ebcba6e952', class: "search-container" }, index.h("slot", { key: 'f2d4b50f9dc9acf8ece7077ccf5d212853bcd9e5', name: "filter-search" }), " "), index.h("div", { key: '55853f0eb81f0db620e3fd36d16b58ca4f14c4c1', class: "components-container" }, slots.length > 0 ? slots : index.h("slot", { name: "filter-component" }), this.showMoreFilters && (index.h("div", { key: 'f59e44ee07769424d83a36defa55f06d8da8056d', class: "filter-buttons-wrapper", onClick: () => this.handleFilterButtonsClick(!this.showAllFilters) }, index.h("ifx-button", { key: '6b4fd9aa53ed4eed269e2241159c2ce3d85002be', type: "button", disabled: false, variant: "tertiary", size: "m", target: "_blank", theme: "default", "full-width": "false" }, index.h("ifx-icon", { key: '6ae26d706c0247f79f707443b52e39097249088e', icon: "filter-16" }), this.showAllFilters ? "Less filters" : "More filters"))))));
     }
 };
 FilterBar.style = filterBarCss();

package/dist/cjs/ifx-filter-search.cjs.entry.js

@@ -47,9 +47,9 @@ const FilterSearch = class {
         }); // Emitting filterKey along with other properties
     }
     render() {
-        return (index.h("div", { key: '4ae6eb7505ed7af7eb37d1c24adb9110b01bac47', class: `${this.filterOrientation === "sidebar"
+        return (index.h("div", { key: '844df78545015021d14e9aad3e8f3317f881ffed', class: `${this.filterOrientation === "sidebar"
                 ? "sidebar-filter-search-wrapper"
-                : "topbar-filter-search-wrapper"}` }, index.h("div", { key: 'acd52fdeab086bc8f560919254c3f7f4d9636d1a', class: "filter-name" }, this.filterName), index.h("ifx-search-field", { key: 'ca11d908536e8f904c75fa80c66ee0ba60cf49fe', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
+                : "topbar-filter-search-wrapper"}` }, index.h("div", { key: 'ef512f36cb470f347075a9d495ebe5e7fecfa842', class: "filter-name" }, this.filterName), index.h("ifx-search-field", { key: '0e71e74924d994e927edefea6d2bfaf17a295923', placeholder: this.placeholder, "show-delete-icon": this.showDeleteIcon, disabled: this.disabled, value: this.filterValue })));
     }
     static get watchers() { return {
         "value": [{

package/dist/cjs/ifx-filter-type-group.cjs.entry.js

@@ -143,7 +143,7 @@ const IfxFilterTypeGroup = class {
         this.ifxSidebarFilterChange.emit(this.selectedOptions);
     };
     render() {
-        return (index.h(index.Host, { key: 'bd2dd1f3a21eae6936a4a97ceceb0d91e8155c56' }, index.h("div", { key: '1543667c1b9601980c7a35e3e52f502bf7d9b241', class: "filter-type-group" }, index.h("slot", { key: '8686f4e6f42be3cde86ca50aa609a9537c5260cb', name: "filter-search" }), index.h("slot", { key: 'd64e04eecab04c2a07849234d132637fb806e392', name: "filter-accordion" }))));
+        return (index.h(index.Host, { key: '597e67d9c6084151a4d1c3e90de84e82d235373e' }, index.h("div", { key: 'b76041c20fb4abcb3a738e75731c82113203b001', class: "filter-type-group" }, index.h("slot", { key: 'd6302cc9187d627fa87aea4bba74db91710426c2', name: "filter-search" }), index.h("slot", { key: 'b2c64153f74e153c8704274e4684951a203fd701', name: "filter-accordion" }))));
     }
 };
 IfxFilterTypeGroup.style = filterTypeGroupCss();

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

@@ -31,7 +31,7 @@ const ListEntry = class {
         });
     }
     render() {
-        return (index.h("div", { key: '97f4104cec47330227e9de7fef48036d5e4833dc', class: "wrapper" }, this.type === "checkbox" ? (index.h("div", { class: "list-entry" }, index.h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (index.h("div", { class: "list-entry" }, index.h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
+        return (index.h("div", { key: '898bffb3dad084c737e3f9bb2376a8e141bef5f4', class: "wrapper" }, this.type === "checkbox" ? (index.h("div", { class: "list-entry" }, index.h("ifx-checkbox", { size: "s", checked: this.value }, this.label))) : (index.h("div", { class: "list-entry" }, index.h("ifx-radio-button", { size: "s", checked: this.value }, this.label)))));
     }
     static get watchers() { return {
         "value": [{

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

@@ -538,22 +538,22 @@ const Multiselect = class {
         if (allOptionElements.length > 0) {
             isFlatMultiselect = Array.from(allOptionElements).every((option) => option.children.length === 0);
         }
-        return (index.h("div", { key: 'eff11e227364456179075bc4c63169610865854a', class: `ifx-multiselect-container ${this.readOnly ? 'readOnly' : this.internalError ? '' : this.disabled ? 'disabled' : ''}`, ref: (el) => (this.dropdownElement = el) }, index.h("div", { key: '58daeed5f6a795d8dede2ae7dd563767b071e10f', class: "ifx-label-wrapper" }, this.label && (index.h("span", { key: '12afd110bfb6676a69c4da7aa4795f0a382ac8c3', class: "wrapper-label" }, index.h("span", { key: 'ce75030fb64087459775d04dad205fb89ca09b02' }, this.label), this.required && (index.h("span", { key: '6b5dd564a0e9595d38e6783966fd7d8909cd8aec', class: `required ${!this.readOnly && this.internalError ? "error" : ""}` }, "*"))))), index.h("div", { key: '561bdb3d6a7d75588bd896d7aaa1f8770ee70b44', class: `ifx-multiselect-wrapper
+        return (index.h("div", { key: '061435f04832e8a8582c6d267ff759c4e0dc8e9e', class: `ifx-multiselect-container ${this.readOnly ? 'readOnly' : this.internalError ? '' : this.disabled ? 'disabled' : ''}`, ref: (el) => (this.dropdownElement = el) }, index.h("div", { key: 'b975c59377cd090f203a1c003dca565bfb2bfa8d', class: "ifx-label-wrapper" }, this.label && (index.h("span", { key: '8d30fb0205b805ee1f5a3f1093c45a7dc787cea8', class: "wrapper-label" }, index.h("span", { key: '84dc6ca318f86e7bf38e2049ba494c6d2f90e140' }, this.label), this.required && (index.h("span", { key: '65d91c3d46ebed3ebd5ce6ff92c3363c205de723', class: `required ${!this.readOnly && this.internalError ? "error" : ""}` }, "*"))))), index.h("div", { key: 'd8acdca15286b671ee0952b5fd245e0c72e4e2c0', class: `ifx-multiselect-wrapper
         ${this.dropdownOpen ? "active" : ""}
         ${this.dropdownFlipped ? "is-flipped" : ""}
         ${this.readOnly ? "" : this.internalError ? "error" : this.disabled ? "disabled" : ""}`, role: "combobox", "aria-label": this.ariaMultiSelectLabel, "aria-labelledby": this.ariaMultiSelectLabelledBy || undefined, "aria-describedby": this.ariaMultiSelectDescribedBy || undefined, "aria-expanded": this.dropdownOpen, "aria-haspopup": "listbox", "aria-disabled": !this.readOnly && !this.internalError && this.disabled, tabindex: "0", onClick: (this.disabled && !this.internalError) || this.readOnly
                 ? undefined
                 : (event) => this.handleWrapperClick(event), onKeyDown: (this.disabled && !this.internalError) || this.readOnly
                 ? undefined
-                : (event) => this.handleKeyDown(event) }, index.h("div", { key: 'c0981414ba527d27470e15d1c2177959591237c7', class: `ifx-multiselect-input
+                : (event) => this.handleKeyDown(event) }, index.h("div", { key: 'd6ff637eeac7ff63f605a8c717cb173c0889b689', class: `ifx-multiselect-input
           ${hasSelections ? "" : "placeholder"}
           `, onClick: (this.disabled && !this.internalError) || this.readOnly
                 ? undefined
-                : () => this.toggleDropdown() }, hasSelections ? selectedOptionsLabels : this.placeholder), this.dropdownOpen && (index.h("div", { key: '93e2237554233b5dc1aeb602bda53b88b717ab5b', class: "ifx-multiselect-dropdown-menu" }, (this.showSearch ||
+                : () => this.toggleDropdown() }, hasSelections ? selectedOptionsLabels : this.placeholder), this.dropdownOpen && (index.h("div", { key: 'ff339f0608115e4781b498ab8a93170634470995', class: "ifx-multiselect-dropdown-menu" }, (this.showSearch ||
             this.showSelectAll ||
-            (this.showExpandCollapse && !isFlatMultiselect)) && (index.h("div", { key: '407883a2cdc23fb203fd16d7381766551d053a9e', class: "ifx-multiselect-dropdown-functions", onClick: (e) => e.stopPropagation() }, this.showSearch && (index.h("div", { key: '794fee295fe233b012a11f4b4a8f47ac3d930d97', class: "ifx-multiselect-dropdown-search" }, index.h("ifx-search-field", { key: '3091c77992d8f5113f79906de14706dc91f0e515', class: "search-input", placeholder: this.searchPlaceholder, size: "s", "show-delete-icon": "true", "aria-label": this.ariaSearchLabel, onKeyDown: (e) => {
+            (this.showExpandCollapse && !isFlatMultiselect)) && (index.h("div", { key: 'cb4890c4969f2d32b3b25bc2aaf79883b3dd3be5', class: "ifx-multiselect-dropdown-functions", onClick: (e) => e.stopPropagation() }, this.showSearch && (index.h("div", { key: 'c38bd5bfc3187ab3a7c05264526142f8d6420f0b', class: "ifx-multiselect-dropdown-search" }, index.h("ifx-search-field", { key: '4c8d66f18479131ac0b88fc5cc9f523f2395002d', class: "search-input", placeholder: this.searchPlaceholder, size: "s", "show-delete-icon": "true", "aria-label": this.ariaSearchLabel, onKeyDown: (e) => {
                 e.stopPropagation();
-            }, onIfxInput: (event) => this.handleSearch(event.target), onFocus: () => this.handleSearchFocus(true), onBlur: () => this.handleSearchFocus(false) }))), index.h("div", { key: '39dc595be5cf2f33098091e42103ce3089f68487', class: "ifx-multiselect-dropdown-controls" }, this.showSelectAll && this.renderSelectAll(), this.showExpandCollapse && !isFlatMultiselect && (index.h("div", { key: '4f708f70c981a881efc5c00cc893e51c29929d34', class: "expand-collapse-controls" }, index.h("span", { key: '489d0101d0180fdae7cd4f61620a8dfe1592e59c', class: "control-item", role: "button", tabIndex: 0, "aria-label": this.ariaExpandAllLabel, onClick: (e) => {
+            }, onIfxInput: (event) => this.handleSearch(event.target), onFocus: () => this.handleSearchFocus(true), onBlur: () => this.handleSearchFocus(false) }))), index.h("div", { key: '9be40d287c236ee19bd9d50c6022bf4b39586bed', class: "ifx-multiselect-dropdown-controls" }, this.showSelectAll && this.renderSelectAll(), this.showExpandCollapse && !isFlatMultiselect && (index.h("div", { key: 'b99fbfb1acb8481bfd68cdafbd98cde93f46dfb6', class: "expand-collapse-controls" }, index.h("span", { key: 'c112567b8983c0dcbc8d40f6c74d8f3c760750aa', class: "control-item", role: "button", tabIndex: 0, "aria-label": this.ariaExpandAllLabel, onClick: (e) => {
                 e.stopPropagation();
                 this.expandAll();
             }, onKeyDown: (e) => {
@@ -562,7 +562,7 @@ const Multiselect = class {
                     e.stopPropagation();
                     this.expandAll();
                 }
-            } }, this.expandLabel), index.h("span", { key: 'c7bc5c33423264a19d3f975289041c5a3057d58e', class: "control-item", role: "button", tabIndex: 0, "aria-label": this.ariaCollapseAllLabel, onClick: (e) => {
+            } }, this.expandLabel), index.h("span", { key: 'ed48150b0978c9ee5946f9096c1da17f89fe5e04', class: "control-item", role: "button", tabIndex: 0, "aria-label": this.ariaCollapseAllLabel, onClick: (e) => {
                 e.stopPropagation();
                 this.collapseAll();
             }, onKeyDown: (e) => {
@@ -571,15 +571,15 @@ const Multiselect = class {
                     e.stopPropagation();
                     this.collapseAll();
                 }
-            } }, this.collapseLabel)))))), index.h("div", { key: '1c90eef6b84589cd53f02c87d1b9fe96ef19412f', class: "ifx-multiselect-options", role: "listbox", "aria-multiselectable": "true" }, index.h("slot", { key: '52a1f44c50959130b37ecba5eb566c8b9d5fa4da' }), this.searchTerm &&
+            } }, this.collapseLabel)))))), index.h("div", { key: '2cc5709717d23e801f46ecfdfad2bde2a3e51502', class: "ifx-multiselect-options", role: "listbox", "aria-multiselectable": "true" }, index.h("slot", { key: '159976a71621ef3c4a474e67aa869204bcc75a32' }), this.searchTerm &&
             this.showNoResultsMessage &&
-            this.renderNoResultsMessage()))), index.h("div", { key: '1caf30ac835180e1d065602b40b2066151936db9', class: "ifx-multiselect-icon-container" }, this.persistentSelectedOptions.length > 0 && (index.h("div", { key: '35c260ea37508e24232bde72639fb7e24fd184a6', class: `ifx-clear-button ${!this.showClearButton ? "hide" : ""}`, onClick: this.disabled && !this.error
+            this.renderNoResultsMessage()))), index.h("div", { key: '772c391f0bd3cc99b1c3b65dcf96c2ec9d1dfe28', class: "ifx-multiselect-icon-container" }, this.persistentSelectedOptions.length > 0 && (index.h("div", { key: '1f2c0a9db89f7730abf255864a96f798e14d7714', class: `ifx-clear-button ${!this.showClearButton ? "hide" : ""}`, onClick: this.disabled && !this.error
                 ? undefined
-                : () => this.clearSelection() }, index.h("ifx-icon", { key: '225dac99949dd0c44c67150c2033fe338da46d8f', icon: "cRemove16" }))), index.h("div", { key: '8fe8fed65fb0eba10b7a11fff86197b4bd5dffef', class: "icon-wrapper-up", onClick: this.disabled && !this.error
+                : () => this.clearSelection() }, index.h("ifx-icon", { key: 'efbaafe4da129d8cbf9ac7438fad1205dc9dc2a9', icon: "cRemove16" }))), index.h("div", { key: '5e0ede55b33858ee98e5386d1ed019ef00f3b4d5', class: "icon-wrapper-up", onClick: this.disabled && !this.error
                 ? undefined
-                : () => this.toggleDropdown() }, index.h("ifx-icon", { key: "icon-up", icon: "chevron-up-16" })), index.h("div", { key: '0831e928c2bda60cd5bc79d6e1f5d616864bd773', class: "icon-wrapper-down", onClick: this.disabled && !this.error
+                : () => this.toggleDropdown() }, index.h("ifx-icon", { key: "icon-up", icon: "chevron-up-16" })), index.h("div", { key: '0fa8604651b054ae4b2130d8522771558aed9b10', class: "icon-wrapper-down", onClick: this.disabled && !this.error
                 ? undefined
-                : () => this.toggleDropdown() }, index.h("ifx-icon", { key: "icon-down", icon: "chevron-down-16" })))), this.caption && (index.h("div", { key: '52c542972625085b40bf02740afeb027500b55b3', class: `multi__select-caption ${this.readOnly ? "" : this.internalError ? "error" : this.disabled ? "disabled" : ""}` }, this.caption))));
+                : () => this.toggleDropdown() }, index.h("ifx-icon", { key: "icon-down", icon: "chevron-down-16" })))), this.caption && (index.h("div", { key: '55f969615171b63d6f8af6adf75b8e1c2b113976', class: `multi__select-caption ${this.readOnly ? "" : this.internalError ? "error" : this.disabled ? "disabled" : ""}` }, this.caption))));
     }
     static get watchers() { return {
         "error": [{
@@ -956,13 +956,13 @@ const MultiselectOption = class {
         const optionItemStyle = isFlatMultiselect
             ? undefined
             : { paddingLeft: `${totalPadding}px` };
-        return (index.h(index.Host, { key: '0e6b442f79020fa8dba4e9a8bb92cc637986e09f' }, index.h("div", { key: '9ba92efa51e86664f1ce9c430bfea031a68669f8', class: {
+        return (index.h(index.Host, { key: 'dbc6d63d25fd60384ceac7b91e828b2121f51e2c' }, index.h("div", { key: '92022e4904260df8c5545916a3b843ecf151998c', class: {
                 option: true,
                 "option--has-children": this.hasChildren,
                 "option--expanded": this.isExpanded,
                 "option--disabled": this.disabled,
                 "option--selected": this.selected,
-            }, role: "option", "aria-expanded": this.hasChildren ? (this.isExpanded ? "true" : "false") : undefined, "aria-selected": this.selected ? "true" : "false", "aria-disabled": this.disabled ? "true" : "false", "data-level": this.depth, "data-value": this.value }, index.h("div", { key: '1ffe770cde6a7a2fd5fa9c6fa4db833f16bf1b13', class: "option-item", style: optionItemStyle }, index.h("div", { key: 'a068670d7428522e1a3caa0a1d78e332ea453bac', class: "chevron-wrapper", tabIndex: this.hasChildren ? 0 : -1, role: this.hasChildren ? "button" : undefined, "aria-label": this.hasChildren
+            }, role: "option", "aria-expanded": this.hasChildren ? (this.isExpanded ? "true" : "false") : undefined, "aria-selected": this.selected ? "true" : "false", "aria-disabled": this.disabled ? "true" : "false", "data-level": this.depth, "data-value": this.value }, index.h("div", { key: '4e3d3bcd148fd076723b5ee71feda97e9f2d3f1e', class: "option-item", style: optionItemStyle }, index.h("div", { key: '170da107b3946c01c1eaba5aa6d70bee89eed6c0', class: "chevron-wrapper", tabIndex: this.hasChildren ? 0 : -1, role: this.hasChildren ? "button" : undefined, "aria-label": this.hasChildren
                 ? this.isExpanded
                     ? "Collapse"
                     : "Expand"
@@ -975,7 +975,7 @@ const MultiselectOption = class {
                     e.stopPropagation();
                     this.toggleExpansion();
                 }
-            } }, this.hasChildren && (index.h("ifx-icon", { key: 'd386e850e2c121f9270968441550491c85bea51d', class: `chevron ${this.isExpanded ? "chevron--expanded" : "chevron--collapsed"}`, icon: "chevron-right-16" }))), index.h("div", { key: 'ebcf9f62cc0555e80dbf44f35a6f715bdd42013d', class: "checkbox-wrapper", onClick: (e) => e.stopPropagation() }, index.h("ifx-checkbox", { key: '4aca2dd43b8a85a8311ef3a1f1e7a2e559266d71', size: "s", checked: this.isSearchActive && this.isSearchDisabled
+            } }, this.hasChildren && (index.h("ifx-icon", { key: 'b30c9926ef385842b975e5983eccfe14117439e1', class: `chevron ${this.isExpanded ? "chevron--expanded" : "chevron--collapsed"}`, icon: "chevron-right-16" }))), index.h("div", { key: 'f08cf98109b41b0deeeef7cf6782162fa0d879c3', class: "checkbox-wrapper", onClick: (e) => e.stopPropagation() }, index.h("ifx-checkbox", { key: '7ddea5efe01d20e53fe974b7ce05c2ff4f462b0f', size: "s", checked: this.isSearchActive && this.isSearchDisabled
                 ? false
                 : this.indeterminate
                     ? false
@@ -988,7 +988,7 @@ const MultiselectOption = class {
                     e.stopPropagation();
                     this.handleCheckboxClick(e);
                 }
-            } })), index.h("div", { key: '95b170fd3f2b01f21c741476d5943fc2313fa1e1', class: "option-label", onClick: this.handleHeaderClick, tabIndex: -1 }, index.h("slot", { key: '2fa49ebc91da46632bcaf4e208538ce2c647fc50' }))), this.isExpanded && (index.h("div", { key: '065a550576a7d31ea0da5c527c3c598fe8991fef', class: "option-children" }, index.h("slot", { key: 'ad08e467b352547c4361df14ff4c7ff130517943', name: "children" }))))));
+            } })), index.h("div", { key: '2fbe87deb7c92d68c3a8770247fa034910e7bacc', class: "option-label", onClick: this.handleHeaderClick, tabIndex: -1 }, index.h("slot", { key: 'f54a85b43cc600db30981882c600fcc599ca882a' }))), this.isExpanded && (index.h("div", { key: '22ce7a254546df97609f6c158bb6a136c12fa179', class: "option-children" }, index.h("slot", { key: 'e1e8422fd71883a02e727496907b3d1200997bb7', name: "children" }))))));
     }
 };
 MultiselectOption.style = multiselectOptionCss();