@siemens/ix 4.0.0 → 4.2.0

package/components/ix-input.js

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D-__gyet.js';
 import { y as iconEye, A as iconEyeCancelled } from './p-BvsadYCu.js';
-import { H as HookValidationLifecycle } from './p-xHo-3QVy.js';
+import { H as HookValidationLifecycle } from './p-Dq_H2flK.js';
 import { m as makeRef } from './p-bcj7UEIC.js';
-import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, c as SlotStart, I as InputElement, g as getAriaAttributesForInput, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd } from './p-S6nC3Yb4.js';
-import { d as defineCustomElement$7 } from './p-4kEXJDiJ.js';
-import { d as defineCustomElement$6 } from './p-Cj9oZ8ym.js';
-import { d as defineCustomElement$5 } from './p-DInJFFDT.js';
-import { d as defineCustomElement$4 } from './p-D8hPr0Kb.js';
-import { d as defineCustomElement$3 } from './p-Ow_osSm5.js';
-import { d as defineCustomElement$2 } from './p-B-mB5dVY.js';
+import { m as mapValidationResult, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, c as SlotStart, I as InputElement, g as getAriaAttributesForInput, d as checkAllowedKeys, o as onInputBlur, S as SlotEnd } from './p-DUU5I7wZ.js';
+import { d as defineCustomElement$7 } from './p-B1p0kpQJ.js';
+import { d as defineCustomElement$6 } from './p-BIg1TSrD.js';
+import { d as defineCustomElement$5 } from './p-BEDohapR.js';
+import { d as defineCustomElement$4 } from './p-1pd_0dhF.js';
+import { d as defineCustomElement$3 } from './p-DXFN8JXp.js';
+import { d as defineCustomElement$2 } from './p-BBwXlKhE.js';
 
 const inputCss = "input{min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow);font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}textarea{min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow);font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}textarea[type=number]{text-align:right}textarea[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea{min-height:2rem;height:3.25rem;padding:calc(0.375rem - var(--theme-input--border-thickness)) calc(0.5rem - var(--theme-input--border-thickness))}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--hover) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{background-color:var(--theme-input--background--invalid--hover);border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:inline-block;position:relative;width:auto}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}: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 .input-wrapper{display:flex;position:relative;align-items:center;width:100%;height:100%}:host input{width:100%;height:100%}:host .start-container,:host .end-container{display:flex;position:absolute;align-items:center;justify-content:center;z-index:1}:host .start-container{left:0}:host .end-container{right:0}:host .start-container ::slotted(*){margin-left:0.5rem}:host .start-container ::slotted(ix-icon.size-24),:host .start-container ::slotted(ix-icon-button.btn-icon-16){margin-left:0.25rem}:host .start-container ::slotted(ix-icon-button.btn-icon-32){margin-left:0}:host .end-container ::slotted(*){margin-right:0.5rem}:host .end-container ::slotted(ix-icon.size-24),:host .end-container ::slotted(ix-icon-button.btn-icon-16){margin-right:0.25rem}:host .end-container ::slotted(ix-icon-button.btn-icon-32){margin-right:0}:host .bottom-text{margin-top:0.25rem;margin-bottom:0.25rem}:host(.disabled){pointer-events:none}:host(.disabled) input,:host(.disabled) textarea{pointer-events:none}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input{background-color:var(--theme-input--background--warning);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{background-color:var(--theme-input--background--warning--hover);border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input{background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:hover{background-color:var(--theme-input--background--invalid--hover);border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--invalid--active) !important}:host .password-eye{margin-left:0.125rem;color:red}:host .password-eye.eye-hidden{display:none}";
 
