npm - @siemens/ix - Versions diffs - 2.3.0 → 2.4.0 - Mend

@siemens/ix 2.3.0 → 2.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (663) hide show

package/dist/esm/ix-chip.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-5429f20b.js';
 const chipCss = ":host{display:inline-block;position:relative;height:2rem;max-height:2rem;margin-left:0.25rem}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host(.inactive){pointer-events:none}.container{display:inline-flex;width:inherit;box-sizing:border-box;position:relative;align-items:center;border-radius:100px;padding:0.5rem;height:2rem;max-height:2rem;cursor:pointer}.container .with-icon{margin-right:0.25rem}.container .hidden{display:none;width:0;margin-right:0}.container .close-button-container{display:inline-flex;margin-left:auto;padding-left:0.5rem}.container .slot-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.container.outline.icon{padding-left:calc(0.75rem - 1px)}.container.outline:not(.icon){padding-left:calc(0.5rem - 1px)}.container.outline.closable:not(.inactive){padding-right:calc(0.25rem - 1px)}.container.outline.closable.inactive,.container.outline:not(.closable){padding-right:calc(0.5rem - 1px)}.container.outline.icon:not(.closable){padding-right:calc(0.75rem - 1px)}.container:not(.outline).icon{padding-left:0.75rem}.container:not(.outline):not(.icon){padding-left:0.5rem}.container:not(.outline).closable:not(.inactive){padding-right:0.25rem}.container:not(.outline).closable.inactive{padding-right:0.5rem}.container:not(.outline):not(.closable).icon{padding-right:0.75rem}.container:not(.outline):not(.closable):not(.icon){padding-right:0.5rem}.container.primary{background-color:var(--theme-color-primary);color:var(--theme-chip-primary--color)}.container.primary .close-button{color:var(--theme-chip-primary--color);--ix-icon-button-color:var(--theme-chip-primary--color);pointer-events:auto}.container.primary:hover{background-color:var(--theme-chip-primary--background--hover)}.container.primary:active{background-color:var(--theme-chip-primary--background--active)}.container.primary:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.primary.outline{color:var(--theme-chip-primary-outline--color);background-color:transparent;border:solid 1px var(--theme-chip-primary-outline--border-color)}.container.primary.outline .close-button{color:var(--theme-chip-primary-outline--color);--ix-icon-button-color:var(--theme-chip-primary-outline--color)}.container.primary.outline:hover{background-color:var(--theme-chip-primary-outline--background--hover)}.container.primary.outline:active{background-color:var(--theme-chip-primary-outline--background--active)}.container.outline{border-width:1px;border-style:solid}.container.alarm{color:var(--theme-color-alarm--contrast)}.container.alarm:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.alarm.active::after,.container.alarm:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.alarm:not(.outline){background-color:var(--theme-color-alarm)}.container.alarm:not(.outline) .close-button{color:var(--theme-color-alarm--contrast);--ix-icon-button-color:var(--theme-color-alarm--contrast)}.container.alarm:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.alarm:not(.outline).active::after,.container.alarm:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.alarm.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-alarm)}.container.alarm.outline:hover::after{display:none}.container.alarm.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.alarm.outline.active::after,.container.alarm.outline:active::after{display:none}.container.alarm.outline.active,.container.alarm.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.alarm:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.critical{color:var(--theme-color-critical--contrast)}.container.critical:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.critical.active::after,.container.critical:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.critical:not(.outline){background-color:var(--theme-color-critical)}.container.critical:not(.outline) .close-button{color:var(--theme-color-critical--contrast);--ix-icon-button-color:var(--theme-color-critical--contrast)}.container.critical:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.critical:not(.outline).active::after,.container.critical:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.critical.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-critical)}.container.critical.outline:hover::after{display:none}.container.critical.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.critical.outline.active::after,.container.critical.outline:active::after{display:none}.container.critical.outline.active,.container.critical.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.critical:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.warning{color:var(--theme-color-warning--contrast)}.container.warning:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.warning.active::after,.container.warning:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.warning:not(.outline){background-color:var(--theme-color-warning)}.container.warning:not(.outline) .close-button{color:var(--theme-color-warning--contrast);--ix-icon-button-color:var(--theme-color-warning--contrast)}.container.warning:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.warning:not(.outline).active::after,.container.warning:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.warning.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-warning)}.container.warning.outline:hover::after{display:none}.container.warning.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.warning.outline.active::after,.container.warning.outline:active::after{display:none}.container.warning.outline.active,.container.warning.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.warning:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.info{color:var(--theme-color-info--contrast)}.container.info:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.info.active::after,.container.info:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.info:not(.outline){background-color:var(--theme-color-info)}.container.info:not(.outline) .close-button{color:var(--theme-color-info--contrast);--ix-icon-button-color:var(--theme-color-info--contrast)}.container.info:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.info:not(.outline).active::after,.container.info:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.info.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-info)}.container.info.outline:hover::after{display:none}.container.info.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.info.outline.active::after,.container.info.outline:active::after{display:none}.container.info.outline.active,.container.info.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.info:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.neutral{color:var(--theme-color-neutral--contrast)}.container.neutral:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.neutral.active::after,.container.neutral:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.neutral:not(.outline){background-color:var(--theme-color-neutral)}.container.neutral:not(.outline) .close-button{color:var(--theme-color-neutral--contrast);--ix-icon-button-color:var(--theme-color-neutral--contrast)}.container.neutral:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.neutral:not(.outline).active::after,.container.neutral:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.neutral.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-neutral)}.container.neutral.outline:hover::after{display:none}.container.neutral.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.neutral.outline.active::after,.container.neutral.outline:active::after{display:none}.container.neutral.outline.active,.container.neutral.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.neutral:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}.container.success{color:var(--theme-color-success--contrast)}.container.success:hover::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}.container.success.active::after,.container.success:active::after{content:\"\";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}.container.success:not(.outline){background-color:var(--theme-color-success)}.container.success:not(.outline) .close-button{color:var(--theme-color-success--contrast);--ix-icon-button-color:var(--theme-color-success--contrast)}.container.success:not(.outline):hover::after{content:\"\";background-color:rgba(0, 0, 0, 0.05)}.container.success:not(.outline).active::after,.container.success:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}.container.success.outline{color:var(--theme-chip-outline--color);border-color:var(--theme-color-success)}.container.success.outline:hover::after{display:none}.container.success.outline:hover{background-color:var(--theme-chip-outline--background--hover)}.container.success.outline.active::after,.container.success.outline:active::after{display:none}.container.success.outline.active,.container.success.outline:active{background-color:var(--theme-chip-outline--background--active)}.container.success:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}";
 const IxChipStyle0 = chipCss;
@@ -35,11 +35,11 @@ const Chip = class {
                 [this.outline ? 'borderColor' : 'backgroundColor']: this.background,
             };
         }
