@siemens/ix 2.1.2-beta.0 → 2.1.2

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

@@ -52,20 +52,20 @@ export class ExpandingSearch {
         this.valueChange.emit(this.value);
     }
     render() {
-        return (h(Host, { key: 'd354ef216d5dc5f80ce2a7a4a7ab9130afe94c0e', class: {
+        return (h(Host, { key: '4c4ad028a6843aa48f111eab03289f05093ff0c4', class: {
                 expanded: this.expanded,
                 'right-position': this.expanded,
                 fullWidth: this.fullWidth,
-            } }, h("ix-icon-button", { key: '960286296bba24fa10228927d446f23c542e3404', size: this.expanded ? '16' : '24', icon: this.icon, ghost: true, variant: "primary", "data-testid": "button", onClick: () => this.expandInput(), tabindex: this.expanded ? -1 : 0, color: this.hasFocus ? 'input-search-icon--color--focus' : undefined, class: {
+            } }, h("ix-icon-button", { key: 'c919f410191cb51957c1d00938cfde61193ebdd5', size: this.expanded ? '16' : '24', icon: this.icon, ghost: true, variant: "primary", "data-testid": "button", onClick: () => this.expandInput(), tabindex: this.expanded ? -1 : 0, color: this.hasFocus ? 'input-search-icon--color--focus' : undefined, class: {
                 'btn-search': true,
                 'btn-search--expanded': this.expanded,
-            } }), h("div", { key: '08c1c9975d18d21a1a2f0331ac72fd44e5ed1fb2', class: {
+            } }), h("div", { key: 'e3c42bb3f8940113d4da24d8d235240fce59fa91', class: {
                 expanded: this.expanded,
                 fullWidth: this.fullWidth,
                 collapsed: !this.expanded,
                 'disable-pointer': !this.expanded,
                 'input-container': true,
-            }, "data-testid": "input-wrapper" }, h("input", { key: 'f2bafc86d72957c20343fbde76664c70ad1a4dc6', class: {
+            }, "data-testid": "input-wrapper" }, h("input", { key: 'ec9dabd6711e59f9675b3c961abdae17ea0da703', class: {
                 'form-control': true,
                 input: this.expanded,
                 'disable-pointer': !this.expanded,

package/dist/collection/components/filter-chip/filter-chip.js

@@ -18,7 +18,7 @@ export class FilterChip {
         this.closeClick.emit();
     }
     render() {
-        return (h(Host, { key: '828da5a62ec5accc6b74cff38e4bfcf51de94c98', class: { disabled: this.disabled, readonly: this.readonly }, title: this.el.textContent }, h("div", { key: '8aba552ef0dee8349ab558d77db21a2c22f76f8f', class: "slot-container" }, h("slot", { key: 'a81343d2a06faf7bd6c5ca2522d40af99ee589ca' })), !this.disabled && !this.readonly ? (h("ix-icon-button", { ghost: true, oval: true, icon: 'close-small', size: "16", tabindex: this.disabled ? -1 : 0, variant: "primary", disabled: this.disabled, onClick: (e) => this.onCloseClick(e) })) : null));
+        return (h(Host, { key: '10df51e34656ed3b7b18e9f2a07a59c18784a3d1', class: { disabled: this.disabled, readonly: this.readonly }, title: this.el.textContent }, h("div", { key: '5a94912e2c22cbddb984b28ba0126f31c1e20165', class: "slot-container" }, h("slot", { key: '0fdc94729908b9c3a040667318dcc18d300e4176' })), !this.disabled && !this.readonly ? (h("ix-icon-button", { ghost: true, oval: true, icon: 'close-small', size: "16", tabindex: this.disabled ? -1 : 0, variant: "primary", disabled: this.disabled, onClick: (e) => this.onCloseClick(e) })) : null));
     }
     static get is() { return "ix-filter-chip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/flip-tile/flip-tile.js

@@ -59,26 +59,26 @@ export class FlipTile {
         }, 2 * this.ANIMATION_DURATION);
     }
     render() {
-        return (h(Host, { key: 'ce09b1e9ed6bed31afff8feb5331bae2fd9c4206', style: {
+        return (h(Host, { key: 'f48c8fa439a5b38b06fbda02e4185aa4195dcba5', style: {
                 height: `${this.height}${this.height === 'auto' ? '' : 'rem'}`,
                 'min-height': `${this.height}${this.height === 'auto' ? '' : 'rem'}`,
                 'max-height': `${this.height}${this.height === 'auto' ? '' : 'rem'}`,
                 width: `${this.width}${this.width === 'auto' ? '' : 'rem'}`,
                 'min-width': `${this.width}${this.width === 'auto' ? '' : 'rem'}`,
                 'max-width': `${this.width}${this.width === 'auto' ? '' : 'rem'}`,
-            } }, h("div", { key: '7b05701a4d284b7bf5df7506d05740ceeeee7721', class: {
+            } }, h("div", { key: 'fc676886cdf565c7cc121640b37c579eb1ea2f64', class: {
                 'flip-tile-container': true,
                 info: this.state === FlipTileState.Info,
                 warning: this.state === FlipTileState.Warning,
                 alarm: this.state === FlipTileState.Alarm,
                 primary: this.state === FlipTileState.Primary,
                 'flip-animation-active': this.isFlipAnimationActive,
-            } }, h("div", { key: 'ce614d5f1fc065d74b6918cfa3f4f3299700ac4b', class: "flip-tile-header" }, h("div", { key: '0c21600adb7f402fe9930813148f924e87143bfe', class: "header-slot-container text-l-title" }, h("slot", { key: '7eca17dff980859c83891d7f2b90192e21dc25ec', name: "header" })), h("ix-icon-button", { key: '8940db181c5db54ccba409fd42d57f08a7dd665b', icon: 'eye', variant: "primary", ghost: true, onClick: () => this.toggleIndex() })), h("div", { key: 'c449e4aabde02243da7b5ab6b68ebd128708b929', class: "content-container" }, h("slot", { key: '7931ffd8b5428c865f5da4481d6641addd11928d' })), h("div", { key: '71061185c12c66f664b05775cf1c204bbfd273dc', class: {
+            } }, h("div", { key: '036a5f9b336796232c649a0c1718601ccd5c46b5', class: "flip-tile-header" }, h("div", { key: '3eb347f451cf27f614f855eee99f8562fc4aa785', class: "header-slot-container text-l-title" }, h("slot", { key: '563785f622191f0692f3790f3a908125e30e7276', name: "header" })), h("ix-icon-button", { key: '9a52873d2890f187d3a2c940688bbd000e676233', icon: 'eye', variant: "primary", ghost: true, onClick: () => this.toggleIndex() })), h("div", { key: '0efc4537aa97d3b79459141678dc180a140bd658', class: "content-container" }, h("slot", { key: '1c7035e6e29731a2f192a37f1d86985c3c219220' })), h("div", { key: '2d1f20e35490d7f87b1d70cb9783268c5f1dc270', class: {
                 footer: true,
                 'contrast-light': this.state === FlipTileState.Warning,
                 'contrast-dark': this.state === FlipTileState.Info ||
                     this.state === FlipTileState.Alarm,
-            } }, h("slot", { key: 'b4ce29eae8a575c65a0d4fbb323f52ef6edff62d', name: "footer" })))));
+            } }, h("slot", { key: '074e8bcae63f134dab5623df0682c754e3212159', name: "footer" })))));
     }
     static get is() { return "ix-flip-tile"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/flip-tile-content/flip-tile-content.js

@@ -12,7 +12,7 @@ export class FlipTileContent {
         this.contentVisible = false;
     }
     render() {
-        return h(Host, { key: '861c12c524efa42bdcf52922898ceb4fd367ffb0' }, this.contentVisible ? h("slot", null) : null);
+        return h(Host, { key: 'e92abcbb8b1cfdeb739ee4933f6ed66a6c2a7dc5' }, this.contentVisible ? h("slot", null) : null);
     }
     static get is() { return "ix-flip-tile-content"; }
     static get encapsulation() { return "shadow"; }

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

@@ -16,7 +16,7 @@ export class FormField {
     }
     componentWillLoad() { }
     render() {
-        return (h(Host, { key: '6b94db9e2ce60a80ccf1f64463fabcf6c432ad70' }, this.label ? (h("label", { htmlFor: this.inputElement.id }, this.label)) : null, h("slot", { key: '7dd324c00fa1fddd947739ec7f4e3a77a10ceaf8' })));
+        return (h(Host, { key: '84f5465600ed945caa31926c700957a4e1b7e43e' }, this.label ? (h("label", { htmlFor: this.inputElement.id }, this.label)) : null, h("slot", { key: 'c57485ac6285e411275e9e7fafeb6aa3b3e96ee3' })));
     }
     static get is() { return "ix-form-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/grid/layout-grid.js

@@ -17,12 +17,12 @@ export class LayoutGrid {
         this.columns = 12;
     }
     render() {
-        return (h(Host, { key: '89d8863758f2044ad0d68491e852c5c23270ac77', class: {
+        return (h(Host, { key: 'd3f673eeface55a4cd571acda477794c8735c5e4', class: {
                 'no-margin': this.noMargin,
             }, style: {
                 '--ix-layout-grid-columns': `${this.columns}`,
                 '--ix-layout-grid-gutter': `${this.gap}px`,
-            } }, h("slot", { key: '3b84d5e1a028c22943acbb845aedae43c2c33fb3' })));
+            } }, h("slot", { key: 'e70ea397035d14b0eefc589150d1106983599cec' })));
     }
     static get is() { return "ix-layout-grid"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/group/group-context-menu.js

@@ -37,7 +37,7 @@ export class GroupContextMenu {
         this.configureDropdown(dropdownElement, triggerElement);
     }
     render() {
-        return (h(Host, { key: '7b561df4adbe4906b1f4dbc4c50fab9788ec30c9' }, h("ix-icon-button", { key: '602b724690fb58e3261710002ef95fff2ef28c25', class: { hide: !this.showContextMenu }, size: "24", ghost: true, icon: 'context-menu' }), h("slot", { key: '0d42add312838be530623029430bc1007ba08a5a', onSlotchange: () => this.onSlotChange() })));
+        return (h(Host, { key: 'f709297153c95aae9ae99750d6eef9bb93b6e93b' }, h("ix-icon-button", { key: 'da299782cd2d0fbf3da4ffebedbd69f3a5f24bf9', class: { hide: !this.showContextMenu }, size: "24", ghost: true, icon: 'context-menu' }), h("slot", { key: '8557ba5e78f8098a9defdf3f966e83046522c2ae', onSlotchange: () => this.onSlotChange() })));
     }
     static get is() { return "ix-group-context-menu"; }
     static get encapsulation() { return "shadow"; }

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

@@ -100,16 +100,16 @@ export class Group {
         }
     }
     render() {
-        return (h(Host, { key: 'bda6803545577fefae47c47adbec8a9386096713' }, h("div", { key: '767084cb393dfd58a2f4af2a66167c4a8b29c942', class: {
+        return (h(Host, { key: '50658e58108e551e704d40f5658e8bf405908841' }, h("div", { key: '7c6dd6d17182f417b7b8845a1caebfc42b2a4ae3', class: {
                 'group-header': true,
                 expand: !this.collapsed,
                 selected: this.selected,
-            }, tabindex: "0" }, h("div", { key: 'a4ab69fe6407477a4b47ec615e592bd8725a4a7c', class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, h("div", { key: '230227a102bd5397b4b54f65a517ad03e8affb71', class: {
+            }, tabindex: "0" }, h("div", { key: '82064c34500593f4dddc2f5766466e48239b6558', class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, h("div", { key: '551ad7dcd5b93652012ca16f8e6df6a029e9de3e', class: {
                 'group-header-selection-indicator': true,
                 'group-header-selection-indicator-item-selected': this.itemSelected,
-            } }), h("div", { key: '795295a972e0df5e77ad71f91d1b6d9c6290335c', class: "btn-expand-header" }, h("ix-icon", { key: 'f1e0de9ab7ad78eaa769545964d28e3dd48f3d5d', class: {
+            } }), h("div", { key: '551174d9914334ad390798ae0483237dedebcd73', class: "btn-expand-header" }, h("ix-icon", { key: '0b86cb98fcb9022a77f855ba34166012a2693a4a', class: {
                 hidden: this.slotSize === 0,
-            }, name: this.collapsed ? 'chevron-right-small' : 'chevron-down-small', onClick: (e) => this.onExpandClick(e) })), h("div", { key: 'e067c4232cfd54b8071f4e713d25b59f7b4b8571', 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: 'f4d0abe144cc870db4393aa5c06bc455a8213e26', name: "header" }))), h("ix-group-context-menu", { key: 'c53d7dc2d6f8edb497f8d03484fee968c7e92539' }, h("slot", { key: '3b145e25ce63ae7396b1d4ecff254345b664ddca', name: "dropdown" }))), h("div", { key: 'b3e1900cf5a41383899f7ff97583898070be7ed7', class: {
+            }, name: this.collapsed ? 'chevron-right-small' : 'chevron-down-small', onClick: (e) => this.onExpandClick(e) })), h("div", { key: '39717ec88f2e53e9a9f4f48e2e7245637ec00653', 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: '2b33b0c9c50099f7d904ed1bf8787acd888ad24d', name: "header" }))), h("ix-group-context-menu", { key: 'cd1268faa06b30f4292cbf988c041da0f0738e8d' }, h("slot", { key: '6152c5bb0e8831ccba53067d4aac1350027e208b', name: "dropdown" }))), h("div", { key: '7682ad50798d4839c71e79d88761cda57cf06801', class: {
                 'group-content': true,
             } }, !this.collapsed ? (h(Fragment, null, h("slot", null), h("ix-group-item", { suppressSelection: true, focusable: false, class: {
                 footer: true,

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

@@ -24,10 +24,10 @@ export class GroupItem {
         this.selectedChanged.emit(this.hostElement);
     }
     render() {
-        return (h(Host, { key: '7cfbff33c26c7dbd32d0d3616b115bf876026beb', class: {
+        return (h(Host, { key: '510249c40eb513c0cad7ad186f94311e86b99c1c', class: {
                 selected: this.selected && !this.suppressSelection,
                 'suppress-selection': this.suppressSelection,
-            } }, h("button", { key: 'e6c9e6094dd24a417f49f18aceb32b6504f83f6b', tabindex: this.focusable ? 0 : -1 }, h("div", { key: '9c736883c42fc5d39f36f9fbb6c39d01624ba8ed', class: "group-entry-selection-indicator" }), this.icon ? h("ix-icon", { size: "16", name: this.icon }) : null, this.text ? (h("span", { class: "group-entry-text" }, h("span", { title: this.text }, this.text))) : null, this.secondaryText ? (h("span", { class: "group-entry-text-secondary" }, h("span", { title: this.secondaryText }, this.secondaryText))) : null, h("slot", { key: '770f048023b4ecca5302d7d11162ed4670e8db16' }))));
+            } }, h("button", { key: '58314b961969fc828b490a251eb3fc991b332356', tabindex: this.focusable ? 0 : -1 }, h("div", { key: '3b643550562e7368c87e4b6443a51902f63da7d5', class: "group-entry-selection-indicator" }), this.icon ? h("ix-icon", { size: "16", name: this.icon }) : null, this.text ? (h("span", { class: "group-entry-text" }, h("span", { title: this.text }, this.text))) : null, this.secondaryText ? (h("span", { class: "group-entry-text-secondary" }, h("span", { title: this.secondaryText }, this.secondaryText))) : null, h("slot", { key: '1314f12170969fd85675165af10b1bff1048f8a5' }))));
     }
     static get is() { return "ix-group-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -69,7 +69,7 @@ export class IconButton {
             type: this.type,
             extraClasses: this.getIconSizeClass(),
         };
-        return (h(Host, { key: '7da24896eae7dce5de64057e70c6d996681d60b7', class: Object.assign(Object.assign({}, this.getIconSizeClass()), { disabled: this.disabled || this.loading }) }, h(BaseIconButton, Object.assign({ key: '067f21e0afca8fb01ea374d60fe51560ec203228' }, baseButtonProps))));
+        return (h(Host, { key: '2990b79a4d4b413e844a3c2ab4b0a4604464eeeb', class: Object.assign(Object.assign({}, this.getIconSizeClass()), { disabled: this.disabled || this.loading }) }, h(BaseIconButton, Object.assign({ key: 'a2983c635bf15e0d7a866d17309be343d78e9aa6' }, baseButtonProps))));
     }
     static get is() { return "ix-icon-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/icon-toggle-button/icon-toggle-button.js

@@ -73,7 +73,7 @@ export class IconToggleButton {
             extraClasses: Object.assign({ 'icon-button': true }, this.getIconSizeClass()),
         };
         console.log(baseButtonProps, this.disabled, this.loading);
-        return (h(Host, { key: '0c195dca24a6e0ec78e2165ffa5c8d7c89484935', class: Object.assign(Object.assign({}, this.getIconSizeClass()), { disabled: this.disabled || this.loading }) }, h(BaseIconButton, Object.assign({ key: 'd97b5d763eaee5f22ca8752480e441fc6ae9a444' }, baseButtonProps))));
+        return (h(Host, { key: '86f8d6e28705fe03d3a918e8452f62b18fc1ee01', class: Object.assign(Object.assign({}, this.getIconSizeClass()), { disabled: this.disabled || this.loading }) }, h(BaseIconButton, Object.assign({ key: '5e4379a3bbb5fe48603b520a268d51b9703540f8' }, baseButtonProps))));
     }
     static get is() { return "ix-icon-toggle-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -118,7 +118,7 @@ export class InputGroup {
         return width;
     }
     render() {
-        return (h(Host, { key: 'e6da076846905dfc765c61e7013f5d3661a32845' }, h("div", { key: '74b8fdf8c0dec9b87fc687036ffb2b3c9856c8c1', class: "group group-start" }, h("slot", { key: 'e807551ee9bf366867bb5c3177759155cbb27c84', name: "input-start" })), h("slot", { key: '9072e4cfd9bb3beeff731b1ce67c02a32ed51f7b' }), h("div", { key: '84484ed6357e0aa40515480d409f5fcbf59fa1f8', class: "group group-end" }, h("slot", { key: '34d4fcbf02cf62b1922e20d403d1a52a145f1cd9', name: "input-end" }))));
+        return (h(Host, { key: '6c305a387eab52c23cff873efb217835cb6552fa' }, h("div", { key: 'db0c738d7a46099408b419a27bc00b8417d3c365', class: "group group-start" }, h("slot", { key: '63c34ce0364cb706b008d50ccf0f56e6fd79dd98', name: "input-start" })), h("slot", { key: '1aac71bae49371f2974dac8f2e9b88df12fd57cb' }), h("div", { key: '552f38ecce4f5db61b108f3a1f8badc52fe546ea', class: "group group-end" }, h("slot", { key: 'e4074cd35b74ec82b7413f11e2c21a8896def99e', name: "input-end" }))));
     }
     static get is() { return "ix-input-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/key-value/key-value.js

@@ -20,7 +20,7 @@ export class KeyValue {
         this.value = undefined;
     }
     render() {
-        return (h(Host, { key: '8223aa74048180df2c252d63f590902aa8a16562', class: `keyValue keyValue--${this.labelPosition === 'top' ? 'column' : 'row'}` }, this.icon && (h("ix-icon", { name: this.icon, size: "24", class: "keyValue__icon" })), h("div", { key: '1f9edfe06188514b7dcb56b008ac563773219aac', class: "keyValue__content" }, h("div", { key: '9c1fcf4cc1b9013866283d77074349a7e9669194', class: "content__label" }, this.label), h("div", { key: '0748ee055c661f1c3652941e1e76c5e94c1f53ad', class: {
+        return (h(Host, { key: '88dcec3572f18783faddef7e3ac8a66aef01ed1b', class: `keyValue keyValue--${this.labelPosition === 'top' ? 'column' : 'row'}` }, this.icon && (h("ix-icon", { name: this.icon, size: "24", class: "keyValue__icon" })), h("div", { key: '133fd9fa5e7fc3af3e181425045073c43c47049d', class: "keyValue__content" }, h("div", { key: '569cb9031c047421118d8847ec0c84dc8aeee469', class: "content__label" }, this.label), h("div", { key: 'a082de0c7b9a820d3ab86ef06f7be7425343a67a', class: {
                 content__value: true,
                 'has-customValue': this.value === undefined,
             } }, this.value !== undefined ? (this.value) : (h("slot", { name: "custom-value" }))))));

package/dist/collection/components/key-value-list/key-value-list.js

@@ -15,7 +15,7 @@ export class KeyValueList {
         this.striped = undefined;
     }
     render() {
-        return (h(Host, { key: '46642ccf687b608a8db31936f492e56c6e360cb7', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '9888ad2f28136d0f354e1d14087fbcdd4d65c946' })));
+        return (h(Host, { key: '8d21b4ebf885e1ca21fddb7c6dc94b7d46940f95', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '782c4a007ea866740087f022bf7c6661aa8eea5a' })));
     }
     static get is() { return "ix-key-value-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/kpi/kpi.js

@@ -33,13 +33,13 @@ export class Kpi {
         return tooltip;
     }
     render() {
-        return (h(Host, { key: 'bb752421257c97da16f70dc2f5d7973a33c3dcd7', title: this.getTooltipText(), tabindex: "1", class: {
+        return (h(Host, { key: 'dfc10eb1b32999417bfcfe2b13318733468c2b8d', title: this.getTooltipText(), tabindex: "1", class: {
                 stacked: this.orientation === 'vertical',
-            } }, h("div", { key: 'a7dae46c852e7866c613c8c05778fd6581d85229', class: {
+            } }, h("div", { key: '42ae8899123702f27d437b1002d19ecca635c827', class: {
                 'kpi-container': true,
                 alarm: this.state === 'alarm',
                 warning: this.state === 'warning',
-            } }, h("span", { key: 'bda2cd5de4a8e72578dfa5283d31c54f5bb19f00', class: "kpi-label" }, this.getStateIcon(), h("span", { key: 'fb6002f8bf537e6471fe5e6d896e108458a886dd', class: "kpi-label-text" }, this.label)), h("span", { key: '5f9ed5b99777bcd4d9c7a0e9e145622544563649', class: "kpi-value-container" }, h("span", { key: '66e40756bf8412b0f4995adedb70581158695b55', class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : ''))));
+            } }, h("span", { key: '97fd8b58beb66d4071a0a00247d73909bb15ac9c', class: "kpi-label" }, this.getStateIcon(), h("span", { key: 'c94f2356c26f267f42427b8dd854dd50a5aaa075', class: "kpi-label-text" }, this.label)), h("span", { key: 'dd33de51b6d73d1fd53715bcfa0b90d4b09fa0e0', class: "kpi-value-container" }, h("span", { key: 'b6172821e5cec47954289a183f37284f9c9c4032', class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : ''))));
     }
     static get is() { return "ix-kpi"; }
     static get encapsulation() { return "shadow"; }

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

@@ -17,13 +17,13 @@ export class LinkButton {
         this.target = '_self';
     }
     render() {
-        return (h(Host, { key: 'be5764812e9610f5799856b27aa4517469d9a24f' }, h("a", { key: '864f226d9eccd8385f926b37688326fba5fa890b', title: this.url, tabindex: "0", class: {
+        return (h(Host, { key: '69b094c49b4c40844709067d3d330cbd9e439a54' }, h("a", { key: 'd480bd3a4956928b36cacb1737b9f15bef4e6db4', title: this.url, tabindex: "0", class: {
                 'link-button': true,
                 disabled: this.disabled,
-            }, href: this.disabled ? undefined : this.url, target: this.target }, h("ix-icon", { key: 'fd946d77b3a0d4da995751311ba6346f82d1cc98', class: "icon", name: 'chevron-right-small', size: "16" }), h("div", { key: '35a530a3752f37229fa656de6ee20154d5ef4e03', class: {
+            }, href: this.disabled ? undefined : this.url, target: this.target }, h("ix-icon", { key: 'f38cdc216ef27ad121605adf41d4b9dfee0ad21c', class: "icon", name: 'chevron-right-small', size: "16" }), h("div", { key: 'bd9aecd23fbffe8af71f3c9648552781ac350df2', class: {
                 link: true,
                 disabled: this.disabled,
-            } }, h("slot", { key: 'f117649997d227f1b33b813a9c5a8aad03cd5789' })))));
+            } }, h("slot", { key: 'a122841a7a121b168198300e574df0f4319fd040' })))));
     }
     static get is() { return "ix-link-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/map-navigation/map-navigation.js

@@ -155,11 +155,11 @@ export class MapNavigation {
         this.hasContentHeader = (nodes === null || nodes === void 0 ? void 0 : nodes.length) !== 0;
     }
     render() {
-        return (h(Host, { key: '12b000aeaa56f3cb4648cf144fb15c8319a35dc3' }, h("slot", { key: 'c974e3181eb4921f12bc504f40b18f01ba71a505', name: "menu" }), h("div", { key: '5bf009607ed825e66d006cc4a8d4b10e7410e33d', class: "map-nav" }, h("div", { key: 'fba46b9e6554cc5de13b01c1483d36cce1004553', class: "map-nav-sidebar" }, h("div", { key: 'e60eeeed1d26d495fee6211a153eb2e590dd276f', class: "map-nav-header" }, h("ix-application-header", { key: 'b069ea97a85ba6f07fda9f73a8e21063d9c9d001', name: this.applicationName, class: "map-nav-header-brand" }, h("slot", { key: '9e9a897e90537488a3c41b1af7b569cd4a50ba52', slot: "logo", name: "logo" }))), h("div", { key: 'b5fd334d696140158bfd3b2eab7212abd4b2cd56', class: "map-nav-sidebar-content" }, h("div", { key: 'e5ab16284a0b64860e894ec9e182c416e85adbdb', class: "map-nav-sidebar-static-content" }, h("div", { key: 'b75e1c203da83fd26cfac85216776c23d1ef1bee', class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (h("ix-icon-button", { icon: 'context-menu', ghost: true, size: "24", variant: "secondary", onClick: (_) => this.contextMenuClick.emit() }))), h("div", { key: 'a24bfbafad8bce92692077ba50d060a914d99865', class: "map-nav-sidebar-user-content" }, h("slot", { key: '71c13468550e734125f11e5a58e7be66aa2069dd', name: "sidebar-content" })))), h("div", { key: '2ac1a049519acf9d5717468c472195d6662732f8', class: "content" }, h("div", { key: '6a86eeb5eae6df6b33cd006575e03001b19dc1db', class: {
+        return (h(Host, { key: 'cce268591eb698f3ea4e1df75f6d901b299955cd' }, h("slot", { key: '5fe015d8ea32646579e2908ed96d384cf6d3b23c', name: "menu" }), h("div", { key: '4b3aef7e9d54ad0ca685fe78a966c68212ddeeac', class: "map-nav" }, h("div", { key: '3ec6010dfb0782a34d05f88802fa4c1af3e5c4fc', class: "map-nav-sidebar" }, h("div", { key: '8dcbc1abbd2e92e4587e8ce3a13827ad7c3af96f', class: "map-nav-header" }, h("ix-application-header", { key: 'fde3c4b328cc2decdbab0046fab65e236b48675e', name: this.applicationName, class: "map-nav-header-brand" }, h("slot", { key: '3c0fc3155201783ce46cfa5c0f9636ce85a62eef', slot: "logo", name: "logo" }))), h("div", { key: '814697d7b86d4a7f1d940a4677261a1106cc8e6e', class: "map-nav-sidebar-content" }, h("div", { key: '92b84f7bd508df872dee03f233da8aae9277df2d', class: "map-nav-sidebar-static-content" }, h("div", { key: 'a68ddb0e887157c08e45d85cef327bf1bf76064f', class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (h("ix-icon-button", { icon: 'context-menu', ghost: true, size: "24", variant: "secondary", onClick: (_) => this.contextMenuClick.emit() }))), h("div", { key: 'd0dc557464a6eef40b5d26e72b3eda0d3113bb9e', class: "map-nav-sidebar-user-content" }, h("slot", { key: 'a4c80892e77776c69d1397514b76da25b6785737', name: "sidebar-content" })))), h("div", { key: '742909b2f8cb2897d4f3e27fe8624a058ca86bfa', class: "content" }, h("div", { key: '86ae660768f26bbae02417ab6b20c16dfec82b00', class: {
                 'map-nav-header-content': true,
                 'bg-2': true,
                 empty: !this.hasContentHeader,
-            } }, h("slot", { key: '8938ee92e4faa9d9d49b8c0b0ac91cc85882f4cd', name: "content-header", onSlotchange: (e) => this.checkHasContentHeader(e) })), h("main", { key: '003a1c1bc056ad1f68adeac5d33760ee4768cce6' }, h("slot", { key: 'b7d28455b65b3f6d4a2f260d7c872e09019a3f9c' }), h("slot", { key: 'c628b4546b1301e1b4c966edf2ed87a8699cd2d9', name: "overlay" }))))));
+            } }, h("slot", { key: 'e042f4d6dadf007435e87e6ca028a9908ffcc48b', name: "content-header", onSlotchange: (e) => this.checkHasContentHeader(e) })), h("main", { key: '2f5ca6dd5e3a9e8d32a2b02e0baf462daeff4a7c' }, h("slot", { key: '437f35dd628c442991188436aebfb72213f4e723' }), h("slot", { key: '7b107165c57e30798ed188959ff4e88416a0e6be', name: "overlay" }))))));
     }
     static get is() { return "ix-map-navigation"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.js

@@ -44,14 +44,14 @@ export class MapNavigationOverlay {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '9a3e2f31b59a6829c87dd6422a5426c0aee2951b' }, h("div", { key: 'c2053424c657e0642b0e7e33bf5009b70151a2f4', class: "overlay-header" }, h("div", { key: 'beab8496e3e0531bf8722b4c778b6e130291a13d', class: {
+        return (h(Host, { key: 'e032148cd238a6e03703b12098550b0af3d59116' }, h("div", { key: '99a192f95c70611b60bdb0dc6ea2626e77c04603', class: "overlay-header" }, h("div", { key: '805208183f5c68841625778424618609a681bb2d', class: {
                 'color-indicator': true,
                 'd-none': ((_a = this.iconColor) !== null && _a !== void 0 ? _a : this.color) === undefined,
             }, style: {
                 'background-color': ((_b = this.iconColor) !== null && _b !== void 0 ? _b : this.color)
                     ? `var(--theme-${(_c = this.iconColor) !== null && _c !== void 0 ? _c : this.color})`
                     : '',
-            } }), h("div", { key: '876d41acfceb40657e724482451588ccbfb06dd6', class: "overlay-header-content" }, h("ix-icon", { key: 'bfbdd91447f23b64f2d0a22a16b450016e9c86ce', size: "32", name: this.icon }), h("span", { key: '9be99e0ff37cc9023b2a66bc6be3a1af12a5a585', class: "overlay-header-title", title: this.name }, this.name)), h("ix-icon-button", { key: '57aed7319da3e3687ef7582849b9a35051d5e3eb', class: "overlay-close", ghost: true, icon: 'close', size: "24", onClick: () => this.closeOverlay() })), h("slot", { key: '8075187346f7e126505bd3defc79a6b4640da7cc' })));
+            } }), h("div", { key: '657730e6f7ee8de1dc6f81832e203dc08ff4fc4c', class: "overlay-header-content" }, h("ix-icon", { key: 'aa4b879448b68d7a98c663c1a1687886ec1ff319', size: "32", name: this.icon }), h("span", { key: '54c28bb988123955edb26f656af30a808b75e5d3', class: "overlay-header-title", title: this.name }, this.name)), h("ix-icon-button", { key: '86975e3e49b5f691c05631fa6b0726987cd136d4', class: "overlay-close", ghost: true, icon: 'close', size: "24", onClick: () => this.closeOverlay() })), h("slot", { key: 'fa0eb00b9acfe52af042b580c69b8cd444b35acc' })));
     }
     static get is() { return "ix-map-navigation-overlay"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/menu/burger-menu.js

@@ -27,7 +27,7 @@ export class BurgerMenu {
         this.pinned = false;
     }
     render() {
-        return (h(Host, { key: '4e7e34d73d70225b42dfdab7529786e9a86a1931', class: {
+        return (h(Host, { key: 'abeece1a04e139ac724db7f84642d98e04184997', class: {
                 expanded: this.expanded,
             } }, this.pinned ? (h("ix-icon-button", { icon: `double-chevron-${this.expanded ? 'left' : 'right'}`, ghost: true })) : (h("button", { class: Object.assign(Object.assign({}, getButtonClasses('secondary', false, true, true, false, false, false)), { 'burger-menu-button': true }), type: "button", "aria-label": this.ixAriaLabel ? this.ixAriaLabel : null, "aria-pressed": a11yBoolean(this.expanded) }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24" }, h("rect", { class: "line line-1", x: "2", y: "5", width: "20", height: "2" }), h("rect", { class: "line line-2", x: "2", y: "11", width: "13", height: "2" }), h("rect", { class: "line line-3", x: "2", y: "17", width: "20", height: "2" }))))));
     }

package/dist/collection/components/menu/menu.css

@@ -1690,10 +1690,11 @@
   flex-direction: row;
   position: absolute;
   height: 100%;
-  min-height: 22.75rem;
+  min-height: -moz-min-content;
+  min-height: min-content;
   z-index: var(--theme-z-index-sticky);
   width: auto;
-  bottom: 0px;
+  bottom: 0;
 }
 :host *,
 :host *::after,
@@ -1730,16 +1731,22 @@
   overflow-y: auto;
   pointer-events: all;
   -ms-overflow-style: none;
-  scrollbar-width: none;
+  scrollbar-width: inherit;
 }
 :host .tabs::-webkit-scrollbar {
   display: none;
 }
+:host .show-scrollbar {
+  scrollbar-width: inherit;
+}
+:host .show-scrollbar::-webkit-scrollbar {
+  display: inherit;
+}
 :host .tabs-shadow-container {
   overflow: hidden;
   display: block;
   position: relative;
-  margin-bottom: 2rem;
+  margin-bottom: 0.75rem;
 }
 :host .tabs--shadow {
   opacity: 0;
@@ -1752,11 +1759,11 @@
   transition: opacity var(--theme-default-time);
 }
 :host .tabs--shadow-top {
-  top: 0px;
+  top: 0;
   background: linear-gradient(var(--theme-color-shadow-1), transparent);
 }
 :host .tabs--shadow-bottom {
-  bottom: 0px;
+  bottom: 0;
   background: linear-gradient(transparent, var(--theme-color-shadow-1));
 }
 :host .tabs--shadow--show {
@@ -1834,14 +1841,14 @@
 :host(.breakpoint-sm) .menu:not(.expanded) {
   width: 0;
 }
-:host(.breakpoint-sm) .menu {
-  padding-top: 0.5rem;
+:host(.breakpoint-sm) .show-scrollbar {
+  padding-top: 1rem;
 }
 :host(.breakpoint-sm) .menu .burger-menu {
   display: none;
 }
 :host(.breakpoint-sm) .menu-overlay {
-  left: 0px;
+  left: 0;
   width: 100vw;
 }
 

package/dist/collection/components/menu/menu.js

@@ -240,6 +240,11 @@ export class Menu {
         this.expandChange.emit(this.expand);
         this.isTransitionDisabled = false;
         this.checkTransition();
+        if (this.breakpoint == 'sm' && this.expand) {
+            setTimeout(() => {
+                this.handleOverflowIndicator();
+            }, 100);
+        }
     }
     /**
      * Disable transition of overlay while menu animation is running.
@@ -380,43 +385,46 @@ export class Menu {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'dc5f861c533377667d90c4447fa69883ccd25a9c', class: {
+        return (h(Host, { key: 'e3390dbde8a79b02db176cd53cfc9b6a6eb0ccbd', class: {
                 expanded: this.expand,
                 [`breakpoint-${this.breakpoint}`]: true,
-            }, slot: "menu" }, h("aside", { key: '3f7c3f0fdc2c34b7443270453ae02f9fc80b69d4', class: {
+            }, slot: "menu" }, h("aside", { key: '3252deae90210285f9e1d39afbc7c31ad31bd936', class: {
                 menu: true,
                 expanded: this.expand,
             }, onClick: () => {
                 this.resetActiveTab();
-            } }, h("div", { key: '67dae20d4923d6c3dcd55554156bce973819e0b4', class: 'menu-buttons' }, h("ix-burger-menu", { key: '909f53239aad6af9171204fc709806399ffb64f2', onClick: async () => this.toggleMenu(), expanded: this.expand, ixAriaLabel: this.i18nExpandSidebar, pinned: this.showPinned, class: {
+            } }, h("div", { key: '279144a3230c31acf10e28ed1616900577ab735a', class: { 'menu-buttons': this.breakpoint != 'sm' } }, h("ix-burger-menu", { key: '5755b29d522d54989ccae911645be889569b3281', onClick: async () => this.toggleMenu(), expanded: this.expand, ixAriaLabel: this.i18nExpandSidebar, pinned: this.showPinned, class: {
                 'burger-menu': true,
             } }), this.breakpoint === 'sm' &&
-            this.applicationLayoutContext.appSwitchConfig && (h("ix-icon-button", { onClick: () => showAppSwitch(this.applicationLayoutContext.appSwitchConfig), icon: "apps", ghost: true, class: "app-switch" }))), h("div", { key: '2dced6457117ed28c2779da6da36b530c617d456', class: "menu-avatar" }, h("slot", { key: 'b980dd0ce062fad908d2abd77eac8d12dd113fe6', name: "ix-menu-avatar" })), h("div", { key: '5b46b35286c6d96abf3f0f0c997e7d9a9062ce09', id: "menu-tabs", style: {
+            this.applicationLayoutContext.appSwitchConfig && (h("ix-icon-button", { onClick: () => showAppSwitch(this.applicationLayoutContext.appSwitchConfig), icon: "apps", ghost: true, class: "app-switch" }))), h("div", { key: '14ef64bc805a19192c6004c77130b734ebd90809', id: "menu-tabs", style: {
                 display: 'contents',
-            }, onClick: (e) => this.onMenuItemsClick(e) }, h("div", { key: '6617a6f08eb96e86057b44f6016b4c4b5dc0d0b0', class: "tabs-top" }, h("slot", { key: 'fa41c0f63f37039d4f875f12379de9dd24fc7263', name: "home" })), h("div", { key: 'a3fdc5c413445908968fbb94cba60ab02c36635e', class: "tabs-shadow-container" }, h("div", { key: 'ac36763e0edf52dc07374aa5bb72e11b4f75d5cb', class: {
+            }, onClick: (e) => this.onMenuItemsClick(e) }, h("div", { key: '924354b6cf64fe8a8c687aa2e724a6a9188a49ad', class: "tabs-shadow-container" }, h("div", { key: 'c9335df438902140716736331c3c903b956c5e48', class: {
                 'tabs--shadow': true,
                 'tabs--shadow-top': true,
                 'tabs--shadow--show': this.itemsScrollShadowTop,
-            } }), h("div", { key: 'f4807e4294f0ece412ef094f7c637dfbceb6c231', class: "tabs", onScroll: () => this.handleOverflowIndicator() }, this.breakpoint !== 'sm' || !this.isHiddenFromViewport() ? (h("slot", null)) : null), h("div", { key: '1fa092109e0fced31873eca5bdf76cff0122e5ab', class: {
+            } }), h("div", { key: '5ac87d48659bad904d98e08410653d2a41bcb5bc', class: {
+                tabs: true,
+                'show-scrollbar': this.expand,
+            }, onScroll: () => this.handleOverflowIndicator() }, h("div", { key: 'dac993f433c3b8830b2566bb2f8d38d2adf2c9cd', class: "menu-avatar" }, h("slot", { key: '3964b31e2bf4d2ccc79dbe5cfd78252452867349', name: "ix-menu-avatar" })), h("slot", { key: '7a8ccbd26621fc9de3e9740b5b8dd7470276664d', name: "home" }), this.breakpoint !== 'sm' || !this.isHiddenFromViewport() ? (h("slot", null)) : null), h("div", { key: 'bcda1ddcc660dbf739dd9117f343bddf55711435', class: {
                 'tabs--shadow': true,
                 'tabs--shadow-bottom': true,
                 'tabs--shadow--show': this.itemsScrollShadowBottom,
-            } }))), h("div", { key: '7340e00be5bffcd3ea91b6cadef350bff4b2f771', class: "bottom-tab-divider" }), this.settings ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "settings", class: {
+            } }))), h("div", { key: '5584b89bf6007576ab6de1333343194668383d51', class: "bottom-tab-divider" }), this.settings ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "settings", class: {
                 'internal-tab': true,
                 'bottom-tab': true,
                 active: this.showSettings,
-            }, icon: 'cogwheel', onClick: async () => this.toggleSettings(!this.showSettings) }, this.i18nSettings)) : null, h("div", { key: 'f3c245f82072f5737581f59753c32d5a7486b0f2', onClick: (e) => this.onMenuItemsClick(e) }, h("slot", { key: '53625e79d26d534ec1cd16a51e270650ae185900', name: "bottom" })), h("div", { key: 'af9c50af4a7a89d877faf6acd5a97884f05a7403', id: "popover-area" }), this.about ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "aboutAndLegal", class: {
+            }, icon: 'cogwheel', onClick: async () => this.toggleSettings(!this.showSettings) }, this.i18nSettings)) : null, h("div", { key: '94f0772dc8a1be3556e0f326e5628ce8db9f6bb9', onClick: (e) => this.onMenuItemsClick(e) }, h("slot", { key: '7a2f19ebc72ab15dfd0c952d79b2cc69aa910727', name: "bottom" })), h("div", { key: '9472bdf5399ec2bee3db4805b58801c0fce97959', id: "popover-area" }), this.about ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "aboutAndLegal", class: {
                 'internal-tab': true,
                 'bottom-tab': true,
                 active: this.showAbout,
-            }, icon: 'info', onClick: async () => this.toggleAbout(!this.showAbout) }, this.i18nLegal)) : null, this.enableToggleTheme ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "toggleTheme", onClick: () => themeSwitcher.toggleMode(), class: "internal-tab bottom-tab", icon: 'light-dark' }, this.i18nToggleTheme)) : null, this.enableMapExpand || ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.sidebar) ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "menu-collapse", onClick: () => this.sidebarToggle(), class: "internal-tab bottom-tab", icon: `${this.getCollapseIcon()}` }, this.getCollapseText())) : null), h("div", { key: 'cc7443de9d327194cc7aff083033111642440efc', class: {
+            }, icon: 'info', onClick: async () => this.toggleAbout(!this.showAbout) }, this.i18nLegal)) : null, this.enableToggleTheme ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "toggleTheme", onClick: () => themeSwitcher.toggleMode(), class: "internal-tab bottom-tab", icon: 'light-dark' }, this.i18nToggleTheme)) : null, this.enableMapExpand || ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.sidebar) ? (h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "menu-collapse", onClick: () => this.sidebarToggle(), class: "internal-tab bottom-tab", icon: `${this.getCollapseIcon()}` }, this.getCollapseText())) : null), h("div", { key: '8d45ec496515fa07e7712a938e3af2c9cd342217', class: {
                 'menu-overlay': true,
                 visible: this.isOverlayVisible(),
                 expanded: this.expand,
             }, onTransitionEnd: () => {
                 this.isTransitionDisabled = true;
                 this.checkTransition();
-            } }, h("div", { key: '5a166f1447115082d0578b42768b9bf79f8df406', class: 'menu-overlay-container' }, this.showSettings ? h("slot", { name: "ix-menu-settings" }) : null), h("div", { key: '0f29a9bbb6a2acc42744818a1813329220ce5c54', class: 'menu-overlay-container' }, this.showAbout ? h("slot", { name: "ix-menu-about" }) : null))));
+            } }, h("div", { key: 'a05f175986d54b8c5d75b3a87da4607351cb97a0', class: 'menu-overlay-container' }, this.showSettings ? h("slot", { name: "ix-menu-settings" }) : null), h("div", { key: '588ae93a2ce717e71086e689c8f09e8c988fa570', class: 'menu-overlay-container' }, this.showAbout ? h("slot", { name: "ix-menu-about" }) : null))));
     }
     static get is() { return "ix-menu"; }
     static get encapsulation() { return "shadow"; }