@siemens/ix 0.0.0-pr-1974-20250627114851 → 0.0.0-pr-1974-20250627142646

package/components/p-CvvOe8xV.js

@@ -0,0 +1,151 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-BuJ6BWIi.js';
+import { B as BaseButton } from './p-9dLpp1OQ.js';
+import { d as defineCustomElement$1 } from './p-BygLxZIM.js';
+
+const buttonCss = ":host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-danger,:host .btn-danger.focus,:host .btn-danger:focus-visible{background-color:var(--theme-btn-danger--background);color:var(--theme-btn-danger--color);--ix-button-color:var(--theme-btn-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-danger--border-color);border-style:solid}:host .btn-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):hover,:host .btn-danger.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):active,:host .btn-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):hover,:host .btn-danger:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-danger--border-color--hover);background-color:var(--theme-btn-danger--background--hover);color:var(--theme-btn-danger--color--hover)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):active,:host .btn-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-danger--border-color--active);background-color:var(--theme-btn-danger--background--active);color:var(--theme-btn-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-danger.disabled,:host(.disabled) .btn-danger:disabled{pointer-events:none;border-color:var(--theme-btn-danger--border-color--disabled);background-color:var(--theme-btn-danger--background--disabled);color:var(--theme-btn-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-danger--color--disabled)}:host .btn-outline-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-danger,:host .btn-outline-danger.focus,:host .btn-outline-danger:focus-visible{background-color:var(--theme-btn-outline-danger--background);color:var(--theme-btn-outline-danger--color);--ix-button-color:var(--theme-btn-outline-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-danger--border-color);border-style:solid}:host .btn-outline-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):hover,:host .btn-outline-danger.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):active,:host .btn-outline-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):hover,:host .btn-outline-danger:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-outline-danger--border-color--hover);background-color:var(--theme-btn-outline-danger--background--hover);color:var(--theme-btn-outline-danger--color--hover)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):active,:host .btn-outline-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-danger--border-color--active);background-color:var(--theme-btn-outline-danger--background--active);color:var(--theme-btn-outline-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-danger.disabled,:host(.disabled) .btn-outline-danger:disabled{pointer-events:none;border-color:var(--theme-btn-outline-danger--border-color--disabled);background-color:var(--theme-btn-outline-danger--background--disabled);color:var(--theme-btn-outline-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-danger--color--disabled)}:host .btn-invisible-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-danger,:host .btn-invisible-danger.focus,:host .btn-invisible-danger:focus-visible{background-color:var(--theme-btn-invisible-danger--background);color:var(--theme-btn-invisible-danger--color);--ix-button-color:var(--theme-btn-invisible-danger--color);border-color:transparent}:host .btn-invisible-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):hover,:host .btn-invisible-danger.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):hover,:host .btn-invisible-danger:not(.disabled):not(:disabled).hover{background-color:var(--theme-btn-invisible-danger--background--hover);color:var(--theme-btn-invisible-danger--color--hover)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):active,:host .btn-invisible-danger:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-danger--background--active);color:var(--theme-btn-invisible-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-danger.disabled,:host(.disabled) .btn-invisible-danger:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-danger--background--disabled);color:var(--theme-btn-invisible-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-danger--color--disabled)}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover,:host .btn-primary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover,:host .btn-primary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover,:host .btn-outline-primary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover,:host .btn-invisible-primary:not(.disabled):not(:disabled).hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover,:host .btn-secondary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover,:host .btn-secondary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover,:host .btn-outline-secondary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover,:host .btn-invisible-secondary:not(.disabled):not(:disabled).hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{min-width:5rem}";
+
+const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        /**
+         * Button variant
+         */
+        this.variant = 'primary';
+        /**
+         * Outline button
+         */
+        this.outline = false;
+        /**
+         * Button with no background or outline
+         */
+        this.ghost = false;
+        /**
+         * Disable the button
+         */
+        this.disabled = false;
+        /**
+         * Type of the button
+         */
+        this.type = 'button';
+        /**
+         * Loading button
+         */
+        this.loading = false;
+        /** @internal */
+        this.alignment = 'center';
+        /** @internal */
+        this.iconSize = '24';
+    }
+    handleClick(event) {
+        if (this.disabled || this.loading) {
+            event.stopPropagation();
+            event.preventDefault();
+        }
+    }
+    componentDidLoad() {
+        if (this.type !== 'submit') {
+            return;
+        }
+        const submitButton = document.createElement('button');
+        submitButton.style.display = 'none';
+        submitButton.type = 'submit';
+        submitButton.tabIndex = -1;
+        if (this.form) {
+            submitButton.setAttribute('form', this.form);
+        }
+        this.hostElement.appendChild(submitButton);
+        this.submitButtonElement = submitButton;
+    }
+    handleFormChange(newValue) {
+        if (this.submitButtonElement) {
+            if (newValue) {
+                this.submitButtonElement.setAttribute('form', newValue);
+            }
+            else {
+                this.submitButtonElement.removeAttribute('form');
+            }
+        }
+    }
+    componentDidRender() {
+        if (this.submitButtonElement &&
+            !this.hostElement.contains(this.submitButtonElement)) {
+            this.hostElement.appendChild(this.submitButtonElement);
+        }
+    }
+    dispatchFormEvents() {
+        if (this.type === 'submit' &&
+            this.submitButtonElement &&
+            !this.disabled &&
+            !this.loading) {
+            this.submitButtonElement.click();
+        }
+    }
+    setFocus() {
+        var _a;
+        (_a = this.hostElement.shadowRoot.querySelector('button')) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+    render() {
+        const baseButtonProps = {
+            variant: this.variant,
+            outline: this.outline,
+            ghost: this.ghost,
+            iconOnly: false,
+            iconOval: false,
+            selected: false,
+            disabled: this.disabled || this.loading,
+            icon: this.icon,
+            iconSize: this.iconSize,
+            loading: this.loading,
+            onClick: () => this.dispatchFormEvents(),
+            type: this.type,
+            alignment: this.alignment,
+            tabIndex: this.hostElement.tabIndex,
+        };
+        return (h(Host, { key: '64d29a9ba0f84b7777d2987a457bc9a89273ad8c', tabindex: this.disabled ? -1 : 0, class: {
+                disabled: this.disabled || this.loading,
+            }, onFocus: () => this.setFocus() }, h(BaseButton, Object.assign({ key: '978c4d1d3092d2e7b626bb7981f2ccdf9dcf0aae' }, baseButtonProps), h("slot", { key: '2bc104087f439ff5f68715aafefb65dad9d170d6' }))));
+    }
+    get hostElement() { return this; }
+    static get watchers() { return {
+        "form": ["handleFormChange"]
+    }; }
+    static get style() { return buttonCss; }
+}, [1, "ix-button", {
+        "variant": [1],
+        "outline": [4],
+        "ghost": [4],
+        "disabled": [516],
+        "type": [1],
+        "loading": [4],
+        "form": [1],
+        "icon": [1],
+        "alignment": [1],
+        "iconSize": [1, "icon-size"]
+    }, [[2, "click", "handleClick"]], {
+        "form": ["handleFormChange"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-button", "ix-spinner"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-button":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Button);
+            }
+            break;
+        case "ix-spinner":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { Button as B, defineCustomElement as d };
+//# sourceMappingURL=p-CvvOe8xV.js.map
+
+//# sourceMappingURL=p-CvvOe8xV.js.map

package/components/p-CvvOe8xV.js.map

@@ -0,0 +1 @@
+{"file":"p-CvvOe8xV.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/button/button.scss?tag=ix-button&encapsulation=shadow","src/components/button/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@import './button-mixin';\n\n@include btn;\n$button-categories: (danger, primary, secondary);\n@each $category in $button-categories {\n  @include btn-variant($category);\n  @include btn-variant('outline-#{$category}');\n  @include btn-variant('invisible-#{$category}', false);\n}\n\n:host {\n  min-width: 5rem;\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  h,\n  Host,\n  Listen,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from './base-button';\nimport { IxButtonComponent } from './button-component';\n\nexport type ButtonVariant = 'danger' | 'primary' | 'secondary';\n\n@Component({\n  tag: 'ix-button',\n  shadow: true,\n  styleUrl: './button.scss',\n})\nexport class Button implements IxButtonComponent {\n  /**\n   * Button variant\n   */\n  @Prop() variant: ButtonVariant = 'primary';\n\n  /**\n   * Outline button\n   */\n  @Prop() outline = false;\n\n  /**\n   * Button with no background or outline\n   */\n  @Prop() ghost = false;\n\n  /**\n   * Disable the button\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Type of the button\n   */\n  @Prop() type: 'button' | 'submit' = 'button';\n\n  /**\n   * Loading button\n   */\n  @Prop() loading: boolean = false;\n\n  /**\n   * Provide a form element ID to automatically submit the from if the button is pressed. Only works in combination with type=\"submit\".\n   *\n   * @since 3.1.0\n   */\n  @Prop() form?: string;\n\n  /**\n   * Icon name\n   */\n  @Prop() icon?: string;\n\n  /** @internal */\n  @Prop() alignment: 'center' | 'start' = 'center';\n\n  /** @internal */\n  @Prop() iconSize: '12' | '16' | '24' = '24';\n\n  @Element() hostElement!: HTMLIxButtonElement;\n\n  /**\n   * Temp. workaround until stencil issue is fixed (https://github.com/ionic-team/stencil/issues/2284)\n   */\n  submitButtonElement?: HTMLButtonElement;\n\n  @Listen('click', { capture: true })\n  handleClick(event: Event) {\n    if (this.disabled || this.loading) {\n      event.stopPropagation();\n      event.preventDefault();\n    }\n  }\n\n  componentDidLoad() {\n    if (this.type !== 'submit') {\n      return;\n    }\n    const submitButton = document.createElement('button');\n    submitButton.style.display = 'none';\n    submitButton.type = 'submit';\n    submitButton.tabIndex = -1;\n\n    if (this.form) {\n      submitButton.setAttribute('form', this.form);\n    }\n    this.hostElement.appendChild(submitButton);\n    this.submitButtonElement = submitButton;\n  }\n\n  @Watch('form')\n  handleFormChange(newValue: string | undefined) {\n    if (this.submitButtonElement) {\n      if (newValue) {\n        this.submitButtonElement.setAttribute('form', newValue);\n      } else {\n        this.submitButtonElement.removeAttribute('form');\n      }\n    }\n  }\n\n  componentDidRender() {\n    if (\n      this.submitButtonElement &&\n      !this.hostElement.contains(this.submitButtonElement)\n    ) {\n      this.hostElement.appendChild(this.submitButtonElement);\n    }\n  }\n\n  dispatchFormEvents() {\n    if (\n      this.type === 'submit' &&\n      this.submitButtonElement &&\n      !this.disabled &&\n      !this.loading\n    ) {\n      this.submitButtonElement.click();\n    }\n  }\n\n  setFocus() {\n    this.hostElement.shadowRoot!.querySelector('button')?.focus();\n  }\n\n  render() {\n    const baseButtonProps: BaseButtonProps = {\n      variant: this.variant,\n      outline: this.outline,\n      ghost: this.ghost,\n      iconOnly: false,\n      iconOval: false,\n      selected: false,\n      disabled: this.disabled || this.loading,\n      icon: this.icon,\n      iconSize: this.iconSize,\n      loading: this.loading,\n      onClick: () => this.dispatchFormEvents(),\n      type: this.type,\n      alignment: this.alignment,\n      tabIndex: this.hostElement.tabIndex,\n    };\n\n    return (\n      <Host\n        tabindex={this.disabled ? -1 : 0}\n        class={{\n          disabled: this.disabled || this.loading,\n        }}\n        onFocus={() => this.setFocus()}\n      >\n        <BaseButton {...baseButtonProps}>\n          <slot></slot>\n        </BaseButton>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/p-CyFFBc_G.js

@@ -0,0 +1,100 @@
+import { m as matchBreakpoint } from './p-D6vSVaHq.js';
+import { T as TypedEvent } from './p-BdCnOrqW.js';
+
+function debounce(func, delay) {
+    let timeoutId;
+    return function debounced(...args) {
+        clearTimeout(timeoutId);
+        timeoutId = setTimeout(() => {
+            func(...args);
+        }, delay);
+    };
+}
+
+var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _ApplicationLayoutService_supportedBreakpoints, _ApplicationLayoutService_breakpointChangeListener, _ApplicationLayoutService_breakpoint, _ApplicationLayoutService_isDetectionEnabled;
+class ApplicationLayoutService {
+    constructor() {
+        // Keep order of breakpoints
+        _ApplicationLayoutService_supportedBreakpoints.set(this, ['sm', 'md', 'lg']);
+        _ApplicationLayoutService_breakpointChangeListener.set(this, new TypedEvent());
+        _ApplicationLayoutService_breakpoint.set(this, 'lg');
+        _ApplicationLayoutService_isDetectionEnabled.set(this, true);
+        this.debouncedOnResize = debounce(this.onResize.bind(this), 50);
+        if (typeof window !== 'undefined') {
+            window.addEventListener('resize', this.debouncedOnResize.bind(this));
+            this.debouncedOnResize();
+        }
+    }
+    get breakpoint() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_breakpoint, "f");
+    }
+    get onChange() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f");
+    }
+    get isDetectionEnabled() {
+        return __classPrivateFieldGet(this, _ApplicationLayoutService_isDetectionEnabled, "f");
+    }
+    onResize() {
+        if (!__classPrivateFieldGet(this, _ApplicationLayoutService_isDetectionEnabled, "f")) {
+            return;
+        }
+        if (!__classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f")) {
+            return;
+        }
+        const matchBreakpoints = [];
+        const breakpoints = __classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f");
+        breakpoints.forEach((breakpoint) => {
+            const match = matchBreakpoint(breakpoint);
+            matchBreakpoints.push([breakpoint, match]);
+        });
+        if (matchBreakpoints.every(([_, match]) => match === false)) {
+            let breakPointIndex = 0;
+            if (!__classPrivateFieldGet(this, _ApplicationLayoutService_supportedBreakpoints, "f").includes('lg')) {
+                breakPointIndex = matchBreakpoints.length - 1;
+            }
+            const [breakpoint, _] = matchBreakpoints[breakPointIndex];
+            requestAnimationFrame(() => __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint));
+            __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+            return;
+        }
+        for (const [breakpoint, match] of matchBreakpoints.reverse()) {
+            if (match) {
+                requestAnimationFrame(() => __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint));
+                __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+                break;
+            }
+        }
+    }
+    disableBreakpointDetection() {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_isDetectionEnabled, false, "f");
+    }
+    enableBreakpointDetection() {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_isDetectionEnabled, true, "f");
+    }
+    setBreakpoint(breakpoint) {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_breakpoint, breakpoint, "f");
+        __classPrivateFieldGet(this, _ApplicationLayoutService_breakpointChangeListener, "f").emit(breakpoint);
+    }
+    setBreakpoints(breakpoints) {
+        __classPrivateFieldSet(this, _ApplicationLayoutService_supportedBreakpoints, breakpoints, "f");
+        this.onResize();
+    }
+}
+_ApplicationLayoutService_supportedBreakpoints = new WeakMap(), _ApplicationLayoutService_breakpointChangeListener = new WeakMap(), _ApplicationLayoutService_breakpoint = new WeakMap(), _ApplicationLayoutService_isDetectionEnabled = new WeakMap();
+const applicationLayoutService = new ApplicationLayoutService();
+
+export { applicationLayoutService as a };
+//# sourceMappingURL=p-CyFFBc_G.js.map
+
+//# sourceMappingURL=p-CyFFBc_G.js.map