-        return (h(Host, { key: 'bc9150f9d71eb0d048c778e21ea5afb39a1dc3f9', tabIndex: "-1", title: this.el.textContent, style: this.variant === 'custom'
+        return (h(Host, { key: '8ede968301d60515bc378c80141926ad75fab0cd', tabIndex: "-1", title: this.el.textContent, style: this.variant === 'custom'
                 ? {
                     '--ix-icon-button-color': (_b = this.chipColor) !== null && _b !== void 0 ? _b : this.color,
                 }
-                : {} }, h("div", { key: '82c39bab0cff12de6c830360ad06281993e4dac6', style: Object.assign({}, customStyle), class: {
+                : {} }, h("div", { key: 'ff82604fbd0ed7d74cdd753e1f1690f4bf67959f', style: Object.assign({}, customStyle), class: {
                 container: true,
                 outline: this.outline,
                 inactive: isInactive,
@@ -53,10 +53,10 @@ const Chip = class {
                 custom: this.variant === 'custom',
                 closable: this.closable,
                 icon: !!this.icon,
-            } }, h("ix-icon", { key: '359b67a50b9c3b438fc7884b7b6dab7027a284c4', class: {
+            } }, h("ix-icon", { key: '7e033b4f17e195a9ce75e3fbea992290180feb1f', class: {
                 'with-icon': true,
                 hidden: !this.icon,
-            }, name: this.icon, size: '24' }), h("span", { key: '800965a9f8c4013009ab1345eed7fea6cb6ae1f2', class: "slot-container" }, h("slot", { key: 'a03c010efbb304e6e70ddb990fb1e91ffa667e0b' })), isInactive === false && this.closable ? this.getCloseButton() : null)));
+            }, name: this.icon, size: '24' }), h("span", { key: '0d0bafd87e80596388ff1b74bcb9fa6024f6fe03', class: "slot-container" }, h("slot", { key: '057958812ca98820f4e039b7c5e2f016d27854c6' })), isInactive === false && this.closable ? this.getCloseButton() : null)));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/ix-col_4.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { r as registerInstance, f as forceUpdate, h, H as Host, c as createEvent, F as Fragment, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, f as forceUpdate, h, H as Host, c as createEvent, F as Fragment, g as getElement } from './index-5429f20b.js';
 import { m as matchBreakpoint } from './breakpoints-d5c2f627.js';
 import { D as DateTime_1, I as Info_1 } from './luxon-aa110584.js';
-import { O as OnListener } from './listener-2d09646e.js';
+import { O as OnListener } from './listener-4f3baab5.js';
 const colCss = ":host{position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px;padding:calc(var(--ix-layout-grid-gutter) * 0.5)}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";
 const IxColStyle0 = colCss;
@@ -505,7 +505,7 @@ const DatePicker = class {
         return rows;
     }
     render() {
-        return (h(Host, { key: 'e0df5b93b72e32d28ca514b5476f9846b22677c6' }, h("ix-date-time-card", { key: '774585ed8c03e12463112ca9e9e44bc30975e8fc', corners: this.corners, standaloneAppearance: this.standaloneAppearance }, h("div", { key: 'c3710f386338c7410ecb72b42e1a9d4e1d35a3f1', class: "header", slot: "header" }, h("ix-icon-button", { key: '70f05d88185459dae9b43e07cc353e61744958b5', onClick: () => this.changeToAdjacentMonth(-1), ghost: true, icon: "chevron-left", variant: "primary", class: "arrows" }), h("div", { key: 'a2237156758b789edd16a2328d12240a74a36d58', class: "selector" }, h("ix-button", { key: 'c6457d065b4847de944ca1e32d72591fc1531c15', ghost: true, ref: (ref) => (this.dropdownButtonRef = ref), "data-testid": "year-month-button" }, h("span", { key: '7ac517ad997291ce595e65a926223a2448c17e89', class: "fontSize capitalize" }, this.monthNames[this.selectedMonth], " ", this.selectedYear)), h("ix-dropdown", { key: '476fef76809be47bceefe2c37c355aebd32eaafe', "data-testid": "year-month-dropdown", class: "dropdown", trigger: this.dropdownButtonRef, ignoreRelatedSubmenu: true, placement: "bottom-start" }, h("div", { key: 'a3a8f2eb8154f7a88ceac13e86406df70d70d3c6', class: "wrapper" }, h("div", { key: 'ee6e1d288d11d95c953ff0e7c81a247939b2aa9d', "data-testid": "year-container", class: "overflow", onScroll: () => this.infiniteScrollYears(), ref: (ref) => (this.yearContainerRef = ref) }, this.renderYears()), h("div", { key: '7d1630d48c7934698cf4dbaa3fcd90c9873e6dff', class: "overflow", "data-testid": "month-container" }, this.monthNames.map((month, index) => (h("div", { key: month, ref: (ref) => {
+        return (h(Host, { key: '559881c8673da97e842398f4bcfe67ef5ff27794' }, h("ix-date-time-card", { key: '4550d5f5a242be0ff07110cc400ef12795475c5c', corners: this.corners, standaloneAppearance: this.standaloneAppearance }, h("div", { key: 'f10ccab02142ae7461ac4b4ba4e8a8eb57123438', class: "header", slot: "header" }, h("ix-icon-button", { key: '52b171c5e04a5bbcb0832f0e6033947735521601', onClick: () => this.changeToAdjacentMonth(-1), ghost: true, icon: "chevron-left", variant: "primary", class: "arrows" }), h("div", { key: 'c48d51b3f22c9862c8006520530559ed44d16372', class: "selector" }, h("ix-button", { key: '8c155fcbafb7c3f32dab3c9ebc912153813ce207', ghost: true, ref: (ref) => (this.dropdownButtonRef = ref), "data-testid": "year-month-button" }, h("span", { key: '74c9634e13886d26238b4ee2262314914b1e8cf8', class: "fontSize capitalize" }, this.monthNames[this.selectedMonth], " ", this.selectedYear)), h("ix-dropdown", { key: 'ba249019d78a59e65f3a479a3ea8315b5990bcac', "data-testid": "year-month-dropdown", class: "dropdown", trigger: this.dropdownButtonRef, ignoreRelatedSubmenu: true, placement: "bottom-start" }, h("div", { key: '39365087bbb4c4dd4e0329828f61a90a1247b744', class: "wrapper" }, h("div", { key: '017d16a032a473b0e791c8dc342b5e62481212e3', "data-testid": "year-container", class: "overflow", onScroll: () => this.infiniteScrollYears(), ref: (ref) => (this.yearContainerRef = ref) }, this.renderYears()), h("div", { key: '1bef58292da8545924f53fdbeddbc864936a56ef', class: "overflow", "data-testid": "month-container" }, this.monthNames.map((month, index) => (h("div", { key: month, ref: (ref) => {
                 if (month === this.monthNames[0]) {
                     this.firstMonthRef = ref;
                 }
@@ -519,12 +519,12 @@ const DatePicker = class {
                 hidden: this.tempYear !== this.selectedYear ||
                     this.tempMonth !== index,
                 checkPosition: true,
-            }, name: "single-check", size: "16" }), h("div", null, h("span", { class: "capitalize monthMargin" }, `${month} ${this.tempYear}`))))))))), h("ix-icon-button", { key: '8526edfce43dd656bc563143497be067752f1072', onClick: () => this.changeToAdjacentMonth(1), ghost: true, icon: "chevron-right", variant: "primary", class: "arrows" })), h("div", { key: '42a4cd7d42d633f3e1fb44a0d6630744a24ff6b2', class: "grid" }, h("div", { key: 'bf5925eb777f1f751b26044811bb9cff880811bf', class: "calendar-item week-day" }), this.dayNames.map((name) => (h("div", { key: name, class: "calendar-item week-day" }, name.slice(0, 3)))), this.calendar.map((week) => {
+            }, name: "single-check", size: "16" }), h("div", null, h("span", { class: "capitalize monthMargin" }, `${month} ${this.tempYear}`))))))))), h("ix-icon-button", { key: 'f414faea937a05dd2690e82d01daf1f444fbce25', onClick: () => this.changeToAdjacentMonth(1), ghost: true, icon: "chevron-right", variant: "primary", class: "arrows" })), h("div", { key: 'b79a961fbfc8c8dd821a83ab172dd7146acc5ade', class: "grid" }, h("div", { key: '7651643c6320b8598b52ffaa45dc70498854d1ad', class: "calendar-item week-day" }), this.dayNames.map((name) => (h("div", { key: name, class: "calendar-item week-day" }, name.slice(0, 3)))), this.calendar.map((week) => {
             return (h(Fragment, null, h("div", { class: "calendar-item week-number" }, week.weekNumber), week.dayNumbers.map((day) => (h("div", { key: day, id: `day-cell-${day}`, "date-calender-day": true, class: this.getDayClasses(day), onClick: () => this.selectDay(day), onKeyUp: (e) => e.key === 'Enter' && this.selectDay(day), tabIndex: day === this.focusedDay ? 0 : -1, onFocus: () => this.onDayFocus(), onBlur: () => this.onDayBlur() }, day)))));
-        })), h("div", { key: '2d8f75a01a7d2f9b02293bf7fa1402bec6ee4420', class: {
+        })), h("div", { key: '0e6b9845bfdb760777cbd0f2f8419aeb5b667799', class: {
                 button: true,
                 hidden: !this.range || !this.standaloneAppearance,
-            } }, h("ix-button", { key: '8aef28eca063bcda077e0590758c0bd17d16428f', onClick: () => this.onDone() }, this.textSelectDate || this.i18nDone)))));
+            } }, h("ix-button", { key: 'bb02236b3e41f3168aa2d5aad2c8e4aa9af90a49', onClick: () => this.onDone() }, this.textSelectDate || this.i18nDone)))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {
@@ -549,12 +549,12 @@ const LayoutGrid = class {
         this.columns = 12;
     }
     render() {
-        return (h(Host, { key: 'e04816c23d075d12ae1cf1cd935322b48c24e249', class: {
+        return (h(Host, { key: 'd77291cf3cca2fd4a61c8998a095923f195b3d8f', class: {
                 'no-margin': this.noMargin,
             }, style: {
                 '--ix-layout-grid-columns': `${this.columns}`,
                 '--ix-layout-grid-gutter': `${this.gap}px`,
-            } }, h("slot", { key: '5068a91f517f248963912a57ff0a0890cfee9410' })));
+            } }, h("slot", { key: 'c149d8a794c75e48d748cccbc3cb9aada30c30ef' })));
     }
 };
 LayoutGrid.style = IxLayoutGridStyle0;
@@ -567,7 +567,7 @@ const Row = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '1ffd343609151d842c357f2e7663e4c772b8ef5a' }, h("slot", { key: 'f3c73ee49974fb8baa706a9b699fe703166f2f96' })));
+        return (h(Host, { key: 'b8813e92c151d3f0a6d063a4f03b50f384ef1127' }, h("slot", { key: '5246811d7fb18593758b07a32e58fee15ba34d51' })));
     }
 };
 Row.style = IxRowStyle0;

