@siemens/ix 5.1.1 → 5.2.0

package/dist/collection/components/popover-footer/popover-footer.js

@@ -24,7 +24,7 @@ export class PopoverFooter {
      */
     alignment = 'horizontal';
     render() {
-        return (h(Host, { key: '66ac122a1578b7645271c21515ab100447035640', class: { [`alignment-${this.alignment}`]: true }, [TRAP_FOCUS_INCLUDE_ATTRIBUTE]: true }, h("div", { key: '5f5a73150f77fb39f7ef3b704bbecbde88c6fd5c', class: "footer-start" }, h("slot", { key: '84e99847b724a2acf40417513820e23c9dc95fed', name: "start" })), h("div", { key: '95cf2bbf6ce27684c37974d64b3d4c36b8e60bd6', class: "footer-end" }, h("slot", { key: 'bb9ea5b049a7d6716cfcad5fc6a25bc5b59443c1' }))));
+        return (h(Host, { key: '6807df77153dc545a04a6babd5d55dcf9f3e0adb', class: { [`alignment-${this.alignment}`]: true }, [TRAP_FOCUS_INCLUDE_ATTRIBUTE]: true }, h("div", { key: '25af3f6651e72be055e0e4d0c4ff89c644b059dd', class: "footer-start" }, h("slot", { key: '43142b46cfe1334343d38cdc5d3b0340916cbfaf', name: "start" })), h("div", { key: '8cdd1696cc0bf0091266d40dad5aff071cb0e74d', class: "footer-end" }, h("slot", { key: '3810b5a7bdebd817494ccbf0e46e5d41db3cb43c' }))));
     }
     static get is() { return "ix-popover-footer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover-header/popover-header.css

@@ -33,7 +33,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -42,37 +42,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host .popover-title {

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

@@ -66,7 +66,7 @@ export class PopoverHeader {
         this.parentPopover?.hidePopover();
     }
     render() {
-        return (h(Host, { key: 'd6b5d04790192d4212e60d39ce685a18b5dcc72a', [TRAP_FOCUS_INCLUDE_ATTRIBUTE]: true }, this.icon ? (h("ix-icon", { name: this.icon, color: this.iconColor, size: "24", "aria-hidden": a11yBoolean(true) })) : null, h("div", { key: '37a9433e60b19c2a191db75ee475586a36b7d4a0', class: "popover-title" }, h("ix-typography", { key: '866758b0c589aef950896e06f00096520311851a', format: "h5" }, h("slot", { key: '6cfa745b62f705ddd2b8076ecf9e634cc8fac309' }))), h("div", { key: '671bfd6538e4540d75051c960a963949bd26d9d8', class: "additional-items" }, h("slot", { key: '8b8c48055f58111077cfdede40f977691180250e', name: "additional-items" })), this.hideClose ? null : (h("ix-icon-button", { class: "popover-close", onClick: (event) => this.onCloseClick(event), variant: "tertiary", icon: iconClose, "aria-label": this.ariaLabelCloseIconButton }))));
+        return (h(Host, { key: '76d1a3d16977a65199b5fe65bf1695936ef32261', [TRAP_FOCUS_INCLUDE_ATTRIBUTE]: true }, this.icon ? (h("ix-icon", { name: this.icon, color: this.iconColor, size: "24", "aria-hidden": a11yBoolean(true) })) : null, h("div", { key: '657a03037f738a7d6eda5882e81daee2adb865dc', class: "popover-title" }, h("ix-typography", { key: 'b2b73f314f4831e17e77187126be81ba7c349ca1', format: "h5" }, h("slot", { key: '4b2764e2af36d94fdfb7f175354291fcacbb701e' }))), h("div", { key: '18708b2c35c85c1a9bafe0b66b004fa142b2c116', class: "additional-items" }, h("slot", { key: '8ff6074594f854d8e220f8da8364b4b69f8c6c7e', name: "additional-items" })), this.hideClose ? null : (h("ix-icon-button", { class: "popover-close", onClick: (event) => this.onCloseClick(event), variant: "tertiary", icon: iconClose, "aria-label": this.ariaLabelCloseIconButton }))));
     }
     static get is() { return "ix-popover-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover-image/popover-image.css

@@ -30,7 +30,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -39,37 +39,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host img {

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

@@ -96,17 +96,17 @@ export class ProgressIndicator {
     render() {
         const normalizedValue = ((this.value - this.min) / (this.max - this.min)) * 100;
         const clampedValue = Math.max(0, Math.min(normalizedValue, 100));
-        return (h(Host, { key: 'a0fda23f6a532303c9995fbf7815bfec062a14ab', class: {
+        return (h(Host, { key: '05a0f4409950bd14852a4b4e8573ddd8ecd3288a', class: {
                 linear: this.type === 'linear',
                 circular: this.type === 'circular',
-            }, tabIndex: -1 }, h("div", { key: 'e02e07ba370860bfe2be7ce663b78c4cf71f12c3', class: {
+            }, tabIndex: -1 }, h("div", { key: '7a4e59690c101846dfbcb57ee04f8143b9f7b71b', class: {
                 'progress-indicator': true,
                 [this.size]: true,
                 [this.status]: true,
                 ['text-center']: this.textAlignment === 'center',
                 ['text-left']: this.textAlignment === 'left',
                 ['text-right']: this.textAlignment === 'right',
-            } }, this.label && (h("ix-typography", { key: 'd9789ab69c7879fcaf0142fc5751162c5b7b2106', format: "label", textColor: this.status === 'error' ? 'alarm' : 'soft', class: 'label' }, this.label)), h("div", { key: '7c10251bb3f06e02985df158da20d539ec23c4d2', class: "progress-container" }, this.type === 'linear' ? (h(Fragment, null, h(LinearBar, { value: clampedValue, status: this.status }), h("div", { class: "linear-slot" }, h("slot", null)))) : (h(CircularProgress, { status: this.status, alignment: this.textAlignment, value: clampedValue, size: this.size }, h("slot", null)))), this.showTextAsTooltip === true && this.helperText ? (h("ix-tooltip", { for: this.hostElement, showDelay: 500, placement: "bottom" }, this.getHelperText())) : (this.getHelperText()))));
+            } }, this.label && (h("ix-typography", { key: 'ce97142eb085bac72ea662adcb2c486c186e03b0', format: "label", textColor: this.status === 'error' ? 'alarm' : 'soft', class: 'label' }, this.label)), h("div", { key: '8a188d3971f1016f3fc858d59fac134d33a43153', class: "progress-container" }, this.type === 'linear' ? (h(Fragment, null, h(LinearBar, { value: clampedValue, status: this.status }), h("div", { class: "linear-slot" }, h("slot", null)))) : (h(CircularProgress, { status: this.status, alignment: this.textAlignment, value: clampedValue, size: this.size }, h("slot", null)))), this.showTextAsTooltip === true && this.helperText ? (h("ix-tooltip", { for: this.hostElement, showDelay: 500, placement: "bottom" }, this.getHelperText())) : (this.getHelperText()))));
     }
     static get is() { return "ix-progress-indicator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/push-card/push-card.css

@@ -38,35 +38,105 @@
 :host(.card-outline) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-outline-accordion--border-color);
 }
+:host(.card-outline) ix-card-accordion {
+  --theme-push-card-outline-accordion--background--hover: var(--theme-push-card-outline-accordion--background);
+  --theme-push-card-outline-accordion--background--active: var(--theme-push-card-outline-accordion--background);
+  --theme-push-card-outline-accordion-frame--border-color: var(--theme-push-card-outline-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-background: var(--theme-color-component-1);
+  --theme-push-card-outline-accordion-frame--border-color: var(--theme-color-soft-bdr);
+}
+:host(.card-outline) ix-card {
+  --ix-card-border-color: var(--theme-color-soft-bdr);
+}
+:host(.card-outline) ix-card:hover, :host(.card-outline) ix-card:active {
+  --ix-card-border-color: var(--theme-color-soft-bdr);
+}
 
 :host(.card-filled) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-filled-accordion--border-color);
 }
+:host(.card-filled) ix-card-accordion {
+  --theme-push-card-filled-accordion--background--hover: var(--theme-push-card-filled-accordion--background);
+  --theme-push-card-filled-accordion--background--active: var(--theme-push-card-filled-accordion--background);
+  --theme-push-card-filled-accordion-frame--border-color: var(--theme-push-card-filled-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-background: var(--theme-color-component-1);
+}
 
 :host(.card-alarm) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-alarm-accordion--border-color);
 }
+:host(.card-alarm) ix-card-accordion {
+  --theme-push-card-alarm-accordion--background--hover: var(--theme-push-card-alarm-accordion--background);
+  --theme-push-card-alarm-accordion--background--active: var(--theme-push-card-alarm-accordion--background);
+  --theme-push-card-alarm-accordion-frame--border-color: var(--theme-push-card-alarm-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-critical) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-critical-accordion--border-color);
 }
+:host(.card-critical) ix-card-accordion {
+  --theme-push-card-critical-accordion--background--hover: var(--theme-push-card-critical-accordion--background);
+  --theme-push-card-critical-accordion--background--active: var(--theme-push-card-critical-accordion--background);
+  --theme-push-card-critical-accordion-frame--border-color: var(--theme-push-card-critical-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-warning) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-warning-accordion--border-color);
 }
+:host(.card-warning) ix-card-accordion {
+  --theme-push-card-warning-accordion--background--hover: var(--theme-push-card-warning-accordion--background);
+  --theme-push-card-warning-accordion--background--active: var(--theme-push-card-warning-accordion--background);
+  --theme-push-card-warning-accordion-frame--border-color: var(--theme-push-card-warning-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-success) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-success-accordion--border-color);
 }
