@siemens/ix-docs 0.0.0-pr-2238-20251103105018 → 4.1.0

package/build/static/demo/v2/preview/html/assets/{ix-input.entry-DpLPx_8q.js → ix-input.entry-qeWpatb8.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { t as iconEye, u as iconEyeCancelled } from "./index-Cz75KU1f-BUHLjWzB.js";
-import { H as HookValidationLifecycle } from "./validation-D_dk-JqT-hK2sg2of.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
+import { t as iconEye, u as iconEyeCancelled } from "./index-8HpPmDK_-DinFJk0z.js";
+import { H as HookValidationLifecycle } from "./validation-D_dk-JqT-Db2_Mno0.js";
 import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
-import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, g as getAriaAttributesForInput, c as SlotStart, I as InputElement, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd } from "./input.util-VHrSuCP7-BxHyeFjg.js";
+import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, g as getAriaAttributesForInput, c as SlotStart, I as InputElement, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd } from "./input.fc-CQbX6V05-BCFlGXa1.js";
 import "./anime.esm-DhE1t8Qh-B6Ygv72Z.js";
 import "./animation-C5MWUgDN-BXCJNYHu.js";
 import "./a11y-Bb7pDeaQ-DNI84lDX.js";
@@ -37,6 +37,8 @@ const Input = class {
     this.required = false;
     this.disabled = false;
     this.readonly = false;
+    this.suppressSubmitOnEnter = false;
+    this.textAlignment = "start";
     this.isInvalid = false;
     this.isValid = false;
     this.isInfo = false;
@@ -108,15 +110,15 @@ const Input = class {
     return Promise.resolve(this.touched);
   }
   render() {
-    var _a;
+    var _a, _b;
     const inputAria = getAriaAttributesForInput(this);
-    return h(Host, { key: "05bb684da7ab25f4cea5429ec2c166a9c7a9cc21", class: {
+    return h(Host, { key: "07337a899a3b73d3cb37b1fc84da266d95cff84a", class: {
       disabled: this.disabled,
       readonly: this.readonly
-    } }, h("ix-field-wrapper", { key: "a2cd4a57590b5848de9738a0fbdff0c1c1947abc", htmlForLabel: this.inputId, required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: "e9369f9d649068b7708fabf29b9c2e25954591a6", class: "input-wrapper" }, h(SlotStart, { key: "4294b9e2329a9e0b9964630d76f64788f127e280", slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: "750c6a574acb4dac21f7a6143b34ae1482de7d74", id: this.inputId, readonly: this.readonly, disabled: this.disabled, maxLength: this.maxLength, minLength: this.minLength, pattern: this.pattern, type: this.inputType, isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, inputRef: this.inputRef, onKeyPress: (event) => checkAllowedKeys(this, event), valueChange: (value) => this.valueChange.emit(value), updateFormInternalValue: (value) => this.updateFormInternalValue(value), onBlur: () => {
+    } }, h("ix-field-wrapper", { key: "64461a842b4a784192fd7ab9fdc972bd4810785a", htmlForLabel: this.inputId, required: this.required, label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, warningText: this.warningText, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isValid: this.isValid, isInfo: this.isInfo, isWarning: this.isWarning, controlRef: this.inputRef }, h("div", { key: "aac87eb96cb2cba4b9f86527b6d7784d0a015474", class: "input-wrapper" }, h(SlotStart, { key: "87bcf8d63bd1a4020a680bc2b6def8034a9d65de", slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: "f6b81c671a36b00bde716d72a40c17b6cd409c24", id: this.inputId, readonly: this.readonly, disabled: this.disabled, maxLength: this.maxLength, minLength: this.minLength, pattern: this.pattern, type: this.inputType, isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, inputRef: this.inputRef, onKeyPress: (event) => checkAllowedKeys(this, event), valueChange: (value) => this.valueChange.emit(value), updateFormInternalValue: (value) => this.updateFormInternalValue(value), onBlur: () => {
       onInputBlur(this, this.inputRef.current);
       this.touched = true;
-    }, ariaAttributes: inputAria }), h(SlotEnd, { key: "ebd005ac85dc9109895d3cd7dcd147a08ee0fc02", slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("ix-icon-button", { key: "473f7914b0b2e7bbc970f9eadfed8f8ec96ed761", color: "color-weak-text", class: {
+    }, ariaAttributes: inputAria, form: (_a = this.formInternals.form) !== null && _a !== void 0 ? _a : void 0, suppressSubmitOnEnter: this.suppressSubmitOnEnter, textAlignment: this.textAlignment }), h(SlotEnd, { key: "c8f10373d93bba50d0c633b77fd7ec548e4590d5", slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("ix-icon-button", { key: "169c36e6719204de19756a1cf8c0a7c141119417", color: "color-weak-text", class: {
       "password-eye": true,
       "eye-hidden": this.type !== "password" || this.disabled
     }, variant: "tertiary", icon: this.inputType === "password" ? iconEye : iconEyeCancelled, onClick: () => {
@@ -125,7 +127,7 @@ const Input = class {
         return;
       }
       this.inputType = "password";
-    } }))), !!this.maxLength && this.maxLength > 0 && h("ix-typography", { key: "f5a0bc6e09ce7be919ccf97b34af1ef804c29df7", class: "bottom-text", slot: "bottom-right", textColor: "soft" }, ((_a = this.value) !== null && _a !== void 0 ? _a : "").length, "/", this.maxLength)));
+    } }))), !!this.maxLength && this.maxLength > 0 && h("ix-typography", { key: "d4041de277ec45534274a6a4a739ff90cd4b98c1", class: "bottom-text", slot: "bottom-right", textColor: "soft" }, ((_b = this.value) !== null && _b !== void 0 ? _b : "").length, "/", this.maxLength)));
   }
   static get formAssociated() {
     return true;

package/build/static/demo/v2/preview/html/assets/{ix-key-value-list.entry-DlyoOZ9x.js → ix-key-value-list.entry-BwbsZjkJ.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
 const keyValueListCss = ":host(.keyValueList) ::slotted(ix-key-value){border-bottom:1px solid var(--theme-color-weak-bdr)}:host(.keyValueList.keyValueList--striped) ::slotted(ix-key-value:nth-child(odd)){background:var(--theme-color-ghost-alt)}";
 const KeyValueList = class {
   constructor(hostRef) {
@@ -6,7 +6,7 @@ const KeyValueList = class {
     this.striped = false;
   }
   render() {
-    return h(Host, { key: "e262c5729ec77f3c9a2beb0a7039cb40422d691e", class: { keyValueList: true, "keyValueList--striped": this.striped } }, h("slot", { key: "72e1498f1f1783e181eb8e83e09c337c5aa564d7" }));
+    return h(Host, { key: "fcc3ec3470c25cac50b88a1006b30be059f778f8", class: { keyValueList: true, "keyValueList--striped": this.striped } }, h("slot", { key: "05645a91f92d7db584bd8235f73979249870e734" }));
   }
 };
 KeyValueList.style = keyValueListCss;

package/build/static/demo/v2/preview/html/assets/{ix-key-value.entry-B3gZCDBx.js → ix-key-value.entry-82lfYb8D.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
 const keyValueCss = ":host(.keyValue){display:flex;flex-direction:row;align-items:center;gap:1rem}:host(.keyValue) .keyValue__icon{padding:0.25rem 0}:host(.keyValue) .keyValue__content{display:flex;flex-grow:1;align-items:flex-start}:host(.keyValue) .keyValue__content,:host(.keyValue) .keyValue__content .content__label,:host(.keyValue) .keyValue__content .content__value{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.keyValue) .keyValue__content .content__label{color:var(--theme-color-soft-text)}:host(.keyValue) .keyValue__content .content__value{width:100%}:host(.keyValue.keyValue--column){padding:0.5rem 0;border-bottom:1px solid var(--theme-color-soft-bdr)}:host(.keyValue.keyValue--column) .keyValue__content{flex-direction:column}:host(.keyValue.keyValue--column) .keyValue__content .content__label,:host(.keyValue.keyValue--column) .keyValue__content .content__value:not(.has-customValue){padding:2px 0}:host(.keyValue.keyValue--row){padding:0.25rem 0}:host(.keyValue.keyValue--row) .keyValue__content{flex-direction:row;gap:1rem;align-items:center}:host(.keyValue.keyValue--row) .keyValue__content .content__label,:host(.keyValue.keyValue--row) .keyValue__content .content__value:not(.has-customValue){padding:6px 0}:host(.keyValue.keyValue--row) .keyValue__content .content__label{min-width:8rem}";
 const KeyValue = class {
   constructor(hostRef) {
@@ -6,7 +6,7 @@ const KeyValue = class {
     this.labelPosition = "top";
   }
   render() {
-    return h(Host, { key: "29b48b869917aa09c497c7314c1b3297c70712f3", class: `keyValue keyValue--${this.labelPosition === "top" ? "column" : "row"}` }, this.icon && h("ix-icon", { key: "50069d0a641035114045d44ae696a8a24f82bc26", name: this.icon, size: "24", class: "keyValue__icon", "aria-label": this.ariaLabelIcon }), h("div", { key: "efebf2aafab9c171a61287ac9f3f85e943388830", class: "keyValue__content" }, h("div", { key: "cc01525dfa12c51b3f16170adc448f61c13126e6", class: "content__label" }, this.label), h("div", { key: "d9c9ce50e3b101266fe522e32eb12c2b0b7b6004", class: {
+    return h(Host, { key: "7fb93d7b2fbcf2ce8aac64eda186d82a5a45cbe7", class: `keyValue keyValue--${this.labelPosition === "top" ? "column" : "row"}` }, this.icon && h("ix-icon", { key: "4ec1a309785fba489f0c8d9dfb2c024268c92193", name: this.icon, size: "24", class: "keyValue__icon", "aria-label": this.ariaLabelIcon }), h("div", { key: "95fb53fe545cd00bc84b6eeeba6c910eff2143cc", class: "keyValue__content" }, h("div", { key: "631b09a0969534b81538968c50c886b5337a0765", class: "content__label" }, this.label), h("div", { key: "d45d5050124bf055a05cd71305b2b4e9d30a572d", class: {
       content__value: true,
       "has-customValue": this.value === void 0
     } }, this.value !== void 0 ? this.value : h("slot", { name: "custom-value" }))));

package/build/static/demo/v2/preview/html/assets/{ix-kpi.entry-CMdvGStb.js → ix-kpi.entry-BNq6YtJO.js}

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host } from "./global-C8r7td8X.js";
-import { a as iconWarning, v as iconAlarm } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
+import { a as iconWarning, v as iconAlarm } from "./index-8HpPmDK_-DinFJk0z.js";
 const kpiCss = ":host{display:flex;flex-grow:1;height:2.5rem;border-radius:var(--theme-kpi--border-radius);padding:0.375rem 0.25rem;min-width:0}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .kpi-container{display:flex;height:100%;width:100%;border-block-end:2px solid grey}:host .kpi-container.alarm{border-block-end-color:var(--theme-color-alarm)}:host .kpi-container.warning{border-block-end-color:var(--theme-color-warning)}:host .kpi-container .kpi-label{display:flex;align-items:center;color:var(--theme-kpi-display-label--color);flex-grow:1;flex-shrink:9999}:host .kpi-container .kpi-label ix-icon{margin-inline-end:0.25rem}:host .kpi-container .kpi-value-container{display:flex;align-items:flex-end}:host .kpi-container .kpi-value{color:var(--theme-kpi-display-value--color);font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}:host .kpi-container .kpi-unit{margin-inline-start:0.5rem;color:var(--theme-kpi-display-units--color)}:host .kpi-container .kpi-label,:host .kpi-container .kpi-unit{margin-block-start:0.125rem}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):hover,:host:not(.disabled):not(:disabled).hover{background-color:var(--theme-kpi-display--background--hover)}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):active,:host:not(.disabled):not(:disabled).active{background-color:var(--theme-kpi-display--background--active)}:host:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--focus--border-color)}:host(.stacked){height:3.75rem}:host(.stacked) .kpi-container{justify-content:center;flex-wrap:wrap}:host(.stacked) .kpi-container .kpi-label{width:100%;justify-content:center}";
 const Kpi = class {
   constructor(hostRef) {
@@ -25,13 +25,13 @@ const Kpi = class {
     return tooltip;
   }
   render() {
-    return h(Host, { key: "b60cacc3f468bfb645ab5f8b7217fab907b24d62", title: this.getTooltipText(), tabindex: "1", class: {
+    return h(Host, { key: "34fcbb68ba73d08619ef12fd9595c9c684aa3d10", title: this.getTooltipText(), tabindex: "1", class: {
       stacked: this.orientation === "vertical"
-    } }, h("div", { key: "f191f41a59eb16f11f69aeae0cd367b3e6cc6e97", class: {
+    } }, h("div", { key: "cd4910a41ee179ea21166c80322e5361dd132850", class: {
       "kpi-container": true,
       alarm: this.state === "alarm",
       warning: this.state === "warning"
-    } }, h("span", { key: "1f77ffa87ad64740858fb9dd46ef3b2d206e6983", class: "kpi-label" }, this.getStateIcon(), h("span", { key: "8347d50cc808a3b677c0340452f1482139f91c35", class: "kpi-label-text" }, this.label)), h("span", { key: "20c58411fb499cccf20c4d6f92b75c1d875d8fbd", class: "kpi-value-container" }, h("span", { key: "49df3a72c7da17998eec8de2be47bb0da4b68495", class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : "")));
+    } }, h("span", { key: "33226fc8e0561e4db98181be1b6595534561bab7", class: "kpi-label" }, this.getStateIcon(), h("span", { key: "06cb693420e43f2475cfae0d8f2217a2770ac5cc", class: "kpi-label-text" }, this.label)), h("span", { key: "8a837f1466b2670d473983aaffc2742737fb8a9a", class: "kpi-value-container" }, h("span", { key: "5e66113f88a3637aaf83c3482a5625b290e25763", class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : "")));
   }
 };
 Kpi.style = kpiCss;

package/build/static/demo/v2/preview/html/assets/{ix-layout-auto.entry-CAExqP3H.js → ix-layout-auto.entry-CWJQVCiF.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
 const layoutAutoCss = ":host{display:block;position:relative;margin:0 0.75rem;--ix-layout-grid-gap:1.5rem}:host .container{display:flex;align-items:stretch;flex-wrap:wrap;gap:var(--ix-layout-grid-gap)}:host ::slotted(*){flex-grow:0;flex-shrink:0}";
 const LayoutForm = class {
   constructor(hostRef) {
@@ -71,7 +71,7 @@ const LayoutForm = class {
     });
   }
   render() {
-    return h(Host, { key: "89fa65872d5cd211c41e8bfda6544155bbbbcc1c" }, h("div", { key: "b6a75e6ce330bbe76c5c3b83a541d3366bfb6866", class: "container" }, h("slot", { key: "d6983232325c2c0081346b059561137e9cf23669" })));
+    return h(Host, { key: "48511195af19191b832713a828ac0945b06a4898" }, h("div", { key: "4a51469ffe227db5c361734fc3122a98f7e0fbcc", class: "container" }, h("slot", { key: "6ab367e83612df056e40392bced22c5f80457486" })));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/ix-link-button.entry-dHv1Bpb5.js

@@ -0,0 +1,23 @@
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
+import { w as iconChevronRightSmall } from "./index-8HpPmDK_-DinFJk0z.js";
+const linkButtonCss = ":host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover,:host .link-button:not(.disabled):not(:disabled).hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";
+const LinkButton = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.disabled = false;
+    this.target = "_self";
+  }
+  render() {
+    return h(Host, { key: "83b41ef8a3bef06a033a9a20c30a4ae1e83066e8" }, h("a", { key: "955dc6e492eec929e592947ec18009d744d1f973", title: this.url, tabindex: "0", class: {
+      "link-button": true,
+      disabled: this.disabled
+    }, href: this.disabled ? void 0 : this.url, target: this.target }, h("ix-icon", { key: "b0589b7cedf757244950b1595916f8c838ae603d", class: "icon", name: iconChevronRightSmall, size: "16", "aria-hidden": "true" }), h("div", { key: "c3ceb43628b0a48d60bbcd6bb54a4ad493ae3de8", class: {
+      link: true,
+      disabled: this.disabled
+    } }, h("slot", { key: "2bd6071e8aad57fb13226d8452b0649367c6b750" }))));
+  }
+};
+LinkButton.style = linkButtonCss;
+export {
+  LinkButton as ix_link_button
+};

package/build/static/demo/v2/preview/html/assets/{ix-menu-about-item.entry-B86hAe95.js → ix-menu-about-item.entry-LhAJx3gt.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from "./global-C8r7td8X.js";
+import { r as registerInstance, c as createEvent, h, H as Host } from "./global-jo2I2sSs.js";
 const menuAboutItemCss = ":host{display:block}";
 const MenuAboutItem = class {
   constructor(hostRef) {
@@ -13,7 +13,7 @@ const MenuAboutItem = class {
     });
   }
   render() {
-    return h(Host, { key: "65b663ccd628378a95ce42a3e5244a232eff116f" }, h("slot", { key: "c3a34b0a229cb627038be98d9d82d13228a6ca11" }));
+    return h(Host, { key: "c150379d52f7dd0744ec480c35909937abef9c90" }, h("slot", { key: "37edb415a550ba73903bd6142162c42fe7be9d34" }));
   }
   static get watchers() {
     return {

package/build/static/demo/v2/preview/html/assets/{ix-menu-about-news.entry-BWzu907_.js → ix-menu-about-news.entry-BATNXDjK.js}

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from "./global-C8r7td8X.js";
-import { q as iconClose, y as iconShout } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { r as registerInstance, c as createEvent, h, H as Host } from "./global-jo2I2sSs.js";
+import { q as iconClose, x as iconShout } from "./index-8HpPmDK_-DinFJk0z.js";
 const menuAboutNewsCss = ":host{--margin:0.5rem;display:block;position:fixed;width:20rem;height:auto;background-color:var(--theme-color-2);border-radius:0.25rem;padding:1rem;left:3.4rem;z-index:10000;transition:left var(--theme-default-time);margin-inline-start:var(--margin) !important;box-shadow:var(--theme-box-shadow-level-4)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .banner-container{position:absolute;top:0.0625rem;left:1rem}:host .banner-container svg{position:absolute;height:3.625rem;width:3rem}:host .banner-container svg polygon{fill:var(--theme-color-primary)}:host .banner-container ix-icon{margin:0.5rem;position:absolute;z-index:1}:host .cui-popover-news-header{margin-bottom:2.5rem;margin-inline-start:4rem;margin-block-start:-0.25rem}:host .popover-body{color:var(--theme-color-std-text)}:host .cui-popover-news-footer{display:flex;justify-content:flex-end;margin-top:1rem}:host ix-icon-button{top:0.5rem;right:0.5rem;position:absolute}:host #arrow{position:absolute;width:0.5rem;height:0.5rem;background-color:var(--theme-color-2);transform:translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg)}:host(.expanded){left:calc(3.4rem + 12.7rem)}:host(.show){display:none}@media only screen and (max-width: 48em){:host{display:flex;flex-direction:column;max-height:calc(100vh - 4.75rem);width:calc(100% - 2rem);max-width:30rem;transform:translateX(calc(1rem - 50%));left:calc(50% - 1rem) !important;bottom:1rem !important;margin-inline:0 !important;z-index:calc(var(--theme-z-index-sticky) - 1)}:host .slot-container{overflow-y:auto}:host #arrow{display:none}}";
 const MenuAboutNews = class {
   constructor(hostRef) {
@@ -11,16 +11,16 @@ const MenuAboutNews = class {
     this.expanded = false;
   }
   render() {
-    return h(Host, { key: "f6796c5d93527d954d18748a60cdbbdab1370af2", class: {
+    return h(Host, { key: "61a51cc04b238505c64285babebaaddf1201a9f7", class: {
       expanded: this.expanded,
       show: !this.show
-    } }, h("div", { key: "3ff7376bd993e2d8ed6f86ae75b5e594027db70a", class: "banner-container" }, h("ix-icon", { key: "6fd35d106b65158700c2255005485e99ad4365a6", color: "color-inv-contrast-text", name: iconShout, size: "32" }), h("svg", { key: "624dcf3a1c412c5480a5f5bd643c7c950c13f70e", viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, h("polygon", { key: "eb0c8a2a6713b83f49be3f96bbf93f0a0d375b09", points: "0 0 48 0 48 56 24 48 0 56" }))), h("div", { key: "4790036caabea78033ca2272f4f58faf1ab05991", class: "cui-popover-news-header" }, h("ix-typography", { key: "4f5a8de94bdcc382e334b8ec6f7483773280ec49", format: "label", bold: true }, this.label)), h("ix-icon-button", { key: "71f9249273af952e0a88a22284f24bbdd3e52760", size: "24", icon: iconClose, iconColor: "color-soft-text", variant: "tertiary", onClick: () => {
+    } }, h("div", { key: "c63c6cab269ef75f01d0396333c5c44ee271d354", class: "banner-container" }, h("ix-icon", { key: "2a3b5ced1c9f9fce0f742a34d9862e115807f6fb", color: "color-inv-contrast-text", name: iconShout, size: "32" }), h("svg", { key: "2433dd408f46a4d0f47e5cf075980b6a2ea2ece7", viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, h("polygon", { key: "386186a0847a504ca07052e1a49ee0c9f6314377", points: "0 0 48 0 48 56 24 48 0 56" }))), h("div", { key: "ec280ef23c279507e186fa0ba0743e64e49d38c8", class: "cui-popover-news-header" }, h("ix-typography", { key: "784c5718192c7641e43004439cedcdc0f6285380", format: "label", bold: true }, this.label)), h("ix-icon-button", { key: "0c5a987a93067b0641ad0d7cd99e747aaa884d40", size: "24", icon: iconClose, iconColor: "color-soft-text", variant: "tertiary", onClick: () => {
       this.show = false;
       this.closePopover.emit();
-    } }), h("div", { key: "daf74d24e1c84fb3acf796bb3a9f6e9117dd9496", class: "slot-container" }, h("slot", { key: "d9809a23c9d7635158b22d535f6b06da085992e8" })), this.aboutItemLabel ? h("div", { class: "cui-popover-news-footer" }, h("ix-button", { variant: "primary", onClick: (e) => {
+    } }), h("div", { key: "780df8bab613bad3b80a3528947fdc0bab41187c", class: "slot-container" }, h("slot", { key: "1992c8d99353665ee6b88b4d21c34869284029d6" })), this.aboutItemLabel ? h("div", { class: "cui-popover-news-footer" }, h("ix-button", { variant: "primary", onClick: (e) => {
       this.show = false;
       this.showMore.emit(e);
-    } }, this.i18nShowMore)) : null, h("div", { key: "994de1ee58d3c39baed52ce729e77379c6c58a55", id: "arrow" }));
+    } }, this.i18nShowMore)) : null, h("div", { key: "b877e4087ebe56fca5c82a7acada5ba7c7ef8abb", id: "arrow" }));
   }
 };
 MenuAboutNews.style = menuAboutNewsCss;

package/build/static/demo/v2/preview/html/assets/{ix-menu-about.entry-BzCmqZg4.js → ix-menu-about.entry-CjX1qHPh.js}

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement } from "./global-C8r7td8X.js";
-import { s as setTab, i as initialize, M as MenuTabs } from "./ix-menu-settings.entry-DOQ9IwkJ.js";
-import "./index-Cz75KU1f-BUHLjWzB.js";
+import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement } from "./global-jo2I2sSs.js";
+import { s as syncTabDisplay, i as initialize, M as MenuTabs } from "./ix-menu-settings.entry-DoMrnHPY.js";
+import "./index-8HpPmDK_-DinFJk0z.js";
 const menuAboutCss = ".text-xs{font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-s{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption-single{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-h2{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-xl{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}a{color:var(--theme-color-primary)}:host{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}:host .about-header{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}:host .about-header h2{color:var(--theme-nav-overlay-header--color);margin-bottom:1rem}:host ix-tabs{margin-bottom:1.5rem}:host ix-menu-about-item{display:none}";
 const MenuAbout = class {
   constructor(hostRef) {
@@ -10,8 +10,10 @@ const MenuAbout = class {
     this.label = "About & legal information";
     this.show = false;
   }
-  updateTab(label) {
-    setTab(this, label);
+  updateTab(newLabel, oldLabel) {
+    if (newLabel !== oldLabel) {
+      syncTabDisplay(this, newLabel);
+    }
   }
   componentWillLoad() {
     initialize(this);
@@ -20,7 +22,7 @@ const MenuAbout = class {
     forceUpdate(this.el);
   }
   render() {
-    return h(MenuTabs, { key: "f39b61fd405141b8e2e7061bd76194ee4beb3a3d", context: this });
+    return h(MenuTabs, { key: "e49c1819db2fcba5b330c776c84e905d6f1aef87", context: this });
   }
   get el() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-menu-avatar.entry-CJPIp1Vx.js → ix-menu-avatar.entry-BRHmRvb9.js}

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
 import { g as getSlottedElements } from "./shadow-dom-i60z1FJC-Cx4XiL3F.js";
-import { z as iconLogOut } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { y as iconLogOut } from "./index-8HpPmDK_-DinFJk0z.js";
 const menuAvatarCss = ":host{display:block;position:relative;margin-bottom:0.5rem;margin-right:0.75rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .avatar{all:unset;box-sizing:border-box;display:flex;align-items:center;height:2.5rem;width:100%;max-height:2.5rem;padding-left:0.25rem;margin-left:0.41rem;margin-right:0.35rem;transition:var(--theme-default-time)}:host .avatar .avatar-name{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap;margin-left:1rem;line-height:1.14}:host .avatar .avatar-name .text-default-single{color:var(--theme-nav-item-primary--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .avatar{border-radius:1.25rem}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):hover,:host .avatar:not(.disabled):not(:disabled).hover{background-color:var(--theme-avatar-btn--background--hover);color:var(--theme-avatar-btn--color--hover)}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):active,:host .avatar:not(.disabled):not(:disabled).active{background-color:var(--theme-avatar-btn--background--active);color:var(--theme-avatar-btn--color--active)}:host .avatar:focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";
 const MenuAvatar = class {
   constructor(hostRef) {
@@ -20,9 +20,9 @@ const MenuAvatar = class {
     this.showContextMenu = elements.length !== 0;
   }
   render() {
-    return h(Host, { key: "a782ea05231fff5ebebe2fe12a2775f519f327cf", slot: "ix-menu-avatar" }, h("button", { key: "044a34b7db89797213223719a17a1b061cb1bd73", class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, h("ix-avatar", { key: "cb1330bf41ca940bb3bde9025cbb1ea4871d2252", image: this.image, initials: this.initials }), h("div", { key: "ed6465daf36db4b60d3aceefbf6408677173a3f0", class: "avatar-name" }, h("span", { key: "571392ee4ae8b60dd252ab92397d31784e4e3a5c", class: "text-default-single", title: this.top }, this.top), h("span", { key: "52f9870036a925195723682aab11b103515f2c9d", class: "text-default-single", title: this.bottom }, this.bottom))), h("ix-dropdown", { key: "09e4dd18be61500b17a6315792fb1ba334a5435c", trigger: this.hostElement, placement: "right-start", hidden: !this.showContextMenu && this.hideLogoutButton, offset: {
+    return h(Host, { key: "6cff313b74cbbd668ed30dd7c04e060867ae0095", slot: "ix-menu-avatar" }, h("button", { key: "c387330d89a9d5740f0af21ec4e7d0f077510064", class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, h("ix-avatar", { key: "82f6207b4005ad8a799d29ce52a629d805d60b36", image: this.image, initials: this.initials }), h("div", { key: "c1a6a4e03b3dda5b36a3caa6c7595a32407b9c19", class: "avatar-name" }, h("span", { key: "a8b413ee5ec9a9f60d26ce695df3d9359831867d", class: "text-default-single", title: this.top }, this.top), h("span", { key: "b333a5337d49199f9545eb30361fe5166d8a8725", class: "text-default-single", title: this.bottom }, this.bottom))), h("ix-dropdown", { key: "31b4149a67636711972e1f682da62a60f833e9f3", trigger: this.hostElement, placement: "right-start", hidden: !this.showContextMenu && this.hideLogoutButton, offset: {
       mainAxis: 16
-    } }, h("slot", { key: "95885a59468c02dc83b81e47598224761b65f337", onSlotchange: () => this.onSlotChange() }), !this.hideLogoutButton && h("ix-menu-avatar-item", { key: "f79cf9960e1de2ee4b03d797d5da4ec8ae53af9b", label: this.i18nLogout, icon: iconLogOut, onClick: (e) => {
+    } }, h("slot", { key: "a17ca070258b8b892c647f4cc2429b21562072c1", onSlotchange: () => this.onSlotChange() }), !this.hideLogoutButton && h("ix-menu-avatar-item", { key: "cbc2544543237b2874744c0678838b701ec89d4a", label: this.i18nLogout, icon: iconLogOut, onClick: (e) => {
       this.logoutClick.emit(e);
     } })));
   }

package/build/static/demo/v2/preview/html/assets/{ix-menu-category.entry-C_eROcgW.js → ix-menu-category.entry-Bt9v-SiC.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
 import { a as animate } from "./anime.esm-DhE1t8Qh-B6Ygv72Z.js";
-import { c as closestIxMenu } from "./context-CKM5pVsv-B0zIukL5.js";
+import { c as closestIxMenu } from "./context-BniHpAE1-BXrc-Gwu.js";
 import { c as createMutationObserver } from "./mutation-observer-CX81WQtk-DFcmhOTk.js";
-import { g as iconChevronDownSmall } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { h as iconChevronDownSmall } from "./index-8HpPmDK_-DinFJk0z.js";
 import "./typed-event-BdCnOrqW-CWsLM0S_.js";
 function createEnterLeaveDebounce(enterCallback, leaveCallback, { debounceTimeEnter, debounceTimeLeave } = {
   debounceTimeEnter: 0,
@@ -164,7 +164,7 @@ const MenuCategory = class {
     }
   }
   render() {
-    return h(Host, { key: "3ab492c20cd7c41d300db0c3c4ad2cf5a6d51090", class: {
+    return h(Host, { key: "13ac63c3321e33e4781ab642577464fde79c6bf2", class: {
       expanded: this.showItems
     }, onPointerEnter: () => {
       this.enterLeaveDebounce.onEnter();
@@ -173,14 +173,14 @@ const MenuCategory = class {
         return;
       }
       this.enterLeaveDebounce.onLeave();
-    } }, h("ix-menu-item", { key: "a59b7d4c9a1360f10c3555d57ece5e8ca439f711", class: "category-parent", active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), tooltipText: this.tooltipText, isCategory: true }, h("div", { key: "e7fb335217c858737e99a1c1df4959b1d15d1867", class: "category" }, h("div", { key: "6700c5e1926a1fa908f323e2bfd059ef7abc3d9d", class: "category-text" }, this.label), h("ix-icon", { key: "576a5b8a6ed3a7944a33d813bd254deaa8175438", name: iconChevronDownSmall, class: {
+    } }, h("ix-menu-item", { key: "25e8a0a50ea1540e346e830045275e6a0c63327d", class: "category-parent", active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), tooltipText: this.tooltipText, isCategory: true }, h("div", { key: "5b0dcefb391bada721218f4d3ba690c1a2de966e", class: "category" }, h("div", { key: "f65e560cb7a6ab490220b814f9e66bbfd010bc44", class: "category-text" }, this.label), h("ix-icon", { key: "672a4f90f58ad0cdf023d050d4b3f75114a4ee52", name: iconChevronDownSmall, class: {
       "category-chevron": true,
       "category-chevron--open": this.showItems
-    } }))), h("div", { key: "2898f39c1f4665a5cb684f875d7881558434cf80", ref: (ref) => this.menuItemsContainer = ref, class: {
+    } }))), h("div", { key: "d7f0f085f33a09d7c57ca18818a90125b3c2e2bf", ref: (ref) => this.menuItemsContainer = ref, class: {
       "menu-items": true,
       "menu-items--expanded": this.showItems,
       "menu-items--collapsed": !this.showItems
-    } }, this.showItems ? h("slot", null) : null), h("ix-dropdown", { key: "6e93539319261b3bd5c53cf80c75ddf4ff240376", closeBehavior: "both", show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
+    } }, this.showItems ? h("slot", null) : null), h("ix-dropdown", { key: "e5b6be4ba14c97ef2e85abd01833bed929b1efa4", closeBehavior: "both", show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
       this.showDropdown = dropdownShown;
     }, class: "category-dropdown", anchor: this.hostElement, placement: "right-start", offset: {
       mainAxis: 3
@@ -192,7 +192,7 @@ const MenuCategory = class {
           e.preventDefault();
         }
       }
-    } }, h("ix-dropdown-item", { key: "aeb52967293d03a82de20c59b448d7f13cd03639", class: "category-dropdown-header" }, h("ix-typography", { key: "19ccac9959ec874b240989a2c43f7c03ed70d9b9", format: "label", bold: true, textColor: "std" }, this.label)), h("ix-divider", { key: "1d113cd249baee291d9e25d47ed1eaecec56a7a7" }), h("slot", { key: "7a21ba6c7a35fef4391bb57fa27cad853edd729a" })));
+    } }, h("ix-dropdown-item", { key: "90e095e2d61e5d359c29c742e4e84457ef47426f", class: "category-dropdown-header" }, h("ix-typography", { key: "67efee1940b51e0457ccec7f0a271684ea6df881", format: "label", bold: true, textColor: "std" }, this.label)), h("ix-divider", { key: "2ec48cbab9dc6a223fcc636e59b497b1db315369" }), h("slot", { key: "e32fb89cf4045faae851af8d1ed1c4ab394e1709" })));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-menu-expand-icon.entry-Def4QeRh.js → ix-menu-expand-icon.entry-WB7FenrS.js}

@@ -1,7 +1,7 @@
-import { r as registerInstance, h, H as Host } from "./global-C8r7td8X.js";
-import { g as getButtonClasses } from "./base-button-TVpiK7pg-BhRYy5BG.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
+import { g as getButtonClasses } from "./base-button-TVpiK7pg-ChRAAgKw.js";
 import { a as a11yBoolean } from "./a11y-Bb7pDeaQ-DNI84lDX.js";
-import { I as iconDoubleChevronLeft, G as iconDoubleChevronRight } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { H as iconDoubleChevronLeft, F as iconDoubleChevronRight } from "./index-8HpPmDK_-DinFJk0z.js";
 const menuExpandIconCss = ":host{--ix-button-border-radius-left:var(--theme-btn--border-radius);--ix-button-border-radius-right:var(--theme-btn--border-radius);display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button,:host a{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none;margin-right:0.25rem}:host .icon-right{margin-left:0.25rem}:host(.disabled){cursor:default}:host .btn-subtle-tertiary{border-top-left-radius:var(--ix-button-border-radius-left);border-bottom-left-radius:var(--ix-button-border-radius-left);border-top-right-radius:var(--ix-button-border-radius-right);border-bottom-right-radius:var(--ix-button-border-radius-right)}:host .btn-subtle-tertiary,:host .btn-subtle-tertiary.focus,:host .btn-subtle-tertiary:focus-visible{background-color:var(--theme-btn-subtle-tertiary--background);color:var(--theme-btn-subtle-tertiary--color);--ix-button-color:var(--theme-btn-subtle-tertiary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-subtle-tertiary--border-color);border-style:solid}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-subtle-tertiary.selected{background-color:var(--theme-btn-subtle-tertiary--background--pressed);color:var(--theme-btn-subtle-tertiary--color--pressed)}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled):hover,:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-btn-subtle-tertiary--background--pressed-hover);color:var(--theme-btn-subtle-tertiary--color--pressed-hover)}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled):active,:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-subtle-tertiary--background--pressed-hover);color:var(--theme-btn-subtle-tertiary--color--pressed-active)}:host .btn-subtle-tertiary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):hover,:host .btn-subtle-tertiary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-subtle-tertiary--border-color--hover);background-color:var(--theme-btn-subtle-tertiary--background--hover);color:var(--theme-btn-subtle-tertiary--color--hover)}:host .btn-subtle-tertiary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):active,:host .btn-subtle-tertiary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-subtle-tertiary--border-color--active);background-color:var(--theme-btn-subtle-tertiary--background--active);color:var(--theme-btn-subtle-tertiary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-subtle-tertiary.disabled,:host(.disabled) .btn-subtle-tertiary:disabled{pointer-events:none;border-color:var(--theme-btn-subtle-tertiary--border-color--disabled);background-color:var(--theme-btn-subtle-tertiary--background--disabled);color:var(--theme-btn-subtle-tertiary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-subtle-tertiary--color--disabled)}:host{display:flex;justify-content:center;align-items:center;height:2rem;width:2rem;border-radius:var(--theme-btn--border-radius);pointer-events:all}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host svg{display:inline-block;vertical-align:middle}:host .line{fill:var(--theme-menu-btn--color);opacity:1;x:2px;transition:x 0.075s ease-in var(--theme-default-time), transform 0.075s ease-in-out 0.075s, y 0.075s ease-in-out, opacity 0.075s linear 0.075s;transform-origin:center}:host(:not(.disabled):not(:disabled)){cursor:pointer}:host(:hover:not(.disabled):not(:disabled)) .menu-expand-button{background-color:var(--theme-menu-btn--background--hover)}.menu-expand-button{width:2rem;padding:0px !important;cursor:pointer}:host(:not(.disabled):not(:disabled)){cursor:pointer}:host(:active:not(.disabled):not(:disabled)) .menu-expand-button{background-color:var(--theme-menu-btn--background--active)}:host(.expanded) svg .line-1{opacity:1;transform:rotate(-45deg);y:11px}:host(.expanded) svg .line-2{opacity:0;x:9}:host(.expanded) svg .line-3{opacity:1;transform:rotate(45deg);y:11px}";
 const MenuExpandIcon = class {
   constructor(hostRef) {
@@ -29,7 +29,7 @@ const MenuExpandIcon = class {
     return this.getSmallScreenIcon();
   }
   render() {
-    return h(Host, { key: "55bb276dfb9ec7960d0e81c1885f022790ef2967", class: {
+    return h(Host, { key: "702baa75b182df885e9488301b2747fb37f96c52", class: {
       expanded: this.expanded
     }, type: "button", "aria-label": this.ixAriaLabel, "aria-pressed": a11yBoolean(this.expanded) }, this.getMenuIcon());
   }

package/build/static/demo/v2/preview/html/assets/{ix-menu-item.entry-CIWXAYp_.js → ix-menu-item.entry-D4WYRGSS.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
 import { c as createMutationObserver } from "./mutation-observer-CX81WQtk-DFcmhOTk.js";
 import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
 import { m as menuController } from "./menu-service-BMvtckRa-Dk6abri9.js";
-import { T as iconDocument } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { T as iconDocument } from "./index-8HpPmDK_-DinFJk0z.js";
 import { a as a11yBoolean } from "./a11y-Bb7pDeaQ-DNI84lDX.js";
 import "./typed-event-BdCnOrqW-CWsLM0S_.js";
 const createSequentialId = (prefix, sequenceId2) => {
@@ -80,11 +80,11 @@ const MenuItem = class {
       tabIndex: this.disabled ? -1 : 0
     };
     const menuContent = [
-      this.icon && h("ix-icon", { key: "010ccc4efd7284bfc7654ab6f9b29783129f17ff", class: "tab-icon", name: this.icon }),
+      this.icon && h("ix-icon", { key: "cf444eeb0b3478721a77ee1dc52436689e4c0102", class: "tab-icon", name: this.icon }),
       this.notifications ? h("div", { class: "notification" }, h("div", { class: "pill" }, this.notifications)) : null,
-      h("span", { key: "247db957f1317fe528db4a863736cc7bf974fbcc", id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: "dbe0bcf50882232b686e322af346ea8edb0007bf" }))
+      h("span", { key: "93ac9e24f2c8634f9bfcef42c8a167d219ff764e", id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: "c98d81e6a16ff3304c1c2c489a71cc892fc6e287" }))
     ];
-    return h(Host, Object.assign({ key: "1877e4728bfea90d5084715ce7d30d59c027cb60", class: {
+    return h(Host, Object.assign({ key: "2bed98070395e9df578f968f317a16f214bf5627", class: {
       disabled: this.disabled,
       "home-tab": this.home,
       "bottom-tab": this.bottom,
@@ -95,7 +95,7 @@ const MenuItem = class {
         e.preventDefault();
         e.stopPropagation();
       }
-    } }), menuContent) : h("button", Object.assign({}, commonAttributes, { ref: this.buttonRef }), menuContent), h("ix-tooltip", { key: "c19646a81a5a2fed7b89eb95caf661125da9f7be", for: this.buttonRef.waitForCurrent(), placement: "right", showDelay: 1e3, interactive: false, "aria-hidden": a11yBoolean(this.ariaHiddenTooltip), "aria-labelledby": this.internalItemId }, this.tooltip));
+    } }), menuContent) : h("button", Object.assign({}, commonAttributes, { ref: this.buttonRef }), menuContent), h("ix-tooltip", { key: "691d40c1d8df8ab9111165be8320190a5c893de0", for: this.buttonRef.waitForCurrent(), placement: "right", showDelay: 1e3, interactive: false, "aria-hidden": a11yBoolean(this.ariaHiddenTooltip), "aria-labelledby": this.internalItemId }, this.tooltip));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-menu-settings-item.entry-Bti7PD7a.js → ix-menu-settings-item.entry-B9Gkv41V.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from "./global-C8r7td8X.js";
+import { r as registerInstance, c as createEvent, h, H as Host } from "./global-jo2I2sSs.js";
 const menuSettingsItemCss = ":host{display:block}";
 const MenuSettingsItem = class {
   constructor(hostRef) {
@@ -13,7 +13,7 @@ const MenuSettingsItem = class {
     });
   }
   render() {
-    return h(Host, { key: "d71ea99d2f7194c876c18e702b0a1d20d84f7a35" }, h("slot", { key: "4906a29d17beb90749df4981daca1ae37c8b8c9b" }));
+    return h(Host, { key: "69dac244a2c3b427237e8dceec64fad9c16600e9" }, h("slot", { key: "ccfc87d1f061f0d4195f943dec3782b655626aae" }));
   }
   static get watchers() {
     return {

package/build/static/demo/v2/preview/html/assets/{ix-menu-settings.entry-DOQ9IwkJ.js → ix-menu-settings.entry-DoMrnHPY.js}

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement, H as Host } from "./global-C8r7td8X.js";
-import { q as iconClose } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement, H as Host } from "./global-jo2I2sSs.js";
+import { q as iconClose } from "./index-8HpPmDK_-DinFJk0z.js";
 const menuSettingsCss = ".text-xs{font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-s{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption-single{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-h2{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-xl{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}a{color:var(--theme-color-primary)}:host{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .settings-header{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}:host .settings-header h2{color:var(--theme-nav-overlay-header--color);margin-bottom:1rem}:host ix-tabs{margin-bottom:1.5rem}:host .settings-tabs{margin-bottom:1.5rem}";
 const MenuSettings = class {
   constructor(hostRef) {
@@ -9,8 +9,10 @@ const MenuSettings = class {
     this.label = "Settings";
     this.show = false;
   }
-  updateTab(label) {
-    setTab(this, label);
+  updateTab(newLabel, oldLabel) {
+    if (newLabel !== oldLabel) {
+      syncTabDisplay(this, newLabel);
+    }
   }
   componentWillLoad() {
     initialize(this);
@@ -19,7 +21,7 @@ const MenuSettings = class {
     forceUpdate(this.el);
   }
   render() {
-    return h(MenuTabs, { key: "a59dd5a81b91ff4ae7f516cb192700bffaee3f84", context: this });
+    return h(MenuTabs, { key: "bff35655d1e57ea807a1d8a6bd0879f8804e3ef4", context: this });
   }
   get el() {
     return getElement(this);
@@ -35,14 +37,19 @@ function getItems(context) {
   return Array.from(context.el.querySelectorAll(context instanceof MenuSettings ? "ix-menu-settings-item" : "ix-menu-about-item"));
 }
 function setTab(context, label) {
+  if (context.activeTabLabel === label) {
+    return;
+  }
   const { defaultPrevented } = context.tabChange.emit(label);
   if (defaultPrevented) {
     return;
   }
   context.activeTabLabel = label;
+}
+function syncTabDisplay(context, label) {
   context.items.forEach((i) => {
     i.style.display = "none";
-    if (i.label === context.activeTabLabel) {
+    if (i.label === label) {
       i.style.display = "block";
     }
   });
@@ -90,5 +97,5 @@ export {
   MenuTabs as M,
   ixMenuSettings_entry as a,
   initialize as i,
-  setTab as s
+  syncTabDisplay as s
 };