package/dist/esm/ix-content-header.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-5429f20b.js';
 const contentHeaderCss = ":host{display:flex;flex-direction:row;align-items:flex-start;padding:0px}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0%}:host .subtitle{margin-top:0.5rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";
 const IxContentHeaderStyle0 = contentHeaderCss;

package/dist/esm/ix-content.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-5429f20b.js';
 import { h as hasSlottedElements } from './shadow-dom-60e9243d.js';
 const contentCss = ":host{display:flex;flex-direction:column;position:relative;padding:1.5rem 0rem 0.25rem 2rem;width:100%;height:100%;overflow:hidden}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .content{flex-grow:1;overflow:auto;padding-right:1.5rem}:host .content-header.slotted{margin-bottom:1rem;padding-right:1.5rem}";
@@ -13,12 +13,12 @@ const Content = class {
         return this.hostElement.shadowRoot.querySelector('.content-header slot');
     }
     render() {
-        return (h(Host, { key: '7298c4abd09355a3ee73d4a236e7025a72720cf7' }, h("div", { key: 'd7ba3fbc44d66ba0ae4e747a5cc5d77c7388b138', class: {
+        return (h(Host, { key: '61f9325ce908e838c83a286da21471c8f081cf7e' }, h("div", { key: '66adfdde8a6f7e4cec46bc8ac3111f9fd344462c', class: {
                 'content-header': true,
                 slotted: this.isContentHeaderSlotted,
-            } }, h("slot", { key: '233200870318a9276d3e0d5c5d5d03980fbe1793', name: "header", onSlotchange: () => {
+            } }, h("slot", { key: '00a1dffb70b39ae24c7ffc7a02649f5c870e95e9', name: "header", onSlotchange: () => {
                 this.isContentHeaderSlotted = hasSlottedElements(this.contentHeaderSlot);
-            } })), h("div", { key: 'ee7f8ceb237b4c33d578262c74d4eca9bdf36070', class: "content" }, h("slot", { key: 'fbbf86e9c454f04dbe33a9b0456f1cd02ec72c02' }))));
+            } })), h("div", { key: 'd27dfeb1305abb6cacdf16a5476e5d7b32d6f3ba', class: "content" }, h("slot", { key: '054a581bc21257f46c3377c53c0e8dbacc4321b5' }))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/ix-css-grid-item.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 const cssGridItemCss = ":host{display:block;position:relative}:host ::slotted(*){height:100%;width:100%}";
 const IxCssGridItemStyle0 = cssGridItemCss;
@@ -11,7 +11,7 @@ const CssGridItem = class {
     render() {
         const style = {};
         style['grid-area'] = this.itemName;
-        return (h(Host, { key: '7eb12cf19328a03e78db24d81bc88158b37e7e4c', style: style }, h("slot", { key: '123dfc3d9459ae11ed038f5c20db4597f6fb6c42' })));
+        return (h(Host, { key: '5e5e54a887244e85620d34eb2759fadf20883dbd', style: style }, h("slot", { key: '14c51da716e0715e205f28181a3d51813ad88027' })));
     }
 };
 CssGridItem.style = IxCssGridItemStyle0;

package/dist/esm/ix-css-grid.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 /*
  * SPDX-FileCopyrightText: 2023 Siemens AG

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-5429f20b.js';
 import { D as DateTime_1 } from './luxon-aa110584.js';
 const dateDropdownCss = ":host{display:inline-block;position:relative}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}@media (max-width: 48em){:host .min-width{width:-moz-min-content;width:min-content}}@media (min-width: 48em){:host .border-right{border-right:var(--theme-x-weak-bdr-2)}}:host ix-button{width:100%}:host .max-height{max-height:-moz-max-content;max-height:max-content}:host .no-margin{margin:0;padding:0}:host .pull-right{float:right;padding:0.25rem 1rem}";
@@ -133,14 +133,14 @@ const DateDropdown = class {
                     this.datePickerTouched) {
                     this.onDateSelect(this.currentRangeValue);
                 }
-            } }, h("ix-layout-grid", { key: 'b8d09d4ddac4960ee2ea23ed9ec6bf5ecb59c5ae', "no-margin": "true" }, h("ix-row", { key: 'fa9099679383056a268265eec7316ced4cd0085a' }, ((_a = this.dateRangeOptions) === null || _a === void 0 ? void 0 : _a.length) > 1 && (h("ix-col", { class: {
+            } }, h("ix-layout-grid", { key: 'b8d09d4ddac4960ee2ea23ed9ec6bf5ecb59c5ae', "no-margin": "true" }, h("ix-row", { key: 'fa9099679383056a268265eec7316ced4cd0085a' }, ((_a = this.dateRangeOptions) === null || _a === void 0 ? void 0 : _a.length) > 1 && (h("ix-col", { key: '9107d5b1053c93d662568b0efa7bb89d60b80ed6', class: {
                 'no-margin': true,
                 'border-right': this.selectedDateRangeId === 'custom',
-            } }, this.dateRangeOptions.map((dateRangeOption) => (h("ix-dropdown-item", { label: dateRangeOption.label, onClick: () => this.onRangeListSelect(dateRangeOption.id), checked: this.selectedDateRangeId === dateRangeOption.id }))), h("div", { hidden: !this.customRangeAllowed }, h("ix-dropdown-item", { label: this.i18nCustomItem, checked: this.selectedDateRangeId === 'custom', onClick: () => this.onRangeListSelect('custom') })))), h("ix-col", { key: '614659cb9511b4bf5267e9ecb3c5a122d91e103a', class: "no-margin" }, this.selectedDateRangeId === 'custom' && (h(Fragment, null, h("ix-date-picker", { standaloneAppearance: false, onDateChange: (e) => {
+            } }, this.dateRangeOptions.map((dateRangeOption) => (h("ix-dropdown-item", { label: dateRangeOption.label, onClick: () => this.onRangeListSelect(dateRangeOption.id), checked: this.selectedDateRangeId === dateRangeOption.id }))), h("div", { key: '0a2993cbe4d995e4dd6345e8f1b4e32cb39997d8', hidden: !this.customRangeAllowed }, h("ix-dropdown-item", { key: '7bddded3f580f85c9222e563df5ef80a6a5470ed', label: this.i18nCustomItem, checked: this.selectedDateRangeId === 'custom', onClick: () => this.onRangeListSelect('custom') })))), h("ix-col", { key: 'fe530809dc0eff3d95e4305ef48d8f46ebaf2a20', class: "no-margin" }, this.selectedDateRangeId === 'custom' && (h(Fragment, { key: '6fb55cd06c7467fa1277476177b8db788fc6e614' }, h("ix-date-picker", { key: 'dac5bfab1baa592aaf0db6aaec80b44592c048f9', standaloneAppearance: false, onDateChange: (e) => {
                 e.stopPropagation();
                 this.currentRangeValue = Object.assign(Object.assign({}, e.detail), { id: 'custom' });
                 this.datePickerTouched = true;
-            }, onDateRangeChange: (e) => e.stopPropagation(), format: this.format, range: this.range, from: this.from || ((_b = this.currentRangeValue) === null || _b === void 0 ? void 0 : _b.from), to: this.to || ((_c = this.currentRangeValue) === null || _c === void 0 ? void 0 : _c.to), minDate: this.minDate, maxDate: this.maxDate, today: this.today }), h("div", { class: "pull-right" }, h("ix-button", { onClick: () => {
+            }, onDateRangeChange: (e) => e.stopPropagation(), format: this.format, range: this.range, from: this.from || ((_b = this.currentRangeValue) === null || _b === void 0 ? void 0 : _b.from), to: this.to || ((_c = this.currentRangeValue) === null || _c === void 0 ? void 0 : _c.to), minDate: this.minDate, maxDate: this.maxDate, today: this.today }), h("div", { key: '613a674664d2b55a8012fc2b869021e8dfeb10b3', class: "pull-right" }, h("ix-button", { key: '9d5470cfb8ddb6e086bb821baaefb25723777337', onClick: () => {
                 this.onDateSelect(this.currentRangeValue);
             } }, this.i18nDone))))))))));
     }

package/dist/esm/ix-date-dropdown.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-date-dropdown.entry.js","mappings":"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","names":["DateTime"],"sources":["src/components/date-dropdown/date-dropdown.scss?tag=ix-date-dropdown&encapsulation=shadow","src/components/date-dropdown/date-dropdown.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: inline-block;\n position: relative;\n\n @media (max-width: 48em) {\n .min-width {\n width: min-content;\n }\n }\n\n @media (min-width: 48em) {\n .border-right {\n border-right: var(--theme-x-weak-bdr-2);\n }\n }\n\n ix-button {\n width: 100%;\n }\n\n .max-height {\n max-height: max-content;\n }\n\n .no-margin {\n margin: 0;\n padding: 0;\n }\n\n .pull-right {\n float: right;\n padding: $tiny-space $default-space;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\n\nexport type DateDropdownOption = {\n id: string;\n label: string;\n from: string;\n to: string;\n};\n\nexport type DateRangeChangeEvent = {\n id: string;\n from: string;\n to: string;\n};\n\n/\n @since 2.1.0\n /\n@Component({\n tag: 'ix-date-dropdown',\n styleUrl: 'date-dropdown.scss',\n shadow: true,\n})\nexport class DateDropdown {\n @Element() hostElement: HTMLIxDateDropdownElement;\n\n /\n Disable the button that opens the dropdown containing the date picker.\n \n @since 2.3.0\n /\n @Prop() disabled = false;\n\n /\n Date format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n /\n @Prop() format = 'yyyy/LL/dd';\n\n /\n If true a range of dates can be selected.\n /\n @Prop() range = true;\n\n /\n Picker date. If the picker is in range mode this property is the start date.\n * If set to `null` no default start date will be pre-selected.\n \n Format is based on `format`\n /\n @Prop() from: string;\n\n /\n Picker date. If the picker is in range mode this property is the end date.\n * If the picker is not in range mode leave this value `null`\n \n Format is based on `format`\n /\n @Prop() to: string;\n\n /\n The earliest date that can be selected by the date picker.\n * If not set there will be no restriction.\n /\n @Prop() minDate: string;\n\n /\n The latest date that can be selected by the date picker.\n * If not set there will be no restriction.\n /\n @Prop() maxDate: string;\n\n /\n Used to set the initial select date range as well as the button name,\n * if not set or no according date range label is found, nothing will be selected\n /\n @Prop() dateRangeId = 'custom';\n @Watch('dateRangeId')\n @Watch('to')\n @Watch('from')\n onDateRangeIdChange() {\n this.onRangeListSelect(this.dateRangeId);\n this.updateCurrentDate();\n this.setDateRangeSelection(this.dateRangeId);\n\n this.onDateSelect({\n from: this.currentRangeValue.from,\n to: this.currentRangeValue.to,\n id: this.currentRangeValue.id,\n });\n }\n\n /\n Controls whether the user is allowed to pick custom date ranges in the component.\n * When set to 'true', the user can select a custom date range using the date picker.\n * When set to 'false', only predefined time date ranges are available for selection.\n /\n @Prop() customRangeAllowed = true;\n\n /\n An array of predefined date range options for the date picker.\n * Each option is an object with a label describing the range and a function\n * that returns the start and end dates of the range as a DateRangeOption object.\n \n Example format:\n * {\n * id: 'some unique id',\n * label: 'Name of the range',\n * from: undefined, to: '2023/03/29'\n * },\n * // ... other predefined date range options ...\n /\n @Prop() dateRangeOptions: DateDropdownOption[] = [];\n @Watch('dateRangeOptions')\n onDateRangeOptionsChange() {\n this.initialize();\n this.onDateRangeIdChange();\n }\n\n /\n Text for custom dropdown item. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-custom-item' }) i18nCustomItem = 'Custom...';\n\n /\n Text for the done button. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-done' }) i18nDone = 'Done';\n\n /\n Text for the done button. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-no-range' }) i18nNoRange = 'No range set';\n\n /* @internal /\n @Prop() today = DateTime.now().toISO();\n\n /\n EventEmitter for date range change events.\n \n This event is emitted when the date range changes within the component.\n * The event payload contains information about the selected date range.\n /\n @Event() private dateRangeChange: EventEmitter<DateRangeChangeEvent>;\n\n @State() private selectedDateRangeId: 'custom' \| (string & {});\n @State() private currentRangeValue: {\n from: string;\n to: string;\n id: string;\n };\n @State() private triggerRef: HTMLElement;\n\n @Watch('disabled')\n onDisabledChange() {\n if (this.disabled) {\n this.closeDropdown();\n }\n }\n private datePickerTouched = false;\n\n componentWillLoad() {\n this.initialize();\n this.setDateRangeSelection(this.dateRangeId);\n }\n\n /\n Retrieves the currently selected date range from the component.\n * This method returns the selected date range as a `DateChangeEvent` object.\n */\n @Method()\n public async getDateRange(): Promise<DateRangeChangeEvent> {\n return this.currentRangeValue;\n }\n\n private initialize() {\n const isCustomRange =\n this.dateRangeId === 'custom' \|\|\n (!this.dateRangeId && !!this.from && !!this.to);\n\n if (isCustomRange && this.customRangeAllowed) {\n this.selectedDateRangeId = 'custom';\n this.updateCurrentDate();\n\n return;\n }\n const isValidConfiguration = !isCustomRange && !this.from;\n if (!isValidConfiguration) {\n console.warn(\n '\"from\" and \"range-date-id\" is provided this is an invalid combination. Using \"custom\".'\n );\n\n this.selectedDateRangeId = 'custom';\n this.updateCurrentDate();\n\n return;\n }\n }\n\n private updateCurrentDate() {\n this.currentRangeValue = {\n id: this.selectedDateRangeId,\n from: this.from,\n to: this.to,\n };\n }\n\n private onDateSelect(\n rangeValue: { from: string; to: string; id: string },\n preserveDropdown = true\n ) {\n this.dateRangeChange.emit(rangeValue);\n\n if (preserveDropdown) {\n this.closeDropdown();\n }\n\n this.datePickerTouched = false;\n }\n\n private onRangeListSelect(id: string) {\n if (this.setDateRangeSelection(id)) {\n this.onDateSelect(this.currentRangeValue);\n }\n }\n\n private setDateRangeSelection(id: string) {\n this.selectedDateRangeId = id;\n const option = this.dateRangeOptions.find((range) => range.id === id);\n\n if (option) {\n this.currentRangeValue = option;\n }\n\n return option;\n }\n\n private closeDropdown() {\n this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;\n }\n\n private getButtonLabel() {\n if (this.selectedDateRangeId === 'custom' && this.currentRangeValue?.from) {\n let range = this.currentRangeValue.from;\n\n if (this.currentRangeValue.to) {\n range += ` - ${this.currentRangeValue.to}`;\n }\n\n return range;\n }\n\n if (!this.selectedDateRangeId) {\n return this.i18nNoRange;\n }\n\n if (!this.dateRangeOptions \|\| this.dateRangeOptions?.length === 0) {\n return this.i18nNoRange;\n }\n\n const option = this.dateRangeOptions.find(\n (option) => option.id === this.selectedDateRangeId\n );\n\n if (!option) {\n console.error(\n `Cannot find range option with id ${this.selectedDateRangeId}`\n );\n return this.i18nNoRange;\n }\n\n return option.label;\n }\n\n render() {\n return (\n <Host>\n <ix-button\n data-testid=\"date-dropdown-trigger\"\n data-date-dropdown-trigger\n variant=\"primary\"\n icon=\"history\"\n ref={(ref) => (this.triggerRef = ref)}\n disabled={this.disabled}\n >\n {this.getButtonLabel()}\n </ix-button>\n <ix-dropdown\n data-testid=\"date-dropdown\"\n data-date-dropdown\n class=\"min-width max-height\"\n trigger={this.triggerRef}\n closeBehavior=\"outside\"\n placement=\"bottom-start\"\n onShowChanged={({ detail: show }) => {\n if (\n !show &&\n this.selectedDateRangeId === 'custom' &&\n this.datePickerTouched\n ) {\n this.onDateSelect(this.currentRangeValue);\n }\n }}\n >\n <ix-layout-grid no-margin=\"true\">\n <ix-row>\n {this.dateRangeOptions?.length > 1 && (\n <ix-col\n class={{\n 'no-margin': true,\n 'border-right': this.selectedDateRangeId === 'custom',\n }}\n >\n {this.dateRangeOptions.map((dateRangeOption) => (\n <ix-dropdown-item\n label={dateRangeOption.label}\n onClick={() => this.onRangeListSelect(dateRangeOption.id)}\n checked={this.selectedDateRangeId === dateRangeOption.id}\n ></ix-dropdown-item>\n ))}\n <div hidden={!this.customRangeAllowed}>\n <ix-dropdown-item\n label={this.i18nCustomItem}\n checked={this.selectedDateRangeId === 'custom'}\n onClick={() => this.onRangeListSelect('custom')}\n ></ix-dropdown-item>\n </div>\n </ix-col>\n )}\n <ix-col class=\"no-margin\">\n {this.selectedDateRangeId === 'custom' && (\n <Fragment>\n <ix-date-picker\n standaloneAppearance={false}\n onDateChange={(e) => {\n e.stopPropagation();\n this.currentRangeValue = {\n ...e.detail,\n id: 'custom',\n };\n this.datePickerTouched = true;\n }}\n onDateRangeChange={(e) => e.stopPropagation()}\n format={this.format}\n range={this.range}\n from={this.from \|\| this.currentRangeValue?.from}\n to={this.to \|\| this.currentRangeValue?.to}\n minDate={this.minDate}\n maxDate={this.maxDate}\n today={this.today}\n ></ix-date-picker>\n <div class=\"pull-right\">\n <ix-button\n onClick={() => {\n this.onDateSelect(this.currentRangeValue);\n }}\n >\n {this.i18nDone}\n </ix-button>\n </div>\n </Fragment>\n )}\n </ix-col>\n </ix-row>\n </ix-layout-grid>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-date-dropdown.entry.js","mappings":"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","names":["DateTime"],"sources":["src/components/date-dropdown/date-dropdown.scss?tag=ix-date-dropdown&encapsulation=shadow","src/components/date-dropdown/date-dropdown.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: inline-block;\n position: relative;\n\n @media (max-width: 48em) {\n .min-width {\n width: min-content;\n }\n }\n\n @media (min-width: 48em) {\n .border-right {\n border-right: var(--theme-x-weak-bdr-2);\n }\n }\n\n ix-button {\n width: 100%;\n }\n\n .max-height {\n max-height: max-content;\n }\n\n .no-margin {\n margin: 0;\n padding: 0;\n }\n\n .pull-right {\n float: right;\n padding: $tiny-space $default-space;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\n\nexport type DateDropdownOption = {\n id: string;\n label: string;\n from: string;\n to: string;\n};\n\nexport type DateRangeChangeEvent = {\n id: string;\n from: string;\n to: string;\n};\n\n/\n @since 2.1.0\n /\n@Component({\n tag: 'ix-date-dropdown',\n styleUrl: 'date-dropdown.scss',\n shadow: true,\n})\nexport class DateDropdown {\n @Element() hostElement: HTMLIxDateDropdownElement;\n\n /\n Disable the button that opens the dropdown containing the date picker.\n \n @since 2.3.0\n /\n @Prop() disabled = false;\n\n /\n Date format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n /\n @Prop() format = 'yyyy/LL/dd';\n\n /\n If true a range of dates can be selected.\n /\n @Prop() range = true;\n\n /\n Picker date. If the picker is in range mode this property is the start date.\n * If set to `null` no default start date will be pre-selected.\n \n Format is based on `format`\n /\n @Prop() from: string;\n\n /\n Picker date. If the picker is in range mode this property is the end date.\n * If the picker is not in range mode leave this value `null`\n \n Format is based on `format`\n /\n @Prop() to: string;\n\n /\n The earliest date that can be selected by the date picker.\n * If not set there will be no restriction.\n /\n @Prop() minDate: string;\n\n /\n The latest date that can be selected by the date picker.\n * If not set there will be no restriction.\n /\n @Prop() maxDate: string;\n\n /\n Used to set the initial select date range as well as the button name,\n * if not set or no according date range label is found, nothing will be selected\n /\n @Prop() dateRangeId = 'custom';\n @Watch('dateRangeId')\n @Watch('to')\n @Watch('from')\n onDateRangeIdChange() {\n this.onRangeListSelect(this.dateRangeId);\n this.updateCurrentDate();\n this.setDateRangeSelection(this.dateRangeId);\n\n this.onDateSelect({\n from: this.currentRangeValue.from,\n to: this.currentRangeValue.to,\n id: this.currentRangeValue.id,\n });\n }\n\n /\n Controls whether the user is allowed to pick custom date ranges in the component.\n * When set to 'true', the user can select a custom date range using the date picker.\n * When set to 'false', only predefined time date ranges are available for selection.\n /\n @Prop() customRangeAllowed = true;\n\n /\n An array of predefined date range options for the date picker.\n * Each option is an object with a label describing the range and a function\n * that returns the start and end dates of the range as a DateRangeOption object.\n \n Example format:\n * {\n * id: 'some unique id',\n * label: 'Name of the range',\n * from: undefined, to: '2023/03/29'\n * },\n * // ... other predefined date range options ...\n /\n @Prop() dateRangeOptions: DateDropdownOption[] = [];\n @Watch('dateRangeOptions')\n onDateRangeOptionsChange() {\n this.initialize();\n this.onDateRangeIdChange();\n }\n\n /\n Text for custom dropdown item. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-custom-item' }) i18nCustomItem = 'Custom...';\n\n /\n Text for the done button. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-done' }) i18nDone = 'Done';\n\n /\n Text for the done button. Will be used for translation.\n /\n @Prop({ attribute: 'i18n-no-range' }) i18nNoRange = 'No range set';\n\n /* @internal /\n @Prop() today = DateTime.now().toISO();\n\n /\n EventEmitter for date range change events.\n \n This event is emitted when the date range changes within the component.\n * The event payload contains information about the selected date range.\n /\n @Event() private dateRangeChange: EventEmitter<DateRangeChangeEvent>;\n\n @State() private selectedDateRangeId: 'custom' \| (string & {});\n @State() private currentRangeValue: {\n from: string;\n to: string;\n id: string;\n };\n @State() private triggerRef: HTMLElement;\n\n @Watch('disabled')\n onDisabledChange() {\n if (this.disabled) {\n this.closeDropdown();\n }\n }\n private datePickerTouched = false;\n\n componentWillLoad() {\n this.initialize();\n this.setDateRangeSelection(this.dateRangeId);\n }\n\n /\n Retrieves the currently selected date range from the component.\n * This method returns the selected date range as a `DateChangeEvent` object.\n */\n @Method()\n public async getDateRange(): Promise<DateRangeChangeEvent> {\n return this.currentRangeValue;\n }\n\n private initialize() {\n const isCustomRange =\n this.dateRangeId === 'custom' \|\|\n (!this.dateRangeId && !!this.from && !!this.to);\n\n if (isCustomRange && this.customRangeAllowed) {\n this.selectedDateRangeId = 'custom';\n this.updateCurrentDate();\n\n return;\n }\n const isValidConfiguration = !isCustomRange && !this.from;\n if (!isValidConfiguration) {\n console.warn(\n '\"from\" and \"range-date-id\" is provided this is an invalid combination. Using \"custom\".'\n );\n\n this.selectedDateRangeId = 'custom';\n this.updateCurrentDate();\n\n return;\n }\n }\n\n private updateCurrentDate() {\n this.currentRangeValue = {\n id: this.selectedDateRangeId,\n from: this.from,\n to: this.to,\n };\n }\n\n private onDateSelect(\n rangeValue: { from: string; to: string; id: string },\n preserveDropdown = true\n ) {\n this.dateRangeChange.emit(rangeValue);\n\n if (preserveDropdown) {\n this.closeDropdown();\n }\n\n this.datePickerTouched = false;\n }\n\n private onRangeListSelect(id: string) {\n if (this.setDateRangeSelection(id)) {\n this.onDateSelect(this.currentRangeValue);\n }\n }\n\n private setDateRangeSelection(id: string) {\n this.selectedDateRangeId = id;\n const option = this.dateRangeOptions.find((range) => range.id === id);\n\n if (option) {\n this.currentRangeValue = option;\n }\n\n return option;\n }\n\n private closeDropdown() {\n this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;\n }\n\n private getButtonLabel() {\n if (this.selectedDateRangeId === 'custom' && this.currentRangeValue?.from) {\n let range = this.currentRangeValue.from;\n\n if (this.currentRangeValue.to) {\n range += ` - ${this.currentRangeValue.to}`;\n }\n\n return range;\n }\n\n if (!this.selectedDateRangeId) {\n return this.i18nNoRange;\n }\n\n if (!this.dateRangeOptions \|\| this.dateRangeOptions?.length === 0) {\n return this.i18nNoRange;\n }\n\n const option = this.dateRangeOptions.find(\n (option) => option.id === this.selectedDateRangeId\n );\n\n if (!option) {\n console.error(\n `Cannot find range option with id ${this.selectedDateRangeId}`\n );\n return this.i18nNoRange;\n }\n\n return option.label;\n }\n\n render() {\n return (\n <Host>\n <ix-button\n data-testid=\"date-dropdown-trigger\"\n data-date-dropdown-trigger\n variant=\"primary\"\n icon=\"history\"\n ref={(ref) => (this.triggerRef = ref)}\n disabled={this.disabled}\n >\n {this.getButtonLabel()}\n </ix-button>\n <ix-dropdown\n data-testid=\"date-dropdown\"\n data-date-dropdown\n class=\"min-width max-height\"\n trigger={this.triggerRef}\n closeBehavior=\"outside\"\n placement=\"bottom-start\"\n onShowChanged={({ detail: show }) => {\n if (\n !show &&\n this.selectedDateRangeId === 'custom' &&\n this.datePickerTouched\n ) {\n this.onDateSelect(this.currentRangeValue);\n }\n }}\n >\n <ix-layout-grid no-margin=\"true\">\n <ix-row>\n {this.dateRangeOptions?.length > 1 && (\n <ix-col\n class={{\n 'no-margin': true,\n 'border-right': this.selectedDateRangeId === 'custom',\n }}\n >\n {this.dateRangeOptions.map((dateRangeOption) => (\n <ix-dropdown-item\n label={dateRangeOption.label}\n onClick={() => this.onRangeListSelect(dateRangeOption.id)}\n checked={this.selectedDateRangeId === dateRangeOption.id}\n ></ix-dropdown-item>\n ))}\n <div hidden={!this.customRangeAllowed}>\n <ix-dropdown-item\n label={this.i18nCustomItem}\n checked={this.selectedDateRangeId === 'custom'}\n onClick={() => this.onRangeListSelect('custom')}\n ></ix-dropdown-item>\n </div>\n </ix-col>\n )}\n <ix-col class=\"no-margin\">\n {this.selectedDateRangeId === 'custom' && (\n <Fragment>\n <ix-date-picker\n standaloneAppearance={false}\n onDateChange={(e) => {\n e.stopPropagation();\n this.currentRangeValue = {\n ...e.detail,\n id: 'custom',\n };\n this.datePickerTouched = true;\n }}\n onDateRangeChange={(e) => e.stopPropagation()}\n format={this.format}\n range={this.range}\n from={this.from \|\| this.currentRangeValue?.from}\n to={this.to \|\| this.currentRangeValue?.to}\n minDate={this.minDate}\n maxDate={this.maxDate}\n today={this.today}\n ></ix-date-picker>\n <div class=\"pull-right\">\n <ix-button\n onClick={() => {\n this.onDateSelect(this.currentRangeValue);\n }}\n >\n {this.i18nDone}\n </ix-button>\n </div>\n </Fragment>\n )}\n </ix-col>\n </ix-row>\n </ix-layout-grid>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/ix-date-time-card.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 const dateTimeCardCss = ":host{}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .card{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset;display:flex;flex-direction:column}:host .card.standaloneAppearance{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0 rgba(0, 0, 0, 0.1);border-radius:4px}:host .card.rounded{border-radius:4px}:host .card.left{border-radius:4px 0 0 4px;height:100%}:host .card.right{border-radius:0 4px 4px 0;height:100%}:host .card .header{padding:1rem;flex:0 1 auto}:host .card .separator{border:1px solid var(--theme-datepicker-separator--background);width:100%;flex:0 1 auto}:host .card .content{padding:0 0.75rem 0.75rem 0.75rem;flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}";
 const IxDateTimeCardStyle0 = dateTimeCardCss;
@@ -22,7 +22,7 @@ const DateTimeCard = class {
         };
     }
     render() {
-        return (h(Host, { key: '40541d8514911fcfec7620c3542774eb189d1687' }, h("div", { key: 'd07d67a70360f31c67e3f220446e92f0266a5fbe', class: this.cardClasses() }, h("div", { key: '60681672b69bf55d3106eec4cf2a1d811c0cf637', class: "header" }, h("slot", { key: '5042ffc5ea4e264baa793dddd8fc071800f3eeaa', name: "header" })), h("div", { key: '68371c4b3fb5f66f291482dd44e738ba64813fb4', class: "separator" }), h("div", { key: 'a6dbde0e6f11d298bd78dfbaec884b1272e564c4', class: "content" }, h("slot", { key: '5537b6cca4feb31830e9d654785bc9c8258455ba' })))));
+        return (h(Host, { key: 'b699133fd52ef092307f90f515aa7046a99cd21f' }, h("div", { key: '938a7c031dae445fee084ea8c1390627b1743bfb', class: this.cardClasses() }, h("div", { key: '1d20df2d528d8219a7fcea504f63da8a07a4fe74', class: "header" }, h("slot", { key: '0dadc7cb6813210aa9de4299f86a2e1b8ed01764', name: "header" })), h("div", { key: '79a1560d676b4d7583edf9c2fc14be75d4a35514', class: "separator" }), h("div", { key: 'e0f633c51c1167383fc9f75d153cfb20ee77bc39', class: "content" }, h("slot", { key: 'eb8a5596284dd1a461d7f83abe3ec94ac0ebe76c' })))));
     }
 };
 DateTimeCard.style = IxDateTimeCardStyle0;

package/dist/esm/ix-datetime-picker.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-5429f20b.js';
 const datetimePickerCss = ":host{display:block;background-color:var(--theme-menu--background);border-radius:4px;position:relative;width:-moz-min-content;width:min-content}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .min-width{width:-moz-min-content;width:min-content}:host .no-padding{padding:0}:host .flex{display:flex;justify-content:center;flex-direction:column}@media (min-width: 576px){:host{min-width:-moz-max-content;min-width:max-content}:host .btn-select-date{left:unset !important}}:host .individual{box-shadow:none;border:none}:host .btn-select-date{position:absolute;bottom:1rem;right:1rem;left:1rem}";
 const IxDatetimePickerStyle0 = datetimePickerCss;
@@ -53,7 +53,7 @@ const DatetimePicker = class {
         this.timeChange.emit(time);
     }
     render() {
-        return (h(Host, { key: 'ced15d6ebee8f55870b7fc36283556fae3cf72fd' }, h("ix-layout-grid", { key: '58e9916ce84c7ee9a3f7b930718a396cb76106f2', class: "no-padding" }, h("ix-row", { key: '593109d02398fd179303b7bc3030b13b5701f769' }, h("ix-col", { key: '4b6a39a1ba04096d522fc7943f72b14901e71006', class: "no-padding" }, h("ix-date-picker", { key: '5ee0c7a5a45749104a23e5f3eeea44e33bd7a815', ref: (ref) => (this.datePickerElement = ref), corners: "left", range: this.range, onDateChange: (event) => this.onDateChange(event), from: this.from, to: this.to, format: this.dateFormat, minDate: this.minDate, maxDate: this.maxDate, weekStartIndex: this.weekStartIndex, standaloneAppearance: false, locale: this.locale })), h("ix-col", { key: '6cbefe036d4a48efaca5a9b1a67ef801feab449f', class: "no-padding" }, h("ix-time-picker", { key: '285d034e938063753075f7f55d4f63a211483f18', class: "min-width", ref: (ref) => (this.timePickerElement = ref), corners: "right", standaloneAppearance: false, showHour: this.showHour, showMinutes: this.showMinutes, showSeconds: this.showSeconds, onTimeChange: (event) => this.onTimeChange(event), format: this.timeFormat, time: this.time }))), h("ix-row", { key: '24ab1e4d0cf246456d34744d14404c6bbb629d06' }, h("ix-col", { key: '26daaa468b4d80e1c124f1776b7b773df4dd9b97' }, h("ix-button", { key: '38f073daffa3f337e26a319d1721f67ee28db729', class: "btn-select-date btn-md-width", onClick: () => this.onDone() }, this.textSelectDate || this.i18nDone))))));
+        return (h(Host, { key: '245fa3202c8983bc8eff53d4078c2a6a8daa0810' }, h("ix-layout-grid", { key: '1bc34611a653f3dea08ee0be6a336766da38b914', class: "no-padding" }, h("ix-row", { key: '26eef283266f46fb5a19fcaf1d78f985119cec3a' }, h("ix-col", { key: 'd4ac83db8977067d5c178fb48eac1acc1adca898', class: "no-padding" }, h("ix-date-picker", { key: '967af43189787bc677ff273de023b43d9e3b0019', ref: (ref) => (this.datePickerElement = ref), corners: "left", range: this.range, onDateChange: (event) => this.onDateChange(event), from: this.from, to: this.to, format: this.dateFormat, minDate: this.minDate, maxDate: this.maxDate, weekStartIndex: this.weekStartIndex, standaloneAppearance: false, locale: this.locale })), h("ix-col", { key: '53bbc9d021687f71f211b6d4091e421b7374ae56', class: "no-padding" }, h("ix-time-picker", { key: 'da5a855b94d37b1424de7f10804e707e9d082139', class: "min-width", ref: (ref) => (this.timePickerElement = ref), corners: "right", standaloneAppearance: false, showHour: this.showHour, showMinutes: this.showMinutes, showSeconds: this.showSeconds, onTimeChange: (event) => this.onTimeChange(event), format: this.timeFormat, time: this.time }))), h("ix-row", { key: 'aa564cb9741fda50e046a508cb9e2ad985ed11d7' }, h("ix-col", { key: 'a13d931565a1165e262070e6e3d637fce6da38c6' }, h("ix-button", { key: '6769327a6e405d2b2705c3a64b4b2031e8f80de4', class: "btn-select-date btn-md-width", onClick: () => this.onDone() }, this.textSelectDate || this.i18nDone))))));
     }
 };
 DatetimePicker.style = IxDatetimePickerStyle0;

package/dist/esm/ix-divider.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 const dividerCss = ":host{display:block;position:relative;width:100%;border-bottom:0.0625rem solid var(--theme-color-x-weak-bdr);margin:0.25rem 0px}";
 const IxDividerStyle0 = dividerCss;
@@ -8,7 +8,7 @@ const Divider = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return h(Host, { key: 'c4ded9a12469394b7f35bebee62799640ccb905f' });
+        return h(Host, { key: 'b940598630bbccaae3d37bfb9fef71c35e777a14' });
     }
 };
 Divider.style = IxDividerStyle0;

package/dist/esm/ix-drawer.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-5429f20b.js';
 import { a as anime } from './anime.es-a5520566.js';
 const drawerCss = ":host{top:0;right:0;box-shadow:var(--theme-box-shadow-level-3);visibility:hidden;display:flex;position:absolute;flex-flow:column nowrap;justify-content:flex-start;align-items:center;max-height:100vh;min-height:1.5rem;background-color:var(--theme-color-1);border-radius:0.25rem;transition:all var(--theme-medium-time) ease-out}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .toggle{z-index:100;visibility:visible}:host .drawer-container.full-height{min-height:100%}:host .header{display:flex;position:relative;align-items:center;justify-content:flex-end;padding:0.5rem;width:100%;order:1}:host .header .header-content{flex-grow:1;margin-right:1rem}:host .content{position:relative;flex:1;flex-grow:1;order:2;height:100%;width:100%;overflow-y:auto}:host(.toggle){visibility:visible}";
@@ -85,7 +85,7 @@ const Drawer = class {
         this.onShowChanged(this.show);
     }
     render() {
-        return (h(Host, { key: '48546d54d8c859e184c75935f0729826247e36d5', class: {
+        return (h(Host, { key: '4cb0a06786c80cd977ebfbbfef6c23d6e7926d86', class: {
                 'drawer-container': true,
                 toggle: this.show,
                 'full-height': this.fullHeight,
@@ -94,7 +94,7 @@ const Drawer = class {
                 width: this.width === 'auto' ? this.width : `${this.width}rem`,
                 'min-width': `${this.minWidth}rem`,
                 'max-width': `${this.maxWidth}rem`,
-            }, ref: (el) => (this.divElement = el), "data-testid": "container", id: "div-container" }, h("div", { key: 'a574087e718559ca1562a41617c457f24dd9fd33', class: "header" }, h("div", { key: '126ab85b1452d7338043cc5457db98b047185d1a', class: "header-content" }, h("slot", { key: '0f62e3434f942f72c268359aacdf11a881553104', name: "header" })), h("ix-icon-button", { key: '42c763a72136811a6e0c5999cd0b7689ef7c9035', class: "close-button", icon: 'close', size: "24", ghost: true, onClick: () => this.onCloseClicked(), "data-testid": "close-button" })), h("div", { key: 'f7e7536dde130c707bf7584a64fae3002ddf3035', class: "content" }, h("slot", { key: '50c5e7afd95802fb9ceb537b788b826a888254df' }))));
+            }, ref: (el) => (this.divElement = el), "data-testid": "container", id: "div-container" }, h("div", { key: '63c8952c342a1d412237ab82f96ac063c0a30158', class: "header" }, h("div", { key: '4a8525053f3954b3b83dac4f8b012f005e9725b7', class: "header-content" }, h("slot", { key: '55b887208a3bdc445950c2e5f153cfaa1ba89068', name: "header" })), h("ix-icon-button", { key: '84b5b11f21d4d768c0118450147bf74d6e0a1400', class: "close-button", icon: 'close', size: "24", ghost: true, onClick: () => this.onCloseClicked(), "data-testid": "close-button" })), h("div", { key: '00079cfb6504ed6fa44c23209787add116e72591', class: "content" }, h("slot", { key: '3de3610ac265b9eda7d69eedf28494b47861c7e3' }))));
     }
     static get watchers() { return {
         "show": ["onShowChanged"]

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-5429f20b.js';
 const dropdownButtonCss = ":host{display:inline-block;position:relative;height:2rem;width:auto}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .hide{display:none}: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(--theme-btn-primary--color)}:host .triangle.primary.ghost{color:var(--theme-btn-invisible-primary--color)}:host .triangle.primary.outline{color:var(--theme-btn-outline-primary--color)}:host .triangle.primary.ghost.disabled{color:var(--theme-btn-invisible-primary--color--disabled)}:host .triangle.primary.outline.disabled{color:var(--theme-btn-outline-primary--color--disabled)}:host .triangle.primary.disabled{color:var(--theme-btn-primary--color--disabled)}:host .triangle.secondary.ghost{color:var(--theme-btn-invisible-secondary--color)}:host .triangle.secondary.outline{color:var(--theme-btn-outline-secondary--color)}:host .triangle.secondary.ghost.disabled{color:var(--theme-btn-invisible-secondary--color--disabled)}:host .triangle.secondary.outline.disabled{color:var(--theme-btn-outline-secondary--color--disabled)}:host .triangle.secondary.disabled{color:var(--theme-btn-secondary--color--disabled)}:host .content{display:flex;align-items:center}:host(.disabled){pointer-events:none}";
 const IxDropdownButtonStyle0 = dropdownButtonCss;
@@ -28,11 +28,11 @@ const DropdownButton = class {
             } }));
     }
     render() {
-        return (h(Host, { key: 'a5b2f4263b3f7431414302dc9a2e387f902c0558', class: {
+        return (h(Host, { key: '8669f7d302b6009aa9ab9cadb3c86e4bbcc6330f', class: {
                 disabled: this.disabled,
             }, ref: (ref) => {
                 this.dropdownAnchor = ref;
-            } }, h("div", { key: 'ee2c7e56e653437c11ddb0100be4fbbd87a768e3', class: "dropdown-button" }, this.label ? (h("ix-button", { variant: this.variant, outline: this.outline, ghost: this.ghost, disabled: this.disabled, alignment: "start" }, 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("ix-icon", { name: 'chevron-down-small', size: "24" })))) : (h("div", null, h("ix-icon-button", { icon: this.icon, variant: this.variant, outline: this.outline, ghost: this.ghost, disabled: this.disabled }), this.getTriangle()))), h("ix-dropdown", { key: '49de3d2d4cc2c4cea66247daa99c6d6c81f34962', class: "dropdown", trigger: this.dropdownAnchor, placement: this.placement, closeBehavior: this.closeBehavior }, h("slot", { key: '6d5420cff93937a002dd17cbe31cf68d39002a3e' }))));
+            } }, h("div", { key: '5561196cfa6584097b0395ca1d4bf61db522b5a8', class: "dropdown-button" }, this.label ? (h("ix-button", { variant: this.variant, outline: this.outline, ghost: this.ghost, disabled: this.disabled, alignment: "start" }, 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("ix-icon", { name: 'chevron-down-small', size: "24" })))) : (h("div", null, h("ix-icon-button", { icon: this.icon, variant: this.variant, outline: this.outline, ghost: this.ghost, disabled: this.disabled }), this.getTriangle()))), h("ix-dropdown", { key: '4b738dfff8c84360e1d561560c3b29ba21684de6', class: "dropdown", trigger: this.dropdownAnchor, placement: this.placement, closeBehavior: this.closeBehavior }, h("slot", { key: 'ad15df81aad664b12a3183b45e443b110d2b4393' }))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/ix-dropdown-header.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 const dropdownHeaderCss = ":host{display:flex;align-items:center;position:relative;height:2.5rem;width:auto;padding:0.25rem 1rem;overflow:hidden;cursor:default;color:var(--theme-color-soft-text)}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";
 const IxDropdownHeaderStyle0 = dropdownHeaderCss;
@@ -9,7 +9,7 @@ const DropdownHeader = class {
         this.label = undefined;
     }
     render() {
-        return (h(Host, { key: '47c0d91d77afa9bf491e95f573d11345f41006fe' }, h("ix-typography", { key: '17ed22d1ae6cd8b5cd993c986ac90963839636b0', class: 'category-text', variant: 'default-title' }, this.label)));
+        return (h(Host, { key: '987d6e23477350b4ea2c129802bcf1887970ef08' }, h("ix-typography", { key: '98aa123660b40148119a914d5edd0eb12b161823', class: 'category-text', variant: 'default-title' }, this.label)));
     }
 };
 DropdownHeader.style = IxDropdownHeaderStyle0;

