@siemens/ix-docs 4.0.0 → 4.1.0

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-CTsFSACc.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-BniHpAE1-BXrc-Gwu.js";
 import { c as createMutationObserver } from "./mutation-observer-CX81WQtk-DFcmhOTk.js";
@@ -164,7 +164,7 @@ const MenuCategory = class {
     }
   }
   render() {
-    return h(Host, { key: "40ae8539715815c94e99313fad8694e4115e5482", 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: "60b77e0aae87b55e7934cbd0fccb18cab83772bb", 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: "f87df62dd73af5968c4d62b657d0a0538e10ade3", class: "category" }, h("div", { key: "855411c78407fa712fddb8c177801db4c3c9780a", class: "category-text" }, this.label), h("ix-icon", { key: "e94bbb4ad9f4fc5612daa12e8812d26ff6ecea70", 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: "9725f1a5f5f7aa7e1835d054ec8155644c5516e8", 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: "69fd00ce9dd45b99069a891318008e25b214a218", 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: "101355b915d54d5e7a309c26aa9480191db1fb3e", class: "category-dropdown-header" }, h("ix-typography", { key: "301de701167a6e09a741d2cdc7ed9c8555242a59", format: "label", bold: true, textColor: "std" }, this.label)), h("ix-divider", { key: "5cdcca1d2025554f5d11ea8f6d819b4c7a2d7ff2" }), h("slot", { key: "a69dc8bdb237da234ab39cb251fda9cbd33da35d" })));
+    } }, 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-DRodMmUx.js → ix-menu-expand-icon.entry-WB7FenrS.js}

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host } from "./global-CTsFSACc.js";
-import { g as getButtonClasses } from "./base-button-TVpiK7pg-CrZ9rI2r.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 { 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}";
@@ -29,7 +29,7 @@ const MenuExpandIcon = class {
     return this.getSmallScreenIcon();
   }
   render() {
-    return h(Host, { key: "c39c90a459dee53b29d4ccd8de683d35dc4abd22", 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-UKvAOzvC.js → ix-menu-item.entry-D4WYRGSS.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from "./global-CTsFSACc.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";
@@ -80,11 +80,11 @@ const MenuItem = class {
       tabIndex: this.disabled ? -1 : 0
     };
     const menuContent = [
-      this.icon && h("ix-icon", { key: "2c1c698aadcb3dd8090c067c3dd746e8a9baaf93", 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: "c02f479113a2c1914df317d21561b657acf6af92", id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: "33f38c81be26d10edc993efd1a7434e04678e2c1" }))
+      h("span", { key: "93ac9e24f2c8634f9bfcef42c8a167d219ff764e", id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: "c98d81e6a16ff3304c1c2c489a71cc892fc6e287" }))
     ];
-    return h(Host, Object.assign({ key: "58699b09d27cd2caa4d688378e1bd274b9467ee7", 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: "f7d1c226c4cde303427a1b38c85bdf93693807b4", 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-DJBL-rpR.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-CTsFSACc.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: "82d134ab9cdb58a29c6fd02a165a9925a9a55912" }, h("slot", { key: "dfb95edb5325b70072cc422a48c78f8a50a9b589" }));
+    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-BHIv-wmV.js → ix-menu-settings.entry-DoMrnHPY.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement, H as Host } from "./global-CTsFSACc.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 {
@@ -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
 };