@@ -62,6 +62,15 @@ const Input = /*@__PURE__*/ proxyCustomElement(class Input extends H {
          * Specifies whether the text field is readonly.
          */
         this.readonly = false;
+        /**
+         * If false, pressing Enter will submit the form (if inside a form).
+         * Set to true to suppress submit on Enter.
+         */
+        this.suppressSubmitOnEnter = false;
+        /**
+         * Text alignment within the input. 'start' aligns the text to the start of the input, 'end' aligns the text to the end of the input.
+         */
+        this.textAlignment = 'start';
         this.isInvalid = false;
         this.isValid = false;
         this.isInfo = false;
@@ -134,15 +143,15 @@ const Input = /*@__PURE__*/ proxyCustomElement(class Input extends H {
         return Promise.resolve(this.touched);
     }
     render() {
-        var _a;
+        var _a, _b;
         const inputAria = getAriaAttributesForInput(this);
-        return (h(Host, { key: 'c74b72aaf7caf50aca8bada5a426ced0d03da3a4', class: {
+        return (h(Host, { key: '07337a899a3b73d3cb37b1fc84da266d95cff84a', class: {
                 disabled: this.disabled,
                 readonly: this.readonly,
-            } }, h("ix-field-wrapper", { key: '259d4c941b5230eb3dab8f1e06d365fc5dd487bf', 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: 'b74bc60a551f8068fc3fd273583089160ef0e272', class: "input-wrapper" }, h(SlotStart, { key: '5da1e346612ed0b0ce81b4ca370593e3cfdd950f', slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h(InputElement, { key: 'd259d8e2fdc27cf9ef550a649db0a05d407752b4', 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: '83f14577687a0437983e0cff26d59291cf1a5f47', slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("ix-icon-button", { key: '4a54d7c381d87c75dca1e3febfb8d0e8d0095bf9', color: "color-weak-text", class: {
+            }, ariaAttributes: inputAria, form: (_a = this.formInternals.form) !== null && _a !== void 0 ? _a : undefined, 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: () => {
@@ -151,7 +160,7 @@ const Input = /*@__PURE__*/ proxyCustomElement(class Input extends H {
                     return;
                 }
                 this.inputType = 'password';
-            } }))), !!this.maxLength && this.maxLength > 0 && (h("ix-typography", { key: '40bbb9d175f5df31dba1115aaab0c7e2c07f067c', 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; }
     get hostElement() { return this; }
@@ -178,6 +187,8 @@ const Input = /*@__PURE__*/ proxyCustomElement(class Input extends H {
         "maxLength": [2, "max-length"],
         "minLength": [2, "min-length"],
         "allowedCharactersPattern": [1, "allowed-characters-pattern"],
+        "suppressSubmitOnEnter": [516, "suppress-submit-on-enter"],
+        "textAlignment": [1, "text-alignment"],
         "isInvalid": [32],
         "isValid": [32],
         "isInfo": [32],

package/components/ix-input.js.map

@@ -1 +1 @@
-{"file":"ix-input.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/input/input.scss?tag=ix-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use 'mixins/validation/form-component';\n@use './input.mixins.scss';\n\n@include input.input-field;\n\n:host {\n  .password-eye {\n    margin-left: 0.125rem;\n    color: red;\n\n    &.eye-hidden {\n      display: none;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconEye, iconEyeCancelled } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport {\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n  addDisposableChangesAndVisibilityObservers,\n  adjustPaddingForStartAndEnd,\n  checkAllowedKeys,\n  DisposableChangesAndVisibilityObservers,\n  getAriaAttributesForInput,\n  mapValidationResult,\n  onInputBlur,\n} from './input.util';\n\nlet inputIds = 0;\n\n/**\n * @form-ready\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-input',\n  styleUrl: 'input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Input implements IxInputFieldComponent<string> {\n  @Element() hostElement!: HTMLIxInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * The type of the text field. Possible values are 'text', 'email', or 'password'.\n   */\n  @Prop() type: 'text' | 'email' | 'password' | 'tel' | 'url' = 'text';\n\n  /**\n   * The name of the text field.\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * The placeholder text for the text field.\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * Specifies whether the text field is required.\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Specifies whether the text field is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Specifies whether the text field is readonly.\n   */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /**\n   * The helper text for the text field.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * The info text for the text field.\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Specifies whether to show the text as a tooltip.\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * The valid text for the text field.\n   */\n  @Prop() validText?: string;\n\n  /**\n   * The warning text for the text field.\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * The label for the text field.\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The error text for the text field.\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * The pattern for the text field.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * The maximum length of the text field.\n   */\n  @Prop() maxLength?: number;\n\n  /**\n   * The minimum length of the text field.\n   */\n  @Prop() minLength?: number;\n\n  /**\n   * The allowed characters pattern for the text field.\n   */\n  @Prop() allowedCharactersPattern?: string;\n\n  /**\n   * Event emitted when the value of the text field changes.\n   */\n  @Event() valueChange!: EventEmitter<string>;\n\n  /**\n   * Event emitted when the validity state of the text field changes.\n   */\n  @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n  /**\n   * Event emitted when the text field loses focus.\n   */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() isInvalidByRequired = false;\n\n  @State() inputType = 'text';\n\n  private readonly inputRef = makeRef<HTMLInputElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n  private readonly inputId = `input-${inputIds++}`;\n  private touched = false;\n\n  private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n  @HookValidationLifecycle()\n  updateClassMappings(result: ValidationResults) {\n    mapValidationResult(this, result);\n  }\n\n  @Watch('type')\n  updateInputType() {\n    this.inputType = this.type;\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue(this.value);\n    this.inputType = this.type;\n  }\n\n  connectedCallback(): void {\n    this.disposableChangesAndVisibilityObservers =\n      addDisposableChangesAndVisibilityObservers(\n        this.hostElement,\n        this.updatePaddings.bind(this)\n      );\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputRef.current\n    );\n  }\n\n  disconnectedCallback(): void {\n    this.disposableChangesAndVisibilityObservers?.();\n  }\n\n  updateFormInternalValue(value: string) {\n    this.formInternals.setFormValue(value);\n    this.value = value;\n  }\n\n  /** @internal */\n  @Method()\n  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return this.formInternals.form;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /**\n   * Returns the native input element used in the text field.\n   */\n  @Method()\n  getNativeInputElement() {\n    return this.inputRef.waitForCurrent();\n  }\n\n  /**\n   * Returns the validity state of the input field.\n   */\n  @Method()\n  async getValidityState(): Promise<ValidityState> {\n    const input = await this.inputRef.waitForCurrent();\n    return Promise.resolve(input.validity);\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  /**\n   * Returns whether the text field has been touched.\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    const inputAria: A11yAttributes = getAriaAttributesForInput(this);\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          htmlForLabel={this.inputId}\n          required={this.required}\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          controlRef={this.inputRef}\n        >\n          <div class=\"input-wrapper\">\n            <SlotStart\n              slotStartRef={this.slotStartRef}\n              onSlotChange={() => this.updatePaddings()}\n            ></SlotStart>\n            <InputElement\n              id={this.inputId}\n              readonly={this.readonly}\n              disabled={this.disabled}\n              maxLength={this.maxLength}\n              minLength={this.minLength}\n              pattern={this.pattern}\n              type={this.inputType}\n              isInvalid={this.isInvalid}\n              required={this.required}\n              value={this.value}\n              placeholder={this.placeholder}\n              inputRef={this.inputRef}\n              onKeyPress={(event) => checkAllowedKeys(this, event)}\n              valueChange={(value) => this.valueChange.emit(value)}\n              updateFormInternalValue={(value) =>\n                this.updateFormInternalValue(value)\n              }\n              onBlur={() => {\n                onInputBlur(this, this.inputRef.current);\n                this.touched = true;\n              }}\n              ariaAttributes={inputAria}\n            ></InputElement>\n            <SlotEnd\n              slotEndRef={this.slotEndRef}\n              onSlotChange={() => this.updatePaddings()}\n            >\n              <ix-icon-button\n                color=\"color-weak-text\"\n                class={{\n                  'password-eye': true,\n                  'eye-hidden': this.type !== 'password' || this.disabled,\n                }}\n                variant=\"tertiary\"\n                icon={\n                  this.inputType === 'password' ? iconEye : iconEyeCancelled\n                }\n                onClick={() => {\n                  if (this.inputType === 'password') {\n                    this.inputType = 'text';\n                    return;\n                  }\n\n                  this.inputType = 'password';\n                }}\n              ></ix-icon-button>\n            </SlotEnd>\n          </div>\n          {!!this.maxLength && this.maxLength > 0 && (\n            <ix-typography\n              class=\"bottom-text\"\n              slot=\"bottom-right\"\n              textColor=\"soft\"\n            >\n              {(this.value ?? '').length}/{this.maxLength}\n            </ix-typography>\n          )}\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ix-input.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/input/input.scss?tag=ix-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use 'mixins/validation/form-component';\n@use './input.mixins.scss';\n\n@include input.input-field;\n\n:host {\n  .password-eye {\n    margin-left: 0.125rem;\n    color: red;\n\n    &.eye-hidden {\n      display: none;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconEye, iconEyeCancelled } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport {\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n  addDisposableChangesAndVisibilityObservers,\n  adjustPaddingForStartAndEnd,\n  checkAllowedKeys,\n  DisposableChangesAndVisibilityObservers,\n  getAriaAttributesForInput,\n  mapValidationResult,\n  onInputBlur,\n} from './input.util';\n\nlet inputIds = 0;\n\n/**\n * @form-ready\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-input',\n  styleUrl: 'input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Input implements IxInputFieldComponent<string> {\n  @Element() hostElement!: HTMLIxInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * The type of the text field. Possible values are 'text', 'email', or 'password'.\n   */\n  @Prop() type: 'text' | 'email' | 'password' | 'tel' | 'url' = 'text';\n\n  /**\n   * The name of the text field.\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * The placeholder text for the text field.\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * Specifies whether the text field is required.\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Specifies whether the text field is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Specifies whether the text field is readonly.\n   */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /**\n   * The helper text for the text field.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * The info text for the text field.\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Specifies whether to show the text as a tooltip.\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * The valid text for the text field.\n   */\n  @Prop() validText?: string;\n\n  /**\n   * The warning text for the text field.\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * The label for the text field.\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The error text for the text field.\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * The pattern for the text field.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * The maximum length of the text field.\n   */\n  @Prop() maxLength?: number;\n\n  /**\n   * The minimum length of the text field.\n   */\n  @Prop() minLength?: number;\n\n  /**\n   * The allowed characters pattern for the text field.\n   */\n  @Prop() allowedCharactersPattern?: string;\n\n  /**\n   * If false, pressing Enter will submit the form (if inside a form).\n   * Set to true to suppress submit on Enter.\n   */\n  @Prop({ reflect: true }) suppressSubmitOnEnter: boolean = false;\n\n  /**\n   * Text alignment within the input. 'start' aligns the text to the start of the input, 'end' aligns the text to the end of the input.\n   */\n  @Prop() textAlignment: 'start' | 'end' = 'start';\n\n  /**\n   * Event emitted when the value of the text field changes.\n   */\n  @Event() valueChange!: EventEmitter<string>;\n\n  /**\n   * Event emitted when the validity state of the text field changes.\n   */\n  @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n  /**\n   * Event emitted when the text field loses focus.\n   */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() isInvalidByRequired = false;\n\n  @State() inputType = 'text';\n\n  private readonly inputRef = makeRef<HTMLInputElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n  private readonly inputId = `input-${inputIds++}`;\n  private touched = false;\n\n  private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n  @HookValidationLifecycle()\n  updateClassMappings(result: ValidationResults) {\n    mapValidationResult(this, result);\n  }\n\n  @Watch('type')\n  updateInputType() {\n    this.inputType = this.type;\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue(this.value);\n    this.inputType = this.type;\n  }\n\n  connectedCallback(): void {\n    this.disposableChangesAndVisibilityObservers =\n      addDisposableChangesAndVisibilityObservers(\n        this.hostElement,\n        this.updatePaddings.bind(this)\n      );\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputRef.current\n    );\n  }\n\n  disconnectedCallback(): void {\n    this.disposableChangesAndVisibilityObservers?.();\n  }\n\n  updateFormInternalValue(value: string) {\n    this.formInternals.setFormValue(value);\n    this.value = value;\n  }\n\n  /** @internal */\n  @Method()\n  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return this.formInternals.form;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /**\n   * Returns the native input element used in the text field.\n   */\n  @Method()\n  getNativeInputElement() {\n    return this.inputRef.waitForCurrent();\n  }\n\n  /**\n   * Returns the validity state of the input field.\n   */\n  @Method()\n  async getValidityState(): Promise<ValidityState> {\n    const input = await this.inputRef.waitForCurrent();\n    return Promise.resolve(input.validity);\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  /**\n   * Returns whether the text field has been touched.\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    const inputAria: A11yAttributes = getAriaAttributesForInput(this);\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          htmlForLabel={this.inputId}\n          required={this.required}\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          controlRef={this.inputRef}\n        >\n          <div class=\"input-wrapper\">\n            <SlotStart\n              slotStartRef={this.slotStartRef}\n              onSlotChange={() => this.updatePaddings()}\n            ></SlotStart>\n            <InputElement\n              id={this.inputId}\n              readonly={this.readonly}\n              disabled={this.disabled}\n              maxLength={this.maxLength}\n              minLength={this.minLength}\n              pattern={this.pattern}\n              type={this.inputType}\n              isInvalid={this.isInvalid}\n              required={this.required}\n              value={this.value}\n              placeholder={this.placeholder}\n              inputRef={this.inputRef}\n              onKeyPress={(event) => checkAllowedKeys(this, event)}\n              valueChange={(value) => this.valueChange.emit(value)}\n              updateFormInternalValue={(value) =>\n                this.updateFormInternalValue(value)\n              }\n              onBlur={() => {\n                onInputBlur(this, this.inputRef.current);\n                this.touched = true;\n              }}\n              ariaAttributes={inputAria}\n              form={this.formInternals.form ?? undefined}\n              suppressSubmitOnEnter={this.suppressSubmitOnEnter}\n              textAlignment={this.textAlignment}\n            ></InputElement>\n            <SlotEnd\n              slotEndRef={this.slotEndRef}\n              onSlotChange={() => this.updatePaddings()}\n            >\n              <ix-icon-button\n                color=\"color-weak-text\"\n                class={{\n                  'password-eye': true,\n                  'eye-hidden': this.type !== 'password' || this.disabled,\n                }}\n                variant=\"tertiary\"\n                icon={\n                  this.inputType === 'password' ? iconEye : iconEyeCancelled\n                }\n                onClick={() => {\n                  if (this.inputType === 'password') {\n                    this.inputType = 'text';\n                    return;\n                  }\n\n                  this.inputType = 'password';\n                }}\n              ></ix-icon-button>\n            </SlotEnd>\n          </div>\n          {!!this.maxLength && this.maxLength > 0 && (\n            <ix-typography\n              class=\"bottom-text\"\n              slot=\"bottom-right\"\n              textColor=\"soft\"\n            >\n              {(this.value ?? '').length}/{this.maxLength}\n            </ix-typography>\n          )}\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/ix-key-value-list.js

@@ -15,7 +15,7 @@ const KeyValueList = /*@__PURE__*/ proxyCustomElement(class KeyValueList extends
         this.striped = false;
     }
     render() {
-        return (h(Host, { key: '8dba91174048942e97f5c3923693f9773498850e', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '008b5a305508353e90fbbdc664079942b5e72fb6' })));
+        return (h(Host, { key: 'fcc3ec3470c25cac50b88a1006b30be059f778f8', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '05645a91f92d7db584bd8235f73979249870e734' })));
     }
     static get style() { return keyValueListCss; }
 }, [257, "ix-key-value-list", {

package/components/ix-key-value.js

@@ -15,7 +15,7 @@ const KeyValue = /*@__PURE__*/ proxyCustomElement(class KeyValue extends H {
         this.labelPosition = 'top';
     }
     render() {
-        return (h(Host, { key: 'afb00b426d8c1058f0cbb4f1c36c77f879d4fcc2', class: `keyValue keyValue--${this.labelPosition === 'top' ? 'column' : 'row'}` }, this.icon && (h("ix-icon", { key: 'f965a5b314912431569919f3d12b03e7ecdd7a7f', name: this.icon, size: "24", class: "keyValue__icon", "aria-label": this.ariaLabelIcon })), h("div", { key: '93a20b20f02409e5229d75f9614024771a1e4062', class: "keyValue__content" }, h("div", { key: '86a788b30e518a4fe26c9f266c79faeb71c2a246', class: "content__label" }, this.label), h("div", { key: '9421c0ff618a40335423c624640556b266cb0744', 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 === undefined,
             } }, this.value !== undefined ? (this.value) : (h("slot", { name: "custom-value" }))))));

package/components/ix-kpi.js

@@ -37,13 +37,13 @@ const Kpi = /*@__PURE__*/ proxyCustomElement(class Kpi extends H {
         return tooltip;
     }
     render() {
-        return (h(Host, { key: 'b30b96a30c6462d46df55d826117a7bbca06bd87', title: this.getTooltipText(), tabindex: "1", class: {
+        return (h(Host, { key: '34fcbb68ba73d08619ef12fd9595c9c684aa3d10', title: this.getTooltipText(), tabindex: "1", class: {
                 stacked: this.orientation === 'vertical',
-            } }, h("div", { key: '91df6b79eab2edbf0ccb71d2dd8ee07e1412c546', class: {
+            } }, h("div", { key: 'cd4910a41ee179ea21166c80322e5361dd132850', class: {
                 'kpi-container': true,
                 alarm: this.state === 'alarm',
                 warning: this.state === 'warning',
-            } }, h("span", { key: '8229c1774d9ef82f8c30e1a8f24dafc57b5eed49', class: "kpi-label" }, this.getStateIcon(), h("span", { key: 'e27dbc323999e5e211ee923a07089a19d8de4ad6', class: "kpi-label-text" }, this.label)), h("span", { key: 'a3c2b17de22d8630a05b0e39c4005ac145784a53', class: "kpi-value-container" }, h("span", { key: '1b5f92dbd5f394d6c3bad1c9360427d572127759', 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) : ''))));
     }
     static get style() { return kpiCss; }
 }, [257, "ix-kpi", {

package/components/ix-layout-auto.js

@@ -80,7 +80,7 @@ const LayoutForm = /*@__PURE__*/ proxyCustomElement(class LayoutForm extends H {
         });
     }
     render() {
-        return (h(Host, { key: 'c372cee7de4d253246c61f60858b268619592d5d' }, h("div", { key: '205f0444aa85dcffd338abf3f38939ff9eea5d3c', class: "container" }, h("slot", { key: 'e8f39e9e0eb5dd8eee1b0ff66899dc1b0283143a' }))));
+        return (h(Host, { key: '48511195af19191b832713a828ac0945b06a4898' }, h("div", { key: '4a51469ffe227db5c361734fc3122a98f7e0fbcc', class: "container" }, h("slot", { key: '6ab367e83612df056e40392bced22c5f80457486' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/components/ix-layout-grid.js

@@ -1,4 +1,4 @@
-import { L as LayoutGrid, d as defineCustomElement$1 } from './p-De0habf3.js';
+import { L as LayoutGrid, d as defineCustomElement$1 } from './p-CvD2yWeJ.js';
 
 const IxLayoutGrid = LayoutGrid;
 const defineCustomElement = defineCustomElement$1;

package/components/ix-link-button.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-D-__gyet.js';
 import { d as iconChevronRightSmall } from './p-BvsadYCu.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}: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):hover .link,:host .link-button:not(.disabled):not(:disabled).hover .link{text-decoration:underline;text-underline-offset:0.2rem}: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:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}: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 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 = /*@__PURE__*/ proxyCustomElement(class LinkButton extends H {
     constructor(registerHost) {
@@ -22,13 +22,13 @@ const LinkButton = /*@__PURE__*/ proxyCustomElement(class LinkButton extends H {
         this.target = '_self';
     }
     render() {
-        return (h(Host, { key: '5d6862720cb7254c81ae048532345670b2725cf6' }, h("a", { key: 'ad09a301c88af52fe06626e71785af1a69f78690', title: this.url, tabindex: "0", class: {
+        return (h(Host, { key: '83b41ef8a3bef06a033a9a20c30a4ae1e83066e8' }, h("a", { key: '955dc6e492eec929e592947ec18009d744d1f973', title: this.url, tabindex: "0", class: {
                 'link-button': true,
                 disabled: this.disabled,
-            }, href: this.disabled ? undefined : this.url, target: this.target }, h("ix-icon", { key: '06f8da3d0dfe027915222ba0525bb6551ebf7472', class: "icon", name: iconChevronRightSmall, size: "16", "aria-hidden": "true" }), h("div", { key: 'c5759a97f5599d15618cd1e83f32a35e656c3ea7', class: {
+            }, href: this.disabled ? undefined : 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: '0429c8a4ac40936697d6e22d6061135e638c4557' })))));
+            } }, h("slot", { key: '2bd6071e8aad57fb13226d8452b0649367c6b750' })))));
     }
     static get style() { return linkButtonCss; }
 }, [257, "ix-link-button", {

package/components/ix-link-button.js.map

@@ -1 +1 @@
-{"file":"ix-link-button.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,k4CAAk4C;;MCiB34C,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AALvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAOxB;;;;AAIG;AACK,QAAA,IAAM,CAAA,MAAA,GAA4C,OAAO;AAiClE;IA/BC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE;AACL,gBAAA,aAAa,EAAE,IAAI;gBACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EACD,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,EAC1C,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnB,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,qBAAqB,EAC3B,IAAI,EAAC,IAAI,EAAA,aAAA,EACG,MAAM,EACT,CAAA,EACX,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EAAA,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACJ,CACC;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'common-variables' as vars;\n@use 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: vars.$x-large-space;\n  font-size: vars.$font-size-default;\n  font-weight: vars.$font-weight-normal;\n  min-width: vars.$x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 vars.$tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n\n    @include hover.hover {\n      color: var(--theme-color-dynamic--hover);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    @include hover.active {\n      color: var(--theme-color-dynamic--active);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n            aria-hidden=\"true\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ix-link-button.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,qlCAAqlC;;MCiB9lC,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;AALvB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAOxB;;;;AAIG;AACK,QAAA,IAAM,CAAA,MAAA,GAA4C,OAAO;AAiClE;IA/BC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CACE,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE;AACL,gBAAA,aAAa,EAAE,IAAI;gBACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EACD,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,EAC1C,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnB,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,qBAAqB,EAC3B,IAAI,EAAC,IAAI,EAAA,aAAA,EACG,MAAM,EACT,CAAA,EACX,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EAAA,EAED,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACJ,CACC;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'common-variables' as vars;\n@use 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: vars.$x-large-space;\n  font-size: vars.$font-size-default;\n  font-weight: vars.$font-weight-normal;\n  min-width: vars.$x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 vars.$tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      text-decoration: underline;\n      text-underline-offset: 0.2rem;\n    }\n\n    @include hover.hover {\n      color: var(--theme-color-dynamic--hover);\n    }\n\n    @include hover.active {\n      color: var(--theme-color-dynamic--active);\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n            aria-hidden=\"true\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/ix-menu-about-item.js

@@ -19,7 +19,7 @@ const MenuAboutItem = /*@__PURE__*/ proxyCustomElement(class MenuAboutItem exten
         });
     }
     render() {
-        return (h(Host, { key: '632b6d89ae686ca05423b4a6b224a2635caa836d' }, h("slot", { key: '9c976c9b75de1cb742965cda40513e870f70fb9e' })));
+        return (h(Host, { key: 'c150379d52f7dd0744ec480c35909937abef9c90' }, h("slot", { key: '37edb415a550ba73903bd6142162c42fe7be9d34' })));
     }
     static get watchers() { return {
         "label": ["watchLabel"]

package/components/ix-menu-about-news.js

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D-__gyet.js';
 import { v as iconClose, H as iconShout } from './p-BvsadYCu.js';
-import { d as defineCustomElement$5 } from './p-DWRnKXkl.js';
-import { d as defineCustomElement$4 } from './p-DInJFFDT.js';
-import { d as defineCustomElement$3 } from './p-D8hPr0Kb.js';
-import { d as defineCustomElement$2 } from './p-B-mB5dVY.js';
+import { d as defineCustomElement$5 } from './p-C6_1qmP4.js';
+import { d as defineCustomElement$4 } from './p-BEDohapR.js';
+import { d as defineCustomElement$3 } from './p-1pd_0dhF.js';
+import { d as defineCustomElement$2 } from './p-BBwXlKhE.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}}";
 
@@ -28,16 +28,16 @@ const MenuAboutNews = /*@__PURE__*/ proxyCustomElement(class MenuAboutNews exten
         this.expanded = false;
     }
     render() {
-        return (h(Host, { key: '9e3e3bfabc3e51bdbee57c13ad492f3d3447fbfe', class: {
+        return (h(Host, { key: '61a51cc04b238505c64285babebaaddf1201a9f7', class: {
                 expanded: this.expanded,
                 show: !this.show,
-            } }, h("div", { key: '616682301e4308c9d3d53481a8fb7e266a9a4181', class: "banner-container" }, h("ix-icon", { key: '5b795a4034d29997b1c285c9659acd8e70d5528d', color: "color-inv-contrast-text", name: iconShout, size: "32" }), h("svg", { key: 'f0c5c49e71a9aa3c91d792dc33909d9c8bbd1818', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, h("polygon", { key: 'e19557acebc98122003ceb160c3d07196dbdd8a8', points: "0 0 48 0 48 56 24 48 0 56" }))), h("div", { key: '75559e792e5610eefae0be4722a9cc6656c9e2d8', class: "cui-popover-news-header" }, h("ix-typography", { key: '2cf5eec66717e025a84d2e979297ad11ad5df324', format: "label", bold: true }, this.label)), h("ix-icon-button", { key: 'f77cb50c4fb25171da08eeda5724557656e7d56c', 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: '1298f46cb80728f5c2b55603ae6a912967e4590c', class: "slot-container" }, h("slot", { key: 'fbe4e45ff94bd1f43864c2290e4b44f8ea3e8f72' })), 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: '5259871afe0e537a1378f60f13c3884a08bc4daa', id: "arrow" })));
+            } }, this.i18nShowMore))) : null, h("div", { key: 'b877e4087ebe56fca5c82a7acada5ba7c7ef8abb', id: "arrow" })));
     }
     static get style() { return menuAboutNewsCss; }
 }, [257, "ix-menu-about-news", {

package/components/ix-menu-about.js

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, e as createEvent, i as forceUpdate, h } from './p-D-__gyet.js';
-import { s as setTab, i as initialize, M as MenuTabs } from './p-C56HnkHy.js';
-import { d as defineCustomElement$5 } from './p-DInJFFDT.js';
-import { d as defineCustomElement$4 } from './p-D8hPr0Kb.js';
-import { d as defineCustomElement$3 } from './p-BAG4Ixzu.js';
-import { d as defineCustomElement$2 } from './p-ChZQLy9v.js';
+import { s as syncTabDisplay, i as initialize, M as MenuTabs } from './p-BiqdnsgA.js';
+import { d as defineCustomElement$5 } from './p-BEDohapR.js';
+import { d as defineCustomElement$4 } from './p-1pd_0dhF.js';
+import { d as defineCustomElement$3 } from './p-7E7AMiQV.js';
+import { d as defineCustomElement$2 } from './p-10zMtvCF.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}";
 
@@ -23,8 +23,10 @@ const MenuAbout = /*@__PURE__*/ proxyCustomElement(class MenuAbout extends H {
         /** @internal */
         this.show = false;
     }
-    updateTab(label) {
-        setTab(this, label);
+    updateTab(newLabel, oldLabel) {
+        if (newLabel !== oldLabel) {
+            syncTabDisplay(this, newLabel);
+        }
     }
     componentWillLoad() {
         initialize(this);
@@ -33,7 +35,7 @@ const MenuAbout = /*@__PURE__*/ proxyCustomElement(class MenuAbout extends H {
         forceUpdate(this.el);
     }
     render() {
-        return h(MenuTabs, { key: 'f39b61fd405141b8e2e7061bd76194ee4beb3a3d', context: this });
+        return h(MenuTabs, { key: 'e49c1819db2fcba5b330c776c84e905d6f1aef87', context: this });
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ix-menu-about.js.map

@@ -1 +1 @@
-{"file":"ix-menu-about.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG;;MCgC5zG,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;AAcE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,2BAA2B;;AAGnC,QAAA,IAAI,CAAA,IAAA,GAAG,KAAK;AA+BrB;AAfC,IAAA,SAAS,CAAC,KAAa,EAAA;AACrB,QAAA,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC;;IAGrB,iBAAiB,GAAA;QACf,UAAU,CAAC,IAAI,CAAC;;IAGlB,gBAAgB,GAAA;AACd,QAAA,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;IAGtB,MAAM,GAAA;AACJ,QAAA,OAAO,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,OAAO,EAAE,IAAI,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'legacy/fonts';\n\n:host {\n  display: block;\n  background-color: var(--theme-nav-overlay--background);\n  padding: vars.$medium-space vars.$default-space vars.$default-space\n    vars.$x-large-space;\n  flex-grow: 1;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n\n  .about-header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    align-items: center;\n    height: vars.$x-large-space;\n    margin-bottom: vars.$small-space;\n\n    h2 {\n      color: var(--theme-nav-overlay-header--color);\n      margin-bottom: 1rem;\n    }\n  }\n\n  ix-tabs {\n    margin-bottom: 1.5rem;\n  }\n\n  ix-menu-about-item {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n  CustomCloseEvent,\n  initialize,\n  setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n  tag: 'ix-menu-about',\n  styleUrl: 'menu-about.scss',\n  shadow: true,\n})\nexport class MenuAbout {\n  @Element() el!: HTMLIxMenuAboutElement;\n\n  /**\n   * Active tab\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) activeTabLabel?: string;\n\n  /**\n   * Content of the header\n   */\n  @Prop() label = 'About & legal information';\n\n  /** @internal */\n  @Prop() show = false;\n\n  /**\n   * Active tab changed\n   * @since 3.0.0\n   */\n  @Event() tabChange!: EventEmitter<string>;\n\n  /**\n   * About and Legal closed\n   */\n  @Event() close!: EventEmitter<CustomCloseEvent>;\n\n  @State() items!: HTMLIxMenuAboutItemElement[];\n\n  @Watch('activeTabLabel')\n  updateTab(label: string) {\n    setTab(this, label);\n  }\n\n  componentWillLoad() {\n    initialize(this);\n  }\n\n  componentDidLoad() {\n    forceUpdate(this.el);\n  }\n\n  render() {\n    return <MenuTabs context={this} />;\n  }\n}\n"],"version":3}
+{"file":"ix-menu-about.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG;;MCgC5zG,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;AALtB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;AAcE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,2BAA2B;;AAGnC,QAAA,IAAI,CAAA,IAAA,GAAG,KAAK;AAiCrB;IAjBC,SAAS,CAAC,QAAgB,EAAE,QAAgB,EAAA;AAC1C,QAAA,IAAI,QAAQ,KAAK,QAAQ,EAAE;AACzB,YAAA,cAAc,CAAC,IAAI,EAAE,QAAQ,CAAC;;;IAIlC,iBAAiB,GAAA;QACf,UAAU,CAAC,IAAI,CAAC;;IAGlB,gBAAgB,GAAA;AACd,QAAA,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;IAGtB,MAAM,GAAA;AACJ,QAAA,OAAO,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,OAAO,EAAE,IAAI,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'legacy/fonts';\n\n:host {\n  display: block;\n  background-color: var(--theme-nav-overlay--background);\n  padding: vars.$medium-space vars.$default-space vars.$default-space\n    vars.$x-large-space;\n  flex-grow: 1;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n\n  .about-header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    align-items: center;\n    height: vars.$x-large-space;\n    margin-bottom: vars.$small-space;\n\n    h2 {\n      color: var(--theme-nav-overlay-header--color);\n      margin-bottom: 1rem;\n    }\n  }\n\n  ix-tabs {\n    margin-bottom: 1.5rem;\n  }\n\n  ix-menu-about-item {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n  CustomCloseEvent,\n  initialize,\n  syncTabDisplay,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n  tag: 'ix-menu-about',\n  styleUrl: 'menu-about.scss',\n  shadow: true,\n})\nexport class MenuAbout {\n  @Element() el!: HTMLIxMenuAboutElement;\n\n  /**\n   * Active tab\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) activeTabLabel?: string;\n\n  /**\n   * Content of the header\n   */\n  @Prop() label = 'About & legal information';\n\n  /** @internal */\n  @Prop() show = false;\n\n  /**\n   * Active tab changed\n   * @since 3.0.0\n   */\n  @Event() tabChange!: EventEmitter<string>;\n\n  /**\n   * About and Legal closed\n   */\n  @Event() close!: EventEmitter<CustomCloseEvent>;\n\n  @State() items!: HTMLIxMenuAboutItemElement[];\n\n  @Watch('activeTabLabel')\n  updateTab(newLabel: string, oldLabel: string) {\n    if (newLabel !== oldLabel) {\n      syncTabDisplay(this, newLabel);\n    }\n  }\n\n  componentWillLoad() {\n    initialize(this);\n  }\n\n  componentDidLoad() {\n    forceUpdate(this.el);\n  }\n\n  render() {\n    return <MenuTabs context={this} />;\n  }\n}\n"],"version":3}

package/components/ix-menu-avatar-item.js

@@ -1,4 +1,4 @@
-import { M as MenuAvatarItem, d as defineCustomElement$1 } from './p-BHcP7TVn.js';
+import { M as MenuAvatarItem, d as defineCustomElement$1 } from './p-Bk0vKwmt.js';
 
 const IxMenuAvatarItem = MenuAvatarItem;
 const defineCustomElement = defineCustomElement$1;

package/components/ix-menu-avatar.js

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-D-__gyet.js';
 import { g as getSlottedElements } from './p-Bi1VyG64.js';
 import { I as iconLogOut } from './p-BvsadYCu.js';
-import { d as defineCustomElement$9 } from './p-GPVWLtS3.js';
-import { d as defineCustomElement$8 } from './p-BtDCIGt3.js';
-import { d as defineCustomElement$7 } from './p-DkDGUG2W.js';
-import { d as defineCustomElement$6 } from './p-DvD1nW88.js';
-import { d as defineCustomElement$5 } from './p-BHcP7TVn.js';
-import { d as defineCustomElement$4 } from './p-D8hPr0Kb.js';
-import { d as defineCustomElement$3 } from './p-Ow_osSm5.js';
-import { d as defineCustomElement$2 } from './p-B-mB5dVY.js';
+import { d as defineCustomElement$9 } from './p-Bye33cYU.js';
+import { d as defineCustomElement$8 } from './p-Db0RazS2.js';
+import { d as defineCustomElement$7 } from './p-BI7B-PUA.js';
+import { d as defineCustomElement$6 } from './p-BLeWaHpy.js';
+import { d as defineCustomElement$5 } from './p-Bk0vKwmt.js';
+import { d as defineCustomElement$4 } from './p-1pd_0dhF.js';
+import { d as defineCustomElement$3 } from './p-DXFN8JXp.js';
+import { d as defineCustomElement$2 } from './p-BBwXlKhE.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)}";
 
@@ -43,9 +43,9 @@ const MenuAvatar = /*@__PURE__*/ proxyCustomElement(class MenuAvatar extends H {
         this.showContextMenu = elements.length !== 0;
     }
     render() {
-        return (h(Host, { key: '342ba4b67b3532da978048158cf9b9abfbc7e33d', slot: "ix-menu-avatar" }, h("button", { key: '68924d460574cde4c655a1f95e3c6ed5bc415c44', class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, h("ix-avatar", { key: '2170181905320f58961a70ab8cb5b25d1c439393', image: this.image, initials: this.initials }), h("div", { key: 'c9f0275dec453f57756d3faefe9988c71d3b54b6', class: "avatar-name" }, h("span", { key: '56536ddb8d6b591433ad6bd88d82691de91b81ad', class: "text-default-single", title: this.top }, this.top), h("span", { key: 'a9b5bbed878e3a0282f770b97bb691f360035416', class: "text-default-single", title: this.bottom }, this.bottom))), h("ix-dropdown", { key: '9974a1b413104016d5366f72103f3712e93813a4', 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: 'b642dd168efdf7f4659c3a0e5d032fccb93df9a5', onSlotchange: () => this.onSlotChange() }), !this.hideLogoutButton && (h("ix-menu-avatar-item", { key: '4b7e853e0522208bebd10535885731af9dc4d3f6', 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/components/ix-menu-category.js

@@ -3,12 +3,12 @@ import { a as animate } from './p-DhE1t8Qh.js';
 import { c as closestIxMenu } from './p-BhgW5qDm.js';
 import { c as createMutationObserver } from './p-CX81WQtk.js';
 import { c as iconChevronDownSmall } from './p-BvsadYCu.js';
-import { d as defineCustomElement$7 } from './p-BtDCIGt3.js';
-import { d as defineCustomElement$6 } from './p-DkDGUG2W.js';
-import { d as defineCustomElement$5 } from './p-DvD1nW88.js';
-import { d as defineCustomElement$4 } from './p-BTR8UA6s.js';
-import { d as defineCustomElement$3 } from './p-Ow_osSm5.js';
-import { d as defineCustomElement$2 } from './p-B-mB5dVY.js';
+import { d as defineCustomElement$7 } from './p-Db0RazS2.js';
+import { d as defineCustomElement$6 } from './p-BI7B-PUA.js';
+import { d as defineCustomElement$5 } from './p-BLeWaHpy.js';
+import { d as defineCustomElement$4 } from './p-DSTHZygb.js';
+import { d as defineCustomElement$3 } from './p-DXFN8JXp.js';
+import { d as defineCustomElement$2 } from './p-BBwXlKhE.js';
 
 /*
  * SPDX-FileCopyrightText: 2024 Siemens AG
@@ -189,7 +189,7 @@ const MenuCategory = /*@__PURE__*/ proxyCustomElement(class MenuCategory extends
         }
     }
     render() {
-        return (h(Host, { key: '40ae8539715815c94e99313fad8694e4115e5482', class: {
+        return (h(Host, { key: '13ac63c3321e33e4781ab642577464fde79c6bf2', class: {
                 expanded: this.showItems,
             }, onPointerEnter: () => {
                 this.enterLeaveDebounce.onEnter();
@@ -198,14 +198,14 @@ const MenuCategory = /*@__PURE__*/ proxyCustomElement(class MenuCategory extends
                     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,
@@ -218,7 +218,7 @@ const MenuCategory = /*@__PURE__*/ proxyCustomElement(class MenuCategory extends
                         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 this; }
     static get style() { return menuCategoryCss; }

package/components/ix-menu-expand-icon.js

@@ -1,4 +1,4 @@
-import { M as MenuExpandIcon, d as defineCustomElement$1 } from './p-CwFNYtOl.js';
+import { M as MenuExpandIcon, d as defineCustomElement$1 } from './p-PpLLlogo.js';
 
 const IxMenuExpandIcon = MenuExpandIcon;
 const defineCustomElement = defineCustomElement$1;

package/components/ix-menu-item.js

@@ -1,4 +1,4 @@
-import { M as MenuItem, d as defineCustomElement$1 } from './p-BTR8UA6s.js';
+import { M as MenuItem, d as defineCustomElement$1 } from './p-DSTHZygb.js';
 
 const IxMenuItem = MenuItem;
 const defineCustomElement = defineCustomElement$1;

package/components/ix-menu-settings-item.js

@@ -19,7 +19,7 @@ const MenuSettingsItem = /*@__PURE__*/ proxyCustomElement(class MenuSettingsItem
         });
     }
     render() {
-        return (h(Host, { key: '82d134ab9cdb58a29c6fd02a165a9925a9a55912' }, h("slot", { key: 'dfb95edb5325b70072cc422a48c78f8a50a9b589' })));
+        return (h(Host, { key: '69dac244a2c3b427237e8dceec64fad9c16600e9' }, h("slot", { key: 'ccfc87d1f061f0d4195f943dec3782b655626aae' })));
     }
     static get watchers() { return {
         "label": ["watchLabel"]

package/components/ix-menu-settings.js

@@ -1,4 +1,4 @@
-import { a as MenuSettings, d as defineCustomElement$1 } from './p-C56HnkHy.js';
+import { a as MenuSettings, d as defineCustomElement$1 } from './p-BiqdnsgA.js';
 
 const IxMenuSettings = MenuSettings;
 const defineCustomElement = defineCustomElement$1;