package/dist/esm/ix-dropdown-item.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-5429f20b.js';
 const dropdownItemCss = ":host{--ix-dropdown-item-checked-color:var(--theme-color-primary);display:flex;flex-direction:row;position:relative;height:2.5rem;width:auto;overflow:hidden;cursor:pointer}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .dropdown-item{all:unset;display:flex;flex-direction:row;align-items:center;position:relative;height:calc(100% - 2px);width:calc(100% - 0.5rem - 1.5rem);padding:0 0.5rem;padding-right:1.5rem;border:0.0625rem solid transparent;white-space:nowrap}:host .dropdown-item.no-checked-field{width:calc(100% - 1rem - 1.5rem);padding:0 1rem;padding-right:1.5rem}:host .dropdown-item:focus-visible{border-color:var(--theme-color-focus-bdr)}:host .dropdown-item-checked{display:flex;align-items:center;justify-content:center;position:relative;height:100%;width:1rem;min-width:1rem;margin-right:0.25rem;color:var(--ix-dropdown-item-checked-color)}:host .dropdown-item-icon{margin-right:0.25rem;color:var(--theme-color-soft-text)}:host .dropdown-item-text{display:block;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .dropdown-item:focus-visible{outline:1px solid yellow}:host .submenu-icon{margin-left:auto}:host(.icon-only) .dropdown-item-icon{margin-right:0px}:host(.icon-only) .dropdown-item-checked{display:none}:host(.icon-only) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(.submenu) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(:not(.disabled):not(:disabled).hover),:host(:not(.disabled):not(:disabled):hover){background-color:var(--theme-ghost--background--hover)}:host(:not(.disabled):not(:disabled).active),:host(:not(.disabled):not(:disabled):active){background-color:var(--theme-ghost--background--active)}:host(.disabled){pointer-events:none;color:var(--theme-color-weak-text) !important}:host(.disabled) .dropdown-item-icon{color:var(--theme-color-weak-text) !important}";
 const IxDropdownItemStyle0 = dropdownItemCss;