package/build/static/demo/v2/preview/html/assets/{ix-menu.entry-dLFLt_kI.js → ix-menu.entry-N-Mh6jug.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-CTsFSACc.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 { s as showAppSwitch } from "./index-Kp5Wf9wr-CEFkQm40.js";
 import { a as useContextConsumer, A as ApplicationLayoutContext } from "./context-BniHpAE1-BXrc-Gwu.js";
@@ -388,43 +388,43 @@ const Menu = class {
   }
   render() {
     var _a, _b;
-    return h(Host, { key: "7c30f31880d51956013f87fe21ea0abf4129f67b", class: {
+    return h(Host, { key: "b36f27c9c7b9342fd8f984dd5d00ad73d735b2ff", class: {
       expanded: this.expand,
       [`breakpoint-${this.breakpoint}`]: true
-    }, slot: "menu" }, h("nav", { key: "ff157fa24a58cd522b33ac035d99086a8dfec7bc", class: {
+    }, slot: "menu" }, h("nav", { key: "4f4b1378ddfe2cb243d0a5305679c98084490e8b", class: {
       menu: true,
       expanded: this.expand
-    } }, h("div", { key: "a3935afe8ee867e934f1c778583d22d11f5cf957", class: "menu-buttons" }, this.breakpoint !== "sm" && h("ix-menu-expand-icon", { key: "067059b37dc7e99ac05bdf3f96f4f417403e1915", breakpoint: this.breakpoint, expanded: this.expand, pinned: this.pinned, class: "menu-expand-icon", ixAriaLabel: this.i18nExpandSidebar, onClick: async () => this.toggleMenu(), "data-testid": "expand-collapse-menu" }), this.breakpoint === "sm" && ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.appSwitchConfig) && h("ix-icon-button", { key: "d9c3d29552e6e8adeba3c44c04a563da430ea9b8", onClick: () => {
+    } }, h("div", { key: "70d117cfe299bdb3f3b0ed9639d5ee83bfc33cf1", class: "menu-buttons" }, this.breakpoint !== "sm" && h("ix-menu-expand-icon", { key: "fa76b253e6cf1ae30e3257cc3c186dc23215b516", breakpoint: this.breakpoint, expanded: this.expand, pinned: this.pinned, class: "menu-expand-icon", ixAriaLabel: this.i18nExpandSidebar, onClick: async () => this.toggleMenu(), "data-testid": "expand-collapse-menu" }), this.breakpoint === "sm" && ((_a = this.applicationLayoutContext) === null || _a === void 0 ? void 0 : _a.appSwitchConfig) && h("ix-icon-button", { key: "927aede1c7824c6c21eed072e7dba6db8d5f8df5", onClick: () => {
       this.showAppSwitch();
-    }, icon: iconApps, variant: "subtle-tertiary" })), h("div", { key: "bf2a827004f7e2d337ba55fc288e7abe418ec6dd", id: "menu-tabs", style: {
+    }, icon: iconApps, variant: "subtle-tertiary" })), h("div", { key: "795f32dc8f94404a75c9a0d0cfb7c8e8d429d8d2", id: "menu-tabs", style: {
       display: "contents"
-    }, onClick: (e) => this.onMenuItemsClick(e) }, h("div", { key: "ee11e15bb3d0e4b6cd3263788aac1eba043dae99", class: "tabs-shadow-container" }, h("div", { key: "0803887ba70d6558cf5e4a890e0eca39b49ff518", class: {
+    }, onClick: (e) => this.onMenuItemsClick(e) }, h("div", { key: "4d609cfd70659c0adfcb1cfca0485edff3b05d08", class: "tabs-shadow-container" }, h("div", { key: "b8b81a13d75c56f9a460f0db382acef185b1c11c", class: {
       "tabs--shadow": true,
       "tabs--shadow-top": true,
       "tabs--shadow--show": this.itemsScrollShadowTop
-    } }), h("div", { key: "7e43e530408b8a5408e2a0c00d4e89b695d0d871", class: {
+    } }), h("div", { key: "1095f30e782665f9d66d7f2619eb3a68806ccf54", class: {
       tabs: true,
       "show-scrollbar": this.expand
-    }, onScroll: () => this.handleOverflowIndicator() }, h("div", { key: "e9f5421b30d3505a1a80ecdea28d78770a2f25fd", class: "menu-avatar" }, h("slot", { key: "c0d0ab2965a271540b41165eaf95fcd13072ae07", name: "ix-menu-avatar" })), h("slot", { key: "3b427bbba570fc61bbe44f6138f338025b144725", name: "home" }), this.breakpoint !== "sm" || !this.isHiddenFromViewport() ? h("slot", null) : null), h("div", { key: "c7bb85da2610aef008b75fe560af46aac221ffc5", class: {
+    }, onScroll: () => this.handleOverflowIndicator() }, h("div", { key: "55ec2b8a3b535c8ed7dfc4c80ecdeedf9add4d34", class: "menu-avatar" }, h("slot", { key: "a893aea63d56c2b4e7fd5997904704639257f65b", name: "ix-menu-avatar" })), h("slot", { key: "85505735fc0f7c9075340389597565bd99e64801", name: "home" }), this.breakpoint !== "sm" || !this.isHiddenFromViewport() ? h("slot", null) : null), h("div", { key: "7a0013bb20500931471b1ee1273615d0ae740d11", class: {
       "tabs--shadow": true,
       "tabs--shadow-bottom": true,
       "tabs--shadow--show": this.itemsScrollShadowBottom
-    } }))), h("div", { key: "80b67bd3408917c424661ff603b6b12a08b5c256", class: "bottom-tab-divider" }), this.settings ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "settings", class: {
+    } }))), h("div", { key: "92a48e39684e2bbbb6078dcafc5c8b7103a693de", 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: iconCogwheel, onClick: async () => this.toggleSettings(!this.showSettings), label: this.i18nSettings }) : null, this.enableToggleTheme ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "toggleTheme", onClick: () => themeSwitcher.toggleMode(), class: "internal-tab bottom-tab", icon: iconLightDark, label: this.i18nToggleTheme }) : null, h("div", { key: "93bc9bfe4c557cbfcc66eaac5cc21118578b050a", onClick: (e) => this.onMenuItemsClick(e) }, h("slot", { key: "9910c841207e3a62b3699cc5e54843155557bb65", name: "bottom" })), h("div", { key: "f3bd210849640e293625b418f928eb12eb6bb8a5", id: "popover-area" }), this.enableMapExpand || ((_b = this.applicationLayoutContext) === null || _b === void 0 ? void 0 : _b.sidebar) ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "menu-collapse", onClick: () => this.sidebarToggle(), class: "internal-tab bottom-tab", icon: `${this.getCollapseIcon()}`, label: this.getCollapseText() }) : null, this.about ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "aboutAndLegal", class: {
+    }, icon: iconCogwheel, onClick: async () => this.toggleSettings(!this.showSettings), label: this.i18nSettings }) : null, this.enableToggleTheme ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "toggleTheme", onClick: () => themeSwitcher.toggleMode(), class: "internal-tab bottom-tab", icon: iconLightDark, label: this.i18nToggleTheme }) : null, h("div", { key: "2a5bad2eb493be6ee59fc101fab300bdb154feb0", onClick: (e) => this.onMenuItemsClick(e) }, h("slot", { key: "5a1e19962a88ceeb1f82ac385dba49d0c311e3d7", name: "bottom" })), h("div", { key: "65802881403efad9dbae84ef9bf5d441e3915150", id: "popover-area" }), this.enableMapExpand || ((_b = this.applicationLayoutContext) === null || _b === void 0 ? void 0 : _b.sidebar) ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "menu-collapse", onClick: () => this.sidebarToggle(), class: "internal-tab bottom-tab", icon: `${this.getCollapseIcon()}`, label: this.getCollapseText() }) : null, this.about ? h("ix-menu-item", { disabled: this.isHiddenFromViewport(), id: "aboutAndLegal", class: {
       "internal-tab": true,
       "bottom-tab": true,
       active: this.showAbout
-    }, icon: iconInfo, onClick: async () => this.toggleAbout(!this.showAbout), label: this.i18nLegal }) : null), h("div", { key: "54785101f98f046af558820493555a3d4739ace3", class: {
+    }, icon: iconInfo, onClick: async () => this.toggleAbout(!this.showAbout), label: this.i18nLegal }) : null), h("div", { key: "e6dd7e53abbd5e4ce11cc5d2be882dd52e335275", class: {
       "menu-overlay": true,
       visible: this.isOverlayVisible(),
       expanded: this.expand
     }, onTransitionEnd: () => {
       this.isTransitionDisabled = true;
       this.checkTransition();
-    } }, h("div", { key: "740f1a98fe2bafb8da7d5457395dee136a5ce9ec", class: "menu-overlay-container" }, this.showSettings ? h("slot", { name: "ix-menu-settings" }) : null), h("div", { key: "3e2f774925487e9da132a3d7b3633486bece3976", class: "menu-overlay-container" }, this.showAbout ? h("slot", { name: "ix-menu-about" }) : null)));
+    } }, h("div", { key: "d8a49e3983b5d060190f1440b4aacd44243894a8", class: "menu-overlay-container" }, this.showSettings ? h("slot", { name: "ix-menu-settings" }) : null), h("div", { key: "92ddf6c21d3d08c5d1961200ac598a6135c9ef89", class: "menu-overlay-container" }, this.showAbout ? h("slot", { name: "ix-menu-about" }) : null)));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-message-bar.entry-AtLC3kdn.js → ix-message-bar.entry-Dex1BE7Q.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from "./global-CTsFSACc.js";
+import { r as registerInstance, c as createEvent, h, H as Host } from "./global-jo2I2sSs.js";
 import { a as animate } from "./anime.esm-DhE1t8Qh-B6Ygv72Z.js";
 import { q as iconClose, z as iconNotification, i as iconInfo, c as iconSuccess, a as iconWarning, A as iconWarningRhomb, b as iconError } from "./index-8HpPmDK_-DinFJk0z.js";
 const messageBarCss = ":host{margin:0.5rem 0.5rem 0rem 0.5rem}: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 .message-container{display:flex;flex-direction:row;align-items:flex-start;flex-wrap:nowrap;justify-content:space-between;min-height:3.375rem;padding:calc(0.75rem - var(--theme-message-bar--border-thickness)) 0.75rem calc(0.75rem - var(--theme-message-bar--border-thickness)) 1rem;border-radius:var(--theme-message-bar--border-radius);background-color:var(--theme-messagebar--background)}:host .alarm{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-alarm)}:host .danger{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-alarm)}:host .critical{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-critical)}:host .warning{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-warning)}:host .success{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-success)}:host .info{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-info)}:host .neutral{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-neutral)}:host .primary{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-primary)}:host .message-content{flex-grow:1;align-self:center;min-height:1.25rem;padding:0 1rem;font-weight:normal;white-space:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ix-icon{margin-top:0.25rem}:host .message-bar-hidden{display:none}";