+:host(.card-success) ix-card-accordion {
+  --theme-push-card-success-accordion--background--hover: var(--theme-push-card-success-accordion--background);
+  --theme-push-card-success-accordion--background--active: var(--theme-push-card-success-accordion--background);
+  --theme-push-card-success-accordion-frame--border-color: var(--theme-push-card-success-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-info) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-info-accordion--border-color);
 }
+:host(.card-info) ix-card-accordion {
+  --theme-push-card-info-accordion--background--hover: var(--theme-push-card-info-accordion--background);
+  --theme-push-card-info-accordion--background--active: var(--theme-push-card-info-accordion--background);
+  --theme-push-card-info-accordion-frame--border-color: var(--theme-push-card-info-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-neutral) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-neutral-accordion--border-color);
 }
+:host(.card-neutral) ix-card-accordion {
+  --theme-push-card-neutral-accordion--background--hover: var(--theme-push-card-neutral-accordion--background);
+  --theme-push-card-neutral-accordion--background--active: var(--theme-push-card-neutral-accordion--background);
+  --theme-push-card-neutral-accordion-frame--border-color: var(--theme-push-card-neutral-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
+}
 
 :host(.card-primary) ix-card-content {
   border-bottom: var(--theme-push-card--border-width) solid var(--theme-push-card-primary-accordion--border-color);
+}
+:host(.card-primary) ix-card-accordion {
+  --theme-push-card-primary-accordion--background--hover: var(--theme-push-card-primary-accordion--background);
+  --theme-push-card-primary-accordion--background--active: var(--theme-push-card-primary-accordion--background);
+  --theme-push-card-primary-accordion-frame--border-color: var(--theme-push-card-primary-accordion--background);
+  --ix-card-accordion-expand-content--border-radius: 0 0 var(--theme-default-border-radius) var(--theme-default-border-radius);
+  --ix-card-accordion-expand-content--border-radius: 0 0 calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width)) calc(var(--theme-default-border-radius) + var(--theme-push-card--border-width));
 }

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