@@ -31,15 +31,15 @@ const DropdownItem = class {
             this.icon !== undefined);
     }
     render() {
-        return (h(Host, { key: 'd2972c4154e4f43f3fc9b7b9d6726c05923109c6', class: {
+        return (h(Host, { key: '89da1b5ab639ecb4fe9caa06f16fc7f8cff8cd49', class: {
                 hover: this.hover,
                 'icon-only': this.isIconOnly(),
                 disabled: this.disabled,
                 submenu: this.isSubMenu,
-            }, role: "listitem" }, h("button", { key: '7148b3977626016ffcb818384175e3b1feda5c62', type: "button", tabIndex: 0, class: {
+            }, role: "listitem" }, h("button", { key: '386ba89dfedf42919298d1d4d189310c364c0acb', type: "button", tabIndex: 0, class: {
                 'dropdown-item': true,
                 'no-checked-field': this.suppressChecked,
-            }, onClick: () => this.emitItemClick() }, !this.suppressChecked ? (h("div", { class: "dropdown-item-checked" }, this.checked ? (h("ix-icon", { class: "checkmark", name: 'single-check', size: "16" })) : null)) : null, this.icon ? (h("ix-icon", { class: "dropdown-item-icon", name: this.icon })) : null, h("div", { key: 'e347baeb8cf93401a7d92210cb5102301e41133b', class: "dropdown-item-text" }, this.label, h("slot", { key: 'fc99370903e7e37d3903f42451c3992b32d0399b' })), this.isSubMenu ? (h("ix-icon", { name: 'chevron-right-small', class: 'submenu-icon' })) : null)));
+            }, onClick: () => this.emitItemClick() }, !this.suppressChecked ? (h("div", { class: "dropdown-item-checked" }, this.checked ? (h("ix-icon", { class: "checkmark", name: 'single-check', size: "16" })) : null)) : null, this.icon ? (h("ix-icon", { class: "dropdown-item-icon", name: this.icon })) : null, h("div", { key: '385eaf4c6c074d1e21eeb55ef1c7956f8f8c4126', class: "dropdown-item-text" }, this.label, h("slot", { key: 'b9e7252f90c080074da87786cf5fce912f8bdb25' })), this.isSubMenu ? (h("ix-icon", { name: 'chevron-right-small', class: 'submenu-icon' })) : null)));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/ix-dropdown-quick-actions.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-06024ae7.js';
+import { r as registerInstance, h, H as Host } from './index-5429f20b.js';
 const dropdownQuickActionsCss = ":host{display:flex;justify-content:center;align-items:center;margin-inline-start:1.5rem;margin-inline-end:1.5rem;margin-block-end:0.25rem}:host slot::slotted(*){display:flex;margin-inline-end:0.625rem}";
 const IxDropdownQuickActionsStyle0 = dropdownQuickActionsCss;
@@ -8,7 +8,7 @@ const DropdownQuickActions = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '5e441f76795c14ce9c89745007b984a758ed6c68' }, h("slot", { key: '9134b8e85c0c92f2250305152d102f71cad38e8e' })));
+        return (h(Host, { key: 'cf0b790f201df5ca5cd904de492140d79f49d29a' }, h("slot", { key: 'f2003c2b93ba50b6acb966ab05b036ce6516d829' })));
     }
 };
 DropdownQuickActions.style = IxDropdownQuickActionsStyle0;