@@ -32,7 +32,7 @@ const MessageBar = class {
     }
   }
   render() {
-    return h(Host, { key: "22bbc355ba3fca3209fab0491ae186f59bb64b02" }, h("div", { key: "a84b47392ddfd8a8b0863ce99aa17985fbf39b4d", class: { "message-container": true, [this.type]: true }, role: "alert", ref: (el) => this.divElement = el }, h("ix-icon", { key: "6528c7bd5a8b484858c97ca0e072704dcf37ad1c", color: this.color, name: this.icon }), h("div", { key: "07eed52e33baa107ebdebb10ef478d775901faf3", class: "message-content" }, h("slot", { key: "cd5981304f6998d55edc38fa3fb0c67e139b8278" })), !this.persistent && h("ix-icon-button", { key: "ac6a235e1080bbb942c102f7c0e5c04672176557", icon: iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => {
+    return h(Host, { key: "538fcc08ad07fe808f424e067a361f4a56f4c0ec" }, h("div", { key: "4a75052efe1b22c247dcfcd298aabbd1098ff7b6", class: { "message-container": true, [this.type]: true }, role: "alert", ref: (el) => this.divElement = el }, h("ix-icon", { key: "d348829692e38a1023e044834aefa45516b4d916", color: this.color, name: this.icon }), h("div", { key: "0ac0a509efe1dd246f7732660e4cf16416c8655d", class: "message-content" }, h("slot", { key: "6143bfa9cf39d32d149c2893b7712358337833c9" })), !this.persistent && h("ix-icon-button", { key: "b118c91956af0fd00d02cfefdb7da36d46f2d360", icon: iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => {
       if (this.divElement) {
         this.closeAlert(this.divElement);
       }

package/build/static/demo/v2/preview/html/assets/{ix-modal-content_2.entry-BEDC9WCr.js → ix-modal-content_2.entry-DC9V2BtK.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from "./global-CTsFSACc.js";
+import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from "./global-jo2I2sSs.js";
 import { a as closestPassShadow } from "./shadow-dom-i60z1FJC-Cx4XiL3F.js";
 import { q as iconClose } from "./index-8HpPmDK_-DinFJk0z.js";
 const modalContentCss = ":host{display:block;position:relative;overflow:auto;padding:0 0.5rem 0.5rem}: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}";
@@ -7,7 +7,7 @@ const ModalContent = class {
     registerInstance(this, hostRef);
   }
   render() {
-    return h(Host, { key: "91592e2a2681326a99cafd1709581a29ecf48d61" }, h("slot", { key: "259ab95ce19cafdc7dbbe67c362e424590fe02c8" }));
+    return h(Host, { key: "b45bdd4b47ca580de9e3419c9c081f8e30b1da09" }, h("slot", { key: "ad2d19f3f3053ea927d6d45ff54bcfff1e74345d" }));
   }
 };
 ModalContent.style = modalContentCss;
@@ -39,7 +39,7 @@ const ModalHeader = class {
     this.parentDialog.dismissModal();
   }
   render() {
-    return h(Host, { key: "b41da77283ecc896aa62fced50290fe487526fbd" }, this.icon ? h("ix-icon", { name: this.icon, color: this.iconColor, size: "32", "aria-label": this.ariaLabelIcon }) : null, h("div", { key: "c084a12acb4d137a55e45b0f98e662d181b1901e", class: "modal-title" }, h("ix-typography", { key: "9e82bdb91af4273454254d3c2fc03803d787dde1", format: "h5" }, h("slot", { key: "209d60c82e6b12c28d95eb538e8f4499becfeb8e" }))), !this.hideClose ? h("ix-icon-button", { class: "modal-close", onClick: (event) => this.onCloseClick(event), variant: "tertiary", icon: iconClose, iconColor: "color-soft-text", "aria-label": this.ariaLabelCloseIconButton }) : null);
+    return h(Host, { key: "7dd6b1964ed537b20a90f9007afb767414fad240" }, this.icon ? h("ix-icon", { name: this.icon, color: this.iconColor, size: "32", "aria-label": this.ariaLabelIcon }) : null, h("div", { key: "4c6d8c7716ba99eed36e7b9c741dce4ebb0bb092", class: "modal-title" }, h("ix-typography", { key: "1db5a1e1cd434c67578a8c276b497284e5447f8d", format: "h5" }, h("slot", { key: "920833a9e7d2c8e15dc4bff1b18c6daa8a9ee4b5" }))), !this.hideClose ? h("ix-icon-button", { class: "modal-close", onClick: (event) => this.onCloseClick(event), variant: "tertiary", icon: iconClose, iconColor: "color-soft-text", "aria-label": this.ariaLabelCloseIconButton }) : null);
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-modal-footer.entry-Zgc4lUTU.js → ix-modal-footer.entry-zIFmUIrW.js}

@@ -1,11 +1,11 @@
-import { r as registerInstance, h, H as Host } from "./global-CTsFSACc.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
 const modalFooterCss = ":host{display:flex;padding:0.5rem;justify-content:flex-end;align-items:center;gap:0.5rem;align-self:stretch}: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}";
 const ModalFooter = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
   }
   render() {
-    return h(Host, { key: "bab5a43ac92a13caca46d241091c27c773990aba" }, h("slot", { key: "fefe386636d486a7e1d4b35a23eafe0d04b7270c" }));
+    return h(Host, { key: "11eb649edd163b25fdeb4b533bf513a861c1d7ec" }, h("slot", { key: "9a2cb92b8df8220ed2307d98ec7a1ce6a6d9196b" }));
   }
 };
 ModalFooter.style = modalFooterCss;

package/build/static/demo/v2/preview/html/assets/{ix-modal-loading.entry-BWnnpnm7.js → ix-modal-loading.entry-CeakpQDq.js}

@@ -1,11 +1,11 @@
-import { r as registerInstance, h, H as Host } from "./global-CTsFSACc.js";
+import { r as registerInstance, h, H as Host } from "./global-jo2I2sSs.js";
 const modalLoadingCss = ":host{display:flex;justify-content:flex-start;align-items:center;gap:0.5rem;overflow:hidden}:host .loading-text{display:block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";
 const ModalLoading = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
   }
   render() {
-    return h(Host, { key: "dac65dc36124b038728e843240d126432d85e987" }, h("ix-spinner", { key: "639371732304b733f79cf8498e46442ff6a442df", variant: "primary" }), h("span", { key: "a9bf046b8c00552a4135cc5046789027abd1803e", class: "loading-text" }, h("slot", { key: "362185ef3806ddb57c90f6fdf776cb3563baf903" })));
+    return h(Host, { key: "404214a461e55c9ee78aad8dc277dab5be8a9b42" }, h("ix-spinner", { key: "96278c04d8c7798b411f6807e5c7a1ea26b03d45", variant: "primary" }), h("span", { key: "cad3eec78defa832ffc679f86941ffc301bc5b5c", class: "loading-text" }, h("slot", { key: "96cf92b74f62260ee97b7bdae73557a2ee5517ec" })));
   }
 };
 ModalLoading.style = modalLoadingCss;

package/build/static/demo/v2/preview/html/assets/{ix-modal.entry-JKMVQ4yW.js → ix-modal.entry-BQGtgMcb.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-CTsFSACc.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 { b as a11yHostAttributes, a as a11yBoolean } from "./a11y-Bb7pDeaQ-DNI84lDX.js";
 import { A as Animation } from "./animation-C5MWUgDN-BXCJNYHu.js";
-import { O as OnListener } from "./listener-DAJkOQte-CGqfZKRD.js";
+import { O as OnListener } from "./listener-DAJkOQte-BvPtyHWY.js";
 function waitForElement(selector, doc, timeout = 3e3) {
   return new Promise((resolve, reject) => {
     const startTime = Date.now();
@@ -153,17 +153,17 @@ const Modal = class {
     this.ariaAttributes = a11yHostAttributes(this.hostElement);
   }
   render() {
-    return h(Host, { key: "192ded80682348ff755d91a613faaca1a8b0753f", class: {
+    return h(Host, { key: "0170729f63356223c39bcd6b0bb7124b2036f2c4", class: {
       visible: this.modalVisible,
       "no-backdrop": this.hideBackdrop,
       "align-center": this.centered
-    } }, h("div", { key: "709679987ecf4e1b1e03374c7c9373332fe01a74", class: "dialog-backdrop" }, h("dialog", { key: "10222a2e51235c3be195eb6b2e7d2ad2e1d887f9", "aria-modal": a11yBoolean(true), "aria-describedby": this.ariaAttributes["aria-describedby"], "aria-labelledby": this.ariaAttributes["aria-labelledby"], class: {
+    } }, h("div", { key: "436b9f2efce7279defa936c9ee79fa44d090e388", class: "dialog-backdrop" }, h("dialog", { key: "e3bc4891433993a5dcbe186011fd91d70277ca3d", "aria-modal": a11yBoolean(true), "aria-describedby": this.ariaAttributes["aria-describedby"], "aria-labelledby": this.ariaAttributes["aria-labelledby"], class: {
       modal: true,
       [`modal-size-${this.size}`]: true
     }, onClose: () => this.dismissModal(), onMouseDown: (event) => this.onMouseDown(event), onMouseUp: (event) => this.onMouseUp(event), onCancel: (e) => {
       e.preventDefault();
       this.dismissModal();
-    } }, h("slot", { key: "a9c321d71d3e08d581bb2e6ad9e3d377663a2c52" }))));
+    } }, h("slot", { key: "5a3e86b9c04f8e1564be6026b0352940978f0666" }))));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-number-input.entry-CcU_NTjj.js → ix-number-input.entry-C2l3Wo1Y.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-CTsFSACc.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-jo2I2sSs.js";
 import { B as iconMinus, C as iconPlus } from "./index-8HpPmDK_-DinFJk0z.js";
-import { H as HookValidationLifecycle } from "./validation-D_dk-JqT-CRNNydA9.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, c as SlotStart, I as InputElement, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd, e as checkInternalValidity } from "./input.util-VHrSuCP7-Be3hd2n8.js";
+import { o as onInputBlur, m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, e as checkInternalValidity, c as SlotStart, I as InputElement, d as checkAllowedKeys, 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";
@@ -20,6 +20,7 @@ var __decorate = function(decorators, target, key, desc) {
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 let numberInputIds = 0;
+const INVALID_NUMBER_INPUT_REGEX = /[^\dEe+\-.,]/;
 const NumberInput = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -36,6 +37,10 @@ const NumberInput = class {
     this.required = false;
     this.disabled = false;
     this.readonly = false;
+    this.step = 1;
+    this.suppressSubmitOnEnter = false;
+    this.textAlignment = "end";
+    this.allowEmptyValueChange = false;
     this.isInvalid = false;
     this.isValid = false;
     this.isInfo = false;
@@ -46,6 +51,69 @@ const NumberInput = class {
     this.slotStartRef = makeRef();
     this.numberInputId = `number-input-${numberInputIds++}`;
     this.touched = false;
+    this.handleInputChange = (inputValue) => {
+      const parsedValue = this.convertNumberStringToFloat(inputValue);
+      const isScientificNotation = this.isScientificNotation(inputValue.trim());
+      if (isScientificNotation) {
+        this.formInternals.setFormValue(inputValue);
+      }
+      this.handleValueChangeEvent(parsedValue);
+    };
+    this.handleBlur = () => {
+      if (!this.inputRef.current)
+        return;
+      const inputValue = this.inputRef.current.value;
+      const parsedValue = this.convertNumberStringToFloat(inputValue);
+      if (parsedValue !== void 0) {
+        this.inputRef.current.value = this.formatValue(parsedValue);
+      }
+      this.updateFormInternalValue(parsedValue);
+      onInputBlur(this, this.inputRef.current);
+      this.touched = true;
+    };
+    this.handleKeyDown = (event) => {
+      if (this.disabled || this.readonly) {
+        return;
+      }
+      switch (event.key) {
+        case "ArrowUp":
+          event.preventDefault();
+          this.handleStepOperation("up");
+          break;
+        case "ArrowDown":
+          event.preventDefault();
+          this.handleStepOperation("down");
+          break;
+      }
+    };
+    this.handleBeforeInput = (e) => {
+      var _a, _b;
+      if (this.disabled || this.readonly)
+        return;
+      if (e.inputType === "insertText") {
+        const character = e.data;
+        if (character && INVALID_NUMBER_INPUT_REGEX.test(character)) {
+          e.preventDefault();
+        }
+      }
+      if (e.inputType === "insertFromPaste") {
+        const dt = e.dataTransfer || e.clipboardData;
+        const text = (_b = (_a = dt === null || dt === void 0 ? void 0 : dt.getData) === null || _a === void 0 ? void 0 : _a.call(dt, "text")) !== null && _b !== void 0 ? _b : "";
+        if (INVALID_NUMBER_INPUT_REGEX.test(text)) {
+          e.preventDefault();
+        }
+      }
+    };
+    this.handlePaste = (e) => {
+      var _a, _b;
+      const text = (_b = (_a = e.clipboardData) === null || _a === void 0 ? void 0 : _a.getData("text")) !== null && _b !== void 0 ? _b : "";
+      if (INVALID_NUMBER_INPUT_REGEX.test(text)) {
+        e.preventDefault();
+      }
+    };
+  }
+  onValueChange(newValue) {
+    this.updateFormInternalValue(newValue);
   }
   updateClassMappings(result) {
     mapValidationResult(this, result);
@@ -63,10 +131,57 @@ const NumberInput = class {
   updatePaddings() {
     adjustPaddingForStartAndEnd(this.slotStartRef.current, this.slotEndRef.current, this.inputRef.current);
   }
+  convertNumberStringToFloat(input) {
+    if (!input || input.trim() === "") {
+      return void 0;
+    }
+    const parsed = Number.parseFloat(input);
+    return Number.isNaN(parsed) ? void 0 : parsed;
+  }
+  isScientificNotation(input) {
+    const parsed = Number.parseFloat(input);
+    return !Number.isNaN(parsed) && Number.isFinite(parsed) && /[eE]/.test(input);
+  }
+  formatValue(value) {
+    if (value === void 0 || value === null) {
+      return "";
+    }
+    return value.toString();
+  }
+  handleValueChangeEvent(value) {
+    this.valueChange.emit(this.allowEmptyValueChange ? value : value !== null && value !== void 0 ? value : 0);
+  }
   updateFormInternalValue(value) {
-    this.formInternals.setFormValue(value.toString());
+    const formValue = value !== void 0 && value !== null ? value.toString() : "";
+    this.formInternals.setFormValue(formValue);
     this.value = value;
   }
+  handleStepOperation(operation) {
+    var _a, _b;
+    if (!this.inputRef.current) {
+      return;
+    }
+    const currentValue = (_a = this.value) !== null && _a !== void 0 ? _a : 0;
+    const stepValue = typeof this.step === "string" ? Number.parseFloat(this.step) : (_b = this.step) !== null && _b !== void 0 ? _b : 1;
+    let newValue;
+    if (operation === "up") {
+      newValue = currentValue + stepValue;
+    } else {
+      newValue = currentValue - stepValue;
+    }
+    if (this.min !== void 0) {
+      const minValue = typeof this.min === "string" ? Number.parseFloat(this.min) : this.min;
+      newValue = Math.max(newValue, minValue);
+    }
+    if (this.max !== void 0) {
+      const maxValue = typeof this.max === "string" ? Number.parseFloat(this.max) : this.max;
+      newValue = Math.min(newValue, maxValue);
+    }
+    this.inputRef.current.value = newValue.toString();
+    this.updateFormInternalValue(newValue);
+    checkInternalValidity(this, this.inputRef.current);
+    this.handleValueChangeEvent(newValue);
+  }
   /** @internal */
   async getAssociatedFormElement() {
     return this.formInternals.form;
@@ -75,9 +190,10 @@ const NumberInput = class {
   async hasValidValue() {
     const nativeInput = await this.getNativeInputElement();
     if (nativeInput.value === "") {
-      return Promise.resolve(false);
+      return !this.required;
     }
-    return Promise.resolve(this.value !== null && this.value !== void 0 && !isNaN(this.value));
+    const parsedValue = this.convertNumberStringToFloat(nativeInput.value);
+    return parsedValue !== void 0;
   }
   /**
    * Returns the native input element used under the hood
@@ -99,36 +215,24 @@ const NumberInput = class {
     return Promise.resolve(this.touched);
   }
   render() {
+    var _a;
     const showStepperButtons = this.showStepperButtons && (this.disabled || this.readonly) === false;
-    return h(Host, { key: "c42e57d87186db97d228a3c80fa487c3e2bbe5d0", class: {
+    return h(Host, { key: "4b541dbe6fe2b32b5158eed8f398de300ea71bb4", class: {
       disabled: this.disabled,
       readonly: this.readonly
-    } }, h("ix-field-wrapper", { key: "2180bbdb30f50945159b742399297ce011729cf7", id: this.numberInputId, 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: "905329aff61d43248e3ee53cb900e5d611b74999", class: {
+    } }, h("ix-field-wrapper", { key: "7ef2bb50ba7c9b3b24612752155a2072329e4b61", id: this.numberInputId, 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: "7e71d63d2a9ecbb16550925e68f3dc8dd76c3968", class: {
       "input-wrapper": true,
       "show-stepper-buttons": !!this.showStepperButtons
-    } }, h(SlotStart, { key: "9acae4279a3d0b81e1e863e25875176e5e73cabf", slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: "e9e3bdebcd1165efdcb0359a6cd9fd90ecb5d4ef", id: this.numberInputId, readonly: this.readonly, disabled: this.disabled, step: this.step, min: this.min, max: this.max, pattern: this.pattern, type: "number", 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(Number(value)), updateFormInternalValue: (value) => this.updateFormInternalValue(Number(value)), onBlur: () => {
-      onInputBlur(this, this.inputRef.current);
-      this.touched = true;
-    } }), h(SlotEnd, { key: "f9e41241aaff4d70ea46315fd39a908cdfe14e11", slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("div", { key: "36507af1b806bd2fc6e4cc1d4d34de9fe8dd8ba0", class: {
+    } }, h(SlotStart, { key: "8d936c9126f94c42db87b2d95d34ab178eadd31d", slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: "c56f510ea8a519204d3d36136d4b0a5a17246370", id: this.numberInputId, readonly: this.readonly, disabled: this.disabled, step: this.step, min: this.min, max: this.max, pattern: this.pattern, type: "number", isInvalid: this.isInvalid, required: this.required, value: this.formatValue(this.value), placeholder: this.placeholder, inputRef: this.inputRef, onKeyPress: (event) => checkAllowedKeys(this, event), onKeyDown: (event) => this.handleKeyDown(event), onBeforeInput: (event) => this.handleBeforeInput(event), onPaste: (event) => this.handlePaste(event), valueChange: this.handleInputChange, updateFormInternalValue: (value) => {
+      const isScientificNotation = this.isScientificNotation(value.trim());
+      if (!isScientificNotation) {
+        const parsedValue = this.convertNumberStringToFloat(value);
+        this.updateFormInternalValue(parsedValue);
+      }
+    }, onBlur: this.handleBlur, form: (_a = this.formInternals.form) !== null && _a !== void 0 ? _a : void 0, suppressSubmitOnEnter: this.suppressSubmitOnEnter, textAlignment: this.textAlignment }), h(SlotEnd, { key: "2d7e82c421d51985c9d24c69b6f641279e3e84aa", slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("div", { key: "5b1e6f03bf456305386537428b23b3fc2706e411", class: {
       "number-stepper-container": true,
       "container-hidden": !showStepperButtons
-    } }, h("ix-icon-button", { key: "0bef82df236486f49f71da016edb67e7edbd4775", variant: "subtle-tertiary", icon: iconMinus, size: "16", class: "number-stepper-button step-minus", "aria-label": "decrement number", onClick: () => {
-      if (!this.inputRef.current) {
-        return;
-      }
-      this.inputRef.current.stepDown();
-      checkInternalValidity(this, this.inputRef.current);
-      this.updateFormInternalValue(Number(this.inputRef.current.value));
-      this.valueChange.emit(this.value);
-    } }), h("ix-icon-button", { key: "34f4f8b3dc4e90ec9ada96f15280b39320ed5fb9", variant: "subtle-tertiary", icon: iconPlus, size: "16", class: "number-stepper-button step-plus", "aria-label": "increment number", onClick: () => {
-      if (!this.inputRef.current) {
-        return;
-      }
-      this.inputRef.current.stepUp();
-      checkInternalValidity(this, this.inputRef.current);
-      this.updateFormInternalValue(Number(this.inputRef.current.value));
-      this.valueChange.emit(this.value);
-    } }))))));
+    } }, h("ix-icon-button", { key: "44a5f583fb174c556a063f384174883ec307f9f4", variant: "subtle-tertiary", icon: iconMinus, size: "16", class: "number-stepper-button step-minus", "aria-label": "decrement number", onClick: () => this.handleStepOperation("down") }), h("ix-icon-button", { key: "c007fe5451c3f124e61214160c7ebc8cc1150b25", variant: "subtle-tertiary", icon: iconPlus, size: "16", class: "number-stepper-button step-plus", "aria-label": "increment number", onClick: () => this.handleStepOperation("up") }))))));
   }
   static get formAssociated() {
     return true;
@@ -136,6 +240,11 @@ const NumberInput = class {
   get hostElement() {
     return getElement(this);
   }
+  static get watchers() {
+    return {
+      "value": ["onValueChange"]
+    };
+  }
 };
 __decorate([
   HookValidationLifecycle()