@@ -47,7 +47,7 @@ export class PushCard {
      */
     passive = false;
     render() {
-        return (h(Host, { key: '559d12fce394d034e88a67d1792cf89db5e1f9d6', class: `card-${this.variant}` }, h("ix-card", { key: '74a3295376423e02defc79637f53905f1975a10e', variant: this.variant, passive: this.passive }, h("ix-card-content", { key: 'e88ae5131c174acebb759628d6de18bdf26d8141' }, h("ix-card-title", { key: '6c1df74de6c6e7b82a6301db6ecc6268d4891e47' }, this.icon ? (h("ix-icon", { class: 'icon', name: this.icon, size: "32", "aria-label": this.ariaLabelIcon })) : null, h("ix-typography", { key: '0f1b79fd78aa5b954c6320b9f61dbbcab61ef3c7', format: "display-xxl" }, this.notification ?? 0), h("slot", { key: '778a56994a47ad9e8fbcee8526c592e6e0459930', name: "title-action" })), h("ix-typography", { key: '5a3b385c75a69f0324fc890c2519476111bc2a4e', format: "h4" }, this.heading), h("ix-typography", { key: '6f261327133e30244fe398c91e099b3dcba848fa' }, this.subheading)), h("ix-card-accordion", { key: '3175d45b32f0d9a1eaccb205a3052b5746fc5287', collapse: !this.expanded, variant: this.variant }, h("slot", { key: '08b90be54cd2d292349ead1ce20a173104ce266e' })))));
+        return (h(Host, { key: '0f239a6558a0ccb0287124bb256a7d7d6256dc8e', class: `card-${this.variant}` }, h("ix-card", { key: 'e512c612e4c0fef3a5ec1d375d653db177b90aca', variant: this.variant, passive: this.passive }, h("ix-card-content", { key: '5c587c9b4698117ffda6104a402f3887cae9cdcc' }, h("ix-card-title", { key: '5f541549ea22b378bc26446f0f68feb8b8926c33' }, this.icon ? (h("ix-icon", { class: 'icon', name: this.icon, size: "32", "aria-label": this.ariaLabelIcon })) : null, h("ix-typography", { key: '363d4ecfe1196bbc591376b9a0405f91c8b6f55d', format: "display-xxl" }, this.notification ?? 0), h("slot", { key: '8ab001894e21f7bd60861015c5d54d2eb14ab3d1', name: "title-action" })), h("ix-typography", { key: '831bc352f52398683fd251dfacfcc2292539a3b5', format: "h4" }, this.heading), h("ix-typography", { key: '8e47745fbef875019a99a7f017975ac4a722db09' }, this.subheading)), h("ix-card-accordion", { key: '43d0965dd8950bba104de8b207cae142c69e1d58', collapse: !this.expanded, variant: this.variant }, h("slot", { key: '92a7fe73f9b6561707057d9daef3f70bba13a667' })))));
     }
     static get is() { return "ix-push-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/radio/radio.css

@@ -31,7 +31,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -40,37 +40,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host .radio-checkmark {

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

@@ -138,17 +138,17 @@ export class Radio {
         if (this.disabled) {
             tabIndex = -1;
         }
-        return (h(Host, { key: 'd6533cba8c7db26ade65df95ed8d5b8633c053f2', "aria-checked": a11yBoolean(this.checked), "aria-disabled": a11yBoolean(this.disabled), role: "radio", tabindex: tabIndex, class: {
+        return (h(Host, { key: '18a9d8d27e3da2d36681f0681caeee84ed943efd', "aria-checked": a11yBoolean(this.checked), "aria-disabled": a11yBoolean(this.disabled), role: "radio", tabindex: tabIndex, class: {
                 disabled: this.disabled,
                 checked: this.checked,
             }, onClick: () => {
                 if (this.disabled)
                     return;
                 this.setCheckedState(true);
-            }, onKeyDown: (event) => this.onKeyDown(event), onBlur: () => this.ixBlur.emit() }, h("label", { key: 'b458abc7f94dca6caf12c633953fe11307990b8e' }, h("div", { key: 'bad09b21c40286db89ee29757c66ed81b129b0d2', class: "radio-button" }, h("div", { key: '2c528acbd6a05b9fb3ddd71b75d1a8682f6fafc3', "aria-hidden": "true", class: {
+            }, onKeyDown: (event) => this.onKeyDown(event), onBlur: () => this.ixBlur.emit() }, h("label", { key: '22db33f534a61abca396ce3c05f30b490327e417' }, h("div", { key: '0ad8548b87a63cded792ad6dee63e4ba018a0aa0', class: "radio-button" }, h("div", { key: '9b8fbaa25b7f4307f4a820a99a80dd3a01272604', "aria-hidden": "true", class: {
                 ['radio-checkmark']: true,
                 checked: this.checked,
-            } }, h("div", { key: 'de7e5a0d22a2f6b1b431e210bb73f9fed161530b', class: "checkmark", style: { visibility: this.checked ? 'visible' : 'hidden' } }))), this.label && (h("ix-typography", { key: 'ba92e2c1e197e78e443b597261db32d44063d7d2', format: "label", textColor: this.disabled ? 'weak' : 'std' }, this.label, h("slot", { key: '6699f5473812078a34278907c58919eab380907a' }))))));
+            } }, h("div", { key: 'a8e10d030150643478be8e859e47b7654ecdcdba', class: "checkmark", style: { visibility: this.checked ? 'visible' : 'hidden' } }))), this.label && (h("ix-typography", { key: 'a0c8ddcf036d2ade8ed14813dff4d3ce8fc664ff', format: "label", textColor: this.disabled ? 'weak' : 'std' }, this.label, h("slot", { key: '35fd78b7b432ced026ac0824f64633f64b8b4441' }))))));
     }
     static get is() { return "ix-radio"; }
     static get encapsulation() { return "shadow"; }

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

@@ -183,10 +183,10 @@ export class RadiobuttonGroup {
         nextRadio.focus();
     }
     render() {
-        return (h(Host, { key: '96ce8cbd3b252510f336800c67d90419103609be', onIxBlur: () => (this.touched = true), ref: this.groupRef, role: "radiogroup" }, h("ix-field-wrapper", { key: '248a9516790541bdacec10fd759344baa1337876', label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, isInvalid: this.isInvalid, controlRef: this.groupRef }, h("div", { key: '9fd29fcd02a5460b2466fc9b80171ed8cd5e39d0', class: {
+        return (h(Host, { key: 'cf5b18bd56a508fd420c9c3708e484e511b7fe0d', onIxBlur: () => (this.touched = true), ref: this.groupRef, role: "radiogroup" }, h("ix-field-wrapper", { key: '2337eef1982364f930394ab1d0493e990e836390', label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, isInvalid: this.isInvalid, controlRef: this.groupRef }, h("div", { key: 'e478c75175c239733f25e0f183d353b8bbbc07a5', class: {
                 'checkbox-container': true,
                 'row-layout': this.direction === 'row',
-            } }, h("slot", { key: '40619f7896a159433a1fc2ec8a398fd3ddfe15aa' })))));
+            } }, h("slot", { key: '136f6fd87c1f3d367cc5dff13040e7fa176726aa' })))));
     }
     static get is() { return "ix-radio-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/range-field/range-field.css

@@ -27,7 +27,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -36,37 +36,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host {

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

@@ -118,10 +118,10 @@ export class RangeField extends Mixin(...DefaultMixins) {
         requestAnimationFrameNoNgZone(() => secondElement.openPicker());
     }
     render() {
-        return (h(Host, { key: 'b0f8679efb64c79cb0896f4f6da02360cb712fd0', class: { 'hide-arrow': this.hideArrow }, role: "group" }, !this.hideArrow && (h("ix-icon", { key: 'ca058c6a86cc66f47a558e96cc0119041b02e603', "aria-hidden": "true", class: {
+        return (h(Host, { key: '39e0e73fb8615f11206cf7e9d296d3ec5c671017', class: { 'hide-arrow': this.hideArrow }, role: "group" }, !this.hideArrow && (h("ix-icon", { key: 'df1a75792a9d184e1e705fd2a93ffbc8068ce8d6', "aria-hidden": "true", class: {
                 'range-delimiter': true,
                 'has-label': this.hasLabel,
-            }, name: iconArrowRight })), h("slot", { key: '18e92d8e65c9fd215734fe0702b4728070d9e3d9' })));
+            }, name: iconArrowRight })), h("slot", { key: '8019b4ace67118363d86d719e3545419ddbad975' })));
     }
     static get is() { return "ix-range-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/row/row.js

@@ -12,7 +12,7 @@ import { h, Host } from "@stencil/core";
  */
 export class Row {
     render() {
-        return (h(Host, { key: '7c76876500cb51c2e200bc8e7fa70d74e4c33853' }, h("slot", { key: '40e1b394378241b5731916a4f0e858ad99d75074' })));
+        return (h(Host, { key: 'dc089e8a0a641e78f237510b27c5198fe23915a4' }, h("slot", { key: '92cb22bde2c9b89a4dc57d0a8fc2434886cabc72' })));
     }
     static get is() { return "ix-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/select.css

@@ -101,7 +101,7 @@
 :host *::before {
   box-sizing: border-box;
 }
-:host ::-webkit-scrollbar-button {
+:host *::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
@@ -110,37 +110,37 @@
     scrollbar-width: thin;
   }
 }
-:host {
+:host * {
   /* width */
 }
-:host ::-webkit-scrollbar {
+:host *::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host {
+:host * {
   /* Track */
 }
-:host ::-webkit-scrollbar-track {
+:host *::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host ::-webkit-scrollbar-track:hover {
+:host *::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host {
+:host * {
   /* Handle */
 }
-:host ::-webkit-scrollbar-thumb {
+:host *::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host {
+:host * {
   /* Handle on hover */
 }
-:host ::-webkit-scrollbar-thumb:hover {
+:host *::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host ::-webkit-scrollbar-corner {
+:host *::-webkit-scrollbar-corner {
   display: none;
 }
 :host .select {

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

@@ -21,7 +21,7 @@ import { forceUpdate, h, Host, Mixin, } from "@stencil/core";
 import { a11yBoolean } from "../utils/a11y";
 import { FocusProxy, PROXY_LIST_ID_SUFFIX, PROXY_LISTITEM_ID_SUFFIX, updateFocusProxyList, } from "../utils/focus/focus-proxy";
 import { IX_FOCUS_VISIBLE_ACTIVE, queryElements, } from "../utils/focus/focus-utilities";
-import { HookValidationLifecycle, } from "../utils/input";
+import { HookValidationLifecycle, NativeInputNotFoundError, } from "../utils/input";
 import { DefaultMixins } from "../utils/internal/component";
 import { AriaActiveDescendantMixin, } from "../utils/internal/mixins/accessibility/aria-activedescendant.mixin";
 import { ComponentIdMixin, } from "../utils/internal/mixins/id.mixin";
@@ -911,7 +911,7 @@ export class Select extends Mixin(...DefaultMixins, ComponentIdMixin, AriaActive
             return Promise.resolve(this.inputElement);
         }
         else {
-            return Promise.reject(new Error('Input element not found'));
+            return Promise.reject(new NativeInputNotFoundError());
         }
     }
     /**
@@ -987,18 +987,18 @@ export class Select extends Mixin(...DefaultMixins, ComponentIdMixin, AriaActive
         });
     }
     render() {
-        return (h(Host, { key: '9415e1e8af83d128ad9214824c182a9c03a70180', id: this.getHostElementId(), class: {
+        return (h(Host, { key: '12f066e4fcda30b4df4420847adfed06fa6eb51e', id: this.getHostElementId(), class: {
                 readonly: this.readonly,
                 disabled: this.disabled,
                 'show-focus-outline': this.hasInputFocus && !this.dropdownItemsVisualFocused,
-            }, tabIndex: this.disabled ? -1 : 0 }, h("ix-field-wrapper", { key: '36b59b412aab4e527f2e09c7b800344d4831436e', required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: '353d3300511ab5311f1359d8591d58ffa862c8d1', class: {
+            }, tabIndex: this.disabled ? -1 : 0 }, h("ix-field-wrapper", { key: 'ef30284c6d2bfe8c67bd61222aa4908b4533f6eb', required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: 'c28253243a825e85ef9ff8cc863ce407191f462d', class: {
                 select: true,
                 disabled: this.disabled,
                 readonly: this.readonly,
             }, ref: (ref) => {
                 this.dropdownAnchorRef(ref);
                 this.dropdownWrapperRef(ref);
-            } }, h("div", { key: '66708c6629d362e2187de9620b6a1386863c0fdf', class: "input-container" }, h("div", { key: 'b5c607cd3766f624d8c608a4eaeb31bea7d3d387', class: "chips", ref: this.chipsContainerRef }, this.isMultipleMode && this.renderMultipleModeChips(), h("div", { key: '84084dbaa7e87c16acd3ca2b487a60eb130f6cc7', class: "trigger" }, h("input", { key: 'f1f7203f87901eca257935c2a4729fd6e2e3db00', id: `${this.hostId}-input`, role: "combobox", "aria-controls": `${this.hostId}-proxy-listbox`, "aria-expanded": a11yBoolean(this.dropdownShow), "aria-autocomplete": "list", "aria-disabled": a11yBoolean(this.disabled), autocomplete: "off", "data-testid": "input", disabled: this.disabled, readOnly: this.readonly, required: this.required, type: "text", class: {
+            } }, h("div", { key: '841ae12c0dfbc999374644a4ec777f3de2c8e414', class: "input-container" }, h("div", { key: '46e892e8f13331dfb840f3f789dff9e0e94f7bf3', class: "chips", ref: this.chipsContainerRef }, this.isMultipleMode && this.renderMultipleModeChips(), h("div", { key: '3bf138f72a341dba37b522697ba357d8d735f0e2', class: "trigger" }, h("input", { key: '7630af0620fe089e9289794340a5a9a3571d877a', id: `${this.hostId}-input`, role: "combobox", "aria-controls": `${this.hostId}-proxy-listbox`, "aria-expanded": a11yBoolean(this.dropdownShow), "aria-autocomplete": "list", "aria-disabled": a11yBoolean(this.disabled), autocomplete: "off", "data-testid": "input", disabled: this.disabled, readOnly: this.readonly, required: this.required, type: "text", class: {
                 'allow-clear': this.allowClear && !!this.selectedLabels?.length,
             }, placeholder: this.placeholderValue(), value: this.inputValue ?? '', ref: (ref) => {
                 this.inputElement = ref;
@@ -1023,7 +1023,7 @@ export class Select extends Mixin(...DefaultMixins, ComponentIdMixin, AriaActive
                 element.ariaHidden = 'true';
             }, "data-select-dropdown": true, key: "dropdown", class: { 'dropdown-visible': this.dropdownShow }, icon: this.dropdownShow
                 ? iconChevronUpSmall
-                : iconChevronDownSmall, variant: "subtle-tertiary" }))))))), h("ix-dropdown", { key: '1339c822f5fe72b80e0080f9bdc0a157f74fe7ad', id: `${this.hostId}-listbox`, keyboardActivationKeys: ['ArrowUp', 'ArrowDown'], keyboardItemTriggerKeys: ['Enter'], disableFocusTrap: true, focusHost: this.hostElement, ref: this.dropdownRef, show: this.dropdownShow, closeBehavior: this.isMultipleMode ? 'outside' : 'both', hidden: this.disabled || this.readonly, anchor: this.dropdownAnchorRef.waitForCurrent(), trigger: this.dropdownWrapperRef.waitForCurrent(), onShowChange: (event) => {
+                : iconChevronDownSmall, variant: "subtle-tertiary" }))))))), h("ix-dropdown", { key: '98815c0cc3ab87dea8cbba41b0285eef62ae3e50', id: `${this.hostId}-listbox`, keyboardActivationKeys: ['ArrowUp', 'ArrowDown'], keyboardItemTriggerKeys: ['Enter'], disableFocusTrap: true, focusHost: this.hostElement, ref: this.dropdownRef, show: this.dropdownShow, closeBehavior: this.isMultipleMode ? 'outside' : 'both', hidden: this.disabled || this.readonly, anchor: this.dropdownAnchorRef.waitForCurrent(), trigger: this.dropdownWrapperRef.waitForCurrent(), onShowChange: (event) => {
                 if ((this.disabled || this.readonly) && event.detail) {
                     event.preventDefault();
                 }
@@ -1062,16 +1062,16 @@ export class Select extends Mixin(...DefaultMixins, ComponentIdMixin, AriaActive
                 if (this.isSingleMode) {
                     this.dropdownShow = false;
                 }
-            } }, h("div", { key: 'df5024089e37d2a0416dd42d3e5c8c5c07ac5f4c', "aria-hidden": "true", class: {
+            } }, h("div", { key: '99bce854b460b54621001ae07fc9f36d10684df8', "aria-hidden": "true", class: {
                 'select-list-header': true,
                 hidden: this.hideListHeader || this.isDropdownEmpty,
-            }, title: this.i18nSelectListHeader, onClick: (e) => e.preventDefault() }, this.i18nSelectListHeader), h("slot", { key: 'b9d758bf0a6c7452ab9e626f37c9fbb5b0a74dfc', onSlotchange: () => {
+            }, title: this.i18nSelectListHeader, onClick: (e) => e.preventDefault() }, this.i18nSelectListHeader), h("slot", { key: '49916fd0b14b1ff8a0b8f00cf2133c6f08c94a80', onSlotchange: () => {
                 this.updateSelection();
-            } }), h(FocusProxy, { key: 'a4bb5eed7ee4ab735ecf0141fc32c69df8c8d57c', hostId: this.hostId, otherProps: {
+            } }), h(FocusProxy, { key: 'f09bdadcc1c886ef78299322f3318eaf2ca0ccd2', hostId: this.hostId, otherProps: {
                 'aria-hidden': a11yBoolean(!this.dropdownShow),
                 'aria-multiselectable': a11yBoolean(this.isMultipleMode),
                 hidden: this.disabled || this.readonly,
-            } }), this.isDropdownEmpty && !this.editable && (h("div", { key: '926fa88d0788351f0f2e865fe4ced2bb8422a43d', class: "select-list-header" }, this.i18nNoMatches))), this.isMultipleMode &&
+            } }), this.isDropdownEmpty && !this.editable && (h("div", { key: '70c18c30db4dc6af1c84b6a4a81fbb133cf02a1b', class: "select-list-header" }, this.i18nNoMatches))), this.isMultipleMode &&
             !this.shouldDisplayAllChip() &&
             this.hiddenChipValues.length > 0 &&
             this.renderOverflowDropdown()));

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

@@ -85,9 +85,9 @@ export class SelectItem extends Mixin(...DefaultMixins, FocusVisibleMixin, Compo
             ...this.inheritAriaAttributes,
             'aria-label': this.inheritAriaAttributes['aria-label'] ?? this.label,
         };
-        return (h(Host, { key: 'adb8da016414dafc839fff44acbe5dd7d254c188', ...ariaAttributes, id: this.getHostElementId(), disableAriaSelectHandling: true, class: {
+        return (h(Host, { key: 'de5fffd688bd95f90e52834f2fb64bd27ccb058e', ...ariaAttributes, id: this.getHostElementId(), disableAriaSelectHandling: true, class: {
                 [IX_FOCUS_VISIBLE]: true,
-            }, "aria-hidden": "true", role: "presentation" }, h("ix-dropdown-item", { key: '156824791385b920b04cb389553e020cf3f3183b', "aria-hidden": "true", itemRole: "option", class: {
+            }, "aria-hidden": "true", role: "presentation" }, h("ix-dropdown-item", { key: '095b16a14ef831cf00021f8078124f3885673891', "aria-hidden": "true", itemRole: "option", class: {
                 'select-item-checked': this.selected,
                 [IX_FOCUS_VISIBLE_ACTIVE]: this.ixFocusVisible,
             }, checked: this.selected, disabled: this.disabled, label: this.label ? this.label : this.value, ref: this.dropdownItemRef })));