package/components/p-CyFFBc_G.js.map

@@ -0,0 +1 @@
+{"file":"p-CyFFBc_G.js","mappings":"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","names":[],"sources":["src/components/utils/debounce.ts","src/components/utils/application-layout/service.ts"],"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 */\ntype AnyFunction = (...args: any[]) => any;\n\nexport function debounce<T extends AnyFunction>(\n  func: T,\n  delay: number\n): (...args: Parameters<T>) => void {\n  let timeoutId: ReturnType<typeof setTimeout>;\n\n  return function debounced(...args: Parameters<T>): void {\n    clearTimeout(timeoutId);\n\n    timeoutId = setTimeout(() => {\n      func(...args);\n    }, delay);\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 */\nimport { Breakpoint, matchBreakpoint } from '../breakpoints';\nimport { debounce } from '../debounce';\nimport { TypedEvent } from '../typed-event';\n\nclass ApplicationLayoutService {\n  // Keep order of breakpoints\n  #supportedBreakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  #breakpointChangeListener = new TypedEvent<Breakpoint>();\n  #breakpoint: Breakpoint = 'lg';\n\n  #isDetectionEnabled = true;\n  debouncedOnResize = debounce(this.onResize.bind(this), 50);\n\n  constructor() {\n    if (typeof window !== 'undefined') {\n      window.addEventListener('resize', this.debouncedOnResize.bind(this));\n      this.debouncedOnResize();\n    }\n  }\n\n  get breakpoint() {\n    return this.#breakpoint;\n  }\n\n  get onChange() {\n    return this.#breakpointChangeListener;\n  }\n\n  get isDetectionEnabled() {\n    return this.#isDetectionEnabled;\n  }\n\n  private onResize() {\n    if (!this.#isDetectionEnabled) {\n      return;\n    }\n    if (!this.#supportedBreakpoints) {\n      return;\n    }\n    const matchBreakpoints: [Breakpoint, boolean][] = [];\n\n    const breakpoints = this.#supportedBreakpoints;\n\n    breakpoints.forEach((breakpoint) => {\n      const match = matchBreakpoint(breakpoint);\n      matchBreakpoints.push([breakpoint, match]);\n    });\n\n    if (matchBreakpoints.every(([_, match]) => match === false)) {\n      let breakPointIndex = 0;\n      if (!this.#supportedBreakpoints.includes('lg')) {\n        breakPointIndex = matchBreakpoints.length - 1;\n      }\n\n      const [breakpoint, _] = matchBreakpoints[breakPointIndex];\n      requestAnimationFrame(() =>\n        this.#breakpointChangeListener.emit(breakpoint)\n      );\n      this.#breakpoint = breakpoint;\n      return;\n    }\n\n    for (const [breakpoint, match] of matchBreakpoints.reverse()) {\n      if (match) {\n        requestAnimationFrame(() =>\n          this.#breakpointChangeListener.emit(breakpoint)\n        );\n        this.#breakpoint = breakpoint;\n        break;\n      }\n    }\n  }\n\n  public disableBreakpointDetection() {\n    this.#isDetectionEnabled = false;\n  }\n\n  public enableBreakpointDetection() {\n    this.#isDetectionEnabled = true;\n  }\n\n  public setBreakpoint(breakpoint: Breakpoint) {\n    this.#breakpoint = breakpoint;\n    this.#breakpointChangeListener.emit(breakpoint);\n  }\n\n  public setBreakpoints(breakpoints: Breakpoint[]) {\n    this.#supportedBreakpoints = breakpoints;\n    this.onResize();\n  }\n}\n\nexport const applicationLayoutService = new ApplicationLayoutService();\n"],"version":3}

package/components/p-D3Aowo70.js

@@ -0,0 +1,113 @@
+import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-BuJ6BWIi.js';
+import { o as iconWarning, q as iconSuccess, p as iconError, n as iconInfo, u as iconClose } from './p-CGwHQeMX.js';
+import { d as defineCustomElement$2 } from './p-BXjBChze.js';
+import { d as defineCustomElement$1 } from './p-BygLxZIM.js';
+
+const toastCss = ":host{display:flex;flex-direction:column;position:relative;min-width:17.5rem;max-width:17.5rem;min-height:3.5rem;pointer-events:all;background-color:var(--theme-toast--background);border:var(--theme-toast--border-thickness) solid var(--theme-toast--border-color);border-radius:var(--theme-toast--border-radius);box-shadow:var(--theme-toast--box-shadow);--animate-duration:300ms}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .toast-body{display:flex;position:relative;min-height:3.5rem;width:100%;flex-grow:1;padding:0.75rem}:host .toast-body .toast-icon{display:flex;align-items:flex-start;margin-right:1rem}:host .toast-body .toast-content{overflow:hidden;text-overflow:ellipsis;min-width:0;width:100%}:host .toast-body .toast-content .toast-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text);margin:0.25rem 0px}:host .toast-body .toast-content .toast-message{min-width:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host .toast-body .toast-icon+.toast-content{max-width:10.25rem}:host .toast-close{display:flex;position:relative;pointer-events:all;margin-left:auto;margin-right:0px}:host .toast-progress-bar{position:absolute;bottom:0;height:0.25rem;width:100%;background-color:var(--theme-toast-timer-value--background);transform-origin:left}:host .toast-progress-bar--animated{animation:trackProgress linear 1 forwards}@keyframes trackProgress{0%{transform:scaleX(1)}100%{transform:scaleX(0)}}";
+
+const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.closeToast = createEvent(this, "closeToast", 7);
+        /**
+         * Toast type
+         */
+        this.type = 'info';
+        /**
+         * Autoclose title after delay
+         */
+        this.autoCloseDelay = 5000;
+        /**
+         * Autoclose behavior
+         */
+        this.autoClose = true;
+        this.progress = 0;
+        this.touched = false;
+    }
+    getIcon() {
+        if (this.icon) {
+            return (h("ix-icon", { "data-testid": "toast-icon", name: this.icon, color: this.iconColor, size: "24" }));
+        }
+        switch (this.type) {
+            case 'info':
+                return (h("ix-icon", { "data-testid": "toast-icon", name: iconInfo, size: "24", color: "color-std-text" }));
+            case 'error':
+                return (h("ix-icon", { "data-testid": "toast-icon", name: iconError, size: "24", color: "color-alarm" }));
+            case 'success':
+                return (h("ix-icon", { "data-testid": "toast-icon", name: iconSuccess, size: "24", color: "color-success" }));
+            case 'warning':
+                return (h("ix-icon", { "data-testid": "toast-icon", name: iconWarning, size: "24", color: "color-warning" }));
+            default:
+                return '';
+        }
+    }
+    close() {
+        if (this.hostElement) {
+            this.hostElement.classList.add('animate__fadeOut');
+        }
+        setTimeout(() => {
+            this.closeToast.emit();
+        }, 250);
+    }
+    render() {
+        let progressBarStyle = {};
+        const progressBarClass = ['toast-progress-bar'];
+        progressBarStyle = {
+            animationDuration: `${this.autoCloseDelay}ms`,
+            animationPlayState: this.touched ? 'paused' : 'running',
+        };
+        progressBarClass.push('toast-progress-bar--animated');
+        return (h(Host, { key: '5cd409e44eb70f62044da80c4896c5c06e842884', class: "animate__animated animate__fadeIn" }, h("div", { key: 'efa97240800330233c5e315eee93e93bc14ca5e9', class: "toast-body", onPointerLeave: () => {
+                this.touched = false;
+            }, onPointerEnter: () => {
+                this.touched = true;
+            } }, this.type || this.icon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: 'd0b9c1ec9c8a215c1627a64246711ee8e2d53c5a', class: "toast-content" }, this.toastTitle ? (h("div", { class: "toast-title" }, this.toastTitle)) : null, h("div", { key: '16168044e69f155781109b10f2055125c5a26e92', class: "toast-message" }, h("slot", { key: '7243f4cbbf8eb959e004fcbfdbf335bd3f35b9a0' }))), h("div", { key: '01e917507ba67c7582040159aaa74d1a58bdbd93', class: "toast-close" }, h("ix-icon-button", { key: '03591a35772c37cc411cef0b4872a65210ecd146', icon: iconClose, size: "24", ghost: true, onClick: () => this.closeToast.emit() }))), this.autoClose ? (h("div", { class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
+                this.close();
+            }, onTransitionEnd: () => {
+                if (this.progress === 0) {
+                    this.close();
+                }
+            } })) : null));
+    }
+    get hostElement() { return this; }
+    static get style() { return toastCss; }
+}, [1, "ix-toast", {
+        "type": [1],
+        "toastTitle": [1, "toast-title"],
+        "autoCloseDelay": [2, "auto-close-delay"],
+        "autoClose": [4, "auto-close"],
+        "icon": [1],
+        "iconColor": [1, "icon-color"],
+        "progress": [32],
+        "touched": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-toast", "ix-icon-button", "ix-spinner"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-toast":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Toast);
+            }
+            break;
+        case "ix-icon-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "ix-spinner":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { Toast as T, defineCustomElement as d };
+//# sourceMappingURL=p-D3Aowo70.js.map
+
+//# sourceMappingURL=p-D3Aowo70.js.map

package/components/p-D3Aowo70.js.map

@@ -0,0 +1 @@
+{"file":"p-D3Aowo70.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/toast/toast.scss?tag=ix-toast&encapsulation=shadow","src/components/toast/toast.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\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n@import 'legacy/mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-width: 17.5rem;\n  max-width: 17.5rem;\n  min-height: 3.5rem;\n\n  pointer-events: all;\n\n  background-color: var(--theme-toast--background);\n  border: var(--theme-toast--border-thickness) solid\n    var(--theme-toast--border-color);\n  border-radius: var(--theme-toast--border-radius);\n  box-shadow: var(--theme-toast--box-shadow);\n\n  --animate-duration: #{$medium-time};\n\n  .toast-body {\n    display: flex;\n    position: relative;\n    min-height: 3.5rem;\n    width: 100%;\n    flex-grow: 1;\n    padding: 0.75rem;\n\n    .toast-icon {\n      display: flex;\n      align-items: flex-start;\n      margin-right: $default-space;\n    }\n\n    .toast-content {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n      width: 100%;\n\n      .toast-title {\n        @include text-default-title-single;\n        margin: 0.25rem 0px;\n      }\n\n      .toast-message {\n        min-width: 0;\n\n        @include text-default;\n      }\n    }\n\n    .toast-icon + .toast-content {\n      max-width: 10.25rem;\n    }\n  }\n\n  .toast-close {\n    display: flex;\n    position: relative;\n    pointer-events: all;\n    margin-left: auto;\n    margin-right: 0px;\n  }\n\n  .toast-progress-bar {\n    position: absolute;\n    bottom: 0;\n    height: $tiny-space;\n    width: 100%;\n    background-color: var(--theme-toast-timer-value--background);\n    transform-origin: left;\n\n    &--animated {\n      animation: trackProgress linear 1 forwards;\n    }\n  }\n\n  @keyframes trackProgress {\n    0% {\n      transform: scaleX(1);\n    }\n    100% {\n      transform: scaleX(0);\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 {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { ToastType } from './toast-utils';\nimport {\n  iconClose,\n  iconError,\n  iconInfo,\n  iconSuccess,\n  iconWarning,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-toast',\n  styleUrl: 'toast.scss',\n  shadow: true,\n})\nexport class Toast {\n  /**\n   * Toast type\n   */\n  @Prop() type: ToastType = 'info';\n\n  /**\n   * Toast title\n   */\n  @Prop() toastTitle?: string;\n\n  /**\n   * Autoclose title after delay\n   */\n  @Prop() autoCloseDelay = 5000;\n\n  /**\n   * Autoclose behavior\n   */\n  @Prop() autoClose = true;\n\n  /**\n   * Icon of toast\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Icon color of toast\n   */\n  @Prop() iconColor?: string;\n\n  /**\n   * Toast closed\n   */\n  @Event() closeToast!: EventEmitter;\n\n  @State() progress = 0;\n  @State() touched = false;\n\n  @Element() hostElement!: HTMLIxToastElement;\n\n  private getIcon() {\n    if (this.icon) {\n      return (\n        <ix-icon\n          data-testid=\"toast-icon\"\n          name={this.icon}\n          color={this.iconColor}\n          size=\"24\"\n        />\n      );\n    }\n\n    switch (this.type) {\n      case 'info':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconInfo}\n            size=\"24\"\n            color=\"color-std-text\"\n          />\n        );\n\n      case 'error':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconError}\n            size=\"24\"\n            color=\"color-alarm\"\n          />\n        );\n\n      case 'success':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconSuccess}\n            size=\"24\"\n            color=\"color-success\"\n          />\n        );\n\n      case 'warning':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconWarning}\n            size=\"24\"\n            color=\"color-warning\"\n          />\n        );\n\n      default:\n        return '';\n    }\n  }\n\n  private close() {\n    if (this.hostElement) {\n      this.hostElement.classList.add('animate__fadeOut');\n    }\n    setTimeout(() => {\n      this.closeToast.emit();\n    }, 250);\n  }\n\n  render() {\n    let progressBarStyle: Record<string, string> = {};\n\n    const progressBarClass = ['toast-progress-bar'];\n\n    progressBarStyle = {\n      animationDuration: `${this.autoCloseDelay}ms`,\n      animationPlayState: this.touched ? 'paused' : 'running',\n    };\n\n    progressBarClass.push('toast-progress-bar--animated');\n\n    return (\n      <Host class=\"animate__animated animate__fadeIn\">\n        <div\n          class=\"toast-body\"\n          onPointerLeave={() => {\n            this.touched = false;\n          }}\n          onPointerEnter={() => {\n            this.touched = true;\n          }}\n        >\n          {this.type || this.icon ? (\n            <div class=\"toast-icon\">{this.getIcon()}</div>\n          ) : null}\n          <div class=\"toast-content\">\n            {this.toastTitle ? (\n              <div class=\"toast-title\">{this.toastTitle}</div>\n            ) : null}\n            <div class=\"toast-message\">\n              <slot></slot>\n            </div>\n          </div>\n          <div class=\"toast-close\">\n            <ix-icon-button\n              icon={iconClose}\n              size=\"24\"\n              ghost\n              onClick={() => this.closeToast.emit()}\n            />\n          </div>\n        </div>\n        {this.autoClose ? (\n          <div\n            class={progressBarClass.join(' ')}\n            style={progressBarStyle}\n            onAnimationEnd={() => {\n              this.close();\n            }}\n            onTransitionEnd={() => {\n              if (this.progress === 0) {\n                this.close();\n              }\n            }}\n          ></div>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/p-D3K9vmFp.js

@@ -0,0 +1,157 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function hasDropdownItemWrapperImplemented(item) {
+    return (item !== null &&
+        item.getDropdownItemElement !== undefined &&
+        typeof item.getDropdownItemElement === 'function');
+}
+class DropdownController {
+    constructor() {
+        this.dropdowns = new Map();
+        this.submenuIds = {};
+        this.isWindowListenerActive = false;
+    }
+    connected(dropdown) {
+        if (!this.isWindowListenerActive) {
+            this.addOverlayListeners();
+        }
+        this.dropdowns.set(dropdown.getId(), dropdown);
+        if (dropdown.discoverAllSubmenus) {
+            this.discoverSubmenus();
+        }
+    }
+    disconnected(dropdown) {
+        const id = dropdown.getId();
+        this.removeFromSubmenuIds(id);
+        this.dropdowns.delete(id);
+    }
+    removeFromSubmenuIds(id) {
+        this.dropdowns.forEach((dropdown) => {
+            const submenuIds = this.submenuIds[dropdown.getId()];
+            if (submenuIds) {
+                const index = submenuIds.indexOf(id);
+                if (index > -1) {
+                    submenuIds.splice(index, 1);
+                }
+            }
+        });
+        delete this.submenuIds[id];
+    }
+    getDropdownById(id) {
+        return this.dropdowns.get(id);
+    }
+    discoverSubmenus() {
+        this.dropdowns.forEach((dropdown) => {
+            dropdown.discoverSubmenu();
+        });
+    }
+    present(dropdown) {
+        var _a;
+        if (!dropdown.isPresent() && ((_a = dropdown.willPresent) === null || _a === void 0 ? void 0 : _a.call(dropdown))) {
+            this.submenuIds[dropdown.getId()] = dropdown.getAssignedSubmenuIds();
+            dropdown.present();
+        }
+    }
+    dismissChildren(uid) {
+        const childIds = this.submenuIds[uid] || [];
+        for (const id of childIds) {
+            const dropdown = this.dropdowns.get(id);
+            if (dropdown) {
+                this.dismiss(dropdown);
+            }
+        }
+    }
+    dismiss(dropdown) {
+        var _a;
+        if (dropdown.isPresent() && ((_a = dropdown.willDismiss) === null || _a === void 0 ? void 0 : _a.call(dropdown))) {
+            this.dismissChildren(dropdown.getId());
+            dropdown.dismiss();
+            delete this.submenuIds[dropdown.getId()];
+        }
+    }
+    dismissAll(ignoreBehaviorForIds = [], ignoreRelatedDropdowns = false) {
+        this.dropdowns.forEach((dropdown) => {
+            const preventClosing = dropdown.closeBehavior === 'inside' || dropdown.closeBehavior === false;
+            const shouldIgnore = ignoreBehaviorForIds.includes(dropdown.getId());
+            const path = this.buildComposedPath(dropdown.getId(), new Set());
+            if (ignoreBehaviorForIds.length > 0 && ignoreRelatedDropdowns) {
+                let skipRelatedDropdown = false;
+                ignoreBehaviorForIds.forEach((id) => {
+                    if (path.has(id)) {
+                        skipRelatedDropdown = true;
+                        return;
+                    }
+                });
+                if (!skipRelatedDropdown) {
+                    return;
+                }
+            }
+            if (!shouldIgnore && preventClosing) {
+                return;
+            }
+            this.dismiss(dropdown);
+        });
+    }
+    dismissOthers(uid) {
+        let path = this.buildComposedPath(uid, new Set());
+        path.add(uid);
+        this.dropdowns.forEach((dropdown) => {
+            if (dropdown.closeBehavior !== 'inside' &&
+                dropdown.closeBehavior !== false &&
+                !path.has(dropdown.getId())) {
+                this.dismiss(dropdown);
+            }
+        });
+    }
+    pathIncludesTrigger(eventTargets) {
+        for (let eventTarget of eventTargets) {
+            if (eventTarget instanceof HTMLElement) {
+                if (eventTarget.hasAttribute('data-ix-dropdown-trigger')) {
+                    return eventTarget;
+                }
+            }
+        }
+        return;
+    }
+    pathIncludesDropdown(eventTargets) {
+        return !!eventTargets.find((element) => element.tagName === 'IX-DROPDOWN');
+    }
+    buildComposedPath(id, path) {
+        if (this.submenuIds[id]) {
+            path.add(id);
+        }
+        for (const ruleKey of Object.keys(this.submenuIds)) {
+            if (this.submenuIds[ruleKey].includes(id)) {
+                this.buildComposedPath(ruleKey, path).forEach((key) => path.add(key));
+            }
+        }
+        return path;
+    }
+    addOverlayListeners() {
+        this.isWindowListenerActive = true;
+        window.addEventListener('click', (event) => {
+            const hasTrigger = this.pathIncludesTrigger(event.composedPath());
+            const hasDropdown = this.pathIncludesDropdown(event.composedPath());
+            if (!hasTrigger && !hasDropdown) {
+                this.dismissAll();
+            }
+        });
+        window.addEventListener('keydown', (event) => {
+            if (event.key === 'Escape') {
+                this.dismissAll([...this.dropdowns.keys()]);
+            }
+        });
+    }
+}
+const dropdownController = new DropdownController();
+
+export { dropdownController as d, hasDropdownItemWrapperImplemented as h };
+//# sourceMappingURL=p-D3K9vmFp.js.map
+
+//# sourceMappingURL=p-D3K9vmFp.js.map