@siemens/ix 5.2.0 → 5.2.1

package/dist/esm/ix-date-dropdown.entry.js

@@ -4,8 +4,8 @@ import { D as DateTime } from './datetime-D1WplX1z.js';
 import { D as DefaultMixins, h as hasKeyboardMode } from './component-DqJSHc3A.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { r as requestAnimationFrameNoNgZone } from './requestAnimationFrame-BEuV0Xpe.js';
-import { B as BaseButton } from './base-button-DZdtpLxn.js';
-import { b as a11yHostAttributes, a as a11yBoolean } from './a11y-C21npbUc.js';
+import { B as BaseButton } from './base-button-Oanl-VqF.js';
+import { b as a11yHostAttributes, a as a11yBoolean } from './a11y-DD206pTM.js';
 import { T as TRAP_FOCUS_EXCLUDE_ATTRIBUTE } from './focus-trap-IK9ialav.js';
 import './focus-utilities-6ZxKp7Jn.js';
 import './shadow-dom-BClJdFQP.js';
@@ -235,7 +235,7 @@ const DateDropdown = class extends Mixin(...DefaultMixins) {
                     return;
                 }
                 this.closeDropdown();
-            }, role: "presentation" }, h("ix-button", { key: 'a457c4586b7d426cb3177b13ada395cd142c554c', "data-testid": "date-dropdown-trigger", "data-date-dropdown-trigger": true, variant: this.variant, loading: this.loading, icon: iconHistory, ref: this.triggerRef, disabled: this.disabled, ...this.inheritAriaAttributes, "aria-haspopup": "true", "aria-expanded": a11yBoolean(this.show), "aria-controls": "date-dropdown", "aria-label": ariaLabel, [TRAP_FOCUS_EXCLUDE_ATTRIBUTE]: true }, this.getButtonLabel()), h("ix-dropdown", { key: '4843647a409bf919d4221187eeb4fb9285a53f0e', focusTrapOptions: {
+            }, role: "presentation" }, h("ix-button", { key: '9de1225750e827a48370d77b643accbf717b5c90', "data-testid": "date-dropdown-trigger", "data-date-dropdown-trigger": true, class: { active: this.show }, variant: this.variant, loading: this.loading, icon: iconHistory, ref: this.triggerRef, disabled: this.disabled, ...this.inheritAriaAttributes, "aria-haspopup": "true", "aria-expanded": a11yBoolean(this.show), "aria-controls": "date-dropdown", "aria-label": ariaLabel, [TRAP_FOCUS_EXCLUDE_ATTRIBUTE]: true }, this.getButtonLabel()), h("ix-dropdown", { key: '5adea2a62d0f2936c7f414d07e4b215fa46013c7', focusTrapOptions: {
                 excludeElements: true,
                 trapFocusInShadowDom: true,
             }, focusHost: this.hostElement, id: "date-dropdown", "data-testid": "date-dropdown", "data-date-dropdown": true, class: "min-width max-height", trigger: this.triggerRef.waitForCurrent(), closeBehavior: "outside", placement: "bottom-start", enableTopLayer: this.enableTopLayer, suppressOverflowBehavior: true, onShowChanged: async ({ detail: show }) => {
@@ -249,18 +249,18 @@ const DateDropdown = class extends Mixin(...DefaultMixins) {
                         datePicker?.focus();
                     });
                 }
-            } }, h("div", { key: 'b56022ada38073e8f0eb41e45fe77ff9e7266619', class: "container" }, this.dateRangeOptions?.length > 1 && (h("div", { key: '08899447b48dbb8e0a9afd9869611694f859de8c', class: {
+            } }, h("div", { key: '529789401a81e427362891c8067dceef2d792ccd', class: "container" }, this.dateRangeOptions?.length > 1 && (h("div", { key: '37357e44ca576b728da92a56b168441660298ad3', class: {
                 'quick-selection': true,
                 'border-right': this.selectedDateRangeId === 'custom',
             } }, this.dateRangeOptions.map((dateRangeOption) => (h(BaseButton, { disabled: false, iconOnly: false, iconOval: false, selected: false, loading: false, type: "button", variant: "subtle-tertiary", onClick: () => this.onRangeListSelect(dateRangeOption.id), ariaAttributes: {
                 'aria-label': `${dateRangeOption.label}: ${dateRangeOption.from} to ${dateRangeOption.to}`,
-            } }, dateRangeOption.label))))), h("div", { key: '8c61f1698346dcbd76f6ac011c54c0034b19db70', class: "picker-wrapper" }, h("ix-date-picker", { key: 'd9f6d28e64a07aedd2f66a5edbb8c470e908b87e', ref: this.datePickerRef, embedded: true, locale: this.locale, onDateChange: (e) => {
+            } }, dateRangeOption.label))))), h("div", { key: '78ba6a786dd6c0f4eab6158c44bca11d8ee3b8a5', class: "picker-wrapper" }, h("ix-date-picker", { key: '17bd8255602531babe2f71e2db5ffac8bb2b7b2f', ref: this.datePickerRef, embedded: true, locale: this.locale, onDateChange: (e) => {
                 e.stopPropagation();
                 this.currentRangeValue = {
                     ...e.detail,
                     id: 'custom',
                 };
-            }, onDateRangeChange: (e) => e.stopPropagation(), format: this.format, singleSelection: this.singleSelection, from: this.from || this.currentRangeValue?.from, to: this.to || this.currentRangeValue?.to, minDate: this.minDate, maxDate: this.maxDate, today: this.today, weekStartIndex: this.weekStartIndex, showWeekNumbers: this.showWeekNumbers }), h("div", { key: '1dc08213a7637d97a129484b84206f9c030448fd', class: "pull-right" }, h("ix-button", { key: 'fcdcc6e21a4aad47466ce6354d75286eed642081', onClick: () => {
+            }, onDateRangeChange: (e) => e.stopPropagation(), format: this.format, singleSelection: this.singleSelection, from: this.from || this.currentRangeValue?.from, to: this.to || this.currentRangeValue?.to, minDate: this.minDate, maxDate: this.maxDate, today: this.today, weekStartIndex: this.weekStartIndex, showWeekNumbers: this.showWeekNumbers }), h("div", { key: 'bedbd4ed054f58030718054a601b0ba9215ded11', class: "pull-right" }, h("ix-button", { key: '05cb78d1a4e407390c00abad740a4516b6fd10fb', onClick: () => {
                 if (this.currentRangeValue) {
                     this.onDateSelect(this.currentRangeValue);
                     this.closeDropdown();

package/dist/esm/ix-date-input.entry.js

@@ -1,16 +1,16 @@
 import { M as Mixin, r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-EBgS4zhE.js';
 import { D as iconCalendar } from './index-BeX6RWvV.js';
 import { D as DateTime } from './datetime-D1WplX1z.js';
-import { c as createPickerValidityStateTracker, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, h as handleSubmitOnEnterKeydown, S as SlotEnd, o as onInputBlurWithChange, d as SlotStart, e as emitPickerValidityState } from './input.fc-DliqEtCM.js';
+import { c as createPickerValidityStateTracker, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, h as handleSubmitOnEnterKeydown, S as SlotEnd, o as onInputBlurWithChange, d as SlotStart, e as emitPickerValidityState } from './input.fc-Cwmx0lGN.js';
 import { I as InputPickerMixin, h as handleIconClick, o as openDropdown, c as closeDropdown, a as createValidityState } from './input-picker.mixin-DudWFH-e.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { D as DefaultMixins, h as hasKeyboardMode } from './component-DqJSHc3A.js';
-import { f as forceTabIndex } from './a11y-C21npbUc.js';
+import { f as forceTabIndex } from './a11y-DD206pTM.js';
 import { c as createClassMutationObserver, g as getValidationText, H as HookValidationLifecycle } from './validation-DXpftrw5.js';
 import './mutation-observer-CX81WQtk.js';
 import './rwd.util-JJddxCCh.js';
 import './anime.esm-DhE1t8Qh.js';
-import './animation-DNIQ2C1K.js';
+import './animation-BqeSHO6C.js';
 import './dropdown-controller-Jfg3ZWk6.js';
 import './path-utils-CNLoALIl.js';
 import './focus-utilities-6ZxKp7Jn.js';

package/dist/esm/ix-date-picker.entry.js

@@ -186,8 +186,8 @@ const DatePicker = class extends Mixin(...DefaultMixins) {
     tempMonth = 0;
     yearDropdownButtonRef = makeRef();
     yearMonthSelectionDropdownRef = makeRef();
-    dayNames;
-    monthNames;
+    dayNames = [];
+    monthNames = [];
     focusedDay = 1;
     isDayFocus = false;
     monthChangedFromFocus = false;
@@ -656,7 +656,11 @@ const DatePicker = class extends Mixin(...DefaultMixins) {
         });
     }
     async intersect(entries) {
-        const container = await this.yearDropdownButtonRef.current.getDropdownReference();
+        const yearDropdownButton = this.yearDropdownButtonRef.current;
+        if (!yearDropdownButton) {
+            return;
+        }
+        const container = await yearDropdownButton.getDropdownReference();
         entries.forEach((entry) => {
             const target = entry.target;
             if (entry.isIntersecting) {
@@ -680,21 +684,21 @@ const DatePicker = class extends Mixin(...DefaultMixins) {
     intersectStart = new IntersectionObserver((entries) => this.intersect(entries), { threshold: 0.5 });
     intersectEnd = new IntersectionObserver((entries) => this.intersect(entries), { threshold: 0.5 });
     render() {
-        return (h(Host, { key: '7de4a5edbe8988dcae7cd6f640ca4d5db58515f5', onKeyDown: (event) => this.onKeyDown(event), onFocusin: () => {
+        return (h(Host, { key: 'd3069d1895021eafcdbf31b1e3efb3fc9c9bd45c', onKeyDown: (event) => this.onKeyDown(event), onFocusin: () => {
                 if (hasKeyboardMode()) {
                     this.changeFocusedDay();
                 }
-            } }, h("ix-date-time-card", { key: 'efae993810b8c99e7093d99afff4585ad157f09d', corners: this.corners, embedded: this.embedded }, h("div", { key: 'b242490e8a186d2891c9f03d167ced3814af2be3', class: "header", slot: "header" }, h("ix-icon-button", { key: '23980a73c3296a4346d545c6ef6d34759a228f9f', onClick: () => this.changeCalendarView(-1), icon: iconChevronLeftSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelPreviousMonthButton }), h("div", { key: 'ef74172fffd395ae5dd84b926b6ad6ecd07bfc18', class: "selector" }, h("ix-dropdown-button", { key: '40c5bd62bf2600880a003d90b889c9fd9e54e146', class: "month-selector", focusCheckedItem: true, "aria-label": this.ariaLabelMonthSelection, variant: "tertiary", label: null, onShowChanged: (event) => {
+            } }, h("ix-date-time-card", { key: '565f344168f3cd6d5ec6cf52c995986069b8b283', corners: this.corners, embedded: this.embedded }, h("div", { key: '0736fee99626beb804c8cc12029fe54e7d548e2b', class: "header", slot: "header" }, h("ix-icon-button", { key: 'f7a6a2cf70bcc64d3c302b7030b6d3d6576e0f2a', onClick: () => this.changeCalendarView(-1), icon: iconChevronLeftSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelPreviousMonthButton }), h("div", { key: '74181a640e8fc12a42b5e781a7c34e181cf1eb8a', class: "selector" }, h("ix-dropdown-button", { key: '4cf5f39ae313b65da3e2ac5a5fa52ccb82122e6d', class: "month-selector", focusCheckedItem: true, "aria-label": this.ariaLabelMonthSelection, variant: "tertiary", label: null, onShowChanged: (event) => {
                 // Need to stop event propagation to trigger initial focus handling of the calendar days
                 event.stopPropagation();
-            } }, h("ix-typography", { key: 'f1a415a1bef4f302de05582bf053c052bad0505a', bold: true, class: "capitalize", slot: "button-label" }, this.monthNames[this.selectedMonth]), this.renderMonths()), h("ix-dropdown-button", { key: 'ce5a5b993fd02564d0104e13764418682a77acc4', class: "year-selector", focusCheckedItem: true, "aria-label": this.ariaLabelYearSelection, ref: this.yearDropdownButtonRef, variant: "tertiary", label: null, onShowChanged: (event) => {
+            } }, h("ix-typography", { key: 'b2faf7ed035bbb6fdd6340b670293c8e0ca1621b', bold: true, class: "capitalize", slot: "button-label" }, this.monthNames[this.selectedMonth]), this.renderMonths()), h("ix-dropdown-button", { key: '4dbdfb735fb5f515968e631575c92e1163a25e1b', class: "year-selector", focusCheckedItem: true, "aria-label": this.ariaLabelYearSelection, ref: this.yearDropdownButtonRef, variant: "tertiary", label: null, onShowChanged: (event) => {
                 // Need to stop event propagation to trigger initial focus handling of the calendar days
                 event.stopPropagation();
                 if (event.detail) {
                     requestAnimationFrameNoNgZone(() => {
                         this.intersectStart.observe(this.hostElement.shadowRoot.querySelector('[data-sentinel="top"]'));
                         this.intersectEnd.observe(this.hostElement.shadowRoot.querySelector('[data-sentinel="bottom"]'));
-                        const selectedYearItem = this.yearDropdownButtonRef.current.querySelector('ix-dropdown-item[checked]');
+                        const selectedYearItem = this.yearDropdownButtonRef.current?.querySelector('ix-dropdown-item[checked]');
                         if (!selectedYearItem) {
                             return;
                         }
@@ -709,10 +713,10 @@ const DatePicker = class extends Mixin(...DefaultMixins) {
                     this.intersectStart.disconnect();
                     this.intersectEnd.disconnect();
                 }
-            } }, h("div", { key: 'd7d93c944877c170728b0aa41085a0ebdf657eac', class: "infinite-scrolling-spacer" }, h("div", { key: '9bdd838a9750150065141302e1e4a5aeaf8b58cc', class: "sentinel", "data-sentinel": "top" })), h("ix-typography", { key: 'f7adff586df01462d4e164d14f95f85dedb0e63d', bold: true, class: "capitalize", slot: "button-label" }, this.selectedYear), this.renderYears(), h("div", { key: '1b0db1dd2e77538f2a052272afc10bee207d35b9', class: "infinite-scrolling-spacer" }, h("div", { key: '1a324d048c46a7b7a1320f76255c6f251fa7ffe6', class: "sentinel", "data-sentinel": "bottom" })))), h("ix-icon-button", { key: '622614d0cf6eea4b960a69d40fbaee1558c457e7', onClick: () => this.changeCalendarView(1), icon: iconChevronRightSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelNextMonthButton })), h("div", { key: '468b8b1a645c376fee7a33f153fc01c24174a048', role: "grid", class: {
+            } }, h("div", { key: '6bff1627c2ae988c2cec43c0fab19301afe0d4b2', class: "infinite-scrolling-spacer" }, h("div", { key: '65649d41658fea52c472ae4a7be9b2049324012a', class: "sentinel", "data-sentinel": "top" })), h("ix-typography", { key: '845eaf9a759948f682bea5ac32cbff69a7911db9', bold: true, class: "capitalize", slot: "button-label" }, this.selectedYear), this.renderYears(), h("div", { key: '4b8886f3383301fce14c4c82a36a322a16bab48d', class: "infinite-scrolling-spacer" }, h("div", { key: '2ed935b2f11cb117b6ed10f4458ecc4d7b3466aa', class: "sentinel", "data-sentinel": "bottom" })))), h("ix-icon-button", { key: '6744bb35c08d528c1455c737823443f786739b87', onClick: () => this.changeCalendarView(1), icon: iconChevronRightSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelNextMonthButton })), h("div", { key: '65e864e3df6b3f4c725337c13c302ae4f4d29904', role: "grid", class: {
                 grid: true,
                 'grid--show-week-numbers': this.showWeekNumbers,
-            } }, h("div", { key: '1aef3ab46c009c831c0a46663490dcac49b3f857', role: "row" }, this.showWeekNumbers && (h("div", { key: '179664fef0ad9939184a6b9247931cb311f2cc8f', class: "calendar-item week-day", role: "columnheader" })), this.dayNames.map((name) => (h("div", { key: name, class: "calendar-item week-day", role: "columnheader" }, h("div", { class: "overflow" }, name.slice(0, 3)))))), this.calendar.map((week) => {
+            } }, h("div", { key: '061afbad3742cbeba3564b06667414ac05c37461', role: "row" }, this.showWeekNumbers && (h("div", { key: '9f223211778fcef3281a0fc11ab2ddfb40c66670', class: "calendar-item week-day", role: "columnheader" })), this.dayNames.map((name) => (h("div", { key: name, class: "calendar-item week-day", role: "columnheader" }, h("div", { class: "overflow" }, name.slice(0, 3)))))), this.calendar.map((week) => {
             return (h("div", { role: "row" }, this.showWeekNumbers && (h("div", { class: "calendar-item week-number", role: "rowheader" }, week.weekNumber)), week.dayNumbers.map((day) => {
                 return day ? (h("div", { role: "gridcell", "aria-selected": this.getUtilitiesBasedOnDay(day).isSelected()
                         ? 'true'
@@ -727,10 +731,10 @@ const DatePicker = class extends Mixin(...DefaultMixins) {
                         }
                     }, tabIndex: day === this.focusedDay ? 0 : -1, autofocus: this.getUtilitiesBasedOnDay(day).isToday(), onFocus: () => this.onDayFocus(), onBlur: () => this.onDayBlur(), "aria-label": `${day} ${Info.months()[this.selectedMonth]} ${this.selectedYear}` }, day)) : (h("div", { role: "gridcell" }));
             })));
-        })), h("div", { key: '64236c8cacbf0c467b6da51e9540e966076f1d46', class: {
+        })), h("div", { key: 'f4e2619893fdf4d3c4a6ba2b514a03285a9a145f', class: {
                 button: true,
                 hidden: this.singleSelection || this.embedded,
-            } }, h("ix-button", { key: 'd0bd805434cbb01e8dbbed9fb539ee647b87ead4', hidden: this.singleSelection || this.embedded, onClick: () => this.onDone() }, this.i18nDone)))));
+            } }, h("ix-button", { key: 'a907377384cc521a7302a4adc7a4076a9befbc38', hidden: this.singleSelection || this.embedded, onClick: () => this.onDone() }, this.i18nDone)))));
     }
     static get delegatesFocus() { return true; }
     static get watchers() { return {

package/dist/esm/ix-datetime-input.entry.js

@@ -1,18 +1,18 @@
 import { M as Mixin, r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-EBgS4zhE.js';
 import { D as iconCalendar } from './index-BeX6RWvV.js';
 import { D as DateTime } from './datetime-D1WplX1z.js';
-import { c as createPickerValidityStateTracker, h as handleSubmitOnEnterKeydown, e as emitPickerValidityState, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, S as SlotEnd, f as onInputFocus, o as onInputBlurWithChange, d as SlotStart } from './input.fc-DliqEtCM.js';
+import { c as createPickerValidityStateTracker, h as handleSubmitOnEnterKeydown, e as emitPickerValidityState, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, S as SlotEnd, f as onInputFocus, o as onInputBlurWithChange, d as SlotStart } from './input.fc-Cwmx0lGN.js';
 import { g as getTimePickerConstraintBounds, i as isWithinTimePickerConstraints } from './time-picker-constraints-Bsg2RskF.js';
 import { I as InputPickerMixin, h as handleIconClick, o as openDropdown, c as closeDropdown, a as createValidityState } from './input-picker.mixin-DudWFH-e.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { g as getLuxonDateOnlyFormatMask, a as getLuxonTimeFormatMask } from './luxon-datetime-format-masks-CoQiziG8.js';
 import { D as DefaultMixins } from './component-DqJSHc3A.js';
 import { c as createClassMutationObserver, g as getValidationText, H as HookValidationLifecycle } from './validation-DXpftrw5.js';
-import './a11y-C21npbUc.js';
+import './a11y-DD206pTM.js';
 import './mutation-observer-CX81WQtk.js';
 import './rwd.util-JJddxCCh.js';
 import './anime.esm-DhE1t8Qh.js';
-import './animation-DNIQ2C1K.js';
+import './animation-BqeSHO6C.js';
 import './dropdown-controller-Jfg3ZWk6.js';
 import './path-utils-CNLoALIl.js';
 import './focus-utilities-6ZxKp7Jn.js';

package/dist/esm/ix-dropdown-button.entry.js

@@ -1,6 +1,6 @@
 import { M as Mixin, r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-EBgS4zhE.js';
 import { G as iconChevronUpSmall, t as iconChevronDownSmall } from './index-BeX6RWvV.js';
-import { b as a11yHostAttributes, f as forceTabIndex, a as a11yBoolean } from './a11y-C21npbUc.js';
+import { b as a11yHostAttributes, f as forceTabIndex, a as a11yBoolean } from './a11y-DD206pTM.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { D as DefaultMixins } from './component-DqJSHc3A.js';
 import { A as AriaActiveDescendantMixin } from './aria-activedescendant.mixin-CM-NUHTW.js';
@@ -8,7 +8,7 @@ import { C as ComponentIdMixin } from './id.mixin-CUbYLenp.js';
 import { c as closestPassShadow } from './shadow-dom-BClJdFQP.js';
 import './focus-utilities-6ZxKp7Jn.js';
 
-const dropdownButtonCss = () => `:host{--ix-dropdown-button-border-radius:var(--theme-btn--border-radius);--ix-dropdown-button-focus-outline-color:var(--theme-color-focus-bdr);--ix-dropdown-button-focus-outline-offset:var(     --theme-btn--focus--outline-offset   );--ix-dropdown-button-primary-color:var(--theme-btn-primary--color);--ix-dropdown-button-primary-color-disabled:var(     --theme-btn-primary--color--disabled   );--ix-dropdown-button-primary-background-active:var(     --theme-btn-primary--background--active   );--ix-dropdown-button-primary-color-active:var(     --theme-btn-primary--color--active   );--ix-dropdown-button-primary-border-color-active:var(     --theme-btn-primary--border-color--active   );--ix-dropdown-button-secondary-color:var(--theme-btn-secondary--color);--ix-dropdown-button-secondary-color-disabled:var(     --theme-btn-secondary--color--disabled   );--ix-dropdown-button-secondary-background-active:var(     --theme-btn-secondary--background--active   );--ix-dropdown-button-secondary-color-active:var(     --theme-btn-secondary--color--active   );--ix-dropdown-button-secondary-border-color-active:var(     --theme-btn-secondary--border-color--active   );--ix-dropdown-button-tertiary-color:var(--theme-btn-tertiary--color);--ix-dropdown-button-tertiary-color-disabled:var(     --theme-btn-tertiary--color--disabled   );--ix-dropdown-button-tertiary-background-active:var(     --theme-btn-tertiary--background--active   );--ix-dropdown-button-tertiary-color-active:var(     --theme-btn-tertiary--color--active   );--ix-dropdown-button-tertiary-border-color-active:var(     --theme-btn-tertiary--border-color--active   );--ix-dropdown-button-subtle-primary-color:var(--theme-btn-subtle-primary--color);--ix-dropdown-button-subtle-primary-color-disabled:var(     --theme-btn-subtle-primary--color--disabled   );--ix-dropdown-button-subtle-primary-background-active:var(     --theme-btn-subtle-primary--background--active   );--ix-dropdown-button-subtle-primary-color-active:var(     --theme-btn-subtle-primary--color--active   );--ix-dropdown-button-subtle-primary-border-color-active:var(     --theme-btn-subtle-primary--border-color--active   );--ix-dropdown-button-subtle-secondary-color:var(--theme-btn-subtle-secondary--color);--ix-dropdown-button-subtle-secondary-color-disabled:var(     --theme-btn-subtle-secondary--color--disabled   );--ix-dropdown-button-subtle-secondary-background-active:var(     --theme-btn-subtle-secondary--background--active   );--ix-dropdown-button-subtle-secondary-color-active:var(     --theme-btn-subtle-secondary--color--active   );--ix-dropdown-button-subtle-secondary-border-color-active:var(     --theme-btn-subtle-secondary--border-color--active   );--ix-dropdown-button-subtle-tertiary-color:var(--theme-btn-subtle-tertiary--color);--ix-dropdown-button-subtle-tertiary-color-disabled:var(     --theme-btn-subtle-tertiary--color--disabled   );--ix-dropdown-button-subtle-tertiary-background-active:var(     --theme-btn-subtle-tertiary--background--active   );--ix-dropdown-button-subtle-tertiary-color-active:var(     --theme-btn-subtle-tertiary--color--active   );--ix-dropdown-button-subtle-tertiary-border-color-active:var(     --theme-btn-subtle-tertiary--border-color--active   );--ix-dropdown-button-danger-primary-color:var(--theme-btn-danger-primary--color);--ix-dropdown-button-danger-primary-color-disabled:var(     --theme-btn-danger-primary--color--disabled   );--ix-dropdown-button-danger-primary-background-active:var(     --theme-btn-danger-primary--background--active   );--ix-dropdown-button-danger-primary-color-active:var(     --theme-btn-danger-primary--color--active   );--ix-dropdown-button-danger-primary-border-color-active:var(     --theme-btn-danger-primary--border-color--active   );--ix-dropdown-button-danger-secondary-color:var(--theme-btn-danger-secondary--color);--ix-dropdown-button-danger-secondary-color-disabled:var(     --theme-btn-danger-secondary--color--disabled   );--ix-dropdown-button-danger-secondary-background-active:var(     --theme-btn-danger-secondary--background--active   );--ix-dropdown-button-danger-secondary-color-active:var(     --theme-btn-danger-secondary--color--active   );--ix-dropdown-button-danger-secondary-border-color-active:var(     --theme-btn-danger-secondary--border-color--active   );--ix-dropdown-button-danger-tertiary-color:var(--theme-btn-danger-tertiary--color);--ix-dropdown-button-danger-tertiary-color-disabled:var(     --theme-btn-danger-tertiary--color--disabled   );--ix-dropdown-button-danger-tertiary-background-active:var(     --theme-btn-danger-tertiary--background--active   );--ix-dropdown-button-danger-tertiary-color-active:var(     --theme-btn-danger-tertiary--color--active   );--ix-dropdown-button-danger-tertiary-border-color-active:var(     --theme-btn-danger-tertiary--border-color--active   )}:host{display:inline-block;position:relative;height:2rem;width:auto;--ix-dropdown-button-border-radius-left:var(     --ix-dropdown-button-border-radius   );--ix-dropdown-button-border-radius-right:var(     --ix-dropdown-button-border-radius   );border-top-left-radius:var(--ix-dropdown-button-border-radius-left);border-bottom-left-radius:var(--ix-dropdown-button-border-radius-left);border-top-right-radius:var(--ix-dropdown-button-border-radius-right);border-bottom-right-radius:var(--ix-dropdown-button-border-radius-right)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host *::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host *{}:host *::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host *{}:host *::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host *::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host *{}:host *::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host *{}:host *::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host *::-webkit-scrollbar-corner{display:none}:host .hide{display:none}:host ix-button,:host ix-icon-button{--ix-button-border-radius-left:var(     --ix-dropdown-button-border-radius-left   );--ix-button-border-radius-right:var(     --ix-dropdown-button-border-radius-right   )}:host .dropdown-button{display:block;position:relative;width:100%;height:100%}:host .dropdown-button>ix-button{width:100%;height:100%}:host .dropdown-button .button-label{margin-right:auto;min-width:0px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .dropdown-button .dropdown-icon{margin-right:0.25rem}:host .triangle{position:absolute;margin-inline-start:1.5625rem;margin-block-start:-0.4375rem;border-right:0 solid transparent;border-left:4px solid transparent;border-top:0 solid transparent;border-bottom:4px solid;color:var(--ix-dropdown-button-primary-color)}:host .triangle.primary{color:var(--ix-dropdown-button-primary-color)}:host .triangle.secondary{color:var(--ix-dropdown-button-secondary-color)}:host .triangle.tertiary{color:var(--ix-dropdown-button-tertiary-color)}:host .triangle.primary.disabled{color:var(--ix-dropdown-button-primary-color-disabled)}:host .triangle.secondary.disabled{color:var(--ix-dropdown-button-secondary-color-disabled)}:host .triangle.tertiary.disabled{color:var(--ix-dropdown-button-tertiary-color-disabled)}:host .triangle.subtle-primary{color:var(--ix-dropdown-button-subtle-primary-color)}:host .triangle.subtle-secondary{color:var(--ix-dropdown-button-subtle-secondary-color)}:host .triangle.subtle-tertiary{color:var(--ix-dropdown-button-subtle-tertiary-color)}:host .triangle.subtle-primary.disabled{color:var(--ix-dropdown-button-subtle-primary-color-disabled)}:host .triangle.subtle-secondary.disabled{color:var(--ix-dropdown-button-subtle-secondary-color-disabled)}:host .triangle.subtle-tertiary.disabled{color:var(--ix-dropdown-button-subtle-tertiary-color-disabled)}:host .triangle.danger-primary{color:var(--ix-dropdown-button-danger-primary-color)}:host .triangle.danger-secondary{color:var(--ix-dropdown-button-danger-secondary-color)}:host .triangle.danger-tertiary{color:var(--ix-dropdown-button-danger-tertiary-color)}:host .triangle.danger-primary.disabled{color:var(--ix-dropdown-button-danger-primary-color-disabled)}:host .triangle.danger-secondary.disabled{color:var(--ix-dropdown-button-danger-secondary-color-disabled)}:host .triangle.danger-tertiary.disabled{color:var(--ix-dropdown-button-danger-tertiary-color-disabled)}:host .content{display:flex;align-items:center}:host .remove-button-min-width{min-width:0px}:host(.host-context-date-picker) .internal-button,:host(.host-context-breadcrumb) .internal-button{min-width:0px;padding:0}:host(.host-context-date-picker) ix-dropdown{max-height:15.625rem;overflow-y:scroll}:host(:focus-visible){outline:1px solid var(--ix-dropdown-button-focus-outline-color);outline-offset:var(--ix-dropdown-button-focus-outline-offset)}:host([aria-expanded=true]){--theme-btn-primary--background:var(     --ix-dropdown-button-primary-background-active   );--theme-btn-primary--background--hover:var(     --ix-dropdown-button-primary-background-active   );--theme-btn-primary--color:var(--ix-dropdown-button-primary-color-active);--theme-btn-primary--color--hover:var(     --ix-dropdown-button-primary-color-active   );--theme-btn-primary--border-color:var(     --ix-dropdown-button-primary-border-color-active   );--theme-btn-primary--border-color--hover:var(     --ix-dropdown-button-primary-border-color-active   );--theme-btn-secondary--background:var(     --ix-dropdown-button-secondary-background-active   );--theme-btn-secondary--background--hover:var(     --ix-dropdown-button-secondary-background-active   );--theme-btn-secondary--color:var(--ix-dropdown-button-secondary-color-active);--theme-btn-secondary--color--hover:var(     --ix-dropdown-button-secondary-color-active   );--theme-btn-secondary--border-color:var(     --ix-dropdown-button-secondary-border-color-active   );--theme-btn-secondary--border-color--hover:var(     --ix-dropdown-button-secondary-border-color-active   );--theme-btn-tertiary--background:var(     --ix-dropdown-button-tertiary-background-active   );--theme-btn-tertiary--background--hover:var(     --ix-dropdown-button-tertiary-background-active   );--theme-btn-tertiary--color:var(--ix-dropdown-button-tertiary-color-active);--theme-btn-tertiary--color--hover:var(     --ix-dropdown-button-tertiary-color-active   );--theme-btn-tertiary--border-color:var(     --ix-dropdown-button-tertiary-border-color-active   );--theme-btn-tertiary--border-color--hover:var(     --ix-dropdown-button-tertiary-border-color-active   );--theme-btn-subtle-primary--background:var(     --ix-dropdown-button-subtle-primary-background-active   );--theme-btn-subtle-primary--background--hover:var(     --ix-dropdown-button-subtle-primary-background-active   );--theme-btn-subtle-primary--color:var(--ix-dropdown-button-subtle-primary-color-active);--theme-btn-subtle-primary--color--hover:var(     --ix-dropdown-button-subtle-primary-color-active   );--theme-btn-subtle-primary--border-color:var(     --ix-dropdown-button-subtle-primary-border-color-active   );--theme-btn-subtle-primary--border-color--hover:var(     --ix-dropdown-button-subtle-primary-border-color-active   );--theme-btn-subtle-secondary--background:var(     --ix-dropdown-button-subtle-secondary-background-active   );--theme-btn-subtle-secondary--background--hover:var(     --ix-dropdown-button-subtle-secondary-background-active   );--theme-btn-subtle-secondary--color:var(--ix-dropdown-button-subtle-secondary-color-active);--theme-btn-subtle-secondary--color--hover:var(     --ix-dropdown-button-subtle-secondary-color-active   );--theme-btn-subtle-secondary--border-color:var(     --ix-dropdown-button-subtle-secondary-border-color-active   );--theme-btn-subtle-secondary--border-color--hover:var(     --ix-dropdown-button-subtle-secondary-border-color-active   );--theme-btn-subtle-tertiary--background:var(     --ix-dropdown-button-subtle-tertiary-background-active   );--theme-btn-subtle-tertiary--background--hover:var(     --ix-dropdown-button-subtle-tertiary-background-active   );--theme-btn-subtle-tertiary--color:var(--ix-dropdown-button-subtle-tertiary-color-active);--theme-btn-subtle-tertiary--color--hover:var(     --ix-dropdown-button-subtle-tertiary-color-active   );--theme-btn-subtle-tertiary--border-color:var(     --ix-dropdown-button-subtle-tertiary-border-color-active   );--theme-btn-subtle-tertiary--border-color--hover:var(     --ix-dropdown-button-subtle-tertiary-border-color-active   );--theme-btn-danger-primary--background:var(     --ix-dropdown-button-danger-primary-background-active   );--theme-btn-danger-primary--background--hover:var(     --ix-dropdown-button-danger-primary-background-active   );--theme-btn-danger-primary--color:var(--ix-dropdown-button-danger-primary-color-active);--theme-btn-danger-primary--color--hover:var(     --ix-dropdown-button-danger-primary-color-active   );--theme-btn-danger-primary--border-color:var(     --ix-dropdown-button-danger-primary-border-color-active   );--theme-btn-danger-primary--border-color--hover:var(     --ix-dropdown-button-danger-primary-border-color-active   );--theme-btn-danger-secondary--background:var(     --ix-dropdown-button-danger-secondary-background-active   );--theme-btn-danger-secondary--background--hover:var(     --ix-dropdown-button-danger-secondary-background-active   );--theme-btn-danger-secondary--color:var(--ix-dropdown-button-danger-secondary-color-active);--theme-btn-danger-secondary--color--hover:var(     --ix-dropdown-button-danger-secondary-color-active   );--theme-btn-danger-secondary--border-color:var(     --ix-dropdown-button-danger-secondary-border-color-active   );--theme-btn-danger-secondary--border-color--hover:var(     --ix-dropdown-button-danger-secondary-border-color-active   );--theme-btn-danger-tertiary--background:var(     --ix-dropdown-button-danger-tertiary-background-active   );--theme-btn-danger-tertiary--background--hover:var(     --ix-dropdown-button-danger-tertiary-background-active   );--theme-btn-danger-tertiary--color:var(--ix-dropdown-button-danger-tertiary-color-active);--theme-btn-danger-tertiary--color--hover:var(     --ix-dropdown-button-danger-tertiary-color-active   );--theme-btn-danger-tertiary--border-color:var(     --ix-dropdown-button-danger-tertiary-border-color-active   );--theme-btn-danger-tertiary--border-color--hover:var(     --ix-dropdown-button-danger-tertiary-border-color-active   )}:host([aria-expanded=true]:focus-visible){outline:none}:host(.disabled){pointer-events:none}`;
+const dropdownButtonCss = () => `:host{--ix-dropdown-button-border-radius:var(--theme-btn--border-radius);--ix-dropdown-button-focus-outline-color:var(--theme-color-focus-bdr);--ix-dropdown-button-focus-outline-offset:var(     --theme-btn--focus--outline-offset   );--ix-dropdown-button-primary-color:var(--theme-btn-primary--color);--ix-dropdown-button-primary-color-disabled:var(     --theme-btn-primary--color--disabled   );--ix-dropdown-button-primary-color-active:var(     --theme-btn-primary--color--active   );--ix-dropdown-button-secondary-color:var(--theme-btn-secondary--color);--ix-dropdown-button-secondary-color-disabled:var(     --theme-btn-secondary--color--disabled   );--ix-dropdown-button-secondary-color-active:var(     --theme-btn-secondary--color--active   );--ix-dropdown-button-tertiary-color:var(--theme-btn-tertiary--color);--ix-dropdown-button-tertiary-color-disabled:var(     --theme-btn-tertiary--color--disabled   );--ix-dropdown-button-tertiary-color-active:var(     --theme-btn-tertiary--color--active   );--ix-dropdown-button-subtle-primary-color:var(--theme-btn-subtle-primary--color);--ix-dropdown-button-subtle-primary-color-disabled:var(     --theme-btn-subtle-primary--color--disabled   );--ix-dropdown-button-subtle-primary-color-active:var(     --theme-btn-subtle-primary--color--active   );--ix-dropdown-button-subtle-secondary-color:var(--theme-btn-subtle-secondary--color);--ix-dropdown-button-subtle-secondary-color-disabled:var(     --theme-btn-subtle-secondary--color--disabled   );--ix-dropdown-button-subtle-secondary-color-active:var(     --theme-btn-subtle-secondary--color--active   );--ix-dropdown-button-subtle-tertiary-color:var(--theme-btn-subtle-tertiary--color);--ix-dropdown-button-subtle-tertiary-color-disabled:var(     --theme-btn-subtle-tertiary--color--disabled   );--ix-dropdown-button-subtle-tertiary-color-active:var(     --theme-btn-subtle-tertiary--color--active   );--ix-dropdown-button-danger-primary-color:var(--theme-btn-danger-primary--color);--ix-dropdown-button-danger-primary-color-disabled:var(     --theme-btn-danger-primary--color--disabled   );--ix-dropdown-button-danger-primary-color-active:var(     --theme-btn-danger-primary--color--active   );--ix-dropdown-button-danger-secondary-color:var(--theme-btn-danger-secondary--color);--ix-dropdown-button-danger-secondary-color-disabled:var(     --theme-btn-danger-secondary--color--disabled   );--ix-dropdown-button-danger-secondary-color-active:var(     --theme-btn-danger-secondary--color--active   );--ix-dropdown-button-danger-tertiary-color:var(--theme-btn-danger-tertiary--color);--ix-dropdown-button-danger-tertiary-color-disabled:var(     --theme-btn-danger-tertiary--color--disabled   );--ix-dropdown-button-danger-tertiary-color-active:var(     --theme-btn-danger-tertiary--color--active   )}:host{display:inline-block;position:relative;height:2rem;width:auto;--ix-dropdown-button-border-radius-left:var(     --ix-dropdown-button-border-radius   );--ix-dropdown-button-border-radius-right:var(     --ix-dropdown-button-border-radius   );border-top-left-radius:var(--ix-dropdown-button-border-radius-left);border-bottom-left-radius:var(--ix-dropdown-button-border-radius-left);border-top-right-radius:var(--ix-dropdown-button-border-radius-right);border-bottom-right-radius:var(--ix-dropdown-button-border-radius-right)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host *::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host *{}:host *::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host *{}:host *::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host *::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host *{}:host *::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host *{}:host *::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host *::-webkit-scrollbar-corner{display:none}:host .hide{display:none}:host ix-button,:host ix-icon-button{--ix-button-border-radius-left:var(     --ix-dropdown-button-border-radius-left   );--ix-button-border-radius-right:var(     --ix-dropdown-button-border-radius-right   )}:host .dropdown-button{display:block;position:relative;width:100%;height:100%}:host .dropdown-button>ix-button{width:100%;height:100%}:host .dropdown-button .button-label{margin-right:auto;min-width:0px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .dropdown-button .dropdown-icon{margin-right:0.25rem}:host .triangle{position:absolute;margin-inline-start:1.5625rem;margin-block-start:-0.4375rem;border-right:0 solid transparent;border-left:4px solid transparent;border-top:0 solid transparent;border-bottom:4px solid;color:var(--ix-dropdown-button-primary-color)}:host .triangle.primary{color:var(--ix-dropdown-button-primary-color)}:host .triangle.secondary{color:var(--ix-dropdown-button-secondary-color)}:host .triangle.tertiary{color:var(--ix-dropdown-button-tertiary-color)}:host .triangle.primary.disabled{color:var(--ix-dropdown-button-primary-color-disabled)}:host .triangle.secondary.disabled{color:var(--ix-dropdown-button-secondary-color-disabled)}:host .triangle.tertiary.disabled{color:var(--ix-dropdown-button-tertiary-color-disabled)}:host .triangle.subtle-primary{color:var(--ix-dropdown-button-subtle-primary-color)}:host .triangle.subtle-secondary{color:var(--ix-dropdown-button-subtle-secondary-color)}:host .triangle.subtle-tertiary{color:var(--ix-dropdown-button-subtle-tertiary-color)}:host .triangle.subtle-primary.disabled{color:var(--ix-dropdown-button-subtle-primary-color-disabled)}:host .triangle.subtle-secondary.disabled{color:var(--ix-dropdown-button-subtle-secondary-color-disabled)}:host .triangle.subtle-tertiary.disabled{color:var(--ix-dropdown-button-subtle-tertiary-color-disabled)}:host .triangle.danger-primary{color:var(--ix-dropdown-button-danger-primary-color)}:host .triangle.danger-secondary{color:var(--ix-dropdown-button-danger-secondary-color)}:host .triangle.danger-tertiary{color:var(--ix-dropdown-button-danger-tertiary-color)}:host .triangle.danger-primary.disabled{color:var(--ix-dropdown-button-danger-primary-color-disabled)}:host .triangle.danger-secondary.disabled{color:var(--ix-dropdown-button-danger-secondary-color-disabled)}:host .triangle.danger-tertiary.disabled{color:var(--ix-dropdown-button-danger-tertiary-color-disabled)}:host .content{display:flex;align-items:center}:host .remove-button-min-width{min-width:0px}:host(.host-context-date-picker) .internal-button,:host(.host-context-breadcrumb) .internal-button{min-width:0px;padding:0}:host(.host-context-date-picker) ix-dropdown{max-height:15.625rem;overflow-y:scroll}:host(:focus-visible){outline:1px solid var(--ix-dropdown-button-focus-outline-color);outline-offset:var(--ix-dropdown-button-focus-outline-offset)}:host([aria-expanded=true]){--ix-dropdown-button-primary-color:var(     --ix-dropdown-button-primary-color-active   );--ix-dropdown-button-secondary-color:var(     --ix-dropdown-button-secondary-color-active   );--ix-dropdown-button-tertiary-color:var(     --ix-dropdown-button-tertiary-color-active   );--ix-dropdown-button-subtle-primary-color:var(     --ix-dropdown-button-subtle-primary-color-active   );--ix-dropdown-button-subtle-secondary-color:var(     --ix-dropdown-button-subtle-secondary-color-active   );--ix-dropdown-button-subtle-tertiary-color:var(     --ix-dropdown-button-subtle-tertiary-color-active   );--ix-dropdown-button-danger-primary-color:var(     --ix-dropdown-button-danger-primary-color-active   );--ix-dropdown-button-danger-secondary-color:var(     --ix-dropdown-button-danger-secondary-color-active   );--ix-dropdown-button-danger-tertiary-color:var(     --ix-dropdown-button-danger-tertiary-color-active   )}:host([aria-expanded=true]:focus-visible){outline:none}:host(.disabled){pointer-events:none}`;
 
 const DropdownButton = class extends Mixin(...DefaultMixins, ComponentIdMixin, AriaActiveDescendantMixin) {
     constructor(hostRef) {
@@ -155,11 +155,14 @@ const DropdownButton = class extends Mixin(...DefaultMixins, ComponentIdMixin, A
                 'host-context-breadcrumb': !!this.hostContext?.breadcrumb,
                 'host-context-date-picker': !!this.hostContext?.datePicker,
                 'host-context-tabs': !!this.hostContext?.tabs,
-            }, ref: this.dropdownAnchor, tabIndex: this.disabled ? -1 : 0, ...ariaAttributes }, h("div", { key: '09be27cd7b565ebcc71c37983c6300afa1a95802', class: "dropdown-button" }, this.label || this.label === null ? (h("ix-button", { ...commonProperties, class: 'internal-button', alignment: "start", ref: (ref) => forceTabIndex(ref, -1), ariaLabelButton: this.ariaLabelDropdownButton ??
+            }, ref: this.dropdownAnchor, tabIndex: this.disabled ? -1 : 0, ...ariaAttributes }, h("div", { key: '09be27cd7b565ebcc71c37983c6300afa1a95802', class: "dropdown-button" }, this.label || this.label === null ? (h("ix-button", { ...commonProperties, class: {
+                'internal-button': true,
+                active: this.dropdownShow,
+            }, alignment: "start", ref: (ref) => forceTabIndex(ref, -1), ariaLabelButton: this.ariaLabelDropdownButton ??
                 (this.dropdownShow ? 'Close dropdown' : 'Open dropdown') }, h("div", { class: 'content' }, this.icon ? (h("ix-icon", { name: this.icon, size: "24", class: 'dropdown-icon' })) : null, h("div", { class: 'button-label' }, this.label), h("slot", { name: "button-label" }), !hideChevron && (h("ix-icon", { "aria-hidden": "true", name: this.dropdownShow
                 ? iconChevronUpSmall
-                : iconChevronDownSmall, size: "24" }))))) : (h("div", null, h("ix-icon-button", { ...commonProperties, icon: this.icon, ref: (ref) => forceTabIndex(ref, -1), "aria-label": this.ariaLabelDropdownButton ??
-                (this.dropdownShow ? 'Close dropdown' : 'Open dropdown') }), !hideChevron && this.getTriangle()))), h("ix-dropdown", { key: 'a71d02c22bd6d0f79d8f4dbfa0b7bfe77e339e8f', role: "menu", ref: this.dropdownRef, id: `dropdown-button-menu-${this.dropdownButtonId}`, "aria-labelledby": `dropdown-button-${this.dropdownButtonId}`, trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, enableTopLayer: this.enableTopLayer, disableFocusTrap: true, focusCheckedItem: this.focusCheckedItem, onShowChanged: (event) => this.onDropdownShowChanged(event), onScroll: (event) => {
+                : iconChevronDownSmall, size: "24" }))))) : (h("div", null, h("ix-icon-button", { ...commonProperties, class: { active: this.dropdownShow }, icon: this.icon, ref: (ref) => forceTabIndex(ref, -1), "aria-label": this.ariaLabelDropdownButton ??
+                (this.dropdownShow ? 'Close dropdown' : 'Open dropdown') }), !hideChevron && this.getTriangle()))), h("ix-dropdown", { key: '4a3236943eb96d8c96c57457c3565dbf038da4a2', role: "menu", ref: this.dropdownRef, id: `dropdown-button-menu-${this.dropdownButtonId}`, "aria-labelledby": `dropdown-button-${this.dropdownButtonId}`, trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, enableTopLayer: this.enableTopLayer, disableFocusTrap: true, focusCheckedItem: this.focusCheckedItem, onShowChanged: (event) => this.onDropdownShowChanged(event), onScroll: (event) => {
                 // Need to dispatch the event again to handle infinite scroll of ix-date-picker,
                 // as the scroll event does not bubble beyond the shadow root
                 const scrollEvent = new CustomEvent('scroll', {
@@ -168,7 +171,7 @@ const DropdownButton = class extends Mixin(...DefaultMixins, ComponentIdMixin, A
                     detail: event.detail,
                 });
                 this.hostElement.dispatchEvent(scrollEvent);
-            } }, h("slot", { key: '330b19b734d3ed649967f7360f5d1424fed3d665' }))));
+            } }, h("slot", { key: 'ad330d9330a8d6d56be634ef6270d7a42327d78e' }))));
     }
 };
 DropdownButton.style = dropdownButtonCss();

package/dist/esm/ix-dropdown_2.entry.js

@@ -8,9 +8,9 @@ import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { r as requestAnimationFrameNoNgZone } from './requestAnimationFrame-BEuV0Xpe.js';
 import { d as dropdownController, h as hasDropdownItemWrapperImplemented } from './dropdown-controller-Jfg3ZWk6.js';
 import { a1 as iconSingleCheck, u as iconChevronRightSmall } from './index-BeX6RWvV.js';
-import { a as a11yBoolean } from './a11y-C21npbUc.js';
+import { a as a11yBoolean } from './a11y-DD206pTM.js';
 import { C as ComponentIdMixin } from './id.mixin-CUbYLenp.js';
-import { F as FocusVisibleMixin } from './focus-visible.mixin-CaRK3Ex_.js';
+import { F as FocusVisibleMixin } from './focus-visible.mixin-DNYMa4dY.js';
 import './shadow-dom-BClJdFQP.js';
 import './path-utils-CNLoALIl.js';
 
@@ -567,7 +567,9 @@ const Dropdown = class extends Mixin(...DefaultMixins) {
         }, {
             threshold: [0, 0.5, 1],
         });
-        this.intersectObserverTrigger.observe(this.anchorElement);
+        if (this.anchorElement) {
+            this.intersectObserverTrigger.observe(this.anchorElement);
+        }
     }
     createFallbackPlacement(side) {
         const alignment = this.placement.endsWith('-end') ? 'end' : 'start';
@@ -814,11 +816,15 @@ const Dropdown = class extends Mixin(...DefaultMixins) {
         if (submenuIds.length === 0) {
             return;
         }
+        const dropdown = dropdownController.getDropdownById(submenuIds[0]);
+        if (!dropdown) {
+            return;
+        }
         event.detail.activeElement.classList.add('ix-dropdown-submenu-trigger-active');
-        dropdownController.present(dropdownController.getDropdownById(submenuIds[0]));
-        this.forwardQueryElement = dropdownController.getDropdownById(submenuIds[0]).hostElement;
+        dropdownController.present(dropdown);
+        this.forwardQueryElement = dropdown.hostElement;
         requestAnimationFrameNoNgZone(() => {
-            focusFirstDescendant(dropdownController.getDropdownById(submenuIds[0]).hostElement);
+            focusFirstDescendant(dropdown.hostElement);
         });
     }
     closeSubmenu() {
@@ -852,7 +858,7 @@ const Dropdown = class extends Mixin(...DefaultMixins) {
         else if (this.hostRole) {
             ariaAttributes['role'] = this.hostRole;
         }
-        return (h(Host, { key: 'eebc7297596d43ef67c3461ae0a74fbf9e5c3917', ...ariaAttributes, "aria-modal": "true", "data-ix-dropdown": this.dropdownElementId, "data-ix-focus-trap": true, class: {
+        return (h(Host, { key: '6f04440b82a4d0f62e2f15932a30a68107b988ec', ...ariaAttributes, "aria-modal": "true", "data-ix-dropdown": this.dropdownElementId, "data-ix-focus-trap": true, class: {
                 'dropdown-menu': true,
                 show: this.show,
                 // overflow handling not needed when using top-layer

package/dist/esm/ix-event-list-item.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-EBgS4zhE.js';
 import { E as iconChevronRight } from './index-BeX6RWvV.js';
-import { a as a11yBoolean } from './a11y-C21npbUc.js';
+import { a as a11yBoolean } from './a11y-DD206pTM.js';
 
 const eventListItemCss = () => `:host(.event-list-item-outline) .event-list-item{--ix-event-list-item--color-border:var(     --theme-event-item-outline--border   );--ix-event-list-item--background:var(     --theme-event-item-outline--background   );--ix-event-list-item--background--hover:var(     --theme-event-item-outline--background--hover   );--ix-event-list-item--background--active:var(     --theme-event-item-outline--background--active   );--ix-event-list-item--background--selected:var(     --theme-event-item-outline--background--selected   );--ix-event-list-item--border--hover:var(     --theme-event-item-outline--border--hover   );--ix-event-list-item--border--active:var(     --theme-event-item-outline--border--active   );--ix-event-list-item--border--selected:var(     --theme-event-item-outline--border--selected   );--ix-event-list-item--border--disabled:var(     --theme-event-item-outline--border--disabled   )}:host(.event-list-item-filled) .event-list-item{--ix-event-list-item--color-border:var(     --theme-event-item-filled--border   );--ix-event-list-item--background:var(     --theme-event-item-filled--background   );--ix-event-list-item--background--hover:var(     --theme-event-item-filled--background--hover   );--ix-event-list-item--background--active:var(     --theme-event-item-filled--background--active   );--ix-event-list-item--background--selected:var(     --theme-event-item-filled--background--selected   );--ix-event-list-item--border--hover:var(     --theme-event-item-filled--border--hover   );--ix-event-list-item--border--active:var(     --theme-event-item-filled--border--active   );--ix-event-list-item--border--selected:var(     --theme-event-item-filled--border--selected   );--ix-event-list-item--border--disabled:var(     --theme-event-item-filled--border--disabled   )}:host *,:host *::after,:host *::before{box-sizing:border-box}:host *::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host *{}:host *::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host *{}:host *::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host *::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host *{}:host *::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host *{}:host *::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host *::-webkit-scrollbar-corner{display:none}:host .event-list-item{display:flex;align-items:center;position:relative;height:var(--event-list-item-height, 2.5rem);max-height:var(--event-list-item-height, 2.5rem);border-radius:var(--event-list-item-border-radius, 0.25rem);background-color:var(--ix-event-list-item--background);overflow:hidden;transition:var(--theme-default-time);cursor:pointer;margin-bottom:var(--event-list-item-margin-bottom, 0.5rem)}:host .event-list-item .indicator{height:100%;width:0.5rem;max-width:0.5rem;min-width:0.5rem;border-top-left-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:var(--event-list-item-border-radius, 0.25rem)}:host .event-list-item .indicator-empty{border:var(--theme-weak-bdr-1);border-right:none}:host .event-list-item .event-list-item-container{display:flex;flex-grow:1;width:calc(100% - (1rem + 0.5rem));height:100%;border:0.062rem solid;border-color:var(--ix-event-list-item--color-border);border-top-left-radius:0;border-top-right-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:0;border-bottom-right-radius:var(--event-list-item-border-radius, 0.25rem);border-left:none;padding-left:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .event-list-item .event-content{display:flex;align-items:center;width:100%;height:var(--event-list-item-height, 100%);max-height:var(--event-list-item-height, 100%);white-space:var(--event-list-item-content-white-space, inherit);overflow:hidden;padding-inline-end:0.5rem}:host .event-list-item .chevron-icon{margin-left:auto;margin-right:0.5rem;opacity:0.6;align-self:center}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):hover,:host .event-list-item:not(.selected):not(.disabled):not(:disabled).hover{background-color:var(--ix-event-list-item--background--hover)}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected):not(.disabled):not(:disabled).active{background-color:var(--ix-event-list-item--background--active)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):hover,:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled).hover{border-color:var(--ix-event-list-item--border--hover)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled).active{border-color:var(--ix-event-list-item--border--active)}:host .event-list-item.selected .event-list-item-container{background-color:var(--ix-event-list-item--background--selected);border-color:var(--ix-event-list-item--border--selected)}:host .event-list-item[disabled],:host .event-list-item.disabled{pointer-events:none}:host .event-list-item[disabled] .event-list-item-container,:host .event-list-item.disabled .event-list-item-container{background-color:var(--ix-event-list-item--background--disabled);border-color:var(--ix-event-list-item--border--disabled)}:host(.disabled){pointer-events:none}`;
 

package/dist/esm/ix-event-list.entry.js

@@ -91,6 +91,10 @@ const EventList = class {
             if (!listElement) {
                 return resolve();
             }
+            if (!listElement) {
+                resolve();
+                return;
+            }
             animate(listElement, {
                 opacity: [{ opacity: 1, easing: 'easeInSine' }, { opacity: 0 }],
                 duration: EventList.fadeOutDuration,
@@ -130,11 +134,11 @@ const EventList = class {
         });
     }
     render() {
-        return (h(Host, { key: 'a8a45d70a13452c6beb7c214ce91e853a38b8552', class: {
+        return (h(Host, { key: '4a355c1cdb34b5c13f05a3abb0fabd1205733371', class: {
                 'item-size-s': this.itemHeight === 'S',
                 'item-size-l': this.itemHeight === 'L',
                 compact: this.compact,
-            } }, h("div", { key: 'dacba6d4f41062ef6a7cd6a1792d792c9279655e', role: "list" }, h("slot", { key: '6193e925c292452afb5d8889120fefd21ebe9351' }))));
+            } }, h("div", { key: '5963f8ed3d7c534701bbc717f85b69cb42240300', role: "list" }, h("slot", { key: '8ddf236842628e767cd5428a56f10dddc532b892' }))));
     }
     static get watchers() { return {
         "chevron": [{

package/dist/esm/ix-field-label_2.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, g as getElement, h, H as Host, M as Mixin } from './index-EBgS4zhE.js';
-import { b as a11yHostAttributes } from './a11y-C21npbUc.js';
+import { b as a11yHostAttributes } from './a11y-DD206pTM.js';
 import { i as isIxInputFieldComponent } from './index-XBTykBKS.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import { c as closestPassShadow } from './shadow-dom-BClJdFQP.js';
 import { c as createClassMutationObserver } from './validation-DXpftrw5.js';
-import { r as resolveTextFromValidationState, h as hasAnyText, H as HelperText$1 } from './helper-text-util-sQKO6RPJ.js';
+import { r as resolveTextFromValidationState, h as hasAnyText, H as HelperText$1 } from './helper-text-util-BJ-ZMW2J.js';
 import { D as DefaultMixins } from './component-DqJSHc3A.js';
 import { C as ComponentIdMixin } from './id.mixin-CUbYLenp.js';
 import './index-BeX6RWvV.js';

package/dist/esm/ix-filter-chip_2.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, c as createEvent, g as getElement, h, H as Host, M as Mixin } from './index-EBgS4zhE.js';
 import { $ as iconCloseSmall } from './index-BeX6RWvV.js';
-import { b as a11yHostAttributes } from './a11y-C21npbUc.js';
+import { b as a11yHostAttributes } from './a11y-DD206pTM.js';
 import { I as IX_FOCUS_VISIBLE_ACTIVE, a as IX_FOCUS_VISIBLE } from './focus-utilities-6ZxKp7Jn.js';
 import { D as DefaultMixins } from './component-DqJSHc3A.js';
-import { F as FocusVisibleMixin } from './focus-visible.mixin-CaRK3Ex_.js';
+import { F as FocusVisibleMixin } from './focus-visible.mixin-DNYMa4dY.js';
 import { C as ComponentIdMixin } from './id.mixin-CUbYLenp.js';
 import { m as makeRef } from './make-ref-Djkc69iv.js';
 import './shadow-dom-BClJdFQP.js';

package/dist/esm/ix-flip-tile.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-EBgS4zhE.js';
 import { F as iconEye } from './index-BeX6RWvV.js';
 import { a as animate } from './anime.esm-DhE1t8Qh.js';
-import { A as Animation } from './animation-DNIQ2C1K.js';
+import { A as Animation } from './animation-BqeSHO6C.js';
 import { c as createMutationObserver } from './mutation-observer-CX81WQtk.js';
 import { h as hasSlottedElements } from './shadow-dom-BClJdFQP.js';
 

package/dist/esm/ix-group.entry.js

@@ -59,7 +59,7 @@ const Group = class {
     footerVisible = false;
     showExpandCollapsedIcon = false;
     hasDropdown = false;
-    observer = null;
+    observer;
     selectedChanged(newSelected) {
         if (newSelected === false) {
             this.changeItemIndex();
@@ -161,26 +161,26 @@ const Group = class {
         }
     }
     render() {
-        return (h(Host, { key: '1793ac3e26d91c376e82c74d31b30d32f1e9cd2a' }, h("div", { key: 'ad7d3167ee6823f4835ee4b5002af0bcec586a07', class: {
+        return (h(Host, { key: 'c13fd65df4bb7ae59e242214a037dbb403264879' }, h("div", { key: '2c9daf5ca7335038e771aadafab3d11648739a8e', class: {
                 'group-header': true,
                 expand: this.expanded,
                 selected: this.selected,
-            }, tabindex: "0" }, h("div", { key: '5a56cffe47d4e3a9b9a88eaa402f00fe5f9788a3', class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, h("div", { key: 'e7cfb2b5d583e2c057624c4a1568e85dc5e4badc', class: {
+            }, tabindex: "0" }, h("div", { key: 'b5d1a6e9a478478909e2cd27bb8fe07ce5ae455f', class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, h("div", { key: '0304ea3dc12318458f710aa0c8e6747a5a945d7d', class: {
                 'group-header-selection-indicator': true,
                 'group-header-selection-indicator-item-selected': this.itemSelected,
-            } }), h("div", { key: '01597689aabccdfb0910941815980ed2cb7ded18', class: "btn-expand-header" }, h("ix-icon", { key: 'f7317874a7830a08f4eaf4f899c2bb9c6b9f1b17', "data-testid": "expand-collapsed-icon", class: {
+            } }), h("div", { key: 'f414bf98c9d8f68217714476411286322005c984', class: "btn-expand-header" }, h("ix-icon", { key: '2c998a5aa350830b9ed3043aacfa236b1693197c', "data-testid": "expand-collapsed-icon", class: {
                 hidden: !this.showExpandCollapsedIcon,
-            }, name: this.expanded ? iconChevronUpSmall : iconChevronDownSmall, onClick: (event) => this.onExpandClick(event) })), h("div", { key: 'ac24f6cd5d8d37185ea2f863c22c8b3a6ca7250b', class: "group-header-content" }, this.header ? (h("div", { class: "group-header-props-container" }, h("div", { class: "group-header-title" }, h("span", { title: this.header }, this.header)), h("div", { class: "group-subheader", title: this.subHeader }, this.subHeader))) : null, h("slot", { key: '5790b072f91964ac542ae058e9764a46ee9462d6', name: "header" }))), this.hasDropdown && (h("ix-group-context-menu", { key: '3451bc23ed72ae8ccced159708176593bb13cfc5' }, h("slot", { key: '3d2e98dbaa2016707dd904d352df9a1cfc62faa3', name: "dropdown" })))), h("div", { key: 'a65bc2d61c25bd2758efac9470362f9d6c461f44', class: {
+            }, name: this.expanded ? iconChevronUpSmall : iconChevronDownSmall, onClick: (event) => this.onExpandClick(event) })), h("div", { key: '2787b0ed7d584400662f9794b8cfba82adec5837', class: "group-header-content" }, this.header ? (h("div", { class: "group-header-props-container" }, h("div", { class: "group-header-title" }, h("span", { title: this.header }, this.header)), h("div", { class: "group-subheader", title: this.subHeader }, this.subHeader))) : null, h("slot", { key: '03e99048ceabea07f229349919c0392df581f9e1', name: "header" }))), this.hasDropdown && (h("ix-group-context-menu", { key: '0ba467c1ad8b9eb4a0406ac897a6cf84635721de' }, h("slot", { key: 'b4dd2adc6c70c6b521abcceee495f323564cc371', name: "dropdown" })))), h("div", { key: '1d14d7a4a6dc617088282c0af07d6c95483878c8', class: {
                 'group-content': true,
-            } }, h("div", { key: '2aacc03d7a9c9e7f922f02a76b951fba83127d57', style: {
+            } }, h("div", { key: 'cbf1f34edc7dac18cc5b63ef640ad2b720c267bb', style: {
                 display: this.expanded ? 'contents' : 'none',
-            } }, h("slot", { key: '2d1efdfc125553264095f9fbedbedf18f23bd61b', onSlotchange: () => {
+            } }, h("slot", { key: '98ea6459c1c434e5afcb8c420ef124f331bf0ff3', onSlotchange: () => {
                 const slot = this.hostElement.shadowRoot?.querySelector('slot:not([name])');
                 this.showExpandCollapsedIcon = hasSlottedElements(slot);
-            } }), h("ix-group-item", { key: '87d5d74df393611c8681d5d3aec6393b3d439323', class: {
+            } }), h("ix-group-item", { key: '55e1c11df531834d2b48b742b8081e669672d5fd', class: {
                 footer: true,
                 'footer-visible': this.footerVisible,
-            }, groupFooter: true, suppressSelection: true }, h("slot", { key: 'f3f126f527efb02af78b884439c35eee1aa35afc', name: "footer", onSlotchange: () => this.onSlotChange() }))))));
+            }, groupFooter: true, suppressSelection: true }, h("slot", { key: '1c1176b3a0e054e31db9999cce99bbc7e904ab33', name: "footer", onSlotchange: () => this.onSlotChange() }))))));
     }
     static get watchers() { return {
         "selected": [{

package/dist/esm/ix-helper-text.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, g as getElement, h, H as Host } from './index-EBgS4zhE.js';
-import { H as HelperText$1 } from './helper-text-util-sQKO6RPJ.js';
+import { H as HelperText$1 } from './helper-text-util-BJ-ZMW2J.js';
 import { c as createClassMutationObserver, a as checkFieldClasses } from './validation-DXpftrw5.js';
 import './index-BeX6RWvV.js';
-import './a11y-C21npbUc.js';
+import './a11y-DD206pTM.js';
 import './index-XBTykBKS.js';
 
 const helperTextCss = () => `:host{display:block}:host .bottom-text{display:flex;position:relative;align-items:flex-start;justify-content:flex-start;gap:0.25rem;margin-right:0.25rem}:host .text-icon{margin:0.125rem}:host .text-icon.invalid{color:var(--theme-helper-icon--color--invalid)}:host .text-icon.info{color:var(--theme-helper-icon--color--info)}:host .text-icon.warning{color:var(--theme-helper-icon--color--warning)}:host .text-icon.valid{color:var(--theme-helper-icon--color--valid)}`;