@siemens/ix-docs 0.0.0-pr-2238-20251103105018 → 0.0.0-pr-2297-20251204163058

package/build/static/demo/v2/preview/html/assets/{ix-split-button.entry-CRpUjD5_.js → ix-split-button.entry-DwTydN2Z.js}

@@ -1,5 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { x as iconContextMenu } from "./index-Cz75KU1f-BUHLjWzB.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
+import { I as iconContextMenu } from "./index-8HpPmDK_-DinFJk0z.js";
+import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
 const splitButtonCss = ".btn-group ix-button:first-child .btn{border-top-right-radius:0px;border-bottom-right-radius:0px;border-right:0px}.btn-group ix-button:last-child .btn{border-top-left-radius:0px;border-bottom-left-radius:0px}.btn-group ix-button:not(:first-child):not(:last-child) .btn{border-radius:0px;border-right:0px}:host{display:inline-block}: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 .btn-group{position:relative;display:inline-flex;vertical-align:middle;width:100%}:host .btn-group>ix-button:nth-child(1),:host .btn-group>ix-icon-button:nth-child(1){width:calc(100% - 2rem);--ix-button-border-radius-right:0}:host .btn-group>ix-icon-button:nth-child(2){width:2rem;--ix-button-border-radius-left:0}:host .middle-gap{gap:0.125rem}:host .left-button-border{border-top-width:0.125rem;border-right-width:0;border-left-width:0.125rem;border-bottom-width:0.125rem}";
 const SplitButton = class {
   constructor(hostRef) {
@@ -8,28 +9,29 @@ const SplitButton = class {
     this.variant = "primary";
     this.closeBehavior = "both";
     this.disabled = false;
+    this.disableButton = false;
+    this.disableDropdownButton = false;
     this.placement = "bottom-start";
     this.toggle = false;
+    this.triggerElementRef = makeRef();
   }
-  linkTriggerRef() {
-    if (this.triggerElement && this.dropdownElement) {
-      this.dropdownElement.trigger = this.triggerElement;
-    }
+  get isDisabledButton() {
+    return this.disabled || this.disableButton;
   }
-  componentDidLoad() {
-    this.linkTriggerRef();
+  get isDisabledIcon() {
+    return this.disabled || this.disableDropdownButton;
   }
   render() {
     var _a;
     const hasOutline = this.variant.toLocaleLowerCase().includes("secondary");
-    const buttonAttributes = {
-      variant: this.variant,
-      disabled: this.disabled,
-      class: {
-        "left-button-border": !hasOutline
-      }
+    const baseAttributes = {
+      variant: this.variant
     };
-    return h(Host, { key: "c0fec74005091e767fabcb3a3f19da5bdd95a43b" }, h("div", { key: "5ed4d1f6ecc27eacb58c101612b6f38d6487e903", class: { "btn-group": true, "middle-gap": !hasOutline } }, this.label ? h("ix-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e) }), this.label) : h("ix-icon-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e), "aria-label": this.ariaLabelButton })), h("ix-icon-button", Object.assign({ key: "0026fece6601ca9715b259bc2fd67f1c63993a93" }, buttonAttributes, { ref: (r) => this.triggerElement = r, class: "anchor", icon: (_a = this.splitIcon) !== null && _a !== void 0 ? _a : iconContextMenu, "aria-label": this.ariaLabelSplitIconButton }))), h("ix-dropdown", { key: "c6e1fc922c216672d8c9545721b421021408f74f", ref: (r) => this.dropdownElement = r, closeBehavior: this.closeBehavior }, h("slot", { key: "ae34c0441b00ef9f29ea8a53308698cda6678468" })));
+    const buttonAttributes = Object.assign(Object.assign({}, baseAttributes), { disabled: this.isDisabledButton, class: {
+      "left-button-border": !hasOutline
+    } });
+    const dropdownButtonAttributes = Object.assign(Object.assign({}, baseAttributes), { disabled: this.isDisabledIcon });
+    return h(Host, { key: "18955e55bbab4f5899f27cf2b38892c60bece302" }, h("div", { key: "8cc32b2686c3e02ee1f2a43d4a5f310cd2930dad", class: { "btn-group": true, "middle-gap": !hasOutline } }, this.label ? h("ix-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e), "aria-label": this.ariaLabelButton }), this.label) : h("ix-icon-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e), "aria-label": this.ariaLabelButton })), h("ix-icon-button", Object.assign({ key: "ae7a2875314967f3100d1abcef3528a9822b0503" }, dropdownButtonAttributes, { ref: this.triggerElementRef, class: "anchor", icon: (_a = this.splitIcon) !== null && _a !== void 0 ? _a : iconContextMenu, "aria-label": this.ariaLabelSplitIconButton }))), h("ix-dropdown", { key: "d81abc1f01f55f2bc85740898e7f59173e62e182", closeBehavior: this.closeBehavior, trigger: this.triggerElementRef.waitForCurrent() }, h("slot", { key: "19c2623131a8ab3799e5a9bb75cc356bf500fffd" })));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-tab-item_2.entry-BgY5PPMJ.js → ix-tab-item_2.entry-CsXRBav3.js}

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { w as iconChevronRightSmall, E as iconChevronLeftSmall } from "./index-Cz75KU1f-BUHLjWzB.js";
-const tabItemCss = '@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}: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::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .text span,:host .text span::before{pointer-events:none}:host .text{vertical-align:middle}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .hidden{display:none}:host(.circle){height:72px}:host(.top)::after{top:0}:host(.bottom)::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle))::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle))::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled)::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled))::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
+import { w as iconChevronRightSmall, D as iconChevronLeftSmall } from "./index-8HpPmDK_-DinFJk0z.js";
+const tabItemCss = '@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}: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::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .text span,:host .text span::before{pointer-events:none}:host .text{vertical-align:middle}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-color-1);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .hidden{display:none}:host(.circle){height:72px}:host(.top)::after{top:0}:host(.bottom)::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle))::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle))::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled)::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled))::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';
 const TabItem = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -26,7 +26,7 @@ const TabItem = class {
     };
   }
   render() {
-    return h(Host, { key: "2eaa9ee3ba9488210877fa4ed43595e1f9d9a8dd", class: this.tabItemClasses({
+    return h(Host, { key: "f703b9ed1db79ae154acd43425ac44993a13e99e", class: this.tabItemClasses({
       selected: this.selected,
       disabled: this.disabled,
       small: this.small,
@@ -43,12 +43,12 @@ const TabItem = class {
       if (clientEvent.defaultPrevented) {
         event.stopPropagation();
       }
-    } }, h("div", { key: "a3592b79e11a50056834d1920aa666a6989f7be9", class: {
+    } }, h("div", { key: "5d9f5fa0c5a9c2f057ff8e3e960a5b15499ec84b", class: {
       circle: this.rounded,
       text: !this.rounded,
       selected: this.selected,
       disabled: this.disabled
-    } }, h("slot", { key: "6bdd7252b0906f1d47257c6bc0fd4bff91a7eb3b" })), h("div", { key: "876c31b1ee2c454887434a99b65435d1511676e1", class: {
+    } }, h("slot", { key: "d0c87e92e0ad1a4664024b7d79900e8bb36a6ba6" })), h("div", { key: "1812905c3f08a70565e1aea166fa372a07344a76", class: {
       counter: true,
       selected: this.selected,
       hidden: !(this.rounded && this.counter !== void 0),
@@ -271,13 +271,13 @@ const Tabs = class {
     });
   }
   render() {
-    return h(Host, { key: "4c58b26f100793ee93715ddf2d71cd85c7a77394" }, this.showArrowPrevious && h("button", { key: "88b2aa246f44f6fca988e8cc95d5c69f973b5626", class: "arrow", onClick: () => this.move(this.scrollAmount, true), "aria-label": this.ariaLabelChevronLeftIconButton }, h("ix-icon", { key: "0a6bdb7e2edafe47e7a2c3a09c860df3b8e8c73f", name: iconChevronLeftSmall })), h("div", { key: "d06c37c4aae268d43ada257185256163c54668bf", class: {
+    return h(Host, { key: "d7fad8d23dafced6cf713108107c54d02f372b6b" }, this.showArrowPrevious && h("button", { key: "dde7a217502a5a157e32bb34327398dba8968d34", class: "arrow", onClick: () => this.move(this.scrollAmount, true), "aria-label": this.ariaLabelChevronLeftIconButton }, h("ix-icon", { key: "08c3d49892d6955a7877bac4968fac25fe8c9742", name: iconChevronLeftSmall })), h("div", { key: "deb8492643ab4b49cb7848c9229805d26b0a4c99", class: {
       "tab-items": true,
       "overflow-shadow": true,
       "shadow-left": this.showArrowPrevious,
       "shadow-right": this.showArrowNext,
       "shadow-both": this.showArrowNext && this.showArrowPrevious
-    } }, h("div", { key: "b2636001520d9d9c63173f35a45c3f38217f949f", class: "items-content" }, h("slot", { key: "d29d939ea9c1053d79b7670c7c54d9e6ec483dce" }))), this.showArrowNext && h("button", { key: "91b68bb75e979fdab0643a479300371e67a0174f", class: "arrow right", onClick: () => this.move(-this.scrollAmount, true), "aria-label": this.ariaLabelChevronRightIconButton }, h("ix-icon", { key: "735a473ee7bd00e299530b09c166b111cd8f04cd", name: iconChevronRightSmall })));
+    } }, h("div", { key: "8b888d4ac1c0e957155028d8508e0cb5862c5cb4", class: "items-content" }, h("slot", { key: "fd39c749b7aaeaec5c65ee72b0c466dbf7d8fa7b" }))), this.showArrowNext && h("button", { key: "028b079e241b9fc3af1cba531ae2c055f1c47d32", class: "arrow right", onClick: () => this.move(-this.scrollAmount, true), "aria-label": this.ariaLabelChevronRightIconButton }, h("ix-icon", { key: "8047e16eadc4ec22f44d70004fe9a663f74c4e01", name: iconChevronRightSmall })));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-textarea.entry-DzUXk1SK.js → ix-textarea.entry-Dg5UW4Mm.js}

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { H as HookValidationLifecycle } from "./validation-D_dk-JqT-hK2sg2of.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
+import { H as HookValidationLifecycle } from "./validation-LJh16vt2-H75l0y2j.js";
 import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
-import { m as mapValidationResult, T as TextareaElement, o as onInputBlur } from "./input.util-VHrSuCP7-BxHyeFjg.js";
+import { m as mapValidationResult, T as TextareaElement, o as onInputBlur } from "./input.fc-KJF8Z9iJ-BT3ti_h_.js";
 import "./anime.esm-DhE1t8Qh-B6Ygv72Z.js";
 import "./animation-C5MWUgDN-BXCJNYHu.js";
 import "./a11y-Bb7pDeaQ-DNI84lDX.js";
@@ -126,10 +126,10 @@ const Textarea = class {
   }
   render() {
     var _a;
-    return h(Host, { key: "01f3753f8d224c04fcfd170004d1591155bae8fe", class: {
+    return h(Host, { key: "50700f0fe24415eff151875bc3dc2a5d53a8f879", class: {
       disabled: this.disabled,
       readonly: this.readonly
-    } }, h("ix-field-wrapper", { key: "7e69d00bbdef14efac3be23a093602dc2c0dae76", 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.textAreaRef }, !!this.maxLength && this.maxLength > 0 && h("ix-typography", { key: "ebd14c19b62522cfb95ab1aa5177931020e12673", class: "bottom-text", slot: "bottom-right", textColor: "soft" }, ((_a = this.value) !== null && _a !== void 0 ? _a : "").length, "/", this.maxLength), h("div", { key: "26855cb5d7dcd374388e8c6d8ab8102b57414a47", class: "input-wrapper" }, h(TextareaElement, { key: "763de52ae31785cc5fd08b37c6f926528f3e665e", minLength: this.minLength, maxLength: this.maxLength, textareaCols: this.textareaCols, textareaRows: this.textareaRows, textareaHeight: this.isManuallyResized ? this.manualHeight : this.textareaHeight, textareaWidth: this.isManuallyResized ? this.manualWidth : this.textareaWidth, resizeBehavior: this.resizeBehavior, readonly: this.readonly, disabled: this.disabled, isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, textAreaRef: this.textAreaRef, valueChange: (value) => this.valueChange.emit(value), updateFormInternalValue: (value) => this.updateFormInternalValue(value), onBlur: () => {
+    } }, h("ix-field-wrapper", { key: "9a59b1c2632f975c3a754978c616bb80fc419fc3", 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.textAreaRef }, !!this.maxLength && this.maxLength > 0 && h("ix-typography", { key: "931e49d6a0fd853745f3f46b88f25b087b2038af", class: "bottom-text", slot: "bottom-right", textColor: "soft" }, ((_a = this.value) !== null && _a !== void 0 ? _a : "").length, "/", this.maxLength), h("div", { key: "ef476a8a1bb52f9b21d93bd1b4d46b6b91a40872", class: "input-wrapper" }, h(TextareaElement, { key: "b2b7006983d16c7c99f2229097aa3e45ecee5c15", minLength: this.minLength, maxLength: this.maxLength, textareaCols: this.textareaCols, textareaRows: this.textareaRows, textareaHeight: this.isManuallyResized ? this.manualHeight : this.textareaHeight, textareaWidth: this.isManuallyResized ? this.manualWidth : this.textareaWidth, resizeBehavior: this.resizeBehavior, readonly: this.readonly, disabled: this.disabled, isInvalid: this.isInvalid, required: this.required, value: this.value, placeholder: this.placeholder, textAreaRef: this.textAreaRef, valueChange: (value) => this.valueChange.emit(value), updateFormInternalValue: (value) => this.updateFormInternalValue(value), onBlur: () => {
       onInputBlur(this, this.textAreaRef.current);
       this.touched = true;
     } }))));

package/build/static/demo/v2/preview/html/assets/{ix-tile.entry-CbJIKFS-.js → ix-tile.entry-CCa4ifYZ.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
 const tileCss = ":host{min-width:11.937rem;max-width:11.937rem;width:11.937rem;display:flex;flex-direction:column;border:1px solid var(--theme-tile--border);border-radius:var(--theme-tile--border-radius);background-color:var(--theme-color-2);color:var(--theme-color-std-text);box-shadow:var(--theme-tile--box-shadow)}: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 .tile-header{display:flex;align-items:center;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}:host .tile-header,:host .tile-subheader,:host .tile-content,:host .tile-footer{padding:0 1rem}:host .tile-header,:host .tile-content{flex-grow:1}:host .tile-header.has-content{display:flex;height:2.5rem;max-height:2.5rem;padding-inline-end:0.5rem}:host .tile-subheader{color:var(--theme-btn-invisible-secondary--color);flex-grow:0}:host .tile-footer.has-content{border-block-start:1px solid var(--theme-color-1);height:2.5rem}:host(.tile-small){height:2.5rem;min-height:2.5rem;max-height:2.5rem}:host(.tile-medium){height:5rem;min-height:5rem;max-height:5rem}:host(.tile-big){height:10rem;min-height:10rem;max-height:10rem}:host(:active),:host(:focus-visible),:host(:visited){outline:none}";
 const Tile = class {
   constructor(hostRef) {
@@ -14,17 +14,17 @@ const Tile = class {
     this.hasFooterSlot = !!this.hostElement.querySelector('[slot="footer"]');
   }
   render() {
-    return h(Host, { key: "aa9ab71b723ec68685a2d0a37b53d9edcfe82cd6", class: {
+    return h(Host, { key: "f5c50da791dcbdfeb884d33071b6d557360c1a60", class: {
       "tile-small": this.size === "small",
       "tile-medium": this.size === "medium",
       "tile-big": this.size === "big"
-    } }, h("div", { key: "fdbc231e60e607c9a5c60d66138f87d563d3a1d1", class: {
+    } }, h("div", { key: "651e393dbd8f7f7cd55373c3bdadc195dfc88cbd", class: {
       "tile-header": true,
       "has-content": this.hasHeaderSlot
-    } }, h("slot", { key: "f881aa65ee46aa1f8ea7991d94e934fed4fe5e6a", name: "header", onSlotchange: () => this.handleHeaderSlotChange() })), h("div", { key: "3a7603fe58fd66c7309a9ec743839f6df1db88d3", class: "tile-subheader" }, h("slot", { key: "846def8a0c20dba9c4d929a10ffad9ad2da73128", name: "subheader" })), h("div", { key: "1a1c7830c296988a0928d76b2af53c14d999e2ac", class: "tile-content" }, h("slot", { key: "5450f27247704ac16db78f1c6507ea9319c367c4" })), h("div", { key: "0464f19054f1c1e15c06fdab283d72f17ab0b9cd", class: {
+    } }, h("slot", { key: "1b94a241077664e5bcb535321f816b3b3faa9fad", name: "header", onSlotchange: () => this.handleHeaderSlotChange() })), h("div", { key: "d2ce3123c9ffa767e07edf25248567ee9406fc95", class: "tile-subheader" }, h("slot", { key: "025ac544a3750fbfb145d1350e7091e969c2e369", name: "subheader" })), h("div", { key: "6ce8df1e1b426df28b42f490db11dc1d951715e6", class: "tile-content" }, h("slot", { key: "7bb66b49df63f613c3b7be8ff0da64bc16dde6b9" })), h("div", { key: "55f6e978190c3c8581310559a7a46ec6c4cc0e2f", class: {
       "tile-footer": true,
       "has-content": this.hasFooterSlot
-    } }, h("slot", { key: "ce04db8085fda4bb5faaa170895cad9c8f850555", name: "footer", onSlotchange: () => this.handleFooterSlotChange() })));
+    } }, h("slot", { key: "d63334865e6a32a6bb082939b44f3bf0b041b93a", name: "footer", onSlotchange: () => this.handleFooterSlotChange() })));
   }
   get hostElement() {
     return getElement(this);

package/build/static/demo/v2/preview/html/assets/{ix-time-input.entry-DIzwZtVJ.js → ix-time-input.entry-1YU2IC8Q.js}

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { J as iconClock } from "./index-Cz75KU1f-BUHLjWzB.js";
-import { D as DateTime } from "./datetime-bDicGJUN-EWahaxaU.js";
-import { a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, S as SlotEnd, c as SlotStart } from "./input.util-VHrSuCP7-BxHyeFjg.js";
-import { c as createClassMutationObserver, H as HookValidationLifecycle } from "./validation-D_dk-JqT-hK2sg2of.js";
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
+import { J as iconClock } from "./index-8HpPmDK_-DinFJk0z.js";
+import { D as DateTime } from "./datetime-bDicGJUN-Rk09H-45.js";
+import { h as handleSubmitOnEnterKeydown, a as addDisposableChangesAndVisibilityObservers, b as adjustPaddingForStartAndEnd, S as SlotEnd, c as SlotStart } from "./input.fc-KJF8Z9iJ-BT3ti_h_.js";
+import { c as createClassMutationObserver, g as getValidationText, H as HookValidationLifecycle } from "./validation-LJh16vt2-H75l0y2j.js";
 import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
 import { h as handleIconClick, o as openDropdown, c as closeDropdown, a as createValidityState } from "./picker-input.util-D1uMJUKN-o8S09pI3.js";
 import "./anime.esm-DhE1t8Qh-B6Ygv72Z.js";
@@ -50,7 +50,9 @@ const TimeInput = class {
     this.i18nMinuteColumnHeader = "min";
     this.i18nSecondColumnHeader = "sec";
     this.i18nMillisecondColumnHeader = "ms";
+    this.suppressSubmitOnEnter = false;
     this.hideHeader = false;
+    this.textAlignment = "start";
     this.show = false;
     this.time = null;
     this.isInputInvalid = false;
@@ -69,6 +71,9 @@ const TimeInput = class {
   watchValuePropHandler(newValue) {
     this.onInput(newValue);
   }
+  handleInputKeyDown(event) {
+    handleSubmitOnEnterKeydown(event, this.suppressSubmitOnEnter, this.formInternals.form);
+  }
   updateFormInternalValue(value) {
     this.formInternals.setFormValue(value);
     this.value = value;
@@ -149,6 +154,8 @@ const TimeInput = class {
   renderInput() {
     return h("div", { class: "input-wrapper" }, h(SlotStart, { slotStartRef: this.slotStartRef, onSlotChange: () => this.updatePaddings() }), h("input", { autoComplete: "off", class: {
       "is-invalid": this.isInputInvalid
+    }, style: {
+      textAlign: this.textAlignment
     }, disabled: this.disabled, readOnly: this.readonly, required: this.required, ref: this.inputElementRef, type: "text", value: this.value, placeholder: this.placeholder, name: this.name, onInput: (event) => {
       const target = event.target;
       this.onInput(target.value);
@@ -163,7 +170,7 @@ const TimeInput = class {
     }, onBlur: () => {
       this.ixBlur.emit();
       this.touched = true;
-    } }), h(SlotEnd, { slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("ix-icon-button", { "data-testid": "open-time-picker", class: { "time-icon-hidden": this.disabled || this.readonly }, variant: "subtle-tertiary", icon: iconClock, onClick: (event) => this.onTimeIconClick(event), "aria-label": "Toggle time picker", "aria-expanded": this.show })));
+    }, onKeyDown: (event) => this.handleInputKeyDown(event) }), h(SlotEnd, { slotEndRef: this.slotEndRef, onSlotChange: () => this.updatePaddings() }, h("ix-icon-button", { "data-testid": "open-time-picker", class: { "time-icon-hidden": this.disabled || this.readonly }, variant: "subtle-tertiary", icon: iconClock, onClick: (event) => this.onTimeIconClick(event), "aria-label": "Toggle time picker", "aria-expanded": this.show })));
   }
   hookValidationLifecycle({ isInfo, isInvalid, isInvalidByRequired, isValid, isWarning }) {
     this.isInvalid = isInvalid || isInvalidByRequired || this.isInputInvalid;
@@ -203,13 +210,13 @@ const TimeInput = class {
   }
   render() {
     var _a;
-    const invalidText = this.isInputInvalid ? this.i18nErrorTimeUnparsable : this.invalidText;
-    return h(Host, { key: "09ce97a9605c6b22a872712c038a2628e5b0b81a", class: {
+    const invalidText = getValidationText(this.isInputInvalid, this.invalidText, this.i18nErrorTimeUnparsable);
+    return h(Host, { key: "aff9b793fae69ba2eb713ae3b1bd2222b548fb25", class: {
       disabled: this.disabled,
       readonly: this.readonly
-    } }, h("ix-field-wrapper", { key: "7885db329aa8632cfaeb55d427ba4d142a8b6ec6", label: this.label, helperText: this.helperText, isInvalid: this.isInvalid, invalidText, infoText: this.infoText, isInfo: this.isInfo, isWarning: this.isWarning, warningText: this.warningText, isValid: this.isValid, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, required: this.required, controlRef: this.inputElementRef }, this.renderInput()), h("ix-dropdown", { key: "e1e55b1d1b48ba6b90e9181814c7d01e1fcd8bae", "data-testid": "time-dropdown", trigger: this.inputElementRef.waitForCurrent(), ref: this.dropdownElementRef, closeBehavior: "outside", suppressOverflowBehavior: true, show: this.show, onShowChanged: (event) => {
+    } }, h("ix-field-wrapper", { key: "5e927fa4c2eeb94dba26b1f4ad1879a6a80ed823", label: this.label, helperText: this.helperText, isInvalid: this.isInvalid, invalidText, infoText: this.infoText, isInfo: this.isInfo, isWarning: this.isWarning, warningText: this.warningText, isValid: this.isValid, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, required: this.required, controlRef: this.inputElementRef }, this.renderInput()), h("ix-dropdown", { key: "0b48b3c8574b0aafe42db74c990f1d269037bd82", "data-testid": "time-dropdown", trigger: this.inputElementRef.waitForCurrent(), ref: this.dropdownElementRef, closeBehavior: "outside", suppressOverflowBehavior: true, show: this.show, onShowChanged: (event) => {
       this.show = event.detail;
-    } }, h("ix-time-picker", { key: "7c3b0350de27af8fe8633478ce1100fd62f75976", ref: this.timePickerRef, format: this.format, time: (_a = this.time) !== null && _a !== void 0 ? _a : "", hourInterval: this.hourInterval, minuteInterval: this.minuteInterval, secondInterval: this.secondInterval, millisecondInterval: this.millisecondInterval, embedded: true, hideHeader: this.hideHeader, i18nConfirmTime: this.i18nSelectTime, i18nHeader: this.i18nTime, i18nHourColumnHeader: this.i18nHourColumnHeader, i18nSecondColumnHeader: this.i18nSecondColumnHeader, i18nMinuteColumnHeader: this.i18nMinuteColumnHeader, i18nMillisecondColumnHeader: this.i18nMillisecondColumnHeader, onTimeSelect: (event) => {
+    } }, h("ix-time-picker", { key: "b3b5536c702fc45c9fc5f323282149c2c2ccb542", ref: this.timePickerRef, format: this.format, time: (_a = this.time) !== null && _a !== void 0 ? _a : "", hourInterval: this.hourInterval, minuteInterval: this.minuteInterval, secondInterval: this.secondInterval, millisecondInterval: this.millisecondInterval, embedded: true, hideHeader: this.hideHeader, i18nConfirmTime: this.i18nSelectTime, i18nHeader: this.i18nTime, i18nHourColumnHeader: this.i18nHourColumnHeader, i18nSecondColumnHeader: this.i18nSecondColumnHeader, i18nMinuteColumnHeader: this.i18nMinuteColumnHeader, i18nMillisecondColumnHeader: this.i18nMillisecondColumnHeader, onTimeSelect: (event) => {
       this.onInput(event.detail);
       this.show = false;
     } })));

package/build/static/demo/v2/preview/html/assets/{ix-time-picker.entry-B5ZZs1cT.js → ix-time-picker.entry-a8SE1VcZ.js}

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-C8r7td8X.js";
-import { D as DateTime } from "./datetime-bDicGJUN-EWahaxaU.js";
-import { O as OnListener } from "./listener-DAJkOQte-D1cCX7ze.js";
-const timePickerCss = '.ix-form-control,.ix-form-control-plaintext{color:var(--theme-input--color);border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem;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;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ix-form-control::-moz-placeholder,.ix-form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.ix-form-control::placeholder,.ix-form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:focus-visible{color:var(--theme-input--color)}.ix-form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.ix-form-control[type=number]{text-align:right}.ix-form-control.readonly,.ix-form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.ix-form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only,.ix-form-control[readonly],.ix-form-control[readOnly],.ix-form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only::-moz-placeholder,.ix-form-control[readonly]::-moz-placeholder,.ix-form-control[readOnly]::-moz-placeholder,.ix-form-control.readonly::-moz-placeholder{color:transparent}.ix-form-control:-moz-read-only::placeholder{color:transparent}.ix-form-control:read-only::placeholder,.ix-form-control[readonly]::placeholder,.ix-form-control[readOnly]::placeholder,.ix-form-control.readonly::placeholder{color:transparent}.ix-form-control:disabled,.ix-form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.ix-form-control:disabled::-moz-placeholder,.ix-form-control.disabled::-moz-placeholder{color:transparent}.ix-form-control:disabled::placeholder,.ix-form-control.disabled::placeholder{color:transparent}.ix-form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.ix-form-control{padding:0 0.312rem}textarea.ix-form-control{padding:0.375rem 0.5rem}input.ix-form-control.disabled,input.ix-form-control:disabled{color:var(--theme-input--color--disabled)}input.ix-form-control:-moz-read-only{cursor:default}input.ix-form-control:read-only,input.ix-form-control.readonly{cursor:default}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:block;position:relative;width:-moz-fit-content;width:fit-content}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}: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 .standaloneAppearance{box-shadow:none}:host .hidden{display:none}:host .header{display:flex;align-items:center;justify-content:center;height:2.5rem}:host .clock{display:flex;justify-content:center;align-items:start}:host .clock .flex{display:flex;height:100%;align-items:start}:host .clock .flex .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around;margin-top:1px}:host .clock .flex .columns .column-header{height:2.5rem;width:2.5rem;line-height:2.5rem;text-align:center;color:var(--theme-color-soft-text);text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host .clock .flex .column-seperator{display:flex;align-items:center;margin:0 0.125rem;min-height:100%;margin-top:3.25rem}:host .clock .element-list{list-style-type:none;overflow:auto;max-height:15.375rem;padding-top:0.125rem}:host .clock .element-list button{all:unset}:host .clock .element-list .element-container{width:2.375rem;height:2.375rem;margin:0.125rem;display:flex;justify-content:center;align-items:center;cursor:pointer;color:var(--theme-color-primary)}:host .clock .element-list .element-container:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .clock .element-list .element-container:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:1px}:host .clock .element-list .selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected)}:host .clock .element-list .selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .clock .element-list .element-list-padding{width:2.5rem;height:12.563rem;min-height:12.563rem}:host .clock div.element-list{scrollbar-width:none;-ms-overflow-style:none}:host .clock div.element-list::-webkit-scrollbar{display:none}:host .footer{display:flex;justify-content:space-between;gap:0.5rem;flex-wrap:wrap}:host .footer .confirm-button{margin-left:auto}:host .footer--compact{flex-direction:column;align-items:center}:host .footer--compact .confirm-button{margin-left:initial}:host .footer .time-ref-buttons--datetime-picker-appearance{margin-left:auto}:host .footer .time-ref-buttons button{all:unset;width:2.625rem;height:1.875rem;text-align:center;border:1px solid var(--theme-color-primary);color:var(--theme-color-primary);background-color:var(--theme-color-secondary);font-weight:700}:host .footer .time-ref-buttons button:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .footer .time-ref-buttons button:hover{cursor:pointer;background-color:var(--theme-color-secondary-hover);border-color:var(--theme-btn-primary--background--hover)}:host .footer .time-ref-buttons button.selected{color:var(--theme-color-secondary);background-color:var(--theme-btn-primary--background)}:host .footer .time-ref-buttons button.selected:hover{background-color:var(--theme-btn-primary--background--hover);border-color:var(--theme-btn-primary--background--hover)}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}:host .hidden{display:none}:host .time-reference{margin-top:0.5rem;margin-bottom:0.5rem}';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from "./global-ZjnNkmge.js";
+import { D as DateTime } from "./datetime-bDicGJUN-Rk09H-45.js";
+import { O as OnListener } from "./listener-DAJkOQte-RbAHKfrD.js";
+const timePickerCss = '.ix-form-control,.ix-form-control-plaintext{color:var(--theme-input--color);border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem;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;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ix-form-control::-moz-placeholder,.ix-form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.ix-form-control::placeholder,.ix-form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled).hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.ix-form-control:focus-visible{color:var(--theme-input--color)}.ix-form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.ix-form-control[type=number]{text-align:right}.ix-form-control.readonly,.ix-form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.ix-form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only,.ix-form-control[readonly],.ix-form-control[readOnly],.ix-form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.ix-form-control:read-only::-moz-placeholder,.ix-form-control[readonly]::-moz-placeholder,.ix-form-control[readOnly]::-moz-placeholder,.ix-form-control.readonly::-moz-placeholder{color:transparent}.ix-form-control:-moz-read-only::placeholder{color:transparent}.ix-form-control:read-only::placeholder,.ix-form-control[readonly]::placeholder,.ix-form-control[readOnly]::placeholder,.ix-form-control.readonly::placeholder{color:transparent}.ix-form-control:disabled,.ix-form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.ix-form-control:disabled::-moz-placeholder,.ix-form-control.disabled::-moz-placeholder{color:transparent}.ix-form-control:disabled::placeholder,.ix-form-control.disabled::placeholder{color:transparent}.ix-form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.ix-form-control{padding:0 0.312rem}textarea.ix-form-control{padding:0.375rem 0.5rem}input.ix-form-control.disabled,input.ix-form-control:disabled{color:var(--theme-input--color--disabled)}input.ix-form-control:-moz-read-only{cursor:default}input.ix-form-control:read-only,input.ix-form-control.readonly{cursor:default}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:block;position:relative;width:-moz-fit-content;width:fit-content}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}: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 .standaloneAppearance{box-shadow:none}:host .hidden{display:none}:host .header{display:flex;align-items:center;justify-content:center;height:2rem}:host .clock{display:flex;justify-content:center;align-items:start}:host .clock .flex{display:flex;height:100%;align-items:start}:host .clock .flex .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around}:host .clock .flex .columns .column-header{height:2.5rem;width:2.5rem;line-height:2.5rem;text-align:center;color:var(--theme-color-soft-text);text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host .clock .flex .column-separator{display:flex;align-items:center;justify-content:center;min-height:100%;margin-top:3rem;width:0.5rem}:host .clock .element-list{list-style-type:none;overflow:auto;padding:0.0625rem;margin:-0.0625rem;max-height:15.75rem}:host .clock .element-list button{all:unset}:host .clock .element-list .element-container{box-sizing:border-box;width:2.5rem;height:2.5rem;margin-bottom:0.125rem;display:flex;justify-content:center;align-items:center;cursor:pointer;color:var(--theme-color-primary)}:host .clock .element-list .element-container:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .clock .element-list .element-container:focus-visible{box-shadow:0 0 0 1px var(--theme-color-focus-bdr)}:host .clock .element-list .selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);font-weight:var(--theme-font-weight-bold)}:host .clock .element-list .selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .clock .element-list .selected:focus-visible{border:0.0625rem solid var(--theme-color-inv-contrast-text)}:host .clock .element-list .element-list-padding{width:2.5rem;height:13.125rem;min-height:13.125rem}:host .clock div.element-list{scrollbar-width:none;-ms-overflow-style:none}:host .clock div.element-list::-webkit-scrollbar{display:none}:host .footer{display:flex;justify-content:space-between;gap:0.5rem;flex-wrap:wrap}:host .footer .confirm-button{margin-left:auto}:host .footer--compact{flex-direction:column;align-items:center}:host .footer--compact .confirm-button{margin-left:initial}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}';
 var __decorate = function(decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
   if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
@@ -48,7 +48,6 @@ const TimePicker = class {
     this.minuteInterval = MINUTE_INTERVAL_DEFAULT;
     this.secondInterval = SECOND_INTERVAL_DEFAULT;
     this.millisecondInterval = MILLISECOND_INTERVAL_DEFAULT;
-    this.time = DateTime.now().toFormat(this.format);
     this.i18nConfirmTime = CONFIRM_BUTTON_DEFAULT;
     this.i18nHeader = HEADER_DEFAULT;
     this.i18nHourColumnHeader = "hr";
@@ -111,6 +110,13 @@ const TimePicker = class {
     }
     this._time = timeFormat;
   }
+  /**
+   * Get default time value
+   * @returns DateTime.now() for empty state (no selection)
+   */
+  getDefaultTime() {
+    return DateTime.now();
+  }
   /**
    * Get the current time based on the wanted format
    */
@@ -128,11 +134,17 @@ const TimePicker = class {
     this.initPicker();
   }
   initPicker() {
-    this._time = DateTime.fromFormat(this.time, this.format);
-    if (!this._time.isValid) {
-      console.error(`Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`);
-      this._time = DateTime.now();
+    let parsedTime;
+    if (this.time) {
+      parsedTime = DateTime.fromFormat(this.time, this.format);
+      if (!parsedTime.isValid) {
+        console.error(`Invalid time format. The configured format does not match the format of the passed time. ${parsedTime.invalidReason}: ${parsedTime.invalidExplanation}`);
+        parsedTime = this.getDefaultTime();
+      }
+    } else {
+      parsedTime = this.getDefaultTime();
     }
+    this._time = parsedTime;
     this.setTimeRef();
     this.setTimePickerDescriptors();
     this.setInitialFocusedValueAndUnit();
@@ -152,14 +164,7 @@ const TimePicker = class {
       if (elementContainer) {
         elementContainer.focus({ preventScroll: true });
         if (!this.isElementVisible(elementContainer, elementList)) {
-          elementContainer.scrollIntoView({
-            block: this.focusScrollAlignment
-          });
-          if (this.focusScrollAlignment === "end") {
-            elementList.scrollTop += 4;
-          } else {
-            elementList.scrollTop -= 4;
-          }
+          this.scrollElementIntoView(elementContainer, elementList, this.focusScrollAlignment);
         }
       }
     }
@@ -218,11 +223,18 @@ const TimePicker = class {
       event.preventDefault();
     }
   }
-  onUnitCellBlur(unit) {
+  onUnitCellBlur(unit, event) {
+    var _a;
+    const relatedTarget = event.relatedTarget;
+    if (relatedTarget) {
+      const relatedUnit = (_a = relatedTarget.dataset.elementContainerId) === null || _a === void 0 ? void 0 : _a.split("-")[0];
+      if (relatedUnit !== unit) {
+        this.elementListScrollToTop(unit, Number(this.formattedTime[unit]), "smooth");
+      }
+    }
     this.isUnitFocused = false;
     const focusedValue = Number(this.formattedTime[unit]);
     this.updateDescriptorFocusedValue(unit, focusedValue);
-    this.elementListScrollToTop(unit, focusedValue, "smooth");
   }
   onUnitCellFocus(unit, value) {
     this.isUnitFocused = true;
@@ -243,6 +255,16 @@ const TimePicker = class {
     const containerRect = container.getBoundingClientRect();
     return elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;
   }
+  scrollElementIntoView(element, container, alignment) {
+    const SCROLL_BUFFER = 1;
+    const containerRect = container.getBoundingClientRect();
+    const elementRect = element.getBoundingClientRect();
+    if (alignment === "end") {
+      container.scrollTop += elementRect.bottom - containerRect.bottom + SCROLL_BUFFER;
+    } else {
+      container.scrollTop += elementRect.top - containerRect.top - SCROLL_BUFFER;
+    }
+  }
   updateFocusedValue(value) {
     const numberArray = this.getNumberArrayForUnit(this.focusedUnit);
     const maxValue = numberArray[numberArray.length - 1];
@@ -287,10 +309,12 @@ const TimePicker = class {
       }
       const dropdown = mutation.target;
       if (!dropdown.classList.contains("show")) {
-        const timeFormat = DateTime.fromFormat(this.time, this.format);
-        if (timeFormat.isValid) {
-          this._time = DateTime.fromFormat(this.time, this.format);
-          this.setInitialFocusedValueAndUnit();
+        if (this.time) {
+          const timeFormat = DateTime.fromFormat(this.time, this.format);
+          if (timeFormat.isValid) {
+            this._time = DateTime.fromFormat(this.time, this.format);
+            this.setInitialFocusedValueAndUnit();
+          }
         }
         continue;
       }
@@ -321,7 +345,6 @@ const TimePicker = class {
     };
   }
   timeUpdate(unit, value) {
-    var _a;
     let maxValue = DateTime.now().endOf("day").get(unit);
     if (unit === "hour") {
       if (this.timeRef === "PM") {
@@ -336,18 +359,21 @@ const TimePicker = class {
     } else if (value < 0) {
       value = 0;
     }
-    this._time = (_a = this._time) === null || _a === void 0 ? void 0 : _a.set({
+    if (!this._time) {
+      this._time = DateTime.now().startOf("day");
+    }
+    this._time = this._time.set({
       [unit]: value
     });
     return value;
   }
   changeTimeReference(newTimeRef) {
-    if (!this._time) {
-      return;
-    }
     if (this.timeRef === newTimeRef) {
       return;
     }
+    if (!this._time) {
+      this._time = DateTime.now().startOf("day");
+    }
     this.timeRef = newTimeRef;
     const currentHour = this._time.hour;
     if (newTimeRef === "PM" && currentHour < 12) {
@@ -435,6 +461,9 @@ const TimePicker = class {
     return this.formattedTime[unit] === String(number);
   }
   select(unit, number) {
+    if (this.isSelected(unit, number)) {
+      return;
+    }
     this.formattedTime = Object.assign(Object.assign({}, this.formattedTime), { [unit]: String(number) });
     this.timeUpdate(unit, number);
     this.elementListScrollToTop(unit, number, "smooth");
@@ -456,11 +485,11 @@ const TimePicker = class {
     if (elementList && elementContainer) {
       const elementListHeight = elementList.clientHeight;
       const elementContainerHeight = elementContainer.clientHeight;
-      let scrollPositionOffset = 15;
+      let scrollPositionOffset = 11;
       if (this.hideHeader) {
-        scrollPositionOffset -= 74;
+        scrollPositionOffset -= 57;
       }
-      const scrollPosition = elementContainer.offsetTop - elementListHeight / 2 + elementContainerHeight / 2 - scrollPositionOffset;
+      const scrollPosition = elementContainer.offsetTop - elementListHeight / 2 + elementContainerHeight - scrollPositionOffset;
       elementList.scrollTo({
         top: scrollPosition,
         behavior: scrollBehaviour
@@ -500,19 +529,26 @@ const TimePicker = class {
     return "-1";
   }
   render() {
-    return h(Host, { key: "fe021682c409d261844a66afc06f7fd821d98311" }, h("ix-date-time-card", { key: "29d86af50dfbe071b9ba542d715a0d310b5acdd8", embedded: this.embedded, timePickerAppearance: true, corners: this.corners, hasFooter: true, hideHeader: this.hideHeader }, h("div", { key: "a0189088fa1b26c1deadd04a571391eade2f4a82", class: "header", slot: "header" }, h("ix-typography", { key: "168ab5345ae2afa0b084c8acd1e6e533db5ae398", format: "h5" }, this.i18nHeader)), h("div", { key: "5fca2d1fb2059d72269e44f231faa0d0e0fc9889", class: "clock" }, this.timePickerDescriptors.map((descriptor, index) => h("div", { class: "flex" }, h("div", { class: { columns: true, hidden: descriptor.hidden } }, h("div", { class: "column-header", title: descriptor.header }, descriptor.header), h("div", { "data-element-list-id": descriptor.unit, class: "element-list", tabIndex: -1 }, descriptor.numberArray.map((number) => h("button", { "data-element-container-id": `${descriptor.unit}-${number}`, class: {
-      selected: this.isSelected(descriptor.unit, number),
-      "element-container": true
-    }, onClick: () => this.select(descriptor.unit, number), onFocus: () => this.onUnitCellFocus(descriptor.unit, number), onBlur: () => this.onUnitCellBlur(descriptor.unit), tabindex: this.getElementContainerTabIndex(number, descriptor.unit), role: "button", "aria-label": `${descriptor.header}: ${number}` }, this.formatUnitValue(descriptor.unit, number))), h("div", { class: "element-list-padding" }))), index !== this.timePickerDescriptors.length - 1 && h("div", { class: {
-      "column-seperator": true,
+    return h(Host, { key: "da95d86956db27851713b28d3727ee9d8e33f785" }, h("ix-date-time-card", { key: "5a8a88d641f859eaa2c1e1e2f7b699abd56f7f74", embedded: this.embedded, timePickerAppearance: true, corners: this.corners, hasFooter: !this.dateTimePickerAppearance, hideHeader: this.hideHeader }, h("div", { key: "85639253213bee998504da73ea4de0421cf146c3", class: "header", slot: "header" }, h("ix-typography", { key: "0a21cf47dd51eaf17c44271dbe4d63d909523055", format: "body" }, this.i18nHeader)), h("div", { key: "9d716194b4a37662e298e8d59c54142e78b9a6a0", class: "clock" }, this.timePickerDescriptors.map((descriptor, index) => h("div", { class: "flex" }, h("div", { class: { columns: true, hidden: descriptor.hidden } }, h("div", { class: "column-header", title: descriptor.header }, descriptor.header), h("div", { "data-element-list-id": descriptor.unit, class: "element-list", tabIndex: -1 }, descriptor.numberArray.map((number) => {
+      return h("button", { "data-element-container-id": `${descriptor.unit}-${number}`, class: {
+        selected: this.isSelected(descriptor.unit, number),
+        "element-container": true
+      }, onClick: () => {
+        this.select(descriptor.unit, number);
+      }, onFocus: () => this.onUnitCellFocus(descriptor.unit, number), onBlur: (e) => this.onUnitCellBlur(descriptor.unit, e), tabindex: this.getElementContainerTabIndex(number, descriptor.unit), "aria-label": `${descriptor.header}: ${number}` }, this.formatUnitValue(descriptor.unit, number));
+    }), h("div", { class: "element-list-padding" }))), index !== this.timePickerDescriptors.length - 1 && h("div", { class: {
+      "column-separator": true,
       hidden: descriptor.hidden
-    } }, this.getColumnSeparator(index))))), h("div", { key: "94fff2af6e3e86a2bebdee7e17a3ae46503c8a03", class: {
+    } }, this.getColumnSeparator(index)))), this.timeRef && h("div", { key: "b177d5ea743648618ab6b877f60a37b46d8a5fa5", class: "flex" }, h("div", { key: "a714f52d250386088368bdfe5c28ad45a1fe2dd0", class: "column-separator" }), h("div", { key: "c7730b336e486ec34fd23e293b8e70e309d153fe", class: "columns" }, h("div", { key: "56677d7c350e235777e5d06afd61b925934923d6", class: "column-header", title: "AM/PM" }), h("div", { key: "764fd7297bdafaa69d24c9a2655c9d4fa7a73966", class: "element-list", tabIndex: -1 }, h("button", { key: "6b7ddefac72c7d4a778e8de6c42fd593003f5e5f", "data-am-pm-id": "AM", class: {
+      selected: this.timeRef === "AM",
+      "element-container": true
+    }, onClick: () => this.changeTimeReference("AM"), tabindex: "0", "aria-label": "AM" }, "AM"), h("button", { key: "75cccf55946da3b04faac2da0bd3c989b8f633a3", "data-am-pm-id": "PM", class: {
+      selected: this.timeRef === "PM",
+      "element-container": true
+    }, onClick: () => this.changeTimeReference("PM"), tabindex: "0", "aria-label": "PM" }, "PM"))))), h("div", { key: "e033175f6d142fd73661703c89c975874bc9d6be", class: {
       footer: true,
       "footer--compact": this.timePickerDescriptors.length <= 2
-    }, slot: "footer" }, this.timeRef && h("div", { key: "a9248cc2ac1c71c8886bfc177eb9c013db8a7a69", class: {
-      "time-ref-buttons": true,
-      "time-ref-buttons--datetime-picker-appearance": this.dateTimePickerAppearance
-    } }, h("button", { key: "506e0e1b8d1ebbb59f53944596e38bbde2f1c0bb", "data-am-pm-id": "AM", class: { selected: this.timeRef === "AM" }, onClick: () => this.changeTimeReference("AM") }, "AM"), h("button", { key: "b94ff617ed3e1a539ae3991fbf9e1b69dfb3f2f3", "data-am-pm-id": "PM", class: { selected: this.timeRef === "PM" }, onClick: () => this.changeTimeReference("PM") }, "PM")), !this.dateTimePickerAppearance && h("ix-button", { key: "3f49ec5488f6bc4914956fa88e793f6029f0f0e5", class: "confirm-button", onClick: () => {
+    }, slot: "footer" }, h("ix-button", { key: "795d890b983737fd09cc7471c428266945062262", class: "confirm-button", onClick: () => {
       var _a;
       this.timeSelect.emit((_a = this._time) === null || _a === void 0 ? void 0 : _a.toFormat(this.format));
     } }, this.i18nConfirmTime))));

package/build/static/demo/v2/preview/html/assets/{ix-toast-container.entry-C0Ykg12Z.js → ix-toast-container.entry-DwoN6g90.js}

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from "./global-C8r7td8X.js";
+import { r as registerInstance, h, H as Host } from "./global-ZjnNkmge.js";
 import { T as TypedEvent } from "./typed-event-BdCnOrqW-CWsLM0S_.js";
 const toastContainerCss = ":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}#toast-container>:not(:last-child){margin-block-end:1rem}.toast-container{display:block;position:fixed;z-index:var(--theme-z-index-toast)}.toast-container--top-right{right:1rem;top:2rem}.toast-container--bottom-right{right:1rem;bottom:2rem}";
 const ToastContainer = class {
@@ -89,10 +89,10 @@ const ToastContainer = class {
     };
   }
   render() {
-    return h(Host, { key: "8ac8e6eb7cfc7110a4b2b44a835b6727e32c8db6", class: {
+    return h(Host, { key: "ff09f24de84ceb7710a228f28dd82f1ca17ce83a", class: {
       "toast-container--bottom-right": this.position === "bottom-right",
       "toast-container--top-right": this.position === "top-right"
-    } }, h("slot", { key: "1c158e22d6adef730c3642a6769e454b6b5e3c03" }));
+    } }, h("slot", { key: "bfe056dedfac7cdc249034e746fc4f63caded036" }));
   }
   static get watchers() {
     return {