package/dist/esm/ix-dropdown.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-06024ae7.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-5429f20b.js';
 import { f as flip, i as inline, s as shift, o as offset, a as autoUpdate, c as computePosition } from './floating-ui.dom.esm-6e7c098f.js';
 import { A as ArrowFocusController } from './focus-d4d3abaf.js';
@@ -434,6 +434,9 @@ const Dropdown = class {
                 event.preventDefault();
             }
             if (this.isTriggerElement(target)) {
+                if (this.closeBehavior === 'outside') {
+                    event.preventDefault();
+                }
                 return;
             }
         }
@@ -451,7 +454,7 @@ const Dropdown = class {
         this.applyDropdownPosition();
     }
     render() {
-        return (h(Host, { key: '21eae24f6b02ef9ac1a2113fef4d3b3553b83d31', "data-ix-dropdown": this.localUId, ref: (ref) => (this.dropdownRef = ref), class: {
+        return (h(Host, { key: '4f50f3c00bce087ae0c36c463f49c29adfe20f78', "data-ix-dropdown": this.localUId, ref: (ref) => (this.dropdownRef = ref), class: {
                 'dropdown-menu': true,
                 show: this.show,
                 overflow: true,
@@ -459,7 +462,7 @@ const Dropdown = class {
                 margin: '0',
                 minWidth: '0px',
                 position: this.positioningStrategy,
-            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { key: 'd1cded3bf438002313e68816b174aa5eac087740', style: { display: 'contents' } }, this.header && h("div", { class: "dropdown-header" }, this.header), h("slot", { key: 'b975b0b6f9b8a4050a5ba88c1b2cb0c9f01e3e4d' }))));
+            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { key: 'be529e836ffcf39ed344416cb41d1cc45a0d9abb', style: { display: 'contents' } }, this.header && h("div", { key: 'af768a37fd188144b84836abc87b3fd06f0b4808', class: "dropdown-header" }, this.header), h("slot", { key: '2b4e76a579c4cadb18e3ce7baa1f83c942e2d28f' }))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {