@siemens/ix 3.0.0-alpha.0 → 3.0.0-alpha.1

package/dist/siemens-ix/p-bcj7UEIC.js

@@ -0,0 +1,2 @@
+function n(n){let e=undefined;let i=new Promise((n=>e=n));let d=undefined;const t=i=>{if(i===undefined){return}d=t.current=i;n===null||n===void 0?void 0:n(i);e===null||e===void 0?void 0:e(i)};t.current=d;t.waitForCurrent=async()=>{await i;return d};return t}export{n as m};
+//# sourceMappingURL=p-bcj7UEIC.js.map

package/dist/siemens-ix/p-bcj7UEIC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"p-bcj7UEIC.js","sources":["src/components/utils/make-ref.ts"],"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 */\nexport type MakeRef<T> = {\n  (ref: T | undefined | null): void;\n  current: T | null;\n  waitForCurrent(): Promise<T>;\n};\n\ntype Resolve<T> = (value: T) => void;\n\nexport function makeRef<T>(\n  currentChangedCallback?: (element: T) => void\n): MakeRef<T> {\n  let resolve: Resolve<T> | undefined = undefined;\n  let currentPromise = new Promise<T>((res) => (resolve = res));\n  let current: T | undefined = undefined;\n\n  const setRefFunction = (ref: T | undefined) => {\n    if (ref === undefined) {\n      return;\n    }\n    current = (setRefFunction as MakeRef<T>).current = ref;\n    currentChangedCallback?.(ref);\n    resolve?.(ref);\n  };\n\n  setRefFunction.current = current as T | null;\n\n  setRefFunction.waitForCurrent = async () => {\n    await currentPromise;\n    return current;\n  };\n\n  return setRefFunction as MakeRef<T>;\n}\n"],"names":[],"mappings":"AAgBM,SAAU,OAAO,CACrB,sBAA6C,EAAA;IAE7C,IAAI,OAAO,GAA2B,SAAS;AAC/C,IAAA,IAAI,cAAc,GAAG,IAAI,OAAO,CAAI,CAAC,GAAG,MAAM,OAAO,GAAG,GAAG,CAAC,CAAC;IAC7D,IAAI,OAAO,GAAkB,SAAS;AAEtC,IAAA,MAAM,cAAc,GAAG,CAAC,GAAkB,KAAI;AAC5C,QAAA,IAAI,GAAG,KAAK,SAAS,EAAE;YACrB;;AAEF,QAAA,OAAO,GAAI,cAA6B,CAAC,OAAO,GAAG,GAAG;AACtD,QAAA,sBAAsB,aAAtB,sBAAsB,KAAA,MAAA,GAAA,MAAA,GAAtB,sBAAsB,CAAG,GAAG,CAAC;AAC7B,QAAA,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAG,GAAG,CAAC;AAChB,KAAC;AAED,IAAA,cAAc,CAAC,OAAO,GAAG,OAAmB;AAE5C,IAAA,cAAc,CAAC,cAAc,GAAG,YAAW;AACzC,QAAA,MAAM,cAAc;AACpB,QAAA,OAAO,OAAO;AAChB,KAAC;AAED,IAAA,OAAO,cAA4B;AACrC;;;;"}

package/dist/siemens-ix/p-bd6e324a.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as o,H as t,g as r}from"./p-DtF9fwpD.js";import{B as n}from"./p-CZ1HWy6s.js";const i=":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{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{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{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{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{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{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{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{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{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{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{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{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{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{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{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{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{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{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 d=class{constructor(o){e(this,o);this.variant="primary";this.outline=false;this.ghost=false;this.disabled=false;this.type="button";this.loading=false;this.alignment="center";this.iconSize="24"}handleClick(e){if(this.disabled||this.loading){e.stopPropagation();e.preventDefault()}}componentDidLoad(){if(this.type==="submit"){const e=document.createElement("button");e.style.display="none";e.type="submit";e.tabIndex=-1;this.hostElement.appendChild(e);this.submitButtonElement=e}}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 e;(e=this.hostElement.shadowRoot.querySelector("button"))===null||e===void 0?void 0:e.focus()}render(){const e={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 o(t,{key:"0d7e9fe309d1c2fd320f19cafa0e15bcefafe346",tabindex:this.disabled?-1:0,class:{disabled:this.disabled||this.loading},onFocus:()=>this.setFocus()},o(n,Object.assign({key:"36c8821e58f2c9beee5d68b842636e629d728687"},e),o("slot",{key:"e7ef0928f22720a705f3223fc2495bd90de5767c"})))}get hostElement(){return r(this)}};d.style=i;export{d as ix_button};
+//# sourceMappingURL=p-bd6e324a.entry.js.map

package/dist/siemens-ix/p-bd6e324a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["buttonCss","Button","constructor","hostRef","this","variant","outline","ghost","disabled","type","loading","alignment","iconSize","handleClick","event","stopPropagation","preventDefault","componentDidLoad","submitButton","document","createElement","style","display","tabIndex","hostElement","appendChild","submitButtonElement","componentDidRender","contains","dispatchFormEvents","click","setFocus","_a","shadowRoot","querySelector","focus","render","baseButtonProps","iconOnly","iconOval","selected","icon","onClick","h","Host","key","tabindex","class","onFocus","BaseButton","Object","assign"],"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 { Component, Element, h, Host, Listen, Prop } 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   * @since 2.3.0 - variant danger\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   * @since 2.0.0\n   */\n  @Prop() loading: boolean = false;\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      const submitButton = document.createElement('button');\n      submitButton.style.display = 'none';\n      submitButton.type = 'submit';\n      submitButton.tabIndex = -1;\n      this.hostElement.appendChild(submitButton);\n\n      this.submitButtonElement = submitButton;\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"],"mappings":"6FAAA,MAAMA,EAAY,oyrB,MCoBLC,EAAM,MALnB,WAAAC,CAAAC,G,UAUUC,KAAOC,QAAkB,UAKzBD,KAAOE,QAAG,MAKVF,KAAKG,MAAG,MAKSH,KAAQI,SAAG,MAK5BJ,KAAIK,KAAwB,SAO5BL,KAAOM,QAAY,MAQnBN,KAASO,UAAuB,SAGhCP,KAAQQ,SAAuB,IAqFxC,CA3EC,WAAAC,CAAYC,GACV,GAAIV,KAAKI,UAAYJ,KAAKM,QAAS,CACjCI,EAAMC,kBACND,EAAME,gB,EAIV,gBAAAC,GACE,GAAIb,KAAKK,OAAS,SAAU,CAC1B,MAAMS,EAAeC,SAASC,cAAc,UAC5CF,EAAaG,MAAMC,QAAU,OAC7BJ,EAAaT,KAAO,SACpBS,EAAaK,UAAW,EACxBnB,KAAKoB,YAAYC,YAAYP,GAE7Bd,KAAKsB,oBAAsBR,C,EAI/B,kBAAAS,GACE,GACEvB,KAAKsB,sBACJtB,KAAKoB,YAAYI,SAASxB,KAAKsB,qBAChC,CACAtB,KAAKoB,YAAYC,YAAYrB,KAAKsB,oB,EAItC,kBAAAG,GACE,GACEzB,KAAKK,OAAS,UACdL,KAAKsB,sBACJtB,KAAKI,WACLJ,KAAKM,QACN,CACAN,KAAKsB,oBAAoBI,O,EAI7B,QAAAC,G,OACEC,EAAA5B,KAAKoB,YAAYS,WAAYC,cAAc,aAAW,MAAAF,SAAA,SAAAA,EAAAG,O,CAGxD,MAAAC,GACE,MAAMC,EAAmC,CACvChC,QAASD,KAAKC,QACdC,QAASF,KAAKE,QACdC,MAAOH,KAAKG,MACZ+B,SAAU,MACVC,SAAU,MACVC,SAAU,MACVhC,SAAUJ,KAAKI,UAAYJ,KAAKM,QAChC+B,KAAMrC,KAAKqC,KACX7B,SAAUR,KAAKQ,SACfF,QAASN,KAAKM,QACdgC,QAAS,IAAMtC,KAAKyB,qBACpBpB,KAAML,KAAKK,KACXE,UAAWP,KAAKO,UAChBY,SAAUnB,KAAKoB,YAAYD,UAG7B,OACEoB,EAACC,EAAI,CAAAC,IAAA,2CACHC,SAAU1C,KAAKI,UAAW,EAAK,EAC/BuC,MAAO,CACLvC,SAAUJ,KAAKI,UAAYJ,KAAKM,SAElCsC,QAAS,IAAM5C,KAAK2B,YAEpBY,EAACM,EAAUC,OAAAC,OAAA,CAAAN,IAAA,4CAAKR,GACdM,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/siemens-ix/p-c210f347.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as s,g as o}from"./p-DtF9fwpD.js";import{a as r}from"./p-Ou74PMQs.js";import{c as a}from"./p--2LOMK-5.js";import{c as n}from"./p-CX81WQtk.js";import{q as h}from"./p-CrTP-icT.js";import"./p-BdCnOrqW.js";function c(e,t,{debounceTimeEnter:i,debounceTimeLeave:s}={debounceTimeEnter:0,debounceTimeLeave:500}){let o;let r;return{onEnter:()=>{clearTimeout(r);o=setTimeout((()=>{e()}),i)},onLeave:()=>{clearTimeout(o);r=setTimeout((()=>{t()}),s)}}}const d=":host{display:flex;flex-direction:column;position:relative}: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 .category{display:flex;position:relative;align-items:center;width:100%;height:100%}:host .category-text{width:100%;padding-right:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .category-chevron{margin-left:auto;margin-right:0;transition:var(--theme-default-time) transform ease-in-out}:host .category-chevron--open{transform:rotate(-180deg)}:host .menu-items{overflow:hidden;max-height:0;transition:var(--theme-default-time) max-height ease-in-out}:host .menu-items--expanded{max-height:999999999px;padding:0.25rem 0 0.25rem 1.625rem}:host .menu-items--collapsed{display:none}:host .category-dropdown ::slotted(ix-menu-item){--ix-menu-item-height:2.5rem}:host .category-dropdown-header{pointer-events:none;padding-left:0.125rem;min-width:256px}:host ::slotted(ix-menu-item){--ix-menu-item-height:2.5rem}:host(.expanded){background-color:var(--theme-color-ghost--active)}:host ::slotted(a[href]){text-decoration:none !important}";const l=40;const m=150;const u=class{constructor(i){e(this,i);this.closeOtherCategories=t(this,"closeOtherCategories",7);this.menuExpand=false;this.showItems=false;this.showDropdown=false;this.nestedItems=[];this.enterLeaveDebounce=c((()=>{this.onPointerEnter()}),(()=>{this.onPointerLeave()}))}isNestedItemActive(){return this.getNestedItems().some((e=>e.active))}getNestedItems(){return Array.from(this.hostElement.querySelectorAll(":scope ix-menu-item"))}getNestedItemsHeight(){const e=this.getNestedItems();return e.length*l}onExpandCategory(e){if(e){this.animateFadeIn()}else{this.animateFadeOut()}}animateFadeOut(){const e=25;r({targets:this.menuItemsContainer,duration:m,easing:"easeInSine",opacity:[1,0],maxHeight:[this.getNestedItemsHeight()+l,0],complete:()=>{setTimeout((()=>{this.showItems=false;this.showDropdown=false}),m+e)}})}animateFadeIn(){r({targets:this.menuItemsContainer,duration:m,easing:"easeInSine",opacity:[0,1],maxHeight:[0,this.getNestedItemsHeight()+l],begin:()=>{this.showItems=true;this.showDropdown=false}})}onPointerEnter(){var e;if((e=this.ixMenu)===null||e===void 0?void 0:e.expand){return}this.closeOtherCategories.emit();this.showDropdown=true}onPointerLeave(){this.showDropdown=false}onCategoryClick(e){var t;e.stopPropagation();if((t=this.ixMenu)===null||t===void 0?void 0:t.expand){this.onExpandCategory(!this.showItems);return}}onNestedItemsChanged(e){const t=this.nestedItems.length;this.nestedItems=this.getNestedItems();if(this.showItems&&this.menuItemsContainer&&t!==this.nestedItems.length){this.menuItemsContainer.style.maxHeight=`${this.getNestedItemsHeight()+l}px`}if(!this.menuExpand||this.showItems||!e){return}for(const t of e!==null&&e!==void 0?e:[]){if(t.attributeName==="class"&&t.target instanceof HTMLElement&&t.target.classList.contains("active")){this.showItems=true;this.onExpandCategory(true);return}}}isCategoryItemListVisible(){return this.menuExpand&&(this.showItems||this.isNestedItemActive())}componentWillLoad(){const e=a(this.hostElement);if(!e){throw Error("ix-menu-category can only be used as a child of ix-menu")}this.ixMenu=e;this.menuExpand=this.ixMenu.expand;this.showItems=this.isCategoryItemListVisible()}componentDidLoad(){var e;this.observer=n((e=>this.onNestedItemsChanged(e)));this.observer.observe(this.hostElement,{attributes:true,childList:true,subtree:true});requestAnimationFrame((()=>{this.onNestedItemsChanged()}));(e=this.ixMenu)===null||e===void 0?void 0:e.addEventListener("expandChange",(({detail:e})=>{this.menuExpand=e;if(!e){this.clearMenuItemStyles()}this.showItems=this.isCategoryItemListVisible()}))}clearMenuItemStyles(){var e,t;(e=this.menuItemsContainer)===null||e===void 0?void 0:e.style.removeProperty("max-height");(t=this.menuItemsContainer)===null||t===void 0?void 0:t.style.removeProperty("opacity")}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return i(s,{key:"571bcfb41185abbb0507273605c92c808c6d5153",class:{expanded:this.showItems},onPointerEnter:()=>{this.enterLeaveDebounce.onEnter()},onPointerLeave:e=>{if(e.pointerType==="touch"){return}this.enterLeaveDebounce.onLeave()}},i("ix-menu-item",{key:"8bccb98e2774f6ab46fa42ef6ef349464940dd2f",class:"category-parent",active:this.isNestedItemActive(),notifications:this.notifications,icon:this.icon,onClick:e=>this.onCategoryClick(e),onFocus:()=>this.onPointerEnter(),isCategory:true},i("div",{key:"6b292422fa8e7ffb5fe572bef0ed94d89d2c9e15",class:"category"},i("div",{key:"6c2ff8cf81035e13dcdbc0e450a99fb6397951c8",class:"category-text"},this.label),i("ix-icon",{key:"8f2e7518ab754635fbadd82d54b93e441917ce7a",name:h,class:{"category-chevron":true,"category-chevron--open":this.showItems}}))),i("div",{key:"b2f01026fcd4893f9b43ee83144f4e978f805358",ref:e=>this.menuItemsContainer=e,class:{"menu-items":true,"menu-items--expanded":this.showItems,"menu-items--collapsed":!this.showItems}},this.showItems?i("slot",null):null),i("ix-dropdown",{key:"5c07087f31baea26b2d7f170e9166f7758f59c0a",closeBehavior:"both",show:this.showDropdown,onShowChanged:({detail:e})=>{this.showDropdown=e},class:"category-dropdown",anchor:this.hostElement,placement:"right-start",offset:{mainAxis:3},onClick:e=>{if(e.target instanceof HTMLElement){if(e.target.tagName==="IX-MENU-ITEM"){this.showDropdown=false}else{e.preventDefault()}}}},i("ix-dropdown-item",{key:"58082df65e185ce432b3d901c4c62894bd594790",class:"category-dropdown-header"},i("ix-typography",{key:"a0effbd7404653428b6197652943b7a6be2cd82f",format:"label",bold:true,textColor:"std"},this.label)),i("ix-divider",{key:"52a6bd0499b16717a27dc189f170fc1f7d91043a"}),i("slot",{key:"67e00f22fc9ae4cde06408c87357483666201723"})))}get hostElement(){return o(this)}};u.style=d;export{u as ix_menu_category};
+//# sourceMappingURL=p-c210f347.entry.js.map

package/dist/siemens-ix/p-c210f347.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createEnterLeaveDebounce","enterCallback","leaveCallback","debounceTimeEnter","debounceTimeLeave","enterTimeout","leaveTimeout","onEnter","clearTimeout","setTimeout","onLeave","menuCategoryCss","DefaultIxMenuItemHeight","DefaultAnimationTimeout","MenuCategory","constructor","hostRef","this","menuExpand","showItems","showDropdown","nestedItems","enterLeaveDebounce","onPointerEnter","onPointerLeave","isNestedItemActive","getNestedItems","some","item","active","Array","from","hostElement","querySelectorAll","getNestedItemsHeight","items","length","onExpandCategory","animateFadeIn","animateFadeOut","slotHideThresholdMs","anime","targets","menuItemsContainer","duration","easing","opacity","maxHeight","complete","begin","_a","ixMenu","expand","closeOtherCategories","emit","onCategoryClick","e","stopPropagation","onNestedItemsChanged","mutations","oldNestedItemsLength","style","mutation","attributeName","target","HTMLElement","classList","contains","isCategoryItemListVisible","componentWillLoad","closestMenu","closestIxMenu","Error","componentDidLoad","observer","createMutationObserver","observe","attributes","childList","subtree","requestAnimationFrame","addEventListener","detail","clearMenuItemStyles","removeProperty","_b","disconnectedCallback","disconnect","render","h","Host","key","class","expanded","event","pointerType","notifications","icon","onClick","onFocus","isCategory","label","name","iconChevronDownSmall","ref","closeBehavior","show","onShowChanged","dropdownShown","anchor","placement","offset","mainAxis","tagName","preventDefault","format","bold","textColor"],"sources":["src/components/menu-category/enter-leave.ts","src/components/menu-category/menu-category.scss?tag=ix-menu-category&encapsulation=shadow","src/components/menu-category/menu-category.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 */\nexport function createEnterLeaveDebounce(\n  enterCallback: Function,\n  leaveCallback: Function,\n  {\n    debounceTimeEnter,\n    debounceTimeLeave,\n  }: {\n    debounceTimeEnter: number;\n    debounceTimeLeave: number;\n  } = {\n    debounceTimeEnter: 0,\n    debounceTimeLeave: 500,\n  }\n) {\n  let enterTimeout: NodeJS.Timeout;\n  let leaveTimeout: NodeJS.Timeout;\n\n  return {\n    onEnter: () => {\n      clearTimeout(leaveTimeout);\n      enterTimeout = setTimeout(() => {\n        enterCallback();\n      }, debounceTimeEnter);\n    },\n    onLeave: () => {\n      clearTimeout(enterTimeout);\n      leaveTimeout = setTimeout(() => {\n        leaveCallback();\n      }, debounceTimeLeave);\n    },\n  };\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n\n  .category {\n    display: flex;\n    position: relative;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n  }\n\n  .category-text {\n    width: 100%;\n    padding-right: 0.25rem;\n    @include ellipsis;\n  }\n\n  .category-chevron {\n    margin-left: auto;\n    margin-right: 0;\n    transition: var(--theme-default-time) transform ease-in-out;\n  }\n\n  .category-chevron--open {\n    transform: rotate(-180deg);\n  }\n\n  .menu-items {\n    overflow: hidden;\n    max-height: 0;\n    transition: var(--theme-default-time) max-height ease-in-out;\n  }\n\n  .menu-items--expanded {\n    max-height: 999999999px;\n    padding: 0.25rem 0 0.25rem 1.625rem;\n  }\n\n  .menu-items--collapsed {\n    display: none;\n  }\n\n  .category-dropdown {\n    ::slotted(ix-menu-item) {\n      --ix-menu-item-height: 2.5rem;\n    }\n  }\n\n  .category-dropdown-header {\n    pointer-events: none;\n    padding-left: 0.125rem;\n    min-width: 256px;\n  }\n\n  ::slotted(ix-menu-item) {\n    --ix-menu-item-height: 2.5rem;\n  }\n}\n\n:host(.expanded) {\n  background-color: var(--theme-color-ghost--active);\n}\n\n:host {\n  ::slotted(a[href]) {\n    text-decoration: none !important;\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 {\n  Component,\n  Element,\n  h,\n  Host,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { createEnterLeaveDebounce } from './enter-leave';\nimport { iconChevronDownSmall } from '@siemens/ix-icons/icons';\n\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-menu-category',\n  styleUrl: 'menu-category.scss',\n  shadow: true,\n})\nexport class MenuCategory {\n  @Element() hostElement!: HTMLIxMenuCategoryElement;\n\n  /**\n   * Display name of the category\n   */\n  @Prop() label?: string;\n\n  /**\n   * Icon of the category\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Show notification count on the category\n   */\n  @Prop() notifications?: number;\n\n  /** @internal */\n  // eslint-disable-next-line @stencil-community/decorators-style\n  @Event({ bubbles: true, cancelable: true })\n  closeOtherCategories!: EventEmitter;\n\n  @State() menuExpand = false;\n  @State() showItems = false;\n  @State() showDropdown = false;\n  @State() nestedItems: HTMLIxMenuItemElement[] = [];\n\n  private observer?: MutationObserver;\n  private menuItemsContainer?: HTMLDivElement;\n  private ixMenu?: HTMLIxMenuElement;\n\n  private enterLeaveDebounce = createEnterLeaveDebounce(\n    () => {\n      this.onPointerEnter();\n    },\n    () => {\n      this.onPointerLeave();\n    }\n  );\n\n  private isNestedItemActive() {\n    return this.getNestedItems().some((item) => item.active);\n  }\n\n  private getNestedItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(':scope ix-menu-item')\n    ) as HTMLIxMenuItemElement[];\n  }\n\n  private getNestedItemsHeight() {\n    const items = this.getNestedItems();\n\n    return items.length * DefaultIxMenuItemHeight;\n  }\n\n  private onExpandCategory(showItems: boolean) {\n    if (showItems) {\n      this.animateFadeIn();\n    } else {\n      this.animateFadeOut();\n    }\n  }\n\n  private animateFadeOut() {\n    const slotHideThresholdMs = 25;\n    anime({\n      targets: this.menuItemsContainer,\n      duration: DefaultAnimationTimeout,\n      easing: 'easeInSine',\n      opacity: [1, 0],\n      maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n      complete: () => {\n        setTimeout(() => {\n          this.showItems = false;\n          this.showDropdown = false;\n        }, DefaultAnimationTimeout + slotHideThresholdMs);\n      },\n    });\n  }\n\n  private animateFadeIn() {\n    anime({\n      targets: this.menuItemsContainer,\n      duration: DefaultAnimationTimeout,\n      easing: 'easeInSine',\n      opacity: [0, 1],\n      maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n      begin: () => {\n        this.showItems = true;\n        this.showDropdown = false;\n      },\n    });\n  }\n\n  private onPointerEnter() {\n    if (this.ixMenu?.expand) {\n      return;\n    }\n    this.closeOtherCategories.emit();\n    this.showDropdown = true;\n  }\n\n  @Listen('closeOtherCategories', { target: 'window' })\n  private onPointerLeave() {\n    this.showDropdown = false;\n  }\n\n  private onCategoryClick(e: MouseEvent) {\n    e.stopPropagation();\n    if (this.ixMenu?.expand) {\n      this.onExpandCategory(!this.showItems);\n      return;\n    }\n  }\n\n  private onNestedItemsChanged(mutations?: MutationRecord[]) {\n    const oldNestedItemsLength = this.nestedItems.length;\n    this.nestedItems = this.getNestedItems();\n\n    if (\n      this.showItems &&\n      this.menuItemsContainer &&\n      oldNestedItemsLength !== this.nestedItems.length\n    ) {\n      this.menuItemsContainer.style.maxHeight = `${\n        this.getNestedItemsHeight() + DefaultIxMenuItemHeight\n      }px`;\n    }\n\n    if (!this.menuExpand || this.showItems || !mutations) {\n      return;\n    }\n\n    for (const mutation of mutations ?? []) {\n      if (\n        mutation.attributeName === 'class' &&\n        mutation.target instanceof HTMLElement &&\n        mutation.target.classList.contains('active')\n      ) {\n        this.showItems = true;\n        this.onExpandCategory(true);\n        return;\n      }\n    }\n  }\n\n  private isCategoryItemListVisible() {\n    return this.menuExpand && (this.showItems || this.isNestedItemActive());\n  }\n\n  componentWillLoad() {\n    const closestMenu = closestIxMenu(this.hostElement);\n    if (!closestMenu) {\n      throw Error('ix-menu-category can only be used as a child of ix-menu');\n    }\n    this.ixMenu = closestMenu;\n\n    this.menuExpand = this.ixMenu.expand;\n    this.showItems = this.isCategoryItemListVisible();\n  }\n\n  componentDidLoad() {\n    this.observer = createMutationObserver((mutations: MutationRecord[]) =>\n      this.onNestedItemsChanged(mutations)\n    );\n\n    this.observer.observe(this.hostElement, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n\n    requestAnimationFrame(() => {\n      this.onNestedItemsChanged();\n    });\n\n    this.ixMenu?.addEventListener(\n      'expandChange',\n      ({ detail: menuExpand }: CustomEvent<boolean>) => {\n        this.menuExpand = menuExpand;\n        if (!menuExpand) {\n          this.clearMenuItemStyles();\n        }\n        this.showItems = this.isCategoryItemListVisible();\n      }\n    );\n  }\n\n  clearMenuItemStyles() {\n    this.menuItemsContainer?.style.removeProperty('max-height');\n    this.menuItemsContainer?.style.removeProperty('opacity');\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.showItems,\n        }}\n        onPointerEnter={() => {\n          this.enterLeaveDebounce.onEnter();\n        }}\n        onPointerLeave={(event: PointerEvent) => {\n          if (event.pointerType === 'touch') {\n            return;\n          }\n          this.enterLeaveDebounce.onLeave();\n        }}\n      >\n        <ix-menu-item\n          class={'category-parent'}\n          active={this.isNestedItemActive()}\n          notifications={this.notifications}\n          icon={this.icon}\n          onClick={(e) => this.onCategoryClick(e)}\n          onFocus={() => this.onPointerEnter()}\n          isCategory\n        >\n          <div class=\"category\">\n            <div class=\"category-text\">{this.label}</div>\n            <ix-icon\n              name={iconChevronDownSmall}\n              class={{\n                'category-chevron': true,\n                'category-chevron--open': this.showItems,\n              }}\n            ></ix-icon>\n          </div>\n        </ix-menu-item>\n        <div\n          ref={(ref) => (this.menuItemsContainer = ref!)}\n          class={{\n            'menu-items': true,\n            'menu-items--expanded': this.showItems,\n            'menu-items--collapsed': !this.showItems,\n          }}\n        >\n          {this.showItems ? <slot></slot> : null}\n        </div>\n        <ix-dropdown\n          closeBehavior={'both'}\n          show={this.showDropdown}\n          onShowChanged={({ detail: dropdownShown }: CustomEvent<boolean>) => {\n            this.showDropdown = dropdownShown;\n          }}\n          class={'category-dropdown'}\n          anchor={this.hostElement}\n          placement=\"right-start\"\n          offset={{\n            mainAxis: 3,\n          }}\n          onClick={(e) => {\n            if (e.target instanceof HTMLElement) {\n              if (e.target.tagName === 'IX-MENU-ITEM') {\n                this.showDropdown = false;\n              } else {\n                e.preventDefault();\n              }\n            }\n          }}\n        >\n          <ix-dropdown-item class={'category-dropdown-header'}>\n            <ix-typography format=\"label\" bold textColor=\"std\">\n              {this.label}\n            </ix-typography>\n          </ix-dropdown-item>\n          <ix-divider></ix-divider>\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-c2b23c82.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as a,H as s}from"./p-DtF9fwpD.js";const c=":host{display:block}";const i=class{constructor(a){e(this,a);this.labelChange=t(this,"labelChange",7)}watchLabel(e,t){this.labelChange.emit({name:"ix-menu-settings-item",oldLabel:t,newLabel:e})}render(){return a(s,{key:"85b9c341a93a6a5d2c401d7c998e9d6701c04854"},a("slot",{key:"ac7e21786837e0a89dea3523d4c5e189e3f2fea6"}))}static get watchers(){return{label:["watchLabel"]}}};i.style=c;export{i as ix_menu_settings_item};
+//# sourceMappingURL=p-c2b23c82.entry.js.map

package/dist/siemens-ix/p-c2b23c82.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["menuSettingsItemCss","MenuSettingsItem","watchLabel","newValue","oldValue","this","labelChange","emit","name","oldLabel","newLabel","render","h","Host","key"],"sources":["src/components/menu-settings-item/menu-settings-item.css?tag=ix-menu-settings-item&encapsulation=shadow","src/components/menu-settings-item/menu-settings-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\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  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { CustomLabelChangeEvent } from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n  tag: 'ix-menu-settings-item',\n  styleUrl: 'menu-settings-item.css',\n  shadow: true,\n})\nexport class MenuSettingsItem {\n  /**\n   * Settings Item label\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * Label changed\n   */\n  @Event() labelChange!: EventEmitter<CustomLabelChangeEvent>;\n\n  @Watch('label')\n  watchLabel(newValue: string, oldValue: string) {\n    this.labelChange.emit({\n      name: 'ix-menu-settings-item',\n      oldLabel: oldValue,\n      newLabel: newValue,\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,uB,MCyBfC,EAAgB,M,kEAY3B,UAAAC,CAAWC,EAAkBC,GAC3BC,KAAKC,YAAYC,KAAK,CACpBC,KAAM,wBACNC,SAAUL,EACVM,SAAUP,G,CAId,MAAAQ,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/siemens-ix/p-c56c3898.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as o,H as r,g as i}from"./p-DtF9fwpD.js";import{c as s}from"./p-CX81WQtk.js";import{h as d}from"./p-i60z1FJC.js";import{f as a,q as n}from"./p-CrTP-icT.js";const h=":host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;width:19.75rem;min-width:12rem;border-color:var(--theme-group-item--border-color)}:host .group-header{height:4rem;min-height:4rem;max-height:4rem;border-radius:var(--theme-group--border-radius) var(--theme-group--border-radius) 0 0;display:flex;background-color:var(--theme-group-item--background);color:var(--theme-group-header--color);cursor:pointer}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover)}:host .group-header:not(.disabled):not(:disabled):hover.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):active,:host .group-header:not(.disabled):not(:disabled).active{background-color:var(--theme-group-item--background--active)}:host .group-header:not(.disabled):not(:disabled):active.selected,:host .group-header:not(.disabled):not(:disabled).active.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled):focus-visible{border:1px solid var(--theme-color-focus-bdr);border-radius:var(--theme-default-border-radius) var(--theme-default-border-radius) 0px 0px;outline:none}:host .group-header.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header.selected .group-header-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header .group-header-selection-indicator{background-color:var(--theme-color-input--focus)}:host .group-header .group-header-selection-indicator.group-header-selection-indicator-item-selected{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header-clickable{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}:host .group-header-selection-indicator{width:0.25rem;border-top-left-radius:var(--theme-group--border-radius)}:host .group-header-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;flex-grow:1;flex-basis:0;padding:0.5rem;padding-left:0}:host .group-header-content .group-header-props-container{width:100%}:host .group-header-content .group-header-title{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}:host .group-header-content .group-header-title>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;padding-right:0}:host .group-header-content .group-subheader{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}:host .expand-icon{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}:host .btn-expand-header{margin:0.5rem;margin-inline-end:0.25rem;min-width:1.5rem}:host .group-content{display:flex;flex-direction:column;gap:1px;margin-top:1px}:host .footer{visibility:collapse;height:auto;min-height:0}:host .footer-visible{visibility:visible}:host .hidden{display:none}";const c=class{constructor(o){e(this,o);this.selectGroup=t(this,"selectGroup",7);this.selectItem=t(this,"selectItem",7);this.collapsedChanged=t(this,"collapsedChanged",7);this.suppressHeaderSelection=false;this.collapsed=true;this.selected=false;this.expandOnHeaderClick=false;this.itemSelected=false;this.slotSize=this.groupItems.length;this.footerVisible=false;this.showExpandCollapsedIcon=false;this.observer=null}selectedChanged(e){if(e===false){this.changeItemIndex()}}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-dropdown-item"))}get groupItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-item:not(.footer)"))}get groupContent(){var e;return(e=this.hostElement.shadowRoot)===null||e===void 0?void 0:e.querySelector(".group-content")}onExpandClick(e){const t=this.collapsed;this.collapsed=!this.collapsed;const{defaultPrevented:o}=this.collapsedChanged.emit(this.collapsed);e.stopPropagation();if(o){this.collapsed=t}}onHeaderClick(e){if(this.suppressHeaderSelection){this.onExpandClick(e);return}this.changeHeaderSelection(!this.selected);this.changeItemIndex()}changeHeaderSelection(e){const t=this.selected;const o=e;this.selected=o;const{defaultPrevented:r}=this.selectGroup.emit(o);if(r){this.selected=t;return}}changeItemIndex(e){const t=this.index;const o=e===this.index?undefined:e;if(this.index===o){return}this.index=o;const{defaultPrevented:r}=this.selectItem.emit(o);if(r){this.index=t;return}const i=this.groupItems;i.forEach(((e,t)=>{e.selected=t===this.index}));this.itemSelected=i.some((e=>e.selected))}onSlotChange(){var e;const t=(e=this.hostElement.shadowRoot)===null||e===void 0?void 0:e.querySelector('slot[name="footer"]');if(t){this.footerVisible=d(t)}}componentWillRender(){this.groupItems.forEach(((e,t)=>{e.selected=t===this.index;e.index=t}))}componentDidLoad(){this.observer=s((()=>{this.slotSize=this.groupItems.length}));if(!this.groupContent){return}this.observer.observe(this.groupContent,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}onItemClicked(e){if(e.target instanceof HTMLElement){const t=e.target;const o=this.groupItems.indexOf(t);this.changeItemIndex(o)}}render(){return o(r,{key:"c268f5611ec43b90822fbb853a7ce6e8ec659a46"},o("div",{key:"85edebe78504c756468a755017455878f2275731",class:{"group-header":true,expand:!this.collapsed,selected:this.selected},tabindex:"0"},o("div",{key:"de1e83c31d43105090f32a385c05dae380494e16",class:"group-header-clickable",onClick:e=>this.onHeaderClick(e)},o("div",{key:"be571bb02cbc5a87526fb2233843109694fb0483",class:{"group-header-selection-indicator":true,"group-header-selection-indicator-item-selected":this.itemSelected}}),o("div",{key:"28eed0500509cfa077c392b571b94b7f58ffc5a9",class:"btn-expand-header"},o("ix-icon",{key:"c03a24366b283854b593a7535f6ec74a546e2f35","data-testid":"expand-collapsed-icon",class:{hidden:!this.showExpandCollapsedIcon},name:this.collapsed?a:n,onClick:e=>this.onExpandClick(e)})),o("div",{key:"3017f37e708850dcc99315d6e9ae8f04b2eb056a",class:"group-header-content"},this.header?o("div",{class:"group-header-props-container"},o("div",{class:"group-header-title"},o("span",{title:this.header},this.header)),o("div",{class:"group-subheader",title:this.subHeader},this.subHeader)):null,o("slot",{key:"8748bbeddeb1131bd97c4451040a502ea4d304f5",name:"header"}))),o("ix-group-context-menu",{key:"ae30b548cd0fe88981f39d0eec4cb4b1e84ee4a3"},o("slot",{key:"784f9e0fc19d89463890a26bf12e3617929b09e3",name:"dropdown"}))),o("div",{key:"a1799b001f3ba51b5df2fcf88f85d09560211dad",class:{"group-content":true}},o("div",{key:"f366922798c0d4629497445b8edfd4c47bc82147",style:{display:this.collapsed?"none":"contents"}},o("slot",{key:"15c9060eac795f4d2ad0f605316713a67b06ebe1",onSlotchange:()=>{var e;const t=(e=this.hostElement.shadowRoot)===null||e===void 0?void 0:e.querySelector("slot:not([name])");this.showExpandCollapsedIcon=d(t)}}),o("ix-group-item",{key:"3d56e41df5f67e26e8923403dda2ca56f5cadc7d",suppressSelection:true,focusable:false,class:{footer:true,"footer-visible":this.footerVisible}},o("slot",{key:"2aba775c0b328782dc802ca63c6ea7ff08038262",name:"footer",onSlotchange:()=>this.onSlotChange()})))))}get hostElement(){return i(this)}static get watchers(){return{selected:["selectedChanged"]}}};c.style=h;export{c as ix_group};
+//# sourceMappingURL=p-c56c3898.entry.js.map

package/dist/siemens-ix/p-c56c3898.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["groupCss","Group","constructor","hostRef","this","suppressHeaderSelection","collapsed","selected","expandOnHeaderClick","itemSelected","slotSize","groupItems","length","footerVisible","showExpandCollapsedIcon","observer","selectedChanged","newSelected","changeItemIndex","dropdownItems","Array","from","hostElement","querySelectorAll","groupContent","_a","shadowRoot","querySelector","onExpandClick","event","oldCollapsed","defaultPrevented","collapsedChanged","emit","stopPropagation","onHeaderClick","changeHeaderSelection","newSelection","oldIsHeaderSelected","newIsHeaderSelected","selectGroup","index","oldIndex","newIndex","undefined","selectItem","items","forEach","item","i","some","onSlotChange","slot","hasSlottedElements","componentWillRender","componentDidLoad","createMutationObserver","observe","childList","disconnectedCallback","disconnect","onItemClicked","target","HTMLElement","indexOf","render","h","Host","key","class","expand","tabindex","onClick","e","hidden","name","iconChevronRightSmall","iconChevronDownSmall","header","title","subHeader","style","display","onSlotchange","suppressSelection","focusable","footer"],"sources":["src/components/group/group.scss?tag=ix-group&encapsulation=shadow","src/components/group/group.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 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  @include ellipsis;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 19.75rem;\n  min-width: 12rem;\n  border-color: var(--theme-group-item--border-color);\n\n  .group-header {\n    height: 4rem;\n    min-height: 4rem;\n    max-height: 4rem;\n    border-radius: var(--theme-group--border-radius)\n      var(--theme-group--border-radius) 0 0;\n    display: flex;\n    background-color: var(--theme-group-item--background);\n    color: var(--theme-group-header--color);\n\n    cursor: pointer;\n\n    @include hover {\n      background-color: var(--theme-group-item--background--hover);\n\n      &.selected {\n        background-color: var(--theme-group-item--background--selected);\n      }\n    }\n\n    @include active {\n      background-color: var(--theme-group-item--background--active);\n\n      &.selected {\n        background-color: var(--theme-group-item--background--selected);\n      }\n    }\n\n    @include focus-visible {\n      border: 1px solid var(--theme-color-focus-bdr);\n      border-radius: var(--theme-default-border-radius)\n        var(--theme-default-border-radius) 0px 0px;\n      outline: none;\n    }\n\n    &.selected {\n      background-color: var(--theme-group-item--background--selected);\n\n      .group-header-selection-indicator {\n        background-color: var(\n          --theme-group-item-indicator--background--selected\n        );\n      }\n    }\n\n    .group-header-selection-indicator {\n      background-color: var(--theme-color-input--focus);\n\n      &.group-header-selection-indicator-item-selected {\n        background-color: var(\n          --theme-group-item-indicator--background--selected\n        );\n      }\n    }\n  }\n\n  .group-header-clickable {\n    @include ellipsis;\n\n    display: flex;\n    width: 100%;\n    min-width: 0;\n  }\n\n  .group-header-selection-indicator {\n    width: $tiny-space;\n    border-top-left-radius: var(--theme-group--border-radius);\n  }\n\n  .group-header-content {\n    @include ellipsis;\n\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    min-width: 0;\n    flex-grow: 1;\n    flex-basis: 0;\n    padding: 0.5rem;\n    padding-left: 0;\n\n    .group-header-props-container {\n      width: 100%;\n    }\n\n    .group-header-title {\n      display: flex;\n      align-items: center;\n      font-size: 1rem;\n      font-weight: $font-weight-bold;\n      height: 1.5rem;\n\n      & > * {\n        @include ellipsis;\n\n        min-width: 0;\n        padding-right: 0;\n      }\n    }\n\n    .group-subheader {\n      @include ellipsis();\n\n      height: 1.25rem;\n      font-size: 0.875rem;\n      color: var(--theme-group-subheader--color);\n    }\n  }\n\n  .expand-icon {\n    padding: 0.125rem 0.437rem;\n    color: var(--theme-color-std-text);\n  }\n\n  .btn-expand-header {\n    margin: $small-space;\n    margin-inline-end: $tiny-space;\n    min-width: 1.5rem;\n  }\n\n  .group-content {\n    display: flex;\n    flex-direction: column;\n    gap: 1px;\n    margin-top: 1px;\n  }\n\n  .footer {\n    visibility: collapse;\n    height: auto;\n    min-height: 0;\n  }\n\n  .footer-visible {\n    visibility: visible;\n  }\n\n  .hidden {\n    display: none;\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  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport {\n  iconChevronDownSmall,\n  iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-group',\n  styleUrl: 'group.scss',\n  shadow: true,\n})\nexport class Group {\n  @Element() hostElement!: HTMLIxGroupElement;\n\n  /**\n   * Prevent header from being selectable\n   */\n  @Prop() suppressHeaderSelection = false;\n\n  /**\n   * Group header\n   */\n  @Prop() header?: string;\n\n  /**\n   * Group header subtitle\n   */\n  @Prop() subHeader?: string;\n\n  /**\n   * Whether the group is collapsed or expanded. Defaults to true.\n   */\n  @Prop({ mutable: true, reflect: true }) collapsed = true;\n\n  /**\n   * Whether the group is selected.\n   */\n  @Prop({ mutable: true, reflect: true }) selected = false;\n\n  /**\n   * The index of the selected group entry.\n   * If undefined no group item is selected.\n   */\n  @Prop({ mutable: true, reflect: true }) index?: number;\n\n  /**\n   * Expand the group if the header is clicked\n   */\n  @Prop() expandOnHeaderClick = false;\n\n  /**\n   * Emits when whole group gets selected.\n   */\n  @Event() selectGroup!: EventEmitter<boolean>;\n\n  /**\n   * Emits when group item gets selected.\n   */\n  @Event() selectItem!: EventEmitter<number>;\n\n  /**\n   * Group collapsed\n   */\n  @Event() collapsedChanged!: EventEmitter<boolean>;\n\n  @State() itemSelected = false;\n  @State() slotSize = this.groupItems.length;\n  @State() footerVisible = false;\n\n  @State() showExpandCollapsedIcon = false;\n\n  private observer: MutationObserver = null!;\n\n  @Watch('selected')\n  selectedChanged(newSelected: boolean) {\n    if (newSelected === false) {\n      this.changeItemIndex();\n    }\n  }\n\n  get dropdownItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll('ix-group-dropdown-item')\n    );\n  }\n\n  get groupItems(): Array<HTMLIxGroupItemElement> {\n    return Array.from(\n      this.hostElement.querySelectorAll('ix-group-item:not(.footer)')\n    );\n  }\n\n  get groupContent() {\n    return this.hostElement.shadowRoot?.querySelector('.group-content');\n  }\n\n  private onExpandClick(event: Event) {\n    const oldCollapsed = this.collapsed;\n    this.collapsed = !this.collapsed;\n    const { defaultPrevented } = this.collapsedChanged.emit(this.collapsed);\n    event.stopPropagation();\n\n    if (defaultPrevented) {\n      this.collapsed = oldCollapsed;\n    }\n  }\n\n  private onHeaderClick(event: Event) {\n    if (this.suppressHeaderSelection) {\n      this.onExpandClick(event);\n      return;\n    }\n\n    this.changeHeaderSelection(!this.selected);\n    this.changeItemIndex();\n  }\n\n  private changeHeaderSelection(newSelection: boolean) {\n    const oldIsHeaderSelected = this.selected;\n    const newIsHeaderSelected = newSelection;\n    this.selected = newIsHeaderSelected;\n    const { defaultPrevented } = this.selectGroup.emit(newIsHeaderSelected);\n\n    if (defaultPrevented) {\n      this.selected = oldIsHeaderSelected;\n      return;\n    }\n  }\n\n  private changeItemIndex(index?: number) {\n    const oldIndex = this.index;\n    const newIndex = index === this.index ? undefined : index;\n\n    if (this.index === newIndex) {\n      return;\n    }\n\n    this.index = newIndex;\n    const { defaultPrevented } = this.selectItem.emit(newIndex);\n    if (defaultPrevented) {\n      this.index = oldIndex;\n      return;\n    }\n\n    const items = this.groupItems;\n    items.forEach((item, i) => {\n      item.selected = i === this.index;\n    });\n\n    this.itemSelected = items.some((item) => item.selected);\n  }\n\n  private onSlotChange() {\n    const slot = this.hostElement.shadowRoot?.querySelector(\n      'slot[name=\"footer\"]'\n    );\n\n    if (slot) {\n      this.footerVisible = hasSlottedElements(slot);\n    }\n  }\n\n  componentWillRender() {\n    this.groupItems.forEach((item, index) => {\n      item.selected = index === this.index;\n      item.index = index;\n    });\n  }\n\n  componentDidLoad() {\n    this.observer = createMutationObserver(() => {\n      this.slotSize = this.groupItems.length;\n    });\n    if (!this.groupContent) {\n      return;\n    }\n    this.observer.observe(this.groupContent, {\n      childList: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  @Listen('selectedChanged')\n  onItemClicked(event: CustomEvent) {\n    if (event.target instanceof HTMLElement) {\n      const item = event.target as HTMLIxGroupItemElement;\n      const index = this.groupItems.indexOf(item);\n      this.changeItemIndex(index);\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'group-header': true,\n            expand: !this.collapsed,\n            selected: this.selected,\n          }}\n          tabindex=\"0\"\n        >\n          <div\n            class=\"group-header-clickable\"\n            onClick={(e) => this.onHeaderClick(e)}\n          >\n            <div\n              class={{\n                'group-header-selection-indicator': true,\n                'group-header-selection-indicator-item-selected':\n                  this.itemSelected,\n              }}\n            ></div>\n            <div class=\"btn-expand-header\">\n              <ix-icon\n                data-testid=\"expand-collapsed-icon\"\n                class={{\n                  hidden: !this.showExpandCollapsedIcon,\n                }}\n                name={\n                  this.collapsed ? iconChevronRightSmall : iconChevronDownSmall\n                }\n                onClick={(event: Event) => this.onExpandClick(event)}\n              ></ix-icon>\n            </div>\n\n            <div class=\"group-header-content\">\n              {this.header ? (\n                <div class=\"group-header-props-container\">\n                  <div class=\"group-header-title\">\n                    <span title={this.header}>{this.header}</span>\n                  </div>\n                  <div class=\"group-subheader\" title={this.subHeader}>\n                    {this.subHeader}\n                  </div>\n                </div>\n              ) : null}\n              <slot name=\"header\"></slot>\n            </div>\n          </div>\n          <ix-group-context-menu>\n            <slot name=\"dropdown\"></slot>\n          </ix-group-context-menu>\n        </div>\n        <div\n          class={{\n            'group-content': true,\n          }}\n        >\n          <div\n            style={{\n              display: this.collapsed ? 'none' : 'contents',\n            }}\n          >\n            <slot\n              onSlotchange={() => {\n                const slot =\n                  this.hostElement.shadowRoot?.querySelector(\n                    'slot:not([name])'\n                  );\n                this.showExpandCollapsedIcon = hasSlottedElements(slot);\n              }}\n            ></slot>\n            <ix-group-item\n              suppressSelection={true}\n              focusable={false}\n              class={{\n                footer: true,\n                'footer-visible': this.footerVisible,\n              }}\n            >\n              <slot\n                name=\"footer\"\n                onSlotchange={() => this.onSlotChange()}\n              ></slot>\n            </ix-group-item>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-cb5000ac.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as o,H as a,g as r}from"./p-DtF9fwpD.js";import{f as n}from"./p-CrTP-icT.js";const i=':host{display:flex;position:relative;flex-direction:column;width:100%;transition:var(--theme-default-time) ease-in-out}: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 .expand-action{all:unset;display:flex;position:relative;-webkit-appearance:button;-moz-appearance:button;appearance:button;height:2.5rem;width:100%;background-color:var(--theme-color-component-1);align-items:center;justify-content:flex-start}:host .expand-action:hover{background:var(--theme-color-component-1--hover)}:host .expand-action:active{background:var(--theme-color-component-1--active)}:host .expand-action:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .expand-action::before{content:"";position:absolute;width:100%;height:100%;background-color:var(--ix-card-background);z-index:-1}:host .expand-action:not(.show),:host .expand-action:not(.show)::before{border-bottom-left-radius:var(--theme-default-border-radius);border-bottom-right-radius:var(--theme-default-border-radius)}:host .expand-icon{margin-left:0.5rem;transition:var(--theme-default-time) transform ease-in-out}:host .expand-icon.show{transform:rotate(90deg)}:host .expand-content{display:grid;position:relative;grid-template-rows:0fr;transition:var(--theme-default-time) ease-in-out;width:100%;max-height:14.75rem;opacity:0;background-color:var(--theme-color-component-1)}:host .expand-content.show{grid-template-rows:14.75rem;opacity:1}:host .expand-content-inner{position:relative;height:100%;overflow:hidden}:host .expand-content.show .expand-content-body{display:none;overflow:hidden;color:var(--theme-color-std-text)}:host .expand-content.show .expand-content-body{display:block;overflow:auto;height:calc(100% - 1rem)}:host .expand-content-footer{display:block;position:relative;width:100%;height:1rem;margin-top:auto;margin-bottom:0px;background-color:var(--theme-color-component-1);border-bottom-left-radius:var(--theme-default-border-radius);border-bottom-right-radius:var(--theme-default-border-radius)}';let s=0;const c=(t="expand-content")=>[t,s++].join("-");const d=class{constructor(o){t(this,o);this.accordionExpand=e(this,"accordionExpand",7);this.collapse=false;this.expandContent=false}onInitialExpandChange(){this.expandContent=!this.collapse}get expandedContent(){return this.hostElement.shadowRoot.querySelector(".expand-content")}onExpandActionClick(t){t.preventDefault();t.stopPropagation();this.expandContent=!this.expandContent;this.accordionExpand.emit({expand:this.expandContent,nativeEvent:t});if(this.expandContent){this.scrollExpandedContentIntoView()}}scrollExpandedContentIntoView(){setTimeout((()=>{const t=this.expandedContent.getBoundingClientRect();if(t.bottom>window.innerHeight){this.hostElement.shadowRoot.querySelector(".expand-content").scrollIntoView(false)}}),150)}componentWillLoad(){this.onInitialExpandChange()}render(){return o(a,{key:"491fb99db65dab3492d23e3122ca9da2c899b232",slot:"card-accordion"},o("button",{key:"b498d87343ed4e70ef4a094642fc4906b309f5b3",tabIndex:0,class:{"expand-action":true,show:this.expandContent},onClick:t=>this.onExpandActionClick(t),role:"button",type:"button","aria-expanded":this.expandContent,"aria-controls":c()},o("ix-icon",{key:"eb8b3af0c8ded220c6c8d62b3c9da45ba302c5d6",name:n,class:{"expand-icon":true,show:this.expandContent}})),o("div",{key:"9b0b53385f7b0b7f3365c89e7134869990c6270a",class:{"expand-content":true,show:this.expandContent}},o("div",{key:"a79520b455e3d344aca02ca70a9b7ff3262c76f8",class:"expand-content-inner"},o("div",{key:"c0798bb66e28ca6e2a5d6ee38b21222677d5a09a",class:"expand-content-body"},o("slot",{key:"01f775b08d53d8ea428b35d972d75af719006e8c"})),o("div",{key:"df5f62b0667977076557472c5713e30a7840a1a4",class:"expand-content-footer"}))))}get hostElement(){return r(this)}static get watchers(){return{collapse:["onInitialExpandChange"]}}};d.style=i;const l=":host{display:flex;position:relative;flex-direction:row;align-items:center;margin-top:0.25rem;margin-bottom:0.25rem;gap:1rem;width:100%}:host .title-actions{display:flex;position:relative;flex-direction:row;gap:0.25rem;margin-left:auto;margin-right:0}";const h=class{constructor(e){t(this,e)}render(){return o(a,{key:"0f4e8785e6861fa9151cece5946a7b33e85bd7fd"},o("slot",{key:"d8909ebe344940cda53d4076ccd1291eb1240f8b"}),o("div",{key:"f87b52b2b467664d6e9d886d358b1c6b5403aae8",class:"title-actions"},o("slot",{key:"9e45b897368e305f0ce1e66b47424360c44c148d",name:"title-actions"})))}};h.style=l;export{d as ix_card_accordion,h as ix_card_title};
+//# sourceMappingURL=p-cb5000ac.entry.js.map

package/dist/siemens-ix/p-cb5000ac.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardAccordionCss","accordionControlId","getAriaControlsId","prefix","join","CardAccordion","constructor","hostRef","this","collapse","expandContent","onInitialExpandChange","expandedContent","hostElement","shadowRoot","querySelector","onExpandActionClick","event","preventDefault","stopPropagation","accordionExpand","emit","expand","nativeEvent","scrollExpandedContentIntoView","setTimeout","rect","getBoundingClientRect","bottom","window","innerHeight","scrollIntoView","componentWillLoad","render","h","Host","key","slot","tabIndex","class","show","onClick","role","type","name","iconChevronRightSmall","cardTitleCss","CardHeader"],"sources":["src/components/card-accordion/card-accordion.scss?tag=ix-card-accordion&encapsulation=shadow","src/components/card-accordion/card-accordion.tsx","src/components/card-title/card-title.scss?tag=ix-card-title&encapsulation=shadow","src/components/card-title/card-title.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 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  width: 100%;\n  transition: var(--theme-default-time) ease-in-out;\n\n  .expand-action {\n    all: unset;\n    display: flex;\n    position: relative;\n\n    appearance: button;\n\n    height: 2.5rem;\n    width: 100%;\n\n    background-color: var(--theme-color-component-1);\n    align-items: center;\n    justify-content: flex-start;\n\n    &:hover {\n      background: var(--theme-color-component-1--hover);\n    }\n\n    &:active {\n      background: var(--theme-color-component-1--active);\n    }\n\n    @include focus-visible {\n      outline: 1px solid var(--theme-color-focus-bdr);\n      outline-offset: var(--theme-btn--focus--outline-offset);\n    }\n  }\n\n  .expand-action::before {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    background-color: var(--ix-card-background);\n    z-index: -1;\n  }\n\n  .expand-action:not(.show),\n  .expand-action:not(.show)::before {\n    border-bottom-left-radius: var(--theme-default-border-radius);\n    border-bottom-right-radius: var(--theme-default-border-radius);\n  }\n\n  .expand-icon {\n    margin-left: 0.5rem;\n    transition: var(--theme-default-time) transform ease-in-out;\n  }\n\n  .expand-icon.show {\n    transform: rotate(90deg);\n  }\n\n  .expand-content {\n    display: grid;\n    position: relative;\n    grid-template-rows: 0fr;\n    transition: var(--theme-default-time) ease-in-out;\n    width: 100%;\n    max-height: 14.75rem;\n    opacity: 0;\n    background-color: var(--theme-color-component-1);\n  }\n\n  .expand-content.show {\n    grid-template-rows: 14.75rem;\n    opacity: 1;\n  }\n\n  .expand-content-inner {\n    position: relative;\n    height: 100%;\n    overflow: hidden;\n  }\n\n  .expand-content.show .expand-content-body {\n    display: none;\n    overflow: hidden;\n    color: var(--theme-color-std-text);\n  }\n\n  .expand-content.show .expand-content-body {\n    display: block;\n    overflow: auto;\n    height: calc(100% - 1rem);\n  }\n\n  .expand-content-footer {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 1rem;\n\n    margin-top: auto;\n    margin-bottom: 0px;\n\n    background-color: var(--theme-color-component-1);\n    border-bottom-left-radius: var(--theme-default-border-radius);\n    border-bottom-right-radius: var(--theme-default-border-radius);\n  }\n}\n","import { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\nlet accordionControlId = 0;\nconst getAriaControlsId = (prefix: string = 'expand-content') => {\n  return [prefix, accordionControlId++].join('-');\n};\n\nexport type CardAccordionExpandChangeEvent = {\n  expand: boolean;\n  nativeEvent: Event;\n};\n\n/**\n * @since 1.6.0\n */\n@Component({\n  tag: 'ix-card-accordion',\n  styleUrl: 'card-accordion.scss',\n  shadow: true,\n})\nexport class CardAccordion {\n  /**\n   * Collapse the card\n   * @since 2.1.0\n   */\n  @Prop() collapse = false;\n\n  @Element() hostElement!: HTMLIxCardAccordionElement;\n\n  /**\n   * @internal\n   */\n  @Event() accordionExpand!: EventEmitter<CardAccordionExpandChangeEvent>;\n\n  @State() expandContent = false;\n\n  @Watch('collapse')\n  onInitialExpandChange() {\n    this.expandContent = !this.collapse;\n  }\n\n  get expandedContent() {\n    return this.hostElement.shadowRoot!.querySelector('.expand-content');\n  }\n\n  onExpandActionClick(event: Event) {\n    event.preventDefault();\n    event.stopPropagation();\n    this.expandContent = !this.expandContent;\n    this.accordionExpand.emit({\n      expand: this.expandContent,\n      nativeEvent: event,\n    });\n\n    if (this.expandContent) {\n      this.scrollExpandedContentIntoView();\n    }\n  }\n\n  private scrollExpandedContentIntoView() {\n    setTimeout(() => {\n      const rect = this.expandedContent!.getBoundingClientRect();\n      if (rect.bottom > window.innerHeight) {\n        this.hostElement\n          .shadowRoot!.querySelector('.expand-content')!\n          .scrollIntoView(false);\n      }\n    }, 150);\n  }\n\n  componentWillLoad() {\n    this.onInitialExpandChange();\n  }\n\n  render() {\n    return (\n      <Host slot=\"card-accordion\">\n        <button\n          tabIndex={0}\n          class={{ 'expand-action': true, show: this.expandContent }}\n          onClick={(event) => this.onExpandActionClick(event)}\n          role=\"button\"\n          type=\"button\"\n          aria-expanded={this.expandContent}\n          aria-controls={getAriaControlsId()}\n        >\n          <ix-icon\n            name={iconChevronRightSmall}\n            class={{\n              'expand-icon': true,\n              show: this.expandContent,\n            }}\n          ></ix-icon>\n        </button>\n        <div\n          class={{\n            'expand-content': true,\n            show: this.expandContent,\n          }}\n        >\n          <div class=\"expand-content-inner\">\n            <div class=\"expand-content-body\">\n              <slot></slot>\n            </div>\n            <div class=\"expand-content-footer\"></div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import 'common-variables';\n\n:host {\n  display: flex;\n  position: relative;\n  flex-direction: row;\n  align-items: center;\n  margin-top: 0.25rem;\n  margin-bottom: 0.25rem;\n  gap: $default-space;\n\n  width: 100%;\n\n  .title-actions {\n    display: flex;\n    position: relative;\n    flex-direction: row;\n    gap: 0.25rem;\n    margin-left: auto;\n    margin-right: 0;\n  }\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * @slot title-actions - Place additional actions inside title\n *\n * @since 1.6.0\n */\n@Component({\n  tag: 'ix-card-title',\n  styleUrl: 'card-title.scss',\n  shadow: true,\n})\nexport class CardHeader {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n        <div class=\"title-actions\">\n          <slot name=\"title-actions\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAmB,4tFCazB,IAAIC,EAAqB,EACzB,MAAMC,EAAoB,CAACC,EAAiB,mBACnC,CAACA,EAAQF,KAAsBG,KAAK,K,MAgBhCC,EAAa,MAL1B,WAAAC,CAAAC,G,2DAUUC,KAAQC,SAAG,MASVD,KAAaE,cAAG,KA4E1B,CAzEC,qBAAAC,GACEH,KAAKE,eAAiBF,KAAKC,Q,CAG7B,mBAAIG,GACF,OAAOJ,KAAKK,YAAYC,WAAYC,cAAc,kB,CAGpD,mBAAAC,CAAoBC,GAClBA,EAAMC,iBACND,EAAME,kBACNX,KAAKE,eAAiBF,KAAKE,cAC3BF,KAAKY,gBAAgBC,KAAK,CACxBC,OAAQd,KAAKE,cACba,YAAaN,IAGf,GAAIT,KAAKE,cAAe,CACtBF,KAAKgB,+B,EAID,6BAAAA,GACNC,YAAW,KACT,MAAMC,EAAOlB,KAAKI,gBAAiBe,wBACnC,GAAID,EAAKE,OAASC,OAAOC,YAAa,CACpCtB,KAAKK,YACFC,WAAYC,cAAc,mBAC1BgB,eAAe,M,IAEnB,I,CAGL,iBAAAC,GACExB,KAAKG,uB,CAGP,MAAAsB,GACE,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,KAAK,kBACTH,EACE,UAAAE,IAAA,2CAAAE,SAAU,EACVC,MAAO,CAAE,gBAAiB,KAAMC,KAAMhC,KAAKE,eAC3C+B,QAAUxB,GAAUT,KAAKQ,oBAAoBC,GAC7CyB,KAAK,SACLC,KAAK,SAAQ,gBACEnC,KAAKE,cACL,gBAAAR,KAEfgC,EAAA,WAAAE,IAAA,2CACEQ,KAAMC,EACNN,MAAO,CACL,cAAe,KACfC,KAAMhC,KAAKE,kBAIjBwB,EAAA,OAAAE,IAAA,2CACEG,MAAO,CACL,iBAAkB,KAClBC,KAAMhC,KAAKE,gBAGbwB,EAAK,OAAAE,IAAA,2CAAAG,MAAM,wBACTL,EAAK,OAAAE,IAAA,2CAAAG,MAAM,uBACTL,EAAA,QAAAE,IAAA,8CAEFF,EAAK,OAAAE,IAAA,2CAAAG,MAAM,4B,+GCnHvB,MAAMO,EAAe,8P,MCYRC,EAAU,M,yBACrB,MAAAd,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAa,QAAAE,IAAA,6CACbF,EAAK,OAAAE,IAAA,2CAAAG,MAAM,iBACTL,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,mB","ignoreList":[]}

package/dist/siemens-ix/p-cbf9dc1c.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,f as r,H as s,g as o}from"./p-DtF9fwpD.js";import{b as a,a as h}from"./p-Bb7pDeaQ.js";import{c as l}from"./p-CX81WQtk.js";import{m as n}from"./p-bcj7UEIC.js";const c=":host{display:flex;justify-content:flex-start;height:2.5rem;align-items:center;background-color:transparent;overflow:hidden}: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 .previous-button{width:3rem;min-width:0px}:host .crumb-dropdown{overflow:visible}:host .remove-anchor::after{display:none}:host .more-text{display:flex}:host .more-text .more-text-ellipsis{width:1rem;display:inline-block;font-weight:700}:host .more-text ix-icon{padding-top:2px}:host nav,:host ol,:host .crumb-items{display:contents}";let b=0;const d=(t="breadcrumb-")=>`${t}-${b++}`;const m=class{constructor(i){t(this,i);this.itemClick=e(this,"itemClick",7);this.nextClick=e(this,"nextClick",7);this.visibleItemCount=9;this.nextItems=[];this.ghost=true;this.ariaLabelPreviousButton="previous";this.previousButtonRef=n();this.nextButtonRef=n();this.items=[];this.isPreviousDropdownExpanded=false;this.previousButtonId=d();this.previousDropdownId=d()}onNextItemsChange(){this.onChildMutation()}onItemClick(t){this.itemClick.emit(t)}componentDidLoad(){this.mutationObserver=l((()=>this.onChildMutation()));this.mutationObserver.observe(this.hostElement,{subtree:true,childList:true})}componentWillLoad(){this.onChildMutation()}disconnectedCallback(){var t;(t=this.mutationObserver)===null||t===void 0?void 0:t.disconnect()}async onChildMutation(){const t=this.getItems();t.forEach(((e,i)=>{const r=this.nextItems.length!==0&&t.length-1===i;e.ghost=this.ghost;e.showChevron=t.length-1!==i||r;e.isDropdownTrigger=r;if(r){this.nextButtonRef(e)}if(t.length<this.visibleItemCount){return}e.visible=i>=t.length-this.visibleItemCount}));this.items=t}getItems(){return Array.from(this.hostElement.querySelectorAll("ix-breadcrumb-item"))}render(){var t,e,o,l;const n=a(this.hostElement);return i(s,{key:"ad4b8c147f3478a9cb8f01d5f46b99ff86ee323f"},i("ix-dropdown",{key:"b8fa759644e7252e3f25c5805e06196ad7acfeb3",id:this.previousDropdownId,"aria-label":this.ariaLabelPreviousButton,trigger:((t=this.items)===null||t===void 0?void 0:t.length)>this.visibleItemCount?this.previousButtonRef.waitForCurrent():undefined,onShowChanged:({detail:t})=>{this.isPreviousDropdownExpanded=t;const e=this.hostElement.shadowRoot.getElementById(this.previousButtonId);if(e){r(e)}}},this.items.slice(0,this.items.length-this.visibleItemCount).map((t=>{var e;const r=(e=t.label)!==null&&e!==void 0?e:t.innerText;return i("ix-dropdown-item",{label:r,onClick:()=>{this.onItemClick(r)},onItemClick:t=>t.stopPropagation()})}))),((e=this.items)===null||e===void 0?void 0:e.length)>this.visibleItemCount?i("ix-breadcrumb-item",{id:this.previousButtonId,ref:this.previousButtonRef,label:"...",tabIndex:1,onItemClick:t=>t.stopPropagation(),"aria-describedby":this.previousDropdownId,"aria-controls":this.previousDropdownId,"aria-expanded":h(this.isPreviousDropdownExpanded),class:"previous-button"}):null,i("nav",{key:"894aa6aba077c3154ff4e2f75ea90e044c9dd1b8",class:"crumb-items","aria-label":(o=n["aria-label"])!==null&&o!==void 0?o:"breadcrumbs"},i("ol",{key:"a1bba2fc77e17877306e996373dc6269c7530e48"},i("slot",{key:"50dea282515e311e37ea48776793cc0aaa6746b2"}))),i("ix-dropdown",{key:"3ebe74020ea3edabcaff09c3840db5fdeef1581d",trigger:this.nextButtonRef.waitForCurrent()},(l=this.nextItems)===null||l===void 0?void 0:l.map((t=>i("ix-dropdown-item",{label:t,onClick:e=>{this.nextClick.emit({event:e,item:t})},onItemClick:t=>t.stopPropagation()})))))}get hostElement(){return o(this)}static get watchers(){return{nextItems:["onNextItemsChange"]}}};m.style=c;export{m as ix_breadcrumb};
+//# sourceMappingURL=p-cbf9dc1c.entry.js.map

package/dist/siemens-ix/p-cbf9dc1c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["breadcrumbCss","sequenceId","createId","prefix","Breadcrumb","constructor","hostRef","this","visibleItemCount","nextItems","ghost","ariaLabelPreviousButton","previousButtonRef","makeRef","nextButtonRef","items","isPreviousDropdownExpanded","previousButtonId","previousDropdownId","onNextItemsChange","onChildMutation","onItemClick","item","itemClick","emit","componentDidLoad","mutationObserver","createMutationObserver","observe","hostElement","subtree","childList","componentWillLoad","disconnectedCallback","_a","disconnect","updatedItems","getItems","forEach","bc","index","shouldShowDropdown","length","showChevron","isDropdownTrigger","visible","Array","from","querySelectorAll","render","a11y","a11yHostAttributes","h","Host","key","id","trigger","waitForCurrent","undefined","onShowChanged","detail","previousButton","shadowRoot","getElementById","forceUpdate","slice","map","label","innerText","onClick","event","stopPropagation","_b","ref","tabIndex","a11yBoolean","class","_c","_d","e","nextClick"],"sources":["src/components/breadcrumb/breadcrumb.scss?tag=ix-breadcrumb&encapsulation=shadow","src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  justify-content: flex-start;\n  height: 2.5rem;\n  align-items: center;\n  background-color: transparent;\n  overflow: hidden;\n\n  .previous-button {\n    width: 3rem;\n    min-width: 0px;\n  }\n\n  .crumb-dropdown {\n    overflow: visible;\n  }\n\n  .remove-anchor::after {\n    display: none;\n  }\n\n  .more-text {\n    display: flex;\n\n    .more-text-ellipsis {\n      width: 1rem;\n      display: inline-block;\n      font-weight: $font-weight-bold;\n    }\n\n    ix-icon {\n      // line-height: unset; --> Note: 'line-height' can't be applied due to shadow DOM encapsulation at ix-icon\n      // using padding-top to achieve same position as before\n      padding-top: 2px;\n    }\n  }\n\n  nav,\n  ol,\n  .crumb-items {\n    display: contents;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { a11yBoolean, a11yHostAttributes } from '../utils/a11y';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { makeRef } from '../utils/make-ref';\n\nlet sequenceId = 0;\nconst createId = (prefix: string = 'breadcrumb-') => {\n  return `${prefix}-${sequenceId++}`;\n};\n\n@Component({\n  tag: 'ix-breadcrumb',\n  styleUrl: 'breadcrumb.scss',\n  shadow: true,\n})\nexport class Breadcrumb {\n  @Element() hostElement!: HTMLIxBreadcrumbElement;\n\n  /**\n   * Excess items will get hidden inside of dropdown\n   */\n  @Prop() visibleItemCount = 9;\n\n  /**\n   * Items will be accessible through a dropdown\n   */\n  @Prop() nextItems: string[] = [];\n  @Watch('nextItems')\n  onNextItemsChange() {\n    this.onChildMutation();\n  }\n\n  /**\n   * Ghost breadcrumbs will not show solid backgrounds on individual crumbs unless there is a mouse event (e.g. hover)\n   */\n  @Prop() ghost = true;\n\n  /**\n   * Accessibility label for the dropdown button (ellipsis icon) used to access the dropdown list\n   * with conditionally hidden previous items\n   *\n   * @since 2.0.0\n   */\n  @Prop() ariaLabelPreviousButton = 'previous';\n\n  /**\n   * Crumb item clicked event\n   */\n  @Event() itemClick!: EventEmitter<string>;\n\n  /**\n   * Next item clicked event\n   */\n  @Event() nextClick!: EventEmitter<{ event: UIEvent; item: string }>;\n\n  private readonly previousButtonRef = makeRef<HTMLIxBreadcrumbItemElement>();\n  private readonly nextButtonRef = makeRef<HTMLElement>();\n\n  @State() items: HTMLIxBreadcrumbItemElement[] = [];\n  @State() isPreviousDropdownExpanded = false;\n\n  private mutationObserver?: MutationObserver;\n\n  private previousButtonId = createId();\n  private previousDropdownId = createId();\n\n  private onItemClick(item: string) {\n    this.itemClick.emit(item);\n  }\n\n  componentDidLoad() {\n    this.mutationObserver = createMutationObserver(() =>\n      this.onChildMutation()\n    );\n\n    this.mutationObserver.observe(this.hostElement, {\n      subtree: true,\n      childList: true,\n    });\n  }\n\n  componentWillLoad() {\n    this.onChildMutation();\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n  }\n\n  private async onChildMutation() {\n    const updatedItems = this.getItems();\n\n    updatedItems.forEach((bc, index) => {\n      const shouldShowDropdown =\n        this.nextItems.length !== 0 && updatedItems.length - 1 === index;\n\n      bc.ghost = this.ghost;\n      bc.showChevron = updatedItems.length - 1 !== index || shouldShowDropdown;\n      bc.isDropdownTrigger = shouldShowDropdown;\n\n      if (shouldShowDropdown) {\n        this.nextButtonRef(bc);\n      }\n\n      if (updatedItems.length < this.visibleItemCount) {\n        return;\n      }\n\n      bc.visible = index >= updatedItems.length - this.visibleItemCount;\n    });\n\n    this.items = updatedItems;\n  }\n\n  private getItems() {\n    return Array.from(this.hostElement.querySelectorAll('ix-breadcrumb-item'));\n  }\n\n  render() {\n    const a11y = a11yHostAttributes(this.hostElement);\n    return (\n      <Host>\n        <ix-dropdown\n          id={this.previousDropdownId}\n          aria-label={this.ariaLabelPreviousButton}\n          trigger={\n            this.items?.length > this.visibleItemCount\n              ? this.previousButtonRef.waitForCurrent()\n              : undefined\n          }\n          onShowChanged={({ detail }) => {\n            this.isPreviousDropdownExpanded = detail;\n\n            const previousButton = this.hostElement.shadowRoot!.getElementById(\n              this.previousButtonId\n            );\n\n            // Need to force update previous button to change `aria-expanded`\n            if (previousButton) {\n              forceUpdate(previousButton);\n            }\n          }}\n        >\n          {this.items\n            .slice(0, this.items.length - this.visibleItemCount)\n            .map((item) => {\n              const label = item.label ?? item.innerText;\n\n              return (\n                <ix-dropdown-item\n                  label={label}\n                  onClick={() => {\n                    this.onItemClick(label);\n                  }}\n                  onItemClick={(event) => event.stopPropagation()}\n                ></ix-dropdown-item>\n              );\n            })}\n        </ix-dropdown>\n        {this.items?.length > this.visibleItemCount ? (\n          <ix-breadcrumb-item\n            id={this.previousButtonId}\n            ref={this.previousButtonRef}\n            label=\"...\"\n            tabIndex={1}\n            onItemClick={(event) => event.stopPropagation()}\n            aria-describedby={this.previousDropdownId}\n            aria-controls={this.previousDropdownId}\n            aria-expanded={a11yBoolean(this.isPreviousDropdownExpanded)}\n            class={'previous-button'}\n          ></ix-breadcrumb-item>\n        ) : null}\n        <nav\n          class=\"crumb-items\"\n          aria-label={a11y['aria-label'] ?? 'breadcrumbs'}\n        >\n          <ol>\n            <slot></slot>\n          </ol>\n        </nav>\n        <ix-dropdown trigger={this.nextButtonRef.waitForCurrent()}>\n          {this.nextItems?.map((item) => (\n            <ix-dropdown-item\n              label={item}\n              onClick={(e) => {\n                this.nextClick.emit({\n                  event: e,\n                  item,\n                });\n              }}\n              onItemClick={(event) => event.stopPropagation()}\n            ></ix-dropdown-item>\n          ))}\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-cc843644.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as r,H as s,g as o}from"./p-DtF9fwpD.js";import{c as i}from"./p-CX81WQtk.js";const c=":host{display:block;position:relative;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;min-width:2rem}: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 .steps{display:flex;height:100%}:host .steps.vertical{flex-direction:column}";const a=class{constructor(r){t(this,r);this.stepSelected=e(this,"stepSelected",7);this.vertical=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}updateSteps(){let t=this.getSteps();t.forEach(((e,r)=>{e.vertical=this.vertical;e.clickable=this.clickable;e.selected=this.selectedIndex===r;if(t.length===1){e.position="single";return}if(r===0){e.position="first"}else if(r===t.length-1){e.position="last"}else{e.position="undefined"}}))}onStepSelectionChanged(t){const e=t.detail;const r=this.getSteps();const s=r.findIndex((t=>t===e));const o=this.stepSelected.emit(s);if(o.defaultPrevented){return}r.forEach(((t,e)=>{t.selected=e===s}))}componentWillLoad(){this.updateSteps()}componentDidLoad(){this.observer=i((t=>{for(let e of t){if(e.type==="childList"){this.updateSteps()}}}));this.observer.observe(this.hostElement,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentDidRender(){this.updateSteps()}render(){return r(s,{key:"192c534bab7bc83c33b9c479817b9bec7967f759"},r("div",{key:"9b35cb1aa638c73acf3cca0fb359e4b26ed8004e",class:{steps:true,vertical:this.vertical}},r("slot",{key:"5feb3ad4a26faed8f4071673980ab1bb3fe27970"})))}get hostElement(){return o(this)}};a.style=c;export{a as ix_workflow_steps};
+//# sourceMappingURL=p-cc843644.entry.js.map

package/dist/siemens-ix/p-cc843644.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["workflowStepsCss","WorkflowSteps","constructor","hostRef","this","vertical","clickable","selectedIndex","getSteps","Array","from","hostElement","querySelectorAll","updateSteps","steps","forEach","element","index","selected","length","position","onStepSelectionChanged","event","eventTarget","detail","clickIndex","findIndex","step","clientEvent","stepSelected","emit","defaultPrevented","componentWillLoad","componentDidLoad","observer","createMutationObserver","mutations","mutation","type","observe","childList","disconnectedCallback","disconnect","componentDidRender","render","h","Host","key","class"],"sources":["src/components/workflow-steps/workflow-steps.scss?tag=ix-workflow-steps&encapsulation=shadow","src/components/workflow-steps/workflow-steps.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/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  width: fit-content;\n  height: fit-content;\n  min-width: 2rem;\n\n  .steps {\n    display: flex;\n    height: 100%;\n\n    &.vertical {\n      flex-direction: column;\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  Listen,\n  Prop,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n@Component({\n  tag: 'ix-workflow-steps',\n  styleUrl: 'workflow-steps.scss',\n  shadow: true,\n})\nexport class WorkflowSteps {\n  @Element() hostElement!: HTMLIxWorkflowStepsElement;\n\n  /**\n   * Select orientation\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() clickable: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() selectedIndex: number = 0;\n\n  /**\n   * On step selected event\n   */\n  @Event() stepSelected!: EventEmitter<number>;\n\n  private getSteps() {\n    return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));\n  }\n\n  updateSteps() {\n    let steps = this.getSteps();\n    steps.forEach((element, index) => {\n      element.vertical = this.vertical;\n      element.clickable = this.clickable;\n      element.selected = this.selectedIndex === index;\n\n      if (steps.length === 1) {\n        element.position = 'single';\n        return;\n      }\n\n      if (index === 0) {\n        element.position = 'first';\n      } else if (index === steps.length - 1) {\n        element.position = 'last';\n      } else {\n        element.position = 'undefined';\n      }\n    });\n  }\n\n  private observer?: MutationObserver;\n\n  @Listen('selectedChanged')\n  onStepSelectionChanged(event: CustomEvent<HTMLIxWorkflowStepElement>) {\n    const eventTarget = event.detail;\n\n    const steps = this.getSteps();\n    const clickIndex = steps.findIndex((step) => step === eventTarget);\n    const clientEvent = this.stepSelected.emit(clickIndex);\n\n    if (clientEvent.defaultPrevented) {\n      return;\n    }\n\n    steps.forEach((step, index) => {\n      step.selected = index === clickIndex;\n    });\n  }\n\n  componentWillLoad() {\n    this.updateSteps();\n  }\n\n  componentDidLoad() {\n    this.observer = createMutationObserver((mutations) => {\n      for (let mutation of mutations) {\n        if (mutation.type === 'childList') {\n          this.updateSteps();\n        }\n      }\n    });\n\n    this.observer.observe(this.hostElement, { childList: true });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  componentDidRender() {\n    this.updateSteps();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={{ steps: true, vertical: this.vertical }}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAmB,s9B,MC0BZC,EAAa,MAL1B,WAAAC,CAAAC,G,qDAWUC,KAAQC,SAAY,MAKpBD,KAASE,UAAY,MAKrBF,KAAaG,cAAW,CAuFjC,CAhFS,QAAAC,GACN,OAAOC,MAAMC,KAAKN,KAAKO,YAAYC,iBAAiB,oB,CAGtD,WAAAC,GACE,IAAIC,EAAQV,KAAKI,WACjBM,EAAMC,SAAQ,CAACC,EAASC,KACtBD,EAAQX,SAAWD,KAAKC,SACxBW,EAAQV,UAAYF,KAAKE,UACzBU,EAAQE,SAAWd,KAAKG,gBAAkBU,EAE1C,GAAIH,EAAMK,SAAW,EAAG,CACtBH,EAAQI,SAAW,SACnB,M,CAGF,GAAIH,IAAU,EAAG,CACfD,EAAQI,SAAW,O,MACd,GAAIH,IAAUH,EAAMK,OAAS,EAAG,CACrCH,EAAQI,SAAW,M,KACd,CACLJ,EAAQI,SAAW,W,KAQzB,sBAAAC,CAAuBC,GACrB,MAAMC,EAAcD,EAAME,OAE1B,MAAMV,EAAQV,KAAKI,WACnB,MAAMiB,EAAaX,EAAMY,WAAWC,GAASA,IAASJ,IACtD,MAAMK,EAAcxB,KAAKyB,aAAaC,KAAKL,GAE3C,GAAIG,EAAYG,iBAAkB,CAChC,M,CAGFjB,EAAMC,SAAQ,CAACY,EAAMV,KACnBU,EAAKT,SAAWD,IAAUQ,CAAU,G,CAIxC,iBAAAO,GACE5B,KAAKS,a,CAGP,gBAAAoB,GACE7B,KAAK8B,SAAWC,GAAwBC,IACtC,IAAK,IAAIC,KAAYD,EAAW,CAC9B,GAAIC,EAASC,OAAS,YAAa,CACjClC,KAAKS,a,MAKXT,KAAK8B,SAASK,QAAQnC,KAAKO,YAAa,CAAE6B,UAAW,M,CAGvD,oBAAAC,GACE,GAAIrC,KAAK8B,SAAU,CACjB9B,KAAK8B,SAASQ,Y,EAIlB,kBAAAC,GACEvC,KAAKS,a,CAGP,MAAA+B,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,CAAElC,MAAO,KAAMT,SAAUD,KAAKC,WACxCwC,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/siemens-ix/p-ce331bdc.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,H as e,g as r}from"./p-DtF9fwpD.js";import{f as o,i as h,s as n,o as a,a as d,c as l}from"./p-CAqtPJ4-.js";import{A as c}from"./p-CUWFODSd.js";import{d as u,h as f}from"./p-D3K9vmFp.js";import{f as b}from"./p-CFRrPFxi.js";import{a as m}from"./p-CKoABG1h.js";const v=":host{background-color:var(--theme-color-2);border-radius:var(--theme-default-border-radius);min-width:0px;z-index:var(--theme-z-index-dropdown);box-shadow:var(--theme-shadow-4);padding:0.25rem 0px}: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 .dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}:host(.overflow){max-height:50vh;overflow-y:auto}:host(:not(.show)){display:none}";let w=0;const p=class{constructor(s){t(this,s);this.showChanged=i(this,"showChanged",7);this.suppressAutomaticPlacement=false;this.show=false;this.closeBehavior="both";this.placement="bottom-start";this.positioningStrategy="fixed";this.discoverAllSubmenus=false;this.ignoreRelatedSubmenu=false;this.suppressOverflowBehavior=false;this.localUId=`dropdown-${w++}`;this.assignedSubmenu=[];this.itemObserver=new MutationObserver((()=>{if(this.arrowFocusController){this.arrowFocusController.items=this.dropdownItems}}))}connectedCallback(){u.connected(this);if(this.trigger!=undefined){this.registerListener(this.trigger)}}cacheSubmenuId(t){t.stopImmediatePropagation();t.preventDefault();const{detail:i}=t;if(this.assignedSubmenu.indexOf(i)===-1){this.assignedSubmenu.push(i)}}disconnectedCallback(){var t;u.dismiss(this);u.disconnected(this);if(this.arrowFocusController){(t=this.arrowFocusController)===null||t===void 0?void 0:t.disconnect();this.arrowFocusController=undefined}if(this.itemObserver){this.itemObserver.disconnect();this.itemObserver=undefined}if(this.disposeClickListener){this.disposeClickListener();this.disposeClickListener=undefined}if(this.disposeKeyListener){this.disposeKeyListener();this.disposeKeyListener=undefined}if(this.autoUpdateCleanup){this.autoUpdateCleanup();this.autoUpdateCleanup=undefined}}getAssignedSubmenuIds(){return this.assignedSubmenu}isPresent(){return this.show}present(){this.show=true}dismiss(){this.show=false}getId(){return this.localUId}willDismiss(){const{defaultPrevented:t}=this.showChanged.emit(false);return!t}willPresent(){const{defaultPrevented:t}=this.showChanged.emit(true);return!t}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-dropdown-item"))}get slotElement(){return this.hostElement.shadowRoot.querySelector("slot")}addEventListenersFor(){var t,i,s;(t=this.disposeClickListener)===null||t===void 0?void 0:t.call(this);(i=this.disposeKeyListener)===null||i===void 0?void 0:i.call(this);const e=()=>{if(!this.isPresent()){u.present(this)}else{u.dismiss(this)}u.dismissOthers(this.getId())};if(!this.triggerElement){return}this.disposeClickListener=m(this.triggerElement,"click",(t=>{if(!t.defaultPrevented){e()}}));(s=this.triggerElement)===null||s===void 0?void 0:s.setAttribute("data-ix-dropdown-trigger",this.localUId)}async discoverSubmenu(){var t;(t=this.triggerElement)===null||t===void 0?void 0:t.dispatchEvent(new CustomEvent("ix-assign-sub-menu",{bubbles:true,composed:true,cancelable:true,detail:this.localUId}))}registerKeyListener(){if(!this.triggerElement){return}this.disposeKeyListener=m(this.triggerElement,"keydown",(t=>{if(t.key!=="ArrowDown"){return}if(document.activeElement!==this.triggerElement){return}u.present(this);setTimeout((()=>{this.focusDropdownItem(0)}))}))}async registerListener(t){this.triggerElement=await this.resolveElement(t);if(this.triggerElement){this.addEventListenersFor();this.discoverSubmenu()}}async resolveElement(t){const i=await b(t);return this.checkForSubmenuAnchor(i)}async checkForSubmenuAnchor(t){if(!t){return undefined}if(f(t)){const i=await t.getDropdownItemElement();i.isSubMenu=true;this.hostElement.style.zIndex=`var(--theme-z-index-dropdown)`}if(t.tagName==="IX-DROPDOWN-ITEM"){t.isSubMenu=true;this.hostElement.style.zIndex=`var(--theme-z-index-dropdown)`}return t}async resolveAnchorElement(){if(this.anchor){this.anchorElement=await this.resolveElement(this.anchor)}else if(this.trigger){this.anchorElement=await this.resolveElement(this.trigger)}}async changedShow(t){var i,s,e,r;if(t){await this.resolveAnchorElement();if(this.anchorElement){this.applyDropdownPosition()}this.arrowFocusController=new c(this.dropdownItems,this.hostElement,(t=>this.focusDropdownItem(t)));(i=this.itemObserver)===null||i===void 0?void 0:i.observe(this.hostElement,{childList:true,subtree:true});this.registerKeyListener()}else{this.destroyAutoUpdate();(s=this.arrowFocusController)===null||s===void 0?void 0:s.disconnect();(e=this.itemObserver)===null||e===void 0?void 0:e.disconnect();(r=this.disposeKeyListener)===null||r===void 0?void 0:r.call(this)}}changedTrigger(t){this.registerListener(t)}destroyAutoUpdate(){if(this.autoUpdateCleanup){this.autoUpdateCleanup();this.autoUpdateCleanup=undefined}}isAnchorSubmenu(){var t;if(!f(this.anchorElement)){return!!((t=this.anchorElement)===null||t===void 0?void 0:t.closest("ix-dropdown-item"))}return true}async applyDropdownPosition(){var t,i;if(!this.show){return}if(!this.anchorElement){return}const s=this.isAnchorSubmenu();let e={strategy:this.positioningStrategy,middleware:[]};if(!this.suppressAutomaticPlacement){(t=e.middleware)===null||t===void 0?void 0:t.push(o({fallbackStrategy:"initialPlacement"}))}e.placement=s?"right-start":this.placement;e.middleware=[...((i=e.middleware)===null||i===void 0?void 0:i.filter(Boolean))||[],h(),n()];if(this.offset){e.middleware.push(a(this.offset))}this.destroyAutoUpdate();if(!this.anchorElement){return}this.autoUpdateCleanup=d(this.anchorElement,this.hostElement,(async()=>{if(this.anchorElement){const t=await l(this.anchorElement,this.hostElement,e);Object.assign(this.hostElement.style,{top:"0",left:"0",transform:`translate(${Math.round(t.x)}px,${Math.round(t.y)}px)`})}if(this.overwriteDropdownStyle){const t=await this.overwriteDropdownStyle({dropdownRef:this.hostElement,triggerRef:this.triggerElement});Object.assign(this.hostElement.style,t)}}),{ancestorResize:true,ancestorScroll:true,elementResize:true})}focusDropdownItem(t){requestAnimationFrame((()=>{var i,s;const e=(s=(i=this.dropdownItems[t])===null||i===void 0?void 0:i.shadowRoot)===null||s===void 0?void 0:s.querySelector("button");if(e){e.focus()}}))}async componentDidLoad(){if(!this.trigger){return}this.changedTrigger(this.trigger)}async componentDidRender(){await this.applyDropdownPosition();await this.resolveAnchorElement()}isTriggerElement(t){const i=!!t.hasAttribute("data-ix-dropdown-trigger");return i}onDropdownClick(t){const i=u.pathIncludesTrigger(t.composedPath());if(i){if(i!==this.triggerElement){t.preventDefault()}if(this.isTriggerElement(i)){if(this.closeBehavior==="outside"){t.preventDefault()}return}}if(!t.defaultPrevented&&(this.closeBehavior==="inside"||this.closeBehavior==="both")){u.dismissAll([this.getId()],this.ignoreRelatedSubmenu);return}u.dismissOthers(this.getId())}async updatePosition(){this.applyDropdownPosition()}render(){return s(e,{key:"8cb74ddd59a4160b1d85285244391fc8ae275c6d","data-ix-dropdown":this.localUId,class:{"dropdown-menu":true,show:this.show,overflow:!this.suppressOverflowBehavior},style:{margin:"0",minWidth:"0px",position:this.positioningStrategy},role:"list",onClick:t=>this.onDropdownClick(t)},s("div",{key:"ebbec839d63ecf94c025d7d20018a150dee89162",style:{display:"contents"}},this.header&&s("div",{key:"9a25904cd90dbec2f738567350bf0f0ada723abf",class:"dropdown-header"},this.header),this.show&&s("slot",{key:"f0b63a8335765d212f72fdc04f155e367a65c0a6"})))}get hostElement(){return r(this)}static get watchers(){return{show:["changedShow"],trigger:["changedTrigger"]}}};p.style=v;export{p as ix_dropdown};
+//# sourceMappingURL=p-ce331bdc.entry.js.map

package/dist/siemens-ix/p-ce331bdc.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownCss","sequenceId","Dropdown","constructor","hostRef","this","suppressAutomaticPlacement","show","closeBehavior","placement","positioningStrategy","discoverAllSubmenus","ignoreRelatedSubmenu","suppressOverflowBehavior","localUId","assignedSubmenu","itemObserver","MutationObserver","arrowFocusController","items","dropdownItems","connectedCallback","dropdownController","connected","trigger","undefined","registerListener","cacheSubmenuId","event","stopImmediatePropagation","preventDefault","detail","indexOf","push","disconnectedCallback","dismiss","disconnected","_a","disconnect","disposeClickListener","disposeKeyListener","autoUpdateCleanup","getAssignedSubmenuIds","isPresent","present","getId","willDismiss","defaultPrevented","showChanged","emit","willPresent","Array","from","hostElement","querySelectorAll","slotElement","shadowRoot","querySelector","addEventListenersFor","call","_b","toggleController","dismissOthers","triggerElement","addDisposableEventListener","_c","setAttribute","discoverSubmenu","dispatchEvent","CustomEvent","bubbles","composed","cancelable","registerKeyListener","key","document","activeElement","setTimeout","focusDropdownItem","element","resolveElement","el","findElement","checkForSubmenuAnchor","hasDropdownItemWrapperImplemented","dropdownItem","getDropdownItemElement","isSubMenu","style","zIndex","tagName","resolveAnchorElement","anchor","anchorElement","changedShow","newShow","applyDropdownPosition","ArrowFocusController","index","observe","childList","subtree","destroyAutoUpdate","_d","changedTrigger","newTriggerValue","isAnchorSubmenu","closest","isSubmenu","positionConfig","strategy","middleware","flip","fallbackStrategy","filter","Boolean","inline","shift","offset","autoUpdate","async","computeResponse","computePosition","Object","assign","top","left","transform","Math","round","x","y","overwriteDropdownStyle","overwriteStyle","dropdownRef","triggerRef","ancestorResize","ancestorScroll","elementResize","requestAnimationFrame","button","focus","componentDidLoad","componentDidRender","isTriggerElement","hasAttribute","onDropdownClick","target","pathIncludesTrigger","composedPath","dismissAll","updatePosition","render","h","Host","class","overflow","margin","minWidth","position","role","onClick","display","header"],"sources":["src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n\n@import 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  background-color: var(--theme-color-2);\n  border-radius: var(--theme-default-border-radius);\n  @include ix-component;\n  min-width: 0px;\n  z-index: var(--theme-z-index-dropdown);\n  box-shadow: var(--theme-shadow-4);\n\n  padding: 0.25rem 0px;\n\n  .dropdown-header {\n    display: flex;\n    align-items: center;\n    height: $large-control-height;\n    color: var(--theme-menu-header--color);\n    padding: 0 $default-space;\n  }\n}\n\n:host(.overflow) {\n  max-height: 50vh;\n  overflow-y: auto;\n}\n\n:host(:not(.show)) {\n  display: none;\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  autoUpdate,\n  computePosition,\n  ComputePositionConfig,\n  flip,\n  inline,\n  offset,\n  shift,\n} from '@floating-ui/dom';\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport { ArrowFocusController } from '../utils/focus';\nimport {\n  CloseBehavior,\n  dropdownController,\n  DropdownInterface,\n  hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\nimport { findElement } from '../utils/find-element';\nimport {\n  addDisposableEventListener,\n  DisposableEventListener,\n} from '../utils/disposable-event-listener';\nimport { ElementReference } from '../utils/element-reference';\n\nlet sequenceId = 0;\n\n@Component({\n  tag: 'ix-dropdown',\n  styleUrl: 'dropdown.scss',\n  shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n  @Element() hostElement!: HTMLIxDropdownElement;\n\n  /**\n   * Suppress the automatic placement of the dropdown.\n   *\n   * @since 2.0.0\n   */\n  @Prop() suppressAutomaticPlacement = false;\n\n  /**\n   * Show dropdown\n   */\n  @Prop({ mutable: true, reflect: true }) show = false;\n\n  /**\n   * Define an element that triggers the dropdown.\n   * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n   */\n  @Prop() trigger?: ElementReference;\n\n  /**\n   * Define an anchor element\n   */\n  @Prop() anchor?: ElementReference;\n\n  /**\n   * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n   * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n   */\n  @Prop() closeBehavior: CloseBehavior = 'both';\n\n  /**\n   * Placement of the dropdown\n   */\n  @Prop() placement: AlignedPlacement = 'bottom-start';\n\n  /**\n   * Position strategy\n   */\n  @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n  /**\n   * An optional header shown at the top of the dropdown\n   */\n  @Prop() header?: string;\n\n  /**\n   * Move dropdown along main axis of alignment\n   *\n   * @internal\n   */\n  @Prop() offset?: {\n    mainAxis?: number;\n    crossAxis?: number;\n    alignmentAxis?: number;\n  };\n\n  /**\n   * @internal\n   */\n  @Prop() overwriteDropdownStyle?: (delegate: {\n    dropdownRef: HTMLElement;\n    triggerRef?: HTMLElement;\n  }) => Promise<Partial<CSSStyleDeclaration>>;\n\n  /**\n   * @internal\n   * If initialization of this dropdown is expected to be deferred submenu discovery will have to be re-run globally by the controller.\n   * This property indicates the need for that to the controller.\n   */\n  @Prop() discoverAllSubmenus = false;\n\n  /** @internal */\n  @Prop() ignoreRelatedSubmenu = false;\n\n  /** @internal */\n  @Prop() suppressOverflowBehavior = false;\n\n  /**\n   * Fire event after visibility of dropdown has changed\n   */\n  @Event() showChanged!: EventEmitter<boolean>;\n\n  private autoUpdateCleanup?: () => void;\n\n  private triggerElement?: Element;\n  private anchorElement?: Element;\n  private arrowFocusController?: ArrowFocusController;\n\n  private localUId = `dropdown-${sequenceId++}`;\n  private assignedSubmenu: string[] = [];\n\n  private itemObserver? = new MutationObserver(() => {\n    if (this.arrowFocusController) {\n      this.arrowFocusController.items = this.dropdownItems;\n    }\n  });\n\n  connectedCallback(): void {\n    dropdownController.connected(this);\n\n    if (this.trigger != undefined) {\n      this.registerListener(this.trigger);\n    }\n  }\n\n  @Listen('ix-assign-sub-menu')\n  cacheSubmenuId(event: CustomEvent<string>) {\n    event.stopImmediatePropagation();\n    event.preventDefault();\n\n    const { detail } = event;\n\n    if (this.assignedSubmenu.indexOf(detail) === -1) {\n      this.assignedSubmenu.push(detail);\n    }\n  }\n\n  disconnectedCallback() {\n    dropdownController.dismiss(this);\n    dropdownController.disconnected(this);\n\n    if (this.arrowFocusController) {\n      this.arrowFocusController?.disconnect();\n      this.arrowFocusController = undefined;\n    }\n\n    if (this.itemObserver) {\n      this.itemObserver.disconnect();\n      this.itemObserver = undefined;\n    }\n\n    if (this.disposeClickListener) {\n      this.disposeClickListener();\n      this.disposeClickListener = undefined;\n    }\n\n    if (this.disposeKeyListener) {\n      this.disposeKeyListener();\n      this.disposeKeyListener = undefined;\n    }\n\n    if (this.autoUpdateCleanup) {\n      this.autoUpdateCleanup();\n      this.autoUpdateCleanup = undefined;\n    }\n  }\n\n  getAssignedSubmenuIds() {\n    return this.assignedSubmenu;\n  }\n\n  isPresent() {\n    return this.show;\n  }\n\n  present() {\n    this.show = true;\n  }\n\n  dismiss() {\n    this.show = false;\n  }\n\n  getId() {\n    return this.localUId;\n  }\n\n  willDismiss() {\n    const { defaultPrevented } = this.showChanged.emit(false);\n    return !defaultPrevented;\n  }\n\n  willPresent() {\n    const { defaultPrevented } = this.showChanged.emit(true);\n    return !defaultPrevented;\n  }\n\n  get dropdownItems() {\n    return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n  }\n\n  get slotElement() {\n    return this.hostElement.shadowRoot!.querySelector('slot');\n  }\n\n  private disposeClickListener?: DisposableEventListener;\n  private disposeKeyListener?: DisposableEventListener;\n\n  private addEventListenersFor() {\n    this.disposeClickListener?.();\n    this.disposeKeyListener?.();\n\n    const toggleController = () => {\n      if (!this.isPresent()) {\n        dropdownController.present(this);\n      } else {\n        dropdownController.dismiss(this);\n      }\n\n      dropdownController.dismissOthers(this.getId());\n    };\n\n    if (!this.triggerElement) {\n      return;\n    }\n\n    this.disposeClickListener = addDisposableEventListener(\n      this.triggerElement,\n      'click',\n      (event: Event) => {\n        if (!event.defaultPrevented) {\n          toggleController();\n        }\n      }\n    );\n\n    this.triggerElement?.setAttribute(\n      'data-ix-dropdown-trigger',\n      this.localUId\n    );\n  }\n\n  /** @internal */\n  @Method()\n  async discoverSubmenu() {\n    this.triggerElement?.dispatchEvent(\n      new CustomEvent('ix-assign-sub-menu', {\n        bubbles: true,\n        composed: true,\n        cancelable: true,\n        detail: this.localUId,\n      })\n    );\n  }\n\n  private registerKeyListener() {\n    if (!this.triggerElement) {\n      return;\n    }\n\n    this.disposeKeyListener = addDisposableEventListener(\n      this.triggerElement,\n      'keydown',\n      ((event: KeyboardEvent) => {\n        if (event.key !== 'ArrowDown') {\n          return;\n        }\n\n        if (document.activeElement !== this.triggerElement) {\n          return;\n        }\n\n        dropdownController.present(this);\n\n        setTimeout(() => {\n          this.focusDropdownItem(0);\n        });\n      }) as EventListener\n    );\n  }\n\n  private async registerListener(element: ElementReference) {\n    this.triggerElement = await this.resolveElement(element);\n    if (this.triggerElement) {\n      this.addEventListenersFor();\n      this.discoverSubmenu();\n    }\n  }\n\n  private async resolveElement(element: ElementReference) {\n    const el = await findElement(element);\n\n    return this.checkForSubmenuAnchor(el);\n  }\n\n  private async checkForSubmenuAnchor(element?: Element) {\n    if (!element) {\n      return undefined;\n    }\n\n    if (hasDropdownItemWrapperImplemented(element)) {\n      const dropdownItem = await element.getDropdownItemElement();\n      dropdownItem.isSubMenu = true;\n      this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n    }\n\n    if (element.tagName === 'IX-DROPDOWN-ITEM') {\n      (element as HTMLIxDropdownItemElement).isSubMenu = true;\n      this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n    }\n\n    return element;\n  }\n\n  private async resolveAnchorElement() {\n    if (this.anchor) {\n      this.anchorElement = await this.resolveElement(this.anchor);\n    } else if (this.trigger) {\n      this.anchorElement = await this.resolveElement(this.trigger);\n    }\n  }\n\n  @Watch('show')\n  async changedShow(newShow: boolean) {\n    if (newShow) {\n      await this.resolveAnchorElement();\n\n      if (this.anchorElement) {\n        this.applyDropdownPosition();\n      }\n\n      this.arrowFocusController = new ArrowFocusController(\n        this.dropdownItems,\n        this.hostElement,\n        (index) => this.focusDropdownItem(index)\n      );\n\n      this.itemObserver?.observe(this.hostElement, {\n        childList: true,\n        subtree: true,\n      });\n\n      this.registerKeyListener();\n    } else {\n      this.destroyAutoUpdate();\n      this.arrowFocusController?.disconnect();\n      this.itemObserver?.disconnect();\n      this.disposeKeyListener?.();\n    }\n  }\n\n  @Watch('trigger')\n  changedTrigger(newTriggerValue: ElementReference) {\n    this.registerListener(newTriggerValue);\n  }\n\n  private destroyAutoUpdate() {\n    if (this.autoUpdateCleanup) {\n      this.autoUpdateCleanup();\n      this.autoUpdateCleanup = undefined;\n    }\n  }\n\n  private isAnchorSubmenu(): boolean {\n    if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n      // Is no official dropdown-item, but check if any dropdown-item\n      // is placed somewhere up the DOM\n      return !!this.anchorElement?.closest('ix-dropdown-item');\n    }\n\n    return true;\n  }\n\n  private async applyDropdownPosition() {\n    if (!this.show) {\n      return;\n    }\n    if (!this.anchorElement) {\n      return;\n    }\n    const isSubmenu = this.isAnchorSubmenu();\n\n    let positionConfig: Partial<ComputePositionConfig> = {\n      strategy: this.positioningStrategy,\n      middleware: [],\n    };\n\n    if (!this.suppressAutomaticPlacement) {\n      positionConfig.middleware?.push(\n        flip({ fallbackStrategy: 'initialPlacement' })\n      );\n    }\n\n    positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n    positionConfig.middleware = [\n      ...(positionConfig.middleware?.filter(Boolean) || []),\n      inline(),\n      shift(),\n    ];\n\n    if (this.offset) {\n      positionConfig.middleware.push(offset(this.offset));\n    }\n\n    this.destroyAutoUpdate();\n\n    if (!this.anchorElement) {\n      return;\n    }\n\n    this.autoUpdateCleanup = autoUpdate(\n      this.anchorElement,\n      this.hostElement,\n      async () => {\n        if (this.anchorElement) {\n          const computeResponse = await computePosition(\n            this.anchorElement,\n            this.hostElement,\n            positionConfig\n          );\n          Object.assign(this.hostElement.style, {\n            top: '0',\n            left: '0',\n            transform: `translate(${Math.round(\n              computeResponse.x\n            )}px,${Math.round(computeResponse.y)}px)`,\n          });\n        }\n        if (this.overwriteDropdownStyle) {\n          const overwriteStyle = await this.overwriteDropdownStyle({\n            dropdownRef: this.hostElement,\n            triggerRef: this.triggerElement as HTMLElement,\n          });\n\n          Object.assign(this.hostElement.style, overwriteStyle);\n        }\n      },\n      {\n        ancestorResize: true,\n        ancestorScroll: true,\n        elementResize: true,\n      }\n    );\n  }\n\n  private focusDropdownItem(index: number) {\n    requestAnimationFrame(() => {\n      const button =\n        this.dropdownItems[index]?.shadowRoot?.querySelector('button');\n\n      if (button) {\n        button.focus();\n      }\n    });\n  }\n\n  async componentDidLoad() {\n    if (!this.trigger) {\n      return;\n    }\n\n    this.changedTrigger(this.trigger);\n  }\n\n  async componentDidRender() {\n    await this.applyDropdownPosition();\n    await this.resolveAnchorElement();\n  }\n\n  private isTriggerElement(element: HTMLElement) {\n    const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n    return trigger;\n  }\n\n  private onDropdownClick(event: PointerEvent) {\n    const target = dropdownController.pathIncludesTrigger(event.composedPath());\n    if (target) {\n      if (target !== this.triggerElement) {\n        event.preventDefault();\n      }\n\n      if (this.isTriggerElement(target)) {\n        if (this.closeBehavior === 'outside') {\n          event.preventDefault();\n        }\n        return;\n      }\n    }\n\n    if (\n      !event.defaultPrevented &&\n      (this.closeBehavior === 'inside' || this.closeBehavior === 'both')\n    ) {\n      dropdownController.dismissAll([this.getId()], this.ignoreRelatedSubmenu);\n      return;\n    }\n\n    dropdownController.dismissOthers(this.getId());\n  }\n\n  /**\n   * Update position of dropdown\n   */\n  @Method()\n  async updatePosition() {\n    this.applyDropdownPosition();\n  }\n\n  render() {\n    return (\n      <Host\n        data-ix-dropdown={this.localUId}\n        class={{\n          'dropdown-menu': true,\n          show: this.show,\n          overflow: !this.suppressOverflowBehavior,\n        }}\n        style={{\n          margin: '0',\n          minWidth: '0px',\n          position: this.positioningStrategy,\n        }}\n        role=\"list\"\n        onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n      >\n        <div style={{ display: 'contents' }}>\n          {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n          {this.show && <slot></slot>}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-cefd8579.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as o,h as t,H as r,g as i}from"./p-DtF9fwpD.js";import{O as s,f as d}from"./p-CrTP-icT.js";const a=":host{--ix-dropdown-item-checked-color:var(--theme-color-primary);display:flex;flex-direction:row;position:relative;height:2.5rem;width:auto;overflow:hidden;cursor:pointer}: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 .dropdown-item{all:unset;display:flex;flex-direction:row;align-items:center;position:relative;height:calc(100% - 2px);width:calc(100% - 0.5rem - 1.5rem);padding:0 0.5rem;padding-right:1.5rem;border:0.0625rem solid transparent;white-space:nowrap}:host .dropdown-item.no-checked-field{width:calc(100% - 1rem - 1.5rem);padding:0 1rem;padding-right:1.5rem}:host .dropdown-item:focus-visible{border-color:var(--theme-color-focus-bdr)}:host .dropdown-item-checked{display:flex;align-items:center;justify-content:center;position:relative;height:100%;width:1rem;min-width:1rem;margin-right:0.5rem;color:var(--ix-dropdown-item-checked-color)}:host .dropdown-item-icon{margin-right:0.5rem;color:var(--theme-color-std-text)}:host .dropdown-item-text{display:block;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .submenu-icon{margin-left:auto}:host(.icon-only) .dropdown-item-icon{margin-right:0px}:host(.icon-only) .dropdown-item-checked{display:none}:host(.icon-only) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(.submenu) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(:not(.disabled):not(:disabled).hover),:host(:not(.disabled):not(:disabled):hover){background-color:var(--theme-ghost--background--hover)}:host(:not(.disabled):not(:disabled).active),:host(:not(.disabled):not(:disabled):active){background-color:var(--theme-ghost--background--active)}:host(.disabled){pointer-events:none;color:var(--theme-color-weak-text) !important}:host(.disabled) .dropdown-item-icon{color:var(--theme-color-weak-text) !important}";const n=class{constructor(t){e(this,t);this.itemClick=o(this,"itemClick",7);this.hover=false;this.disabled=false;this.checked=false;this.isSubMenu=false;this.suppressChecked=false}async emitItemClick(){this.itemClick.emit(this.hostElement)}async getDropdownItemElement(){return this.hostElement}isIconOnly(){return this.label===undefined&&this.hostElement.innerText===""&&this.icon!==undefined}render(){return t(r,{key:"9422b6909b1e14603325f59d7414344f7ad52a36",class:{hover:this.hover,"icon-only":this.isIconOnly(),disabled:this.disabled,submenu:this.isSubMenu},role:"listitem"},t("button",{key:"5e6f69c10c1f1ca203f66bdc0f16bcff3f793fe2",type:"button",tabIndex:0,class:{"dropdown-item":true,"no-checked-field":this.suppressChecked},onClick:()=>this.emitItemClick()},!this.suppressChecked?t("div",{class:"dropdown-item-checked"},this.checked?t("ix-icon",{class:"checkmark",name:s,size:"16"}):null):null,this.icon?t("ix-icon",{class:"dropdown-item-icon",name:this.icon}):null,t("div",{key:"94ae83ecf8117a15b8ce82ae3dcd94bb5f8dee7e",class:"dropdown-item-text"},this.label,t("slot",{key:"cfe3fa2bc48853786f5fe9676ad55c5418c6821a"})),this.isSubMenu?t("ix-icon",{name:d,class:"submenu-icon"}):null))}get hostElement(){return i(this)}};n.style=a;export{n as ix_dropdown_item};
+//# sourceMappingURL=p-cefd8579.entry.js.map

package/dist/siemens-ix/p-cefd8579.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownItemCss","DropdownItem","constructor","hostRef","this","hover","disabled","checked","isSubMenu","suppressChecked","emitItemClick","itemClick","emit","hostElement","getDropdownItemElement","isIconOnly","label","undefined","innerText","icon","render","h","Host","key","class","submenu","role","type","tabIndex","onClick","name","iconSingleCheck","size","iconChevronRightSmall"],"sources":["src/components/dropdown-item/dropdown-item.scss?tag=ix-dropdown-item&encapsulation=shadow","src/components/dropdown-item/dropdown-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n@import 'mixins/shadow-dom/hover';\n\n$itemPadding: 0.5rem;\n$itemPaddingRight: 1.5rem;\n$focusBorder: 0.0625rem;\n\n@mixin applyItemWidth($padding, $paddingRight) {\n  width: calc(100% - #{$padding} - #{$paddingRight});\n\n  padding: 0 $padding;\n  padding-right: $paddingRight;\n}\n\n:host {\n  --ix-dropdown-item-checked-color: var(--theme-color-primary);\n  @include ix-component;\n  display: flex;\n  flex-direction: row;\n\n  position: relative;\n  height: 2.5rem;\n  width: auto;\n  overflow: hidden;\n  cursor: pointer;\n\n  .dropdown-item {\n    all: unset;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    position: relative;\n    height: calc(100% - 2px);\n    @include applyItemWidth($itemPadding, $itemPaddingRight);\n    border: $focusBorder solid transparent;\n    white-space: nowrap;\n  }\n\n  .dropdown-item.no-checked-field {\n    @include applyItemWidth(1rem, $itemPaddingRight);\n  }\n\n  .dropdown-item:focus-visible {\n    border-color: var(--theme-color-focus-bdr);\n  }\n\n  .dropdown-item-checked {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    height: 100%;\n    width: 1rem;\n    min-width: 1rem;\n    margin-right: 0.5rem;\n\n    color: var(--ix-dropdown-item-checked-color);\n  }\n\n  .dropdown-item-icon {\n    margin-right: 0.5rem;\n    color: var(--theme-color-std-text);\n  }\n\n  .dropdown-item-text {\n    display: block;\n    position: relative;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .submenu-icon {\n    margin-left: auto;\n  }\n}\n\n:host(.icon-only) {\n  .dropdown-item-icon {\n    margin-right: 0px;\n  }\n\n  .dropdown-item-checked {\n    display: none;\n  }\n\n  .dropdown-item {\n    @include applyItemWidth(0.5rem, 0.5rem);\n  }\n}\n\n:host(.submenu) {\n  .dropdown-item {\n    @include applyItemWidth($itemPadding, 0.5rem);\n  }\n}\n\n@include ghost-hover-pressed;\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--theme-color-weak-text) !important;\n\n  .dropdown-item-icon {\n    color: var(--theme-color-weak-text) !important;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n  iconChevronRightSmall,\n  iconSingleCheck,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-dropdown-item',\n  styleUrl: 'dropdown-item.scss',\n  shadow: true,\n})\nexport class DropdownItem implements DropdownItemWrapper {\n  @Element() hostElement!: HTMLIxDropdownItemElement;\n\n  /**\n   * Label of dropdown item\n   */\n  @Prop() label?: string;\n\n  /**\n   * Icon of dropdown item\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Display hover state\n   */\n  @Prop() hover = false;\n\n  /**\n   * Disable item and remove event listeners\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Whether the item is checked or not. If true a checkmark will mark the item as checked.\n   */\n  @Prop() checked = false;\n\n  /** @internal */\n  @Prop() isSubMenu = false;\n\n  /** @internal */\n  @Prop() suppressChecked = false;\n\n  /** @internal */\n  @Event() itemClick!: EventEmitter<HTMLIxDropdownItemElement>;\n\n  /** @internal */\n  @Method()\n  async emitItemClick() {\n    this.itemClick.emit(this.hostElement);\n  }\n\n  /** @internal */\n  @Method()\n  async getDropdownItemElement() {\n    return this.hostElement;\n  }\n\n  private isIconOnly() {\n    return (\n      this.label === undefined &&\n      this.hostElement.innerText === '' &&\n      this.icon !== undefined\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          hover: this.hover,\n          'icon-only': this.isIconOnly(),\n          disabled: this.disabled,\n          submenu: this.isSubMenu,\n        }}\n        role=\"listitem\"\n      >\n        <button\n          type=\"button\"\n          tabIndex={0}\n          class={{\n            'dropdown-item': true,\n            'no-checked-field': this.suppressChecked,\n          }}\n          onClick={() => this.emitItemClick()}\n        >\n          {!this.suppressChecked ? (\n            <div class=\"dropdown-item-checked\">\n              {this.checked ? (\n                <ix-icon\n                  class=\"checkmark\"\n                  name={iconSingleCheck}\n                  size=\"16\"\n                ></ix-icon>\n              ) : null}\n            </div>\n          ) : null}\n          {this.icon ? (\n            <ix-icon class=\"dropdown-item-icon\" name={this.icon}></ix-icon>\n          ) : null}\n          <div class=\"dropdown-item-text\">\n            {this.label}\n            <slot></slot>\n          </div>\n          {this.isSubMenu ? (\n            <ix-icon\n              name={iconChevronRightSmall}\n              class={'submenu-icon'}\n            ></ix-icon>\n          ) : null}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"2GAAA,MAAMA,EAAkB,qhF,MC8BXC,EAAY,MALzB,WAAAC,CAAAC,G,+CAqBUC,KAAKC,MAAG,MAKRD,KAAQE,SAAG,MAKXF,KAAOG,QAAG,MAGVH,KAASI,UAAG,MAGZJ,KAAeK,gBAAG,KAyE3B,CAlEC,mBAAMC,GACJN,KAAKO,UAAUC,KAAKR,KAAKS,Y,CAK3B,4BAAMC,GACJ,OAAOV,KAAKS,W,CAGN,UAAAE,GACN,OACEX,KAAKY,QAAUC,WACfb,KAAKS,YAAYK,YAAc,IAC/Bd,KAAKe,OAASF,S,CAIlB,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLnB,MAAOD,KAAKC,MACZ,YAAaD,KAAKW,aAClBT,SAAUF,KAAKE,SACfmB,QAASrB,KAAKI,WAEhBkB,KAAK,YAELL,EACE,UAAAE,IAAA,2CAAAI,KAAK,SACLC,SAAU,EACVJ,MAAO,CACL,gBAAiB,KACjB,mBAAoBpB,KAAKK,iBAE3BoB,QAAS,IAAMzB,KAAKM,kBAElBN,KAAKK,gBACLY,EAAK,OAAAG,MAAM,yBACRpB,KAAKG,QACJc,EACE,WAAAG,MAAM,YACNM,KAAMC,EACNC,KAAK,OAEL,MAEJ,KACH5B,KAAKe,KACJE,EAAA,WAASG,MAAM,qBAAqBM,KAAM1B,KAAKe,OAC7C,KACJE,EAAK,OAAAE,IAAA,2CAAAC,MAAM,sBACRpB,KAAKY,MACNK,EAAA,QAAAE,IAAA,8CAEDnB,KAAKI,UACJa,EAAA,WACES,KAAMG,EACNT,MAAO,iBAEP,M","ignoreList":[]}

package/dist/siemens-ix/p-d1420219.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as a,h as s,H as e}from"./p-DtF9fwpD.js";import{m as i}from"./p-CrTP-icT.js";const o=":host{display:flex;flex-direction:row;align-items:flex-start;padding:0}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0}:host .titleGroup .secondary{padding:0.25rem 0}:host .subtitle{margin-top:-0.125rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";const r=class{constructor(s){t(this,s);this.backButtonClick=a(this,"backButtonClick",7);this.variant="primary";this.headerSubtitle=undefined;this.hasBackButton=false}render(){return s(e,{key:"928efa217011fe719ae85f242af1a6a53dd9f9a0"},this.hasBackButton?s("ix-icon-button",{class:"backButton",variant:"primary",icon:i,ghost:true,onClick:()=>this.backButtonClick.emit()}):null,s("div",{key:"9ea073b90b1b71caa19ffd417a49eed7c4308061",class:"titleGroup"},s("ix-typography",{key:"961dced5d7117a17efe8f1830968796d1d864be3",format:this.variant==="secondary"?"h4":"h3",class:this.variant==="secondary"?"secondary":""},this.headerTitle),!!this.headerSubtitle&&s("ix-typography",{key:"9bf3c18838430fdffbbc146b1577f5d2251dc3e4",format:"h6","text-color":"soft",class:this.variant==="secondary"?"subtitle":""},this.headerSubtitle)),s("div",{key:"8952391cb6163493dc5ab27b690c4375ef535ac4",class:"buttons"},s("slot",{key:"afa8f83adfda8f12a5ac50a1bde46d1e1ba60671"})))}};r.style=o;export{r as ix_content_header};
+//# sourceMappingURL=p-d1420219.entry.js.map

package/dist/siemens-ix/p-d1420219.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["contentHeaderCss","ContentHeader","constructor","hostRef","this","variant","headerSubtitle","undefined","hasBackButton","render","h","Host","key","class","icon","iconArrowLeft","ghost","onClick","backButtonClick","emit","format","headerTitle"],"sources":["src/components/content-header/content-header.scss?tag=ix-content-header&encapsulation=shadow","src/components/content-header/content-header.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  padding: 0;\n\n  .titleGroup {\n    display: flex;\n    flex-direction: column;\n    flex: 1 1 0;\n\n    .secondary {\n      padding: 0.25rem 0;\n    }\n  }\n\n  .subtitle {\n    margin-top: -0.125rem;\n  }\n\n  .backButton {\n    margin-right: 0.5rem;\n  }\n\n  .buttons {\n    flex: 0 0 auto;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconArrowLeft } from '@siemens/ix-icons/icons';\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type ContentHeaderVariant = 'primary' | 'secondary';\n\n@Component({\n  tag: 'ix-content-header',\n  styleUrl: 'content-header.scss',\n  shadow: true,\n})\nexport class ContentHeader {\n  /**\n   * Variant of content header\n   */\n  @Prop() variant: ContentHeaderVariant = 'primary';\n\n  /**\n   * Title of Header\n   */\n  @Prop() headerTitle?: string;\n\n  /**\n   * Subtitle of Header\n   */\n  @Prop() headerSubtitle: string | undefined = undefined;\n\n  /**\n   * Display a back button\n   */\n  @Prop() hasBackButton: boolean = false;\n\n  /**\n   * Triggered when back button is clicked\n   */\n  @Event() backButtonClick!: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host>\n        {this.hasBackButton ? (\n          <ix-icon-button\n            class={'backButton'}\n            variant=\"primary\"\n            icon={iconArrowLeft}\n            ghost={true}\n            onClick={() => this.backButtonClick.emit()}\n          ></ix-icon-button>\n        ) : null}\n\n        <div class=\"titleGroup\">\n          <ix-typography\n            format={this.variant === 'secondary' ? 'h4' : 'h3'}\n            class={this.variant === 'secondary' ? 'secondary' : ''}\n          >\n            {this.headerTitle}\n          </ix-typography>\n          {!!this.headerSubtitle && (\n            <ix-typography\n              format={'h6'}\n              text-color={'soft'}\n              class={this.variant === 'secondary' ? 'subtitle' : ''}\n            >\n              {this.headerSubtitle}\n            </ix-typography>\n          )}\n        </div>\n        <div class=\"buttons\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAmB,iS,MCmBZC,EAAa,MAL1B,WAAAC,CAAAC,G,2DASUC,KAAOC,QAAyB,UAUhCD,KAAcE,eAAuBC,UAKrCH,KAAaI,cAAY,KA2ClC,CApCC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFR,KAAKI,cACJE,EACE,kBAAAG,MAAO,aACPR,QAAQ,UACRS,KAAMC,EACNC,MAAO,KACPC,QAAS,IAAMb,KAAKc,gBAAgBC,SAEpC,KAEJT,EAAK,OAAAE,IAAA,2CAAAC,MAAM,cACTH,EAAA,iBAAAE,IAAA,2CACEQ,OAAQhB,KAAKC,UAAY,YAAc,KAAO,KAC9CQ,MAAOT,KAAKC,UAAY,YAAc,YAAc,IAEnDD,KAAKiB,eAELjB,KAAKE,gBACNI,EAAA,iBAAAE,IAAA,2CACEQ,OAAQ,KACI,oBACZP,MAAOT,KAAKC,UAAY,YAAc,WAAa,IAElDD,KAAKE,iBAIZI,EAAK,OAAAE,IAAA,2CAAAC,MAAM,WACTH,EAAQ,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/siemens-ix/p-d1e08a10.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as a,H as e,g as o}from"./p-DtF9fwpD.js";import{a as s}from"./p-Ou74PMQs.js";import{b as l,a as r}from"./p-Bb7pDeaQ.js";import{A as d}from"./p-Dp15M30K.js";import{O as n}from"./p-DQmgxFuB.js";function h(t,i,a=3e3){return new Promise(((e,o)=>{const s=Date.now();const l=()=>{const r=i.querySelector(t);if(r){e(r)}else{if(Date.now()-s<a){setTimeout(l)}else{o()}}};l()}))}const c="::backdrop{--ix-dialog-backdrop:var(--theme-color-lightbox, #0000008c)}:focus-visible{outline:none !important}:host{display:none}:host dialog{--ix-dialog-padding:1rem;margin:0;padding:var(--ix-dialog-padding);padding-top:calc(var(--ix-dialog-padding) + var(--ix-safe-area-inset-top));padding-bottom:calc(var(--ix-dialog-padding) + var(--ix-safe-area-inset-bottom));left:50%}:host dialog::backdrop{-webkit-backdrop-filter:blur(2.7182817459px);backdrop-filter:blur(2.7182817459px)}:host .modal{display:flex;flex-direction:column;position:relative;border:none;border-radius:var(--theme-default-border-radius);background:var(--theme-modal--background);box-shadow:var(--theme-shadow-4);color:var(--theme-color-std-text);overflow:visible;max-height:80vh;pointer-events:all}:host .modal-size-360{width:22.5rem}:host .modal-size-480{width:30rem}:host .modal-size-600{width:37.5rem}:host .modal-size-720{width:45rem}:host .modal-size-840{width:52.5rem}:host .modal-size-full-width{width:95%}:host .modal-size-full-screen{border-radius:0;left:0 !important;top:0 !important;transform:none !important;box-shadow:none;--ix-dialog-full-screen-height:calc(\n    var(--ix-safe-area-inset-top) + var(--ix-safe-area-inset-bottom)\n  );width:calc(100% - var(--ix-dialog-padding) * 2);min-width:calc(100% - var(--ix-dialog-padding) * 2);max-width:calc(100% - var(--ix-dialog-padding) * 2);min-height:calc(100% - var(--ix-dialog-padding) * 2 - var(--ix-dialog-full-screen-height));max-height:calc(100% - var(--ix-dialog-padding) * 2 - var(--ix-dialog-full-screen-height))}:host dialog.modal-size-full-screen::backdrop{background:var(--theme-modal--background)}:host .dialog-backdrop{display:block;position:fixed;width:100vw;height:100vh;top:0;left:0;pointer-events:none}:host ::slotted(ix-modal-footer){margin-top:auto}:host(.visible){display:block}:host(.align-center) dialog{margin:0;left:50%;top:50%}:host(.no-backdrop) dialog::backdrop{background-color:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}:host(.with-icon) ::slotted(ix-modal-footer),:host(.with-icon) ::slotted(ix-modal-content){margin-left:3rem}";var p=undefined&&undefined.__decorate||function(t,i,a,e){var o=arguments.length,s=o<3?i:e===null?e=Object.getOwnPropertyDescriptor(i,a):e,l;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(t,i,a,e);else for(var r=t.length-1;r>=0;r--)if(l=t[r])s=(o<3?l(s):o>3?l(i,a,s):l(i,a))||s;return o>3&&s&&Object.defineProperty(i,a,s),s};const m=class{constructor(a){t(this,a);this.dialogClose=i(this,"dialogClose",7);this.dialogDismiss=i(this,"dialogDismiss",7);this.ariaAttributes={};this.size="360";this.animation=true;this.backdrop=true;this.closeOnBackdropClick=false;this.centered=false;this.closeOnEscape=true;this.modalVisible=false}onKey(t){if(t.key==="Escape"){t.preventDefault()}}get dialog(){return this.hostElement.shadowRoot.querySelector("dialog")}slideInModal(){const t=this.animation?d.mediumTime:0;let i=this.centered?"-50%":40;s({targets:this.dialog,duration:t,opacity:[0,1],translateY:[0,i],translateX:["-50%","-50%"],easing:"easeOutSine"})}slideOutModal(t){const i=this.animation?d.mediumTime:0;let a=this.centered?"-50%":40;s({targets:this.dialog,duration:i,opacity:[1,0],translateY:[a,0],translateX:["-50%","-50%"],easing:"easeInSine",complete:()=>{if(t){t()}}})}onModalClick(t){if(t.target!==this.dialog){return}const i=this.dialog.getBoundingClientRect();const a=i.top<=t.clientY&&t.clientY<=i.top+i.height&&i.left<=t.clientX&&t.clientX<=i.left+i.width;if(!a&&this.closeOnBackdropClick){this.dismissModal()}}async showModal(){try{const t=await h("dialog",this.hostElement.shadowRoot);this.modalVisible=true;t.showModal()}catch(t){console.error("HTMLDialogElement not existing")}}async dismissModal(t){if(!this.modalVisible){return}let i=true;if(this.beforeDismiss!==undefined){i=await this.beforeDismiss(t)}if(!i){return}this.slideOutModal((()=>{this.modalVisible=false;this.dialog.close(JSON.stringify({type:"dismiss",reason:t},null,2));this.dialogDismiss.emit(t)}))}async closeModal(t){if(!this.modalVisible){return}this.slideOutModal((()=>{this.modalVisible=false;this.dialog.close(JSON.stringify({type:"close",reason:t},null,2));this.dialogClose.emit(t)}))}componentDidLoad(){this.slideInModal()}componentWillLoad(){this.ariaAttributes=l(this.hostElement)}render(){return a(e,{key:"2eb4265e1340e363f2fad727ce537166e871c455",class:{visible:this.modalVisible,"no-backdrop":this.backdrop===false,"align-center":this.centered}},a("div",{key:"0ad32150a4e68a653531d20124fef022c348570f",class:"dialog-backdrop"},a("dialog",{key:"424c214d86b57d7001e4af7bd3894bf5024cc94c","aria-modal":r(true),"aria-describedby":this.ariaAttributes["aria-describedby"],"aria-labelledby":this.ariaAttributes["aria-labelledby"],class:{modal:true,[`modal-size-${this.size}`]:true},onClose:()=>this.dismissModal(),onClick:t=>this.onModalClick(t),onCancel:t=>{t.preventDefault();this.dismissModal()}},a("slot",{key:"4aa40b5224d791540c8a62f6412bb8b60ce0482c"}))))}get hostElement(){return o(this)}};p([n("keydown",(t=>!t.closeOnEscape))],m.prototype,"onKey",null);m.style=c;export{m as ix_modal};
+//# sourceMappingURL=p-d1e08a10.entry.js.map

package/dist/siemens-ix/p-d1e08a10.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["waitForElement","selector","doc","timeout","Promise","resolve","reject","startTime","Date","now","checkIfElementExist","dialog","querySelector","setTimeout","modalCss","Modal","constructor","hostRef","this","ariaAttributes","size","animation","backdrop","closeOnBackdropClick","centered","closeOnEscape","modalVisible","onKey","e","key","preventDefault","hostElement","shadowRoot","slideInModal","duration","Animation","mediumTime","transformY","anime","targets","opacity","translateY","translateX","easing","slideOutModal","completeCallback","complete","onModalClick","event","target","rect","getBoundingClientRect","isClickOutside","top","clientY","height","left","clientX","width","dismissModal","showModal","console","error","reason","allowDismiss","beforeDismiss","undefined","close","JSON","stringify","type","dialogDismiss","emit","closeModal","dialogClose","componentDidLoad","componentWillLoad","a11yHostAttributes","render","h","Host","class","visible","a11yBoolean","modal","onClose","onClick","onCancel","__decorate","OnListener","self","prototype"],"sources":["src/components/utils/waitForElement.ts","src/components/modal/modal.scss?tag=ix-modal&encapsulation=shadow","src/components/modal/modal.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\nexport function waitForElement<R extends HTMLElement>(\n  selector: string,\n  doc: any,\n  timeout = 3000\n): Promise<R> {\n  return new Promise<R>((resolve, reject) => {\n    const startTime = Date.now();\n\n    const checkIfElementExist = () => {\n      const dialog = doc.querySelector(selector) satisfies R;\n\n      if (dialog) {\n        resolve(dialog);\n      } else {\n        if (Date.now() - startTime < timeout) {\n          setTimeout(checkIfElementExist);\n        } else {\n          reject();\n        }\n      }\n    };\n\n    checkIfElementExist();\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\n::backdrop {\n  --ix-dialog-backdrop: var(--theme-color-lightbox, #0000008c);\n}\n\n:focus-visible {\n  outline: none !important;\n}\n\n:host {\n  display: none;\n\n  dialog {\n    --ix-dialog-padding: 1rem;\n\n    margin: 0;\n    padding: var(--ix-dialog-padding);\n    padding-top: calc(var(--ix-dialog-padding) + var(--ix-safe-area-inset-top));\n    padding-bottom: calc(\n      var(--ix-dialog-padding) + var(--ix-safe-area-inset-bottom)\n    );\n    left: 50%;\n  }\n\n  dialog::backdrop {\n    backdrop-filter: blur(2.7182817459106445px);\n  }\n\n  .modal {\n    display: flex;\n    flex-direction: column;\n    position: relative;\n    border: none;\n    border-radius: var(--theme-default-border-radius);\n    background: var(--theme-modal--background);\n    box-shadow: var(--theme-shadow-4);\n    color: var(--theme-color-std-text);\n    overflow: visible;\n    max-height: 80vh;\n    pointer-events: all;\n  }\n\n  .modal-size-360 {\n    width: 22.5rem;\n  }\n\n  .modal-size-480 {\n    width: 30rem;\n  }\n\n  .modal-size-600 {\n    width: 37.5rem;\n  }\n\n  .modal-size-720 {\n    width: 45rem;\n  }\n\n  .modal-size-840 {\n    width: 52.5rem;\n  }\n\n  .modal-size-full-width {\n    width: 95%;\n  }\n\n  .modal-size-full-screen {\n    border-radius: 0;\n    left: 0 !important;\n    top: 0 !important;\n    transform: none !important;\n    box-shadow: none;\n\n    --ix-dialog-full-screen-height: calc(\n      var(--ix-safe-area-inset-top) + var(--ix-safe-area-inset-bottom)\n    );\n\n    width: calc(100% - var(--ix-dialog-padding) * 2);\n    min-width: calc(100% - var(--ix-dialog-padding) * 2);\n    max-width: calc(100% - var(--ix-dialog-padding) * 2);\n\n    min-height: calc(\n      100% - (var(--ix-dialog-padding) * 2) -\n        var(--ix-dialog-full-screen-height)\n    );\n    max-height: calc(\n      100% - (var(--ix-dialog-padding) * 2) -\n        var(--ix-dialog-full-screen-height)\n    );\n  }\n\n  dialog.modal-size-full-screen::backdrop {\n    background: var(--theme-modal--background);\n  }\n\n  .dialog-backdrop {\n    display: block;\n    position: fixed;\n    width: 100vw;\n    height: 100vh;\n    top: 0;\n    left: 0;\n\n    pointer-events: none;\n  }\n\n  ::slotted(ix-modal-footer) {\n    margin-top: auto;\n  }\n}\n\n:host(.visible) {\n  display: block;\n}\n\n:host(.align-center) {\n  dialog {\n    margin: 0;\n    left: 50%;\n    top: 50%;\n  }\n}\n\n:host(.no-backdrop) {\n  dialog::backdrop {\n    background-color: transparent !important;\n    backdrop-filter: none !important;\n  }\n}\n\n:host(.with-icon) {\n  ::slotted(ix-modal-footer),\n  ::slotted(ix-modal-content) {\n    margin-left: 3rem;\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 */\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { A11yAttributes, a11yBoolean, a11yHostAttributes } from '../utils/a11y';\nimport Animation from '../utils/animation';\nimport { OnListener } from '../utils/listener';\nimport { waitForElement } from '../utils/waitForElement';\n\nexport type IxModalFixedSize = '360' | '480' | '600' | '720' | '840';\nexport type IxModalDynamicSize = 'full-width' | 'full-screen';\nexport type IxModalSize = IxModalFixedSize | IxModalDynamicSize;\n\n@Component({\n  tag: 'ix-modal',\n  styleUrl: 'modal.scss',\n  shadow: true,\n})\nexport class Modal {\n  private ariaAttributes: A11yAttributes = {};\n\n  @Element() hostElement!: HTMLIxModalElement;\n\n  /**\n   * Modal size\n   *\n   * @since 2.0.0\n   */\n  @Prop() size: IxModalSize = '360';\n\n  /**\n   * Should the modal be animated\n   */\n  @Prop() animation = true;\n\n  /**\n   * Show a backdrop behind the modal dialog\n   */\n  @Prop() backdrop = true;\n\n  /**\n   * Dismiss modal on backdrop click\n   *\n   * @since 2.0.0\n   */\n  @Prop() closeOnBackdropClick = false;\n\n  /**\n   * Is called before the modal is dismissed.\n   *\n   * - Return `true` to proceed in dismissing the modal\n   * - Return `false` to abort in dismissing the modal\n   */\n  @Prop() beforeDismiss?: (reason?: any) => boolean | Promise<boolean>;\n\n  /**\n   * Centered modal\n   */\n  @Prop() centered = false;\n\n  /**\n   * If set to true the modal can be closed by pressing the Escape key\n   */\n  @Prop() closeOnEscape = true;\n\n  /**\n   * Dialog close\n   */\n  @Event() dialogClose!: EventEmitter;\n\n  /**\n   * Dialog cancel\n   */\n  @Event() dialogDismiss!: EventEmitter;\n\n  @State() modalVisible = false;\n\n  @OnListener<Modal>('keydown', (self) => !self.closeOnEscape)\n  onKey(e: KeyboardEvent) {\n    if (e.key === 'Escape') {\n      e.preventDefault();\n    }\n  }\n\n  get dialog() {\n    return this.hostElement.shadowRoot!.querySelector('dialog');\n  }\n\n  private slideInModal() {\n    const duration = this.animation ? Animation.mediumTime : 0;\n\n    let transformY = this.centered ? '-50%' : 40;\n\n    anime({\n      targets: this.dialog,\n      duration,\n      opacity: [0, 1],\n      translateY: [0, transformY],\n      translateX: ['-50%', '-50%'],\n      easing: 'easeOutSine',\n    });\n  }\n\n  private slideOutModal(completeCallback: Function) {\n    const duration = this.animation ? Animation.mediumTime : 0;\n\n    let transformY = this.centered ? '-50%' : 40;\n\n    anime({\n      targets: this.dialog,\n      duration,\n      opacity: [1, 0],\n      translateY: [transformY, 0],\n      translateX: ['-50%', '-50%'],\n      easing: 'easeInSine',\n      complete: () => {\n        if (completeCallback) {\n          completeCallback();\n        }\n      },\n    });\n  }\n\n  private onModalClick(event: MouseEvent) {\n    if (event.target !== this.dialog) {\n      return;\n    }\n\n    const rect = this.dialog!.getBoundingClientRect();\n    const isClickOutside =\n      rect.top <= event.clientY &&\n      event.clientY <= rect.top + rect.height &&\n      rect.left <= event.clientX &&\n      event.clientX <= rect.left + rect.width;\n\n    if (!isClickOutside && this.closeOnBackdropClick) {\n      this.dismissModal();\n    }\n  }\n\n  /**\n   * Show the dialog\n   */\n  @Method()\n  async showModal() {\n    try {\n      const dialog = await waitForElement<HTMLDialogElement>(\n        'dialog',\n        this.hostElement.shadowRoot\n      );\n      this.modalVisible = true;\n      dialog.showModal();\n    } catch (e) {\n      console.error('HTMLDialogElement not existing');\n    }\n  }\n\n  /**\n   * Dismiss the dialog\n   */\n  @Method()\n  async dismissModal<T = any>(reason?: T) {\n    if (!this.modalVisible) {\n      return;\n    }\n\n    let allowDismiss = true;\n\n    if (this.beforeDismiss !== undefined) {\n      allowDismiss = await this.beforeDismiss(reason);\n    }\n    if (!allowDismiss) {\n      return;\n    }\n\n    this.slideOutModal(() => {\n      this.modalVisible = false;\n      this.dialog!.close(\n        JSON.stringify(\n          {\n            type: 'dismiss',\n            reason,\n          },\n          null,\n          2\n        )\n      );\n\n      this.dialogDismiss.emit(reason);\n    });\n  }\n\n  /**\n   * Close the dialog\n   */\n  @Method()\n  async closeModal<T = any>(reason: T) {\n    if (!this.modalVisible) {\n      return;\n    }\n\n    this.slideOutModal(() => {\n      this.modalVisible = false;\n      this.dialog!.close(\n        JSON.stringify(\n          {\n            type: 'close',\n            reason,\n          },\n          null,\n          2\n        )\n      );\n\n      this.dialogClose.emit(reason);\n    });\n  }\n\n  componentDidLoad() {\n    this.slideInModal();\n  }\n\n  componentWillLoad() {\n    this.ariaAttributes = a11yHostAttributes(this.hostElement);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          visible: this.modalVisible,\n          'no-backdrop': this.backdrop === false,\n          'align-center': this.centered,\n        }}\n      >\n        <div class=\"dialog-backdrop\">\n          <dialog\n            aria-modal={a11yBoolean(true)}\n            aria-describedby={this.ariaAttributes['aria-describedby']}\n            aria-labelledby={this.ariaAttributes['aria-labelledby']}\n            class={{\n              modal: true,\n              [`modal-size-${this.size}`]: true,\n            }}\n            onClose={() => this.dismissModal()}\n            onClick={(event) => this.onModalClick(event)}\n            onCancel={(e) => {\n              e.preventDefault();\n              this.dismissModal();\n            }}\n          >\n            <slot></slot>\n          </dialog>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-d1e55b65.entry.js

@@ -0,0 +1,2 @@
+import{r as a,c as t,h as e,H as r,g as o}from"./p-DtF9fwpD.js";import{g as i}from"./p-i60z1FJC.js";import{x as s}from"./p-CrTP-icT.js";const l=":host{display:block;position:relative;margin-bottom:0.5rem;margin-right:0.75rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-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 .avatar{all:unset;box-sizing:border-box;display:flex;align-items:center;height:2.5rem;width:100%;max-height:2.5rem;padding-left:0.25rem;margin-left:0.41rem;margin-right:0.35rem;transition:var(--theme-default-time);border-radius:1.25rem}:host .avatar .avatar-name{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap;margin-left:1rem;line-height:1.14}:host .avatar .avatar-name .text-default-single{color:var(--theme-nav-item-primary--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):hover{background-color:var(--theme-avatar-btn--background--hover);color:var(--theme-avatar-btn--color--hover)}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):active,:host .avatar:not(.disabled):not(:disabled).active{background-color:var(--theme-avatar-btn--background--active);color:var(--theme-avatar-btn--color--active)}:host .avatar:focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";const n=class{constructor(e){a(this,e);this.logoutClick=t(this,"logoutClick",7);this.i18nLogout="Logout";this.showLogoutButton=true;this.showContextMenu=false;this.avatarElementId="ix-menu-avatar-id"}onSlotChange(){const a=this.hostElement.shadowRoot.querySelector("slot");if(!a){return}const t=i(a);this.showContextMenu=t.length!==0}render(){return e(r,{key:"3bcb9db9a5f7b6e2b949a1b78d31ac4307d55a21",slot:"ix-menu-avatar"},e("button",{key:"997f2a3ca9f419eb8618b7baecea9487fee4353a",class:"nav-item top-item avatar no-hover",title:this.top,id:this.avatarElementId,tabIndex:0},e("ix-avatar",{key:"9f16020bf51db6289cdda6ec9f9576d5d1e0f30a",image:this.image,initials:this.initials}),e("div",{key:"bb5bc3adb3b7ec2973e2212fc913423ae69d2796",class:"avatar-name"},e("span",{key:"efa4a3e92895392a7618db2f124228bb785717ae",class:"text-default-single",title:this.top},this.top),e("span",{key:"eff8ba846915852b97771f1610f62450496f8c33",class:"text-default-single",title:this.bottom},this.bottom))),e("ix-dropdown",{key:"51e2c74f032ef5960aa1b3491728545bd3d88557",trigger:this.hostElement,placement:"right-start",hidden:!this.showContextMenu&&!this.showLogoutButton,offset:{mainAxis:16}},e("slot",{key:"28605745ab13750eba6842c78e42fac4ac705a51",onSlotchange:()=>this.onSlotChange()}),this.showLogoutButton?e("ix-menu-avatar-item",{label:this.i18nLogout,icon:s,onClick:a=>{this.logoutClick.emit(a)}}):null))}get hostElement(){return o(this)}};n.style=l;export{n as ix_menu_avatar};
+//# sourceMappingURL=p-d1e55b65.entry.js.map

package/dist/siemens-ix/p-d1e55b65.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["menuAvatarCss","MenuAvatar","constructor","hostRef","this","i18nLogout","showLogoutButton","showContextMenu","avatarElementId","onSlotChange","slot","hostElement","shadowRoot","querySelector","elements","getSlottedElements","length","render","h","Host","key","class","title","top","id","tabIndex","image","initials","bottom","trigger","placement","hidden","offset","mainAxis","onSlotchange","label","icon","iconLogOut","onClick","e","logoutClick","emit"],"sources":["src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=shadow","src/components/menu-avatar/menu-avatar.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  margin-bottom: 0.5rem;\n  margin-right: 0.75rem;\n\n  .avatar {\n    all: unset;\n    box-sizing: border-box;\n\n    display: flex;\n    align-items: center;\n    height: 2.5rem;\n    width: 100%;\n    max-height: 2.5rem;\n    padding-left: 0.25rem;\n    margin-left: 0.41rem;\n    margin-right: 0.35rem;\n    transition: var(--theme-default-time);\n\n    .avatar-name {\n      display: flex;\n      flex-direction: column;\n      overflow: hidden;\n      white-space: nowrap;\n      margin-left: $default-space;\n      line-height: 1.14;\n\n      .text-default-single {\n        color: var(--theme-nav-item-primary--color);\n        @include ellipsis;\n      }\n    }\n\n    border-radius: 1.25rem;\n\n    @include hover {\n      background-color: var(--theme-avatar-btn--background--hover);\n      color: var(--theme-avatar-btn--color--hover);\n    }\n\n    @include active {\n      background-color: var(--theme-avatar-btn--background--active);\n      color: var(--theme-avatar-btn--color--active);\n    }\n  }\n\n  .avatar:focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\nimport { iconLogOut } from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-menu-avatar',\n  styleUrl: 'menu-avatar.scss',\n  shadow: true,\n})\nexport class MenuAvatar {\n  @Element() hostElement!: HTMLIxMenuAvatarElement;\n\n  /**\n   * First line of text\n   */\n  @Prop() top?: string;\n\n  /**\n   * Second line of text\n   */\n  @Prop() bottom?: string;\n\n  /**\n   * Display a avatar image\n   *\n   * @since 1.4.0\n   */\n  @Prop() image?: string;\n\n  /**\n   * Display the initials of the user. Will be overwritten by image\n   *\n   * @since 1.4.0\n   */\n  @Prop() initials?: string;\n\n  /**\n   * Use for translation\n   */\n  @Prop() i18nLogout: string = 'Logout';\n\n  /**\n   *  Control the visibility of the logout button\n   *  @since 2.1.0\n   */\n  @Prop() showLogoutButton: boolean = true;\n\n  /**\n   * Control the visibility of the dropdown menu\n   * @since 2.1.0\n   */\n  @State() showContextMenu: boolean = false;\n\n  /**\n   * Logout click\n   */\n  @Event() logoutClick!: EventEmitter;\n\n  private avatarElementId = 'ix-menu-avatar-id';\n\n  onSlotChange() {\n    const slot = this.hostElement.shadowRoot!.querySelector('slot');\n    if (!slot) {\n      return;\n    }\n    const elements = getSlottedElements(slot);\n    this.showContextMenu = elements.length !== 0;\n  }\n\n  render() {\n    return (\n      <Host slot=\"ix-menu-avatar\">\n        <button\n          class=\"nav-item top-item avatar no-hover\"\n          title={this.top}\n          id={this.avatarElementId}\n          tabIndex={0}\n        >\n          <ix-avatar image={this.image} initials={this.initials}></ix-avatar>\n\n          <div class=\"avatar-name\">\n            <span class=\"text-default-single\" title={this.top}>\n              {this.top}\n            </span>\n            <span class=\"text-default-single\" title={this.bottom}>\n              {this.bottom}\n            </span>\n          </div>\n        </button>\n        <ix-dropdown\n          trigger={this.hostElement}\n          placement={'right-start'}\n          hidden={!this.showContextMenu && !this.showLogoutButton}\n          offset={{\n            mainAxis: 16,\n          }}\n        >\n          <slot onSlotchange={() => this.onSlotChange()}></slot>\n          {this.showLogoutButton ? (\n            <ix-menu-avatar-item\n              label={this.i18nLogout}\n              icon={iconLogOut}\n              onClick={(e) => {\n                this.logoutClick.emit(e);\n              }}\n            ></ix-menu-avatar-item>\n          ) : null}\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wIAAA,MAAMA,EAAgB,g4D,MC0BTC,EAAU,MALvB,WAAAC,CAAAC,G,mDAmCUC,KAAUC,WAAW,SAMrBD,KAAgBE,iBAAY,KAM3BF,KAAeG,gBAAY,MAO5BH,KAAeI,gBAAG,mBAqD3B,CAnDC,YAAAC,GACE,MAAMC,EAAON,KAAKO,YAAYC,WAAYC,cAAc,QACxD,IAAKH,EAAM,CACT,M,CAEF,MAAMI,EAAWC,EAAmBL,GACpCN,KAAKG,gBAAkBO,EAASE,SAAW,C,CAG7C,MAAAC,GACE,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAV,KAAK,kBACTQ,EAAA,UAAAE,IAAA,2CACEC,MAAM,oCACNC,MAAOlB,KAAKmB,IACZC,GAAIpB,KAAKI,gBACTiB,SAAU,GAEVP,EAAW,aAAAE,IAAA,2CAAAM,MAAOtB,KAAKsB,MAAOC,SAAUvB,KAAKuB,WAE7CT,EAAK,OAAAE,IAAA,2CAAAC,MAAM,eACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,sBAAsBC,MAAOlB,KAAKmB,KAC3CnB,KAAKmB,KAERL,EAAA,QAAAE,IAAA,2CAAMC,MAAM,sBAAsBC,MAAOlB,KAAKwB,QAC3CxB,KAAKwB,UAIZV,EACE,eAAAE,IAAA,2CAAAS,QAASzB,KAAKO,YACdmB,UAAW,cACXC,QAAS3B,KAAKG,kBAAoBH,KAAKE,iBACvC0B,OAAQ,CACNC,SAAU,KAGZf,EAAM,QAAAE,IAAA,2CAAAc,aAAc,IAAM9B,KAAKK,iBAC9BL,KAAKE,iBACJY,EAAA,uBACEiB,MAAO/B,KAAKC,WACZ+B,KAAMC,EACNC,QAAUC,IACRnC,KAAKoC,YAAYC,KAAKF,EAAE,IAG1B,M","ignoreList":[]}