@siemens/ix 2.4.0 → 2.5.0

package/dist/siemens-ix/p-5aa0b93c.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["toastContainerCss","IxToastContainerStyle0","ToastContainer","this","PREFIX_POSITION_CLASS","hostContainer","Promise","resolve","interval","setInterval","containerElement","document","getElementById","containerId","clearInterval","componentDidLoad","toastContainer","createElement","id","classList","add","containerClass","position","body","appendChild","onPositionChange","newPosition","oldPosition","remove","showToast","config","toast","onClose","TypedEvent","removeToast","result","emit","toastTitle","title","type","autoClose","_a","autoCloseDelay","_b","icon","iconColor","addEventListener","event","detail","message","innerText","close","render","h","Host","key","class"],"sources":["src/components/toast/styles/toast-container.scss?tag=ix-toast-container&encapsulation=shadow","src/components/toast/toast-container.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/shadow-dom/component';\n\n:host {\n  @include ix-component;\n}\n\n#toast-container {\n  > :not(:last-child) {\n    margin-block-end: $default-space;\n  }\n}\n\n.toast-container {\n  display: block;\n  position: fixed;\n}\n\n.toast-container--top-right {\n  right: 1rem;\n  top: 2rem;\n}\n\n.toast-container--bottom-right {\n  right: 1rem;\n  bottom: 2rem;\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, h, Host, Method, Prop, Watch } from '@stencil/core';\nimport { TypedEvent } from '../utils/typed-event';\nimport { ToastConfig } from './toast-utils';\n\nexport type ShowToastResult = {\n  onClose: TypedEvent<any | undefined>;\n  close: (result?: any) => void;\n};\n\n@Component({\n  tag: 'ix-toast-container',\n  styleUrl: './styles/toast-container.scss',\n  shadow: true,\n})\nexport class ToastContainer {\n  /**\n   */\n  @Prop() containerId = 'toast-container';\n\n  /**\n   */\n  @Prop() containerClass = 'toast-container';\n\n  /**\n   */\n  @Prop() position: 'bottom-right' | 'top-right' = 'bottom-right';\n\n  private readonly PREFIX_POSITION_CLASS = 'toast-container--';\n\n  get hostContainer() {\n    return new Promise<HTMLElement>((resolve) => {\n      const interval = setInterval(() => {\n        const containerElement = document.getElementById(this.containerId);\n        if (containerElement) {\n          clearInterval(interval);\n          resolve(containerElement);\n        }\n      });\n    });\n  }\n\n  componentDidLoad() {\n    if (!document.getElementById(this.containerId)) {\n      const toastContainer = document.createElement('div');\n      toastContainer.id = this.containerId;\n      toastContainer.classList.add(this.containerClass);\n      toastContainer.classList.add(\n        `${this.PREFIX_POSITION_CLASS}${this.position}`\n      );\n      document.body.appendChild(toastContainer);\n    }\n  }\n\n  @Watch('position')\n  onPositionChange(newPosition: string, oldPosition: string) {\n    const toastContainer = document.getElementById(this.containerId);\n    toastContainer.classList.remove(\n      `${this.PREFIX_POSITION_CLASS}${oldPosition}`\n    );\n    toastContainer.classList.add(`${this.PREFIX_POSITION_CLASS}${newPosition}`);\n  }\n\n  /**\n   * Display a toast message\n   * @param config\n   */\n  @Method()\n  async showToast(config: ToastConfig): Promise<ShowToastResult> {\n    const toast = document.createElement('ix-toast');\n    const onClose = new TypedEvent<any | undefined>();\n\n    function removeToast(result?: any) {\n      toast.remove();\n      onClose.emit(result);\n    }\n\n    toast.toastTitle = config.title;\n    toast.type = config.type;\n    toast.autoClose = config.autoClose ?? true;\n    toast.autoCloseDelay = config.autoCloseDelay ?? 5000;\n    toast.icon = config.icon;\n    toast.iconColor = config.iconColor;\n    toast.addEventListener(\n      'closeToast',\n      (event: CustomEvent<any | undefined>) => {\n        const { detail } = event;\n        removeToast(detail);\n      }\n    );\n\n    if (typeof config.message === 'string') {\n      toast.innerText = config.message;\n    } else {\n      toast.appendChild(config.message);\n    }\n\n    (await this.hostContainer).appendChild(toast);\n\n    return {\n      onClose,\n      close: (result?: any) => {\n        removeToast(result);\n      },\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'toast-container--bottom-right': this.position === 'bottom-right',\n          'toast-container--top-right': this.position === 'top-right',\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAoB,+8BAC1B,MAAAC,EAAeD,E,MCsBFE,EAAc,M,yBAaRC,KAAAC,sBAAwB,oB,iBAVnB,kB,oBAIG,kB,cAIwB,c,CAIjD,iBAAIC,GACF,OAAO,IAAIC,SAAsBC,IAC/B,MAAMC,EAAWC,aAAY,KAC3B,MAAMC,EAAmBC,SAASC,eAAeT,KAAKU,aACtD,GAAIH,EAAkB,CACpBI,cAAcN,GACdD,EAAQG,E,IAEV,G,CAIN,gBAAAK,GACE,IAAKJ,SAASC,eAAeT,KAAKU,aAAc,CAC9C,MAAMG,EAAiBL,SAASM,cAAc,OAC9CD,EAAeE,GAAKf,KAAKU,YACzBG,EAAeG,UAAUC,IAAIjB,KAAKkB,gBAClCL,EAAeG,UAAUC,IACvB,GAAGjB,KAAKC,wBAAwBD,KAAKmB,YAEvCX,SAASY,KAAKC,YAAYR,E,EAK9B,gBAAAS,CAAiBC,EAAqBC,GACpC,MAAMX,EAAiBL,SAASC,eAAeT,KAAKU,aACpDG,EAAeG,UAAUS,OACvB,GAAGzB,KAAKC,wBAAwBuB,KAElCX,EAAeG,UAAUC,IAAI,GAAGjB,KAAKC,wBAAwBsB,I,CAQ/D,eAAMG,CAAUC,G,QACd,MAAMC,EAAQpB,SAASM,cAAc,YACrC,MAAMe,EAAU,IAAIC,EAEpB,SAASC,EAAYC,GACnBJ,EAAMH,SACNI,EAAQI,KAAKD,E,CAGfJ,EAAMM,WAAaP,EAAOQ,MAC1BP,EAAMQ,KAAOT,EAAOS,KACpBR,EAAMS,WAAYC,EAAAX,EAAOU,aAAS,MAAAC,SAAA,EAAAA,EAAI,KACtCV,EAAMW,gBAAiBC,EAAAb,EAAOY,kBAAc,MAAAC,SAAA,EAAAA,EAAI,IAChDZ,EAAMa,KAAOd,EAAOc,KACpBb,EAAMc,UAAYf,EAAOe,UACzBd,EAAMe,iBACJ,cACCC,IACC,MAAMC,OAAEA,GAAWD,EACnBb,EAAYc,EAAO,IAIvB,UAAWlB,EAAOmB,UAAY,SAAU,CACtClB,EAAMmB,UAAYpB,EAAOmB,O,KACpB,CACLlB,EAAMP,YAAYM,EAAOmB,Q,QAGpB9C,KAAKE,eAAemB,YAAYO,GAEvC,MAAO,CACLC,UACAmB,MAAQhB,IACND,EAAYC,EAAO,E,CAKzB,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,gCAAiCrD,KAAKmB,WAAa,eACnD,6BAA8BnB,KAAKmB,WAAa,cAGlD+B,EAAA,QAAAE,IAAA,6C"}
+{"version":3,"names":["toastContainerCss","IxToastContainerStyle0","ToastContainer","this","PREFIX_POSITION_CLASS","hostContainer","Promise","resolve","interval","setInterval","containerElement","document","getElementById","containerId","clearInterval","componentDidLoad","toastContainer","createElement","id","classList","add","containerClass","position","body","appendChild","onPositionChange","newPosition","oldPosition","remove","showToast","config","toast","onClose","TypedEvent","removeToast","result","emit","toastTitle","title","type","autoClose","_a","autoCloseDelay","_b","icon","iconColor","addEventListener","event","detail","message","innerText","close","render","h","Host","key","class"],"sources":["src/components/toast/styles/toast-container.scss?tag=ix-toast-container&encapsulation=shadow","src/components/toast/toast-container.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}\n\n#toast-container {\n  > :not(:last-child) {\n    margin-block-end: $default-space;\n  }\n}\n\n.toast-container {\n  display: block;\n  position: fixed;\n}\n\n.toast-container--top-right {\n  right: 1rem;\n  top: 2rem;\n}\n\n.toast-container--bottom-right {\n  right: 1rem;\n  bottom: 2rem;\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 { Component, h, Host, Method, Prop, Watch } from '@stencil/core';\nimport { TypedEvent } from '../utils/typed-event';\nimport { ToastConfig } from './toast-utils';\n\nexport type ShowToastResult = {\n  onClose: TypedEvent<any | undefined>;\n  close: (result?: any) => void;\n};\n\n@Component({\n  tag: 'ix-toast-container',\n  styleUrl: './styles/toast-container.scss',\n  shadow: true,\n})\nexport class ToastContainer {\n  /**\n   */\n  @Prop() containerId = 'toast-container';\n\n  /**\n   */\n  @Prop() containerClass = 'toast-container';\n\n  /**\n   */\n  @Prop() position: 'bottom-right' | 'top-right' = 'bottom-right';\n\n  private readonly PREFIX_POSITION_CLASS = 'toast-container--';\n\n  get hostContainer() {\n    return new Promise<HTMLElement>((resolve) => {\n      const interval = setInterval(() => {\n        const containerElement = document.getElementById(this.containerId);\n        if (containerElement) {\n          clearInterval(interval);\n          resolve(containerElement);\n        }\n      });\n    });\n  }\n\n  componentDidLoad() {\n    if (!document.getElementById(this.containerId)) {\n      const toastContainer = document.createElement('div');\n      toastContainer.id = this.containerId;\n      toastContainer.classList.add(this.containerClass);\n      toastContainer.classList.add(\n        `${this.PREFIX_POSITION_CLASS}${this.position}`\n      );\n      document.body.appendChild(toastContainer);\n    }\n  }\n\n  @Watch('position')\n  onPositionChange(newPosition: string, oldPosition: string) {\n    const toastContainer = document.getElementById(this.containerId);\n    toastContainer.classList.remove(\n      `${this.PREFIX_POSITION_CLASS}${oldPosition}`\n    );\n    toastContainer.classList.add(`${this.PREFIX_POSITION_CLASS}${newPosition}`);\n  }\n\n  /**\n   * Display a toast message\n   * @param config\n   */\n  @Method()\n  async showToast(config: ToastConfig): Promise<ShowToastResult> {\n    const toast = document.createElement('ix-toast');\n    const onClose = new TypedEvent<any | undefined>();\n\n    function removeToast(result?: any) {\n      toast.remove();\n      onClose.emit(result);\n    }\n\n    toast.toastTitle = config.title;\n    toast.type = config.type;\n    toast.autoClose = config.autoClose ?? true;\n    toast.autoCloseDelay = config.autoCloseDelay ?? 5000;\n    toast.icon = config.icon;\n    toast.iconColor = config.iconColor;\n    toast.addEventListener(\n      'closeToast',\n      (event: CustomEvent<any | undefined>) => {\n        const { detail } = event;\n        removeToast(detail);\n      }\n    );\n\n    if (typeof config.message === 'string') {\n      toast.innerText = config.message;\n    } else {\n      toast.appendChild(config.message);\n    }\n\n    (await this.hostContainer).appendChild(toast);\n\n    return {\n      onClose,\n      close: (result?: any) => {\n        removeToast(result);\n      },\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'toast-container--bottom-right': this.position === 'bottom-right',\n          'toast-container--top-right': this.position === 'top-right',\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAoB,+8BAC1B,MAAAC,EAAeD,E,MCsBFE,EAAc,M,yBAaRC,KAAAC,sBAAwB,oB,iBAVnB,kB,oBAIG,kB,cAIwB,c,CAIjD,iBAAIC,GACF,OAAO,IAAIC,SAAsBC,IAC/B,MAAMC,EAAWC,aAAY,KAC3B,MAAMC,EAAmBC,SAASC,eAAeT,KAAKU,aACtD,GAAIH,EAAkB,CACpBI,cAAcN,GACdD,EAAQG,E,IAEV,G,CAIN,gBAAAK,GACE,IAAKJ,SAASC,eAAeT,KAAKU,aAAc,CAC9C,MAAMG,EAAiBL,SAASM,cAAc,OAC9CD,EAAeE,GAAKf,KAAKU,YACzBG,EAAeG,UAAUC,IAAIjB,KAAKkB,gBAClCL,EAAeG,UAAUC,IACvB,GAAGjB,KAAKC,wBAAwBD,KAAKmB,YAEvCX,SAASY,KAAKC,YAAYR,E,EAK9B,gBAAAS,CAAiBC,EAAqBC,GACpC,MAAMX,EAAiBL,SAASC,eAAeT,KAAKU,aACpDG,EAAeG,UAAUS,OACvB,GAAGzB,KAAKC,wBAAwBuB,KAElCX,EAAeG,UAAUC,IAAI,GAAGjB,KAAKC,wBAAwBsB,I,CAQ/D,eAAMG,CAAUC,G,QACd,MAAMC,EAAQpB,SAASM,cAAc,YACrC,MAAMe,EAAU,IAAIC,EAEpB,SAASC,EAAYC,GACnBJ,EAAMH,SACNI,EAAQI,KAAKD,E,CAGfJ,EAAMM,WAAaP,EAAOQ,MAC1BP,EAAMQ,KAAOT,EAAOS,KACpBR,EAAMS,WAAYC,EAAAX,EAAOU,aAAS,MAAAC,SAAA,EAAAA,EAAI,KACtCV,EAAMW,gBAAiBC,EAAAb,EAAOY,kBAAc,MAAAC,SAAA,EAAAA,EAAI,IAChDZ,EAAMa,KAAOd,EAAOc,KACpBb,EAAMc,UAAYf,EAAOe,UACzBd,EAAMe,iBACJ,cACCC,IACC,MAAMC,OAAEA,GAAWD,EACnBb,EAAYc,EAAO,IAIvB,UAAWlB,EAAOmB,UAAY,SAAU,CACtClB,EAAMmB,UAAYpB,EAAOmB,O,KACpB,CACLlB,EAAMP,YAAYM,EAAOmB,Q,QAGpB9C,KAAKE,eAAemB,YAAYO,GAEvC,MAAO,CACLC,UACAmB,MAAQhB,IACND,EAAYC,EAAO,E,CAKzB,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,gCAAiCrD,KAAKmB,WAAa,eACnD,6BAA8BnB,KAAKmB,WAAa,cAGlD+B,EAAA,QAAAE,IAAA,6C"}

package/dist/siemens-ix/{p-113cc793.entry.js → p-5af99eaa.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as r,h as o,H as t}from"./p-f87cd962.js";import{a as s}from"./p-71206084.js";const a=":host{margin:0.5rem 0.5rem 0rem 0.5rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-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 .message-container{display:flex;flex-direction:row;align-items:flex-start;flex-wrap:nowrap;justify-content:space-between;min-height:3.375rem;padding:calc(0.75rem - var(--theme-message-bar--border-thickness)) 0.75rem calc(0.75rem - var(--theme-message-bar--border-thickness)) 1rem;border-radius:var(--theme-message-bar--border-radius);background-color:var(--theme-messagebar--background)}:host .danger{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-alarm)}:host .warning{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-warning)}:host .info{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-info)}:host .message-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;align-self:center;min-height:1.25rem;padding:0 1rem;font-weight:normal;white-space:normal}:host ix-icon{margin-top:0.25rem}";const i=a;const c=class{constructor(o){e(this,o);this.closedChange=r(this,"closedChange",7);this.type="info";this.dismissible=true;this.icon=undefined;this.color=undefined}componentWillRender(){if(this.type==="danger"){this.icon="error";this.color="color-alarm"}if(this.type==="info"){this.icon="info";this.color="color-info"}if(this.type==="warning"){this.icon="warning";this.color="color-warning"}}closeAlert(e){s({targets:e,duration:c.duration,opacity:[1,0],easing:"easeOutSine",complete:()=>{e.classList.add("d-none")}});this.closedChange.emit()}render(){return o(t,{key:"89f424843ed559d787f88edd431f1321086cbbb2"},o("div",{key:"3f450ca115c040e749a0926d896dc2bb7ad3648d",class:{"message-container":true,[this.type]:true},role:"alert",ref:e=>this.divElement=e},o("ix-icon",{key:"73dcaa37d965d84b754cb14e58c3442665fcca07",color:this.color,name:this.icon}),o("div",{key:"b5d5178e53c550320803ffa2ac4da925db284fc7",class:"message-content"},o("slot",{key:"e9d97812edc2c45d0c16f57d29352f5357312720"})),this.dismissible?o("ix-icon-button",{icon:"close",size:"24",ghost:true,onClick:()=>{this.closeAlert(this.divElement)},"data-testid":"close-btn"}):""))}};c.duration=300;c.style=i;export{c as ix_message_bar};
-//# sourceMappingURL=p-113cc793.entry.js.map
+import{r as e,c as r,h as o,H as t}from"./p-f87cd962.js";import{a as s}from"./p-71206084.js";const a=":host{margin:0.5rem 0.5rem 0rem 0.5rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-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 .message-container{display:flex;flex-direction:row;align-items:flex-start;flex-wrap:nowrap;justify-content:space-between;min-height:3.375rem;padding:calc(0.75rem - var(--theme-message-bar--border-thickness)) 0.75rem calc(0.75rem - var(--theme-message-bar--border-thickness)) 1rem;border-radius:var(--theme-message-bar--border-radius);background-color:var(--theme-messagebar--background)}:host .danger{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-alarm)}:host .warning{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-warning)}:host .info{border:solid var(--theme-message-bar--border-thickness) var(--theme-color-info)}:host .message-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;align-self:center;min-height:1.25rem;padding:0 1rem;font-weight:normal;white-space:normal}:host ix-icon{margin-top:0.25rem}";const i=a;const c=class{constructor(o){e(this,o);this.closedChange=r(this,"closedChange",7);this.type="info";this.dismissible=true;this.icon=undefined;this.color=undefined}componentWillRender(){if(this.type==="danger"){this.icon="error";this.color="color-alarm"}if(this.type==="info"){this.icon="info";this.color="color-info"}if(this.type==="warning"){this.icon="warning";this.color="color-warning"}}closeAlert(e){s({targets:e,duration:c.duration,opacity:[1,0],easing:"easeOutSine",complete:()=>{e.classList.add("d-none")}});this.closedChange.emit()}render(){return o(t,{key:"5cfbf8a6f0410db0bce4d9313b67eeaca3fd7ee1"},o("div",{key:"0379523394cfcb8c662bfc1e9b4b6f22f1516d61",class:{"message-container":true,[this.type]:true},role:"alert",ref:e=>this.divElement=e},o("ix-icon",{key:"9b94770ff17de637c2dd4924fff67b04d537a137",color:this.color,name:this.icon}),o("div",{key:"e1144a9ccf300e73b3cba522db91966c9bf1b3f1",class:"message-content"},o("slot",{key:"bffed0ff54c91f4fcb836dbc706931372b3fb42e"})),this.dismissible?o("ix-icon-button",{icon:"close",size:"24",ghost:true,onClick:()=>{this.closeAlert(this.divElement)},"data-testid":"close-btn"}):""))}};c.duration=300;c.style=i;export{c as ix_message_bar};
+//# sourceMappingURL=p-5af99eaa.entry.js.map

package/dist/siemens-ix/{p-e30ed20a.entry.js → p-62b089b6.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,f as t,h as r,H as i,c as o,F as a,g as s}from"./p-f87cd962.js";import{m as d}from"./p-68a274e7.js";import{D as n,I as c}from"./p-f5e574da.js";import{O as h}from"./p-0c8a98cd.js";const l=":host{position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px;padding:calc(var(--ix-layout-grid-gutter) * 0.5)}: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}";const u=l;const b=class{constructor(t){e(this,t);this.size=undefined;this.sizeSm=undefined;this.sizeMd=undefined;this.sizeLg=undefined}onResize(){t(this)}getSize(e){if(e===""){return this.size}if(e==="sm"){return this.sizeSm}if(e==="md"){return this.sizeMd}if(e==="lg"){return this.sizeLg}}getColumnSize(){let e;b.Breakpoints.forEach((t=>{const r=t!==""?d(t):true;if(!r){return}const i=this.getSize(t);if(i){e=i}}));return e}getColumnSizeStyling(){const e=this.getColumnSize();if(!e){return}if(e==="auto"){return{flex:"0 0 auto",width:"auto","max-width":"auto"}}const t=`calc(calc(${e} / var(--ix-layout-grid-columns)) * 100%)`;return{flex:`0 0 ${t}`,width:`${t}`,"max-width":`${t}`}}render(){return r(i,{key:"7cbf750f0768a0a1db65aa2651605c89f82ce604",style:Object.assign({},this.getColumnSizeStyling())},r("slot",{key:"d83749089de332574097a8299c265d45b1fd8da7"}))}};b.Breakpoints=["","sm","md","lg"];b.style=u;const f=":host{display:block;position:relative;width:22rem}: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 .header{display:flex;align-items:center;justify-content:space-between}:host .disabled-item{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .selector{flex-basis:100%;display:flex;align-items:center;justify-content:center;padding:0.25rem 1rem}:host .selector .dropdown{color:var(--theme-menu-item--color);font-size:14px;line-height:20px}:host .selector .fontSize{font-size:16px}:host .selector .capitalize{text-transform:capitalize}:host .selector .month-dropdown-item{margin-left:4px;margin-right:4px}:host .selector .month-dropdown-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .selector .arrowYear{display:flex;position:relative;padding:0.75rem 2rem;align-items:center;cursor:pointer}:host .selector .arrowYear:hover{background-color:var(--theme-select-list-item--background--hover)}:host .selector .arrowYear.selected{background-color:var(--theme-select-list-item--background--selected)}:host .selector .arrowYear .arrowPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 6px)}:host .selector .arrowYear .checkPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 8px)}:host .selector .arrowYear .monthMargin{margin-left:10px}:host .wrapper{display:flex}:host .wrapper .overflow{overflow-y:scroll;max-height:250px}:host .grid{display:grid;grid-template-columns:repeat(8, 40px);grid-template-rows:repeat(7, 40px);align-items:center;justify-items:center;justify-content:center;color:var(--theme-datepicker-today--color)}:host .grid .calendar-item{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--theme-datepicker-day--background);border:1px solid var(--theme-datepicker-day--background);width:40px;height:40px;cursor:pointer}:host .grid .calendar-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .grid .calendar-item.today{border:1px solid var(--theme-datepicker-today--border-color)}:host .grid .calendar-item.today:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item.today:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.today.selected{box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.today.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.today.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);border:1px solid var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.today.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range);border:1px solid var(--theme-datepicker-today--border-color--range);box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.range:hover{background-color:var(--theme-datepicker-day--background--range-hover);border:1px solid var(--theme-datepicker-today--border-color--range-hover)}:host .grid .calendar-item.today.range:active{background-color:var(--theme-datepicker-day--background--range-active);border:1px solid var(--theme-datepicker-today--border-color--range-active)}:host .grid .calendar-item.today.range.disabled{background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled);border:1px solid var(--theme-datepicker-today--border-color--range-disabled)}:host .grid .calendar-item.today.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .grid .calendar-item:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);border:1px solid var(--theme-datepicker-day--background--selected)}:host .grid .calendar-item.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range)}:host .grid .calendar-item.range:hover{background-color:var(--theme-datepicker-day--background--range-hover)}:host .grid .calendar-item.range:active{background-color:var(--theme-datepicker-day--background--range-active)}:host .grid .calendar-item.range.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled)}:host .grid .calendar-item.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled)}:host .grid .calendar-item.week-day{color:var(--theme-datepicker-weekday--color);font-size:12px;line-height:20px;border:none;background:none;cursor:initial}:host .grid .calendar-item.empty-day{border:none;background:none;cursor:initial}:host .grid .calendar-item.week-number{font-size:10px;line-height:14px;color:var(--theme-datepicker-weekday--color);border:none;background:none;cursor:initial}:host .grid .calendar-item:focus-visible{background-color:var(--theme-datepicker-day--background--selected);border:inset 1px solid var(--theme-datepicker-day--border-color--selected);color:var(--theme-datepicker-day--color--selected);font-size:14px;line-height:20px;letter-spacing:0}:host .button{display:flex;justify-content:flex-end}:host .hidden{display:none}";const g=f;var m=undefined&&undefined.__decorate||function(e,t,r,i){var o=arguments.length,a=o<3?t:i===null?i=Object.getOwnPropertyDescriptor(t,r):i,s;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")a=Reflect.decorate(e,t,r,i);else for(var d=e.length-1;d>=0;d--)if(s=e[d])a=(o<3?s(a):o>3?s(t,r,a):s(t,r))||a;return o>3&&a&&Object.defineProperty(t,r,a),a};const k=class{constructor(t){e(this,t);this.dateChange=o(this,"dateChange",7);this.dateRangeChange=o(this,"dateRangeChange",7);this.dateSelect=o(this,"dateSelect",7);this.done=o(this,"done",7);this.DAYS_IN_WEEK=7;this.format="yyyy/LL/dd";this.range=true;this.corners="rounded";this.from=undefined;this.to=undefined;this.minDate=undefined;this.maxDate=undefined;this.textSelectDate=undefined;this.i18nDone="Done";this.weekStartIndex=0;this.locale=undefined;this.individual=true;this.eventDelimiter=" - ";this.standaloneAppearance=true;this.today=n.now().toISO();this.currFromDate=undefined;this.currToDate=undefined;this.selectedYear=undefined;this.tempYear=undefined;this.startYear=undefined;this.endYear=undefined;this.selectedMonth=undefined;this.tempMonth=undefined;this.dropdownButtonRef=undefined;this.yearContainerRef=undefined;this.dayNames=undefined;this.monthNames=undefined;this.firstMonthRef=undefined;this.focusedDay=1;this.focusedDayElem=undefined}watchFromPropHandler(e){var t;this.currFromDate=e?n.fromFormat(e,this.format):undefined;if((t=this.currFromDate)===null||t===void 0?void 0:t.isValid){this.selectedYear=this.currFromDate.year;this.selectedMonth=this.currFromDate.month-1}}watchToPropHandler(e){var t;this.currToDate=e?n.fromFormat(e,this.format):undefined;if((t=this.currToDate)===null||t===void 0?void 0:t.isValid){this.selectedYear=this.currToDate.year;this.selectedMonth=this.currToDate.month-1}}onLocaleChange(){this.setTranslations()}async getCurrentDate(){var e,t,r,i;const o=((e=this.currFromDate)===null||e===void 0?void 0:e.isValid)?(t=this.currFromDate)===null||t===void 0?void 0:t.toFormat(this.format):undefined;const a=((r=this.currToDate)===null||r===void 0?void 0:r.isValid)?(i=this.currToDate)===null||i===void 0?void 0:i.toFormat(this.format):undefined;if(this.range){return{from:o,to:a}}return{from:o,to:undefined}}handleKeyUp(e){if(!this.isDayFocus){return}let t=this.focusedDay;switch(e.key){case"ArrowLeft":t--;break;case"ArrowRight":t++;break;case"ArrowUp":t=t-7;break;case"ArrowDown":t=t+7;break;default:return}if(t>this.getDaysInCurrentMonth()){t=t-this.getDaysInCurrentMonth();this.changeToAdjacentMonth(1);this.monthChangedFromFocus=true}else if(t<1){this.changeToAdjacentMonth(-1);t=t+this.getDaysInCurrentMonth();this.monthChangedFromFocus=true}this.focusedDay=t}getDaysInCurrentMonth(){return n.utc(this.selectedYear,this.selectedMonth+1).daysInMonth}getDateTimeNow(){return n.fromISO(this.today)}onDayBlur(){this.isDayFocus=false}onDayFocus(){this.isDayFocus=true}componentWillLoad(){var e,t,r,i;this.setTranslations();this.currFromDate=this.from?n.fromFormat(this.from,this.format):undefined;this.currToDate=this.to?n.fromFormat(this.to,this.format):undefined;const o=(t=(e=this.currFromDate)===null||e===void 0?void 0:e.year)!==null&&t!==void 0?t:this.getDateTimeNow().year;this.startYear=o-5;this.endYear=o+5;this.selectedMonth=((i=(r=this.currFromDate)===null||r===void 0?void 0:r.month)!==null&&i!==void 0?i:this.getDateTimeNow().month)-1;this.selectedYear=o;this.tempMonth=this.selectedMonth;this.tempYear=this.selectedYear}componentWillRender(){this.calculateCalendar()}componentDidRender(){if(!this.monthChangedFromFocus&&!this.isDayFocus){return}const e=this.hostElement.shadowRoot.querySelector(`[id=day-cell-${this.focusedDay}]`);e.focus()}setTranslations(){this.dayNames=this.rotateWeekDayNames(c.weekdays("long",{locale:this.locale}),this.weekStartIndex);this.monthNames=c.months("long",{locale:this.locale})}rotateWeekDayNames(e,t){const r=[...e];if(t===0){return r}t=-t;const i=e.length;r.push(...r.splice(0,(-t%i+i)%i));return r}async onDone(){const e=await this.getCurrentDate();this.dateSelect.emit(e)}calculateCalendar(){const e=[];const t=n.utc(this.selectedYear,this.selectedMonth+1);const r=t.startOf("month");const i=t.endOf("month");let o=r.weekNumber;let a=i.weekNumber;let s=r.weekday-1;let d=i.weekday-1;if(this.weekStartIndex!==0){const e=c.weekdays();const t=e[r.weekday];s=this.dayNames.findIndex((e=>e===t));const o=e[i.weekday];d=this.dayNames.findIndex((e=>e===o))}let h=false;if(a===1){a=i.weeksInWeekYear+1;h=true}let l=false;if(o===r.weeksInWeekYear){o=1;a++;l=true}let u=1;for(let t=o;t<=a&&u<=31;t++){const n=[];for(let e=0;e<this.DAYS_IN_WEEK&&u<=31;e++){if(t===o&&e<s||t===a&&e>d){n.push(undefined)}else{n.push(u++)}}if(l||h){if(t===1){e.push({weekNumber:r.weeksInWeekYear,dayNumbers:n})}else if(t===i.weekNumber){e.push({weekNumber:1,dayNumbers:n})}else{e.push({weekNumber:t-1,dayNumbers:n})}continue}e.push({weekNumber:t,dayNumbers:n})}this.calendar=e}selectTempYear(e,t){e===null||e===void 0?void 0:e.stopPropagation();this.tempYear=t}focusMonth(){this.firstMonthRef.focus()}infiniteScrollYears(){const e=this.yearContainerRef.scrollTop;const t=this.yearContainerRef.scrollHeight;const r=e===0;const i=Math.round(e+this.yearContainerRef.offsetHeight)>=t;const o=200;if(this.endYear-this.startYear>o)return;if(r){const e=this.yearContainerRef.firstElementChild;this.startYear-=5;this.yearContainerRef.scrollTo(0,e.offsetTop);return}if(i){const e=this.yearContainerRef.lastElementChild;this.endYear+=5;this.yearContainerRef.scrollTo(0,e.offsetTop)}}selectMonth(e){this.selectedMonth=e;this.selectedYear=this.tempYear;this.tempMonth=e;this.hostElement.shadowRoot.querySelector("ix-dropdown").show=false}changeToAdjacentMonth(e){if(this.selectedMonth+e<0){this.selectedYear--;this.selectedMonth=11}else if(this.selectedMonth+e>11){this.selectedYear++;this.selectedMonth=0}else{this.selectedMonth+=e}}selectDay(e){const t=n.fromJSDate(new Date(this.selectedYear,this.selectedMonth,e));if(!this.range||this.currFromDate===undefined){this.currFromDate=t;this.onDateChange();return}if(this.currToDate!==undefined){this.currFromDate=t;this.currToDate=undefined;this.onDateChange();return}if(t<this.currFromDate){this.currToDate=this.currFromDate;this.currFromDate=t;this.onDateChange();return}this.currToDate=t;this.onDateChange()}onDateChange(){this.getCurrentDate().then((e=>{this.dateChange.emit(e);if(this.range){this.dateRangeChange.emit(e)}}))}getDayClasses(e){var t,r,i,o;if(!e){return}const a=this.getDateTimeNow();const s=n.fromJSDate(new Date(this.selectedYear,this.selectedMonth,e));return{"calendar-item":true,"empty-day":e===undefined,today:a.hasSame(s,"day"),selected:((t=this.currFromDate)===null||t===void 0?void 0:t.hasSame(s,"day"))||((r=this.currToDate)===null||r===void 0?void 0:r.hasSame(s,"day")),range:s.startOf("day")>((i=this.currFromDate)===null||i===void 0?void 0:i.startOf("day"))&&this.currToDate!==undefined&&s.startOf("day")<((o=this.currToDate)===null||o===void 0?void 0:o.startOf("day")),disabled:!this.isWithinMinMaxDate(s)}}isWithinMinMaxYear(e){const t=this.minDate?n.fromFormat(this.minDate,this.format).year:undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format).year:undefined;const i=t?e<t:false;const o=r?e>r:false;return!i&&!o}isWithinMinMaxMonth(e){const t=this.minDate?n.fromFormat(this.minDate,this.format):undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format):undefined;const i=t===null||t===void 0?void 0:t.month;const o=r===null||r===void 0?void 0:r.month;const a=i?this.tempYear===t.year&&e<i:false;const s=o?this.tempYear===r.year&&e>o:false;return!a&&!s}isWithinMinMaxDate(e){const t=this.minDate?n.fromFormat(this.minDate,this.format):undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format):undefined;const i=t?e.startOf("day")<t.startOf("day"):false;const o=r?e.startOf("day")>r.startOf("day"):false;return!i&&!o}renderYears(){const e=[];for(let t=this.startYear;t<=this.endYear;t++){e.push(r("div",{key:t,class:{arrowYear:true,"month-dropdown-item":true,"disabled-item":!this.isWithinMinMaxYear(t)},onClick:e=>this.selectTempYear(e,t),onKeyUp:e=>{if(e.key==="Enter"){this.selectTempYear(null,t);this.focusMonth()}},tabIndex:0},r("ix-icon",{class:{hidden:this.tempYear!==t,arrowPosition:true},name:"chevron-right",size:"12"}),r("div",{style:{"min-width":"max-content"}},`${t}`)))}return e}render(){return r(i,{key:"559881c8673da97e842398f4bcfe67ef5ff27794"},r("ix-date-time-card",{key:"4550d5f5a242be0ff07110cc400ef12795475c5c",corners:this.corners,standaloneAppearance:this.standaloneAppearance},r("div",{key:"f10ccab02142ae7461ac4b4ba4e8a8eb57123438",class:"header",slot:"header"},r("ix-icon-button",{key:"52b171c5e04a5bbcb0832f0e6033947735521601",onClick:()=>this.changeToAdjacentMonth(-1),ghost:true,icon:"chevron-left",variant:"primary",class:"arrows"}),r("div",{key:"c48d51b3f22c9862c8006520530559ed44d16372",class:"selector"},r("ix-button",{key:"8c155fcbafb7c3f32dab3c9ebc912153813ce207",ghost:true,ref:e=>this.dropdownButtonRef=e,"data-testid":"year-month-button"},r("span",{key:"74c9634e13886d26238b4ee2262314914b1e8cf8",class:"fontSize capitalize"},this.monthNames[this.selectedMonth]," ",this.selectedYear)),r("ix-dropdown",{key:"ba249019d78a59e65f3a479a3ea8315b5990bcac","data-testid":"year-month-dropdown",class:"dropdown",trigger:this.dropdownButtonRef,ignoreRelatedSubmenu:true,placement:"bottom-start"},r("div",{key:"39365087bbb4c4dd4e0329828f61a90a1247b744",class:"wrapper"},r("div",{key:"017d16a032a473b0e791c8dc342b5e62481212e3","data-testid":"year-container",class:"overflow",onScroll:()=>this.infiniteScrollYears(),ref:e=>this.yearContainerRef=e},this.renderYears()),r("div",{key:"1bef58292da8545924f53fdbeddbc864936a56ef",class:"overflow","data-testid":"month-container"},this.monthNames.map(((e,t)=>r("div",{key:e,ref:t=>{if(e===this.monthNames[0]){this.firstMonthRef=t}},class:{arrowYear:true,"month-dropdown-item":true,selected:this.tempYear===this.selectedYear&&this.tempMonth===t,"disabled-item":!this.isWithinMinMaxMonth(t)},onClick:()=>this.selectMonth(t),onKeyUp:e=>e.key==="Enter"&&this.selectMonth(t),tabIndex:0},r("ix-icon",{class:{hidden:this.tempYear!==this.selectedYear||this.tempMonth!==t,checkPosition:true},name:"single-check",size:"16"}),r("div",null,r("span",{class:"capitalize monthMargin"},`${e} ${this.tempYear}`))))))))),r("ix-icon-button",{key:"f414faea937a05dd2690e82d01daf1f444fbce25",onClick:()=>this.changeToAdjacentMonth(1),ghost:true,icon:"chevron-right",variant:"primary",class:"arrows"})),r("div",{key:"b79a961fbfc8c8dd821a83ab172dd7146acc5ade",class:"grid"},r("div",{key:"7651643c6320b8598b52ffaa45dc70498854d1ad",class:"calendar-item week-day"}),this.dayNames.map((e=>r("div",{key:e,class:"calendar-item week-day"},e.slice(0,3)))),this.calendar.map((e=>r(a,null,r("div",{class:"calendar-item week-number"},e.weekNumber),e.dayNumbers.map((e=>r("div",{key:e,id:`day-cell-${e}`,"date-calender-day":true,class:this.getDayClasses(e),onClick:()=>this.selectDay(e),onKeyUp:t=>t.key==="Enter"&&this.selectDay(e),tabIndex:e===this.focusedDay?0:-1,onFocus:()=>this.onDayFocus(),onBlur:()=>this.onDayBlur()},e))))))),r("div",{key:"0e6b9845bfdb760777cbd0f2f8419aeb5b667799",class:{button:true,hidden:!this.range||!this.standaloneAppearance}},r("ix-button",{key:"bb02236b3e41f3168aa2d5aad2c8e4aa9af90a49",onClick:()=>this.onDone()},this.textSelectDate||this.i18nDone))))}get hostElement(){return s(this)}static get watchers(){return{from:["watchFromPropHandler"],to:["watchToPropHandler"],locale:["onLocaleChange"]}}};m([h("keydown")],k.prototype,"handleKeyUp",null);k.style=g;const p=":host{--ix-layout-grid-gutter:24px;display:block;flex:1 1 0%;width:100%;padding-left:calc(var(--ix-layout-grid-gutter) * 0.5);padding-right:calc(var(--ix-layout-grid-gutter) * 0.5)}:host(.no-margin){padding-left:0;padding-right:0}";const v=p;const y=class{constructor(t){e(this,t);this.noMargin=false;this.gap="24";this.columns=12}render(){return r(i,{key:"d77291cf3cca2fd4a61c8998a095923f195b3d8f",class:{"no-margin":this.noMargin},style:{"--ix-layout-grid-columns":`${this.columns}`,"--ix-layout-grid-gutter":`${this.gap}px`}},r("slot",{key:"c149d8a794c75e48d748cccbc3cb9aada30c30ef"}))}};y.style=v;const x=":host{display:flex;flex-wrap:wrap}:host(:not(:first-of-type)){margin-block-start:var(--ix-layout-grid-row-margin, 0)}";const w=x;const z=class{constructor(t){e(this,t)}render(){return r(i,{key:"b8813e92c151d3f0a6d063a4f03b50f384ef1127"},r("slot",{key:"5246811d7fb18593758b07a32e58fee15ba34d51"}))}};z.style=w;export{b as ix_col,k as ix_date_picker,y as ix_layout_grid,z as ix_row};
-//# sourceMappingURL=p-e30ed20a.entry.js.map
+import{r as e,f as t,h as r,H as i,c as o,F as a,g as s}from"./p-f87cd962.js";import{m as d}from"./p-68a274e7.js";import{D as n,I as c}from"./p-f5e574da.js";import{O as h}from"./p-e948bcb0.js";const l=":host{position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px;padding:calc(var(--ix-layout-grid-gutter) * 0.5)}: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}";const u=l;const b=class{constructor(t){e(this,t);this.size=undefined;this.sizeSm=undefined;this.sizeMd=undefined;this.sizeLg=undefined}onResize(){t(this)}getSize(e){if(e===""){return this.size}if(e==="sm"){return this.sizeSm}if(e==="md"){return this.sizeMd}if(e==="lg"){return this.sizeLg}}getColumnSize(){let e;b.Breakpoints.forEach((t=>{const r=t!==""?d(t):true;if(!r){return}const i=this.getSize(t);if(i){e=i}}));return e}getColumnSizeStyling(){const e=this.getColumnSize();if(!e){return}if(e==="auto"){return{flex:"0 0 auto",width:"auto","max-width":"auto"}}const t=`calc(calc(${e} / var(--ix-layout-grid-columns)) * 100%)`;return{flex:`0 0 ${t}`,width:`${t}`,"max-width":`${t}`}}render(){return r(i,{key:"7cbf750f0768a0a1db65aa2651605c89f82ce604",style:Object.assign({},this.getColumnSizeStyling())},r("slot",{key:"d83749089de332574097a8299c265d45b1fd8da7"}))}};b.Breakpoints=["","sm","md","lg"];b.style=u;const f=":host{display:block;position:relative;width:22rem}: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 .header{display:flex;align-items:center;justify-content:space-between}:host .disabled-item{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .selector{flex-basis:100%;display:flex;align-items:center;justify-content:center;padding:0.25rem 1rem}:host .selector .dropdown{color:var(--theme-menu-item--color);font-size:14px;line-height:20px}:host .selector .fontSize{font-size:16px}:host .selector .capitalize{text-transform:capitalize}:host .selector .month-dropdown-item{margin-left:4px;margin-right:4px}:host .selector .month-dropdown-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .selector .arrowYear{display:flex;position:relative;padding:0.75rem 2rem;align-items:center;cursor:pointer}:host .selector .arrowYear:hover{background-color:var(--theme-select-list-item--background--hover)}:host .selector .arrowYear.selected{background-color:var(--theme-select-list-item--background--selected)}:host .selector .arrowYear .arrowPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 6px)}:host .selector .arrowYear .checkPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 8px)}:host .selector .arrowYear .monthMargin{margin-left:10px}:host .wrapper{display:flex}:host .wrapper .overflow{overflow-y:scroll;max-height:250px}:host .grid{display:grid;grid-template-columns:repeat(8, 40px);grid-template-rows:repeat(7, 40px);align-items:center;justify-items:center;justify-content:center;color:var(--theme-datepicker-today--color)}:host .grid .calendar-item{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--theme-datepicker-day--background);border:1px solid var(--theme-datepicker-day--background);width:40px;height:40px;cursor:pointer}:host .grid .calendar-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .grid .calendar-item.today{border:1px solid var(--theme-datepicker-today--border-color)}:host .grid .calendar-item.today:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item.today:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.today.selected{box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.today.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.today.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);border:1px solid var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.today.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range);border:1px solid var(--theme-datepicker-today--border-color--range);box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.range:hover{background-color:var(--theme-datepicker-day--background--range-hover);border:1px solid var(--theme-datepicker-today--border-color--range-hover)}:host .grid .calendar-item.today.range:active{background-color:var(--theme-datepicker-day--background--range-active);border:1px solid var(--theme-datepicker-today--border-color--range-active)}:host .grid .calendar-item.today.range.disabled{background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled);border:1px solid var(--theme-datepicker-today--border-color--range-disabled)}:host .grid .calendar-item.today.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .grid .calendar-item:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);border:1px solid var(--theme-datepicker-day--background--selected)}:host .grid .calendar-item.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range)}:host .grid .calendar-item.range:hover{background-color:var(--theme-datepicker-day--background--range-hover)}:host .grid .calendar-item.range:active{background-color:var(--theme-datepicker-day--background--range-active)}:host .grid .calendar-item.range.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled)}:host .grid .calendar-item.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled)}:host .grid .calendar-item.week-day{color:var(--theme-datepicker-weekday--color);font-size:12px;line-height:20px;border:none;background:none;cursor:initial}:host .grid .calendar-item.empty-day{border:none;background:none;cursor:initial}:host .grid .calendar-item.week-number{font-size:10px;line-height:14px;color:var(--theme-datepicker-weekday--color);border:none;background:none;cursor:initial}:host .grid .calendar-item:focus-visible{background-color:var(--theme-datepicker-day--background--selected);border:inset 1px solid var(--theme-datepicker-day--border-color--selected);color:var(--theme-datepicker-day--color--selected);font-size:14px;line-height:20px;letter-spacing:0}:host .button{display:flex;justify-content:flex-end}:host .hidden{display:none}";const g=f;var m=undefined&&undefined.__decorate||function(e,t,r,i){var o=arguments.length,a=o<3?t:i===null?i=Object.getOwnPropertyDescriptor(t,r):i,s;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")a=Reflect.decorate(e,t,r,i);else for(var d=e.length-1;d>=0;d--)if(s=e[d])a=(o<3?s(a):o>3?s(t,r,a):s(t,r))||a;return o>3&&a&&Object.defineProperty(t,r,a),a};const k=class{constructor(t){e(this,t);this.dateChange=o(this,"dateChange",7);this.dateRangeChange=o(this,"dateRangeChange",7);this.dateSelect=o(this,"dateSelect",7);this.done=o(this,"done",7);this.DAYS_IN_WEEK=7;this.format="yyyy/LL/dd";this.range=true;this.corners="rounded";this.from=undefined;this.to=undefined;this.minDate=undefined;this.maxDate=undefined;this.textSelectDate=undefined;this.i18nDone="Done";this.weekStartIndex=0;this.locale=undefined;this.individual=true;this.eventDelimiter=" - ";this.standaloneAppearance=true;this.today=n.now().toISO();this.currFromDate=undefined;this.currToDate=undefined;this.selectedYear=undefined;this.tempYear=undefined;this.startYear=undefined;this.endYear=undefined;this.selectedMonth=undefined;this.tempMonth=undefined;this.dropdownButtonRef=undefined;this.yearContainerRef=undefined;this.dayNames=undefined;this.monthNames=undefined;this.firstMonthRef=undefined;this.focusedDay=1;this.focusedDayElem=undefined}watchFromPropHandler(e){var t;this.currFromDate=e?n.fromFormat(e,this.format):undefined;if((t=this.currFromDate)===null||t===void 0?void 0:t.isValid){this.selectedYear=this.currFromDate.year;this.selectedMonth=this.currFromDate.month-1}}watchToPropHandler(e){var t;this.currToDate=e?n.fromFormat(e,this.format):undefined;if((t=this.currToDate)===null||t===void 0?void 0:t.isValid){this.selectedYear=this.currToDate.year;this.selectedMonth=this.currToDate.month-1}}onLocaleChange(){this.setTranslations()}async getCurrentDate(){var e,t,r,i;const o=((e=this.currFromDate)===null||e===void 0?void 0:e.isValid)?(t=this.currFromDate)===null||t===void 0?void 0:t.toFormat(this.format):undefined;const a=((r=this.currToDate)===null||r===void 0?void 0:r.isValid)?(i=this.currToDate)===null||i===void 0?void 0:i.toFormat(this.format):undefined;if(this.range){return{from:o,to:a}}return{from:o,to:undefined}}handleKeyUp(e){if(!this.isDayFocus){return}let t=this.focusedDay;switch(e.key){case"ArrowLeft":t--;break;case"ArrowRight":t++;break;case"ArrowUp":t=t-7;break;case"ArrowDown":t=t+7;break;default:return}if(t>this.getDaysInCurrentMonth()){t=t-this.getDaysInCurrentMonth();this.changeToAdjacentMonth(1);this.monthChangedFromFocus=true}else if(t<1){this.changeToAdjacentMonth(-1);t=t+this.getDaysInCurrentMonth();this.monthChangedFromFocus=true}this.focusedDay=t}getDaysInCurrentMonth(){return n.utc(this.selectedYear,this.selectedMonth+1).daysInMonth}getDateTimeNow(){return n.fromISO(this.today)}onDayBlur(){this.isDayFocus=false}onDayFocus(){this.isDayFocus=true}componentWillLoad(){var e,t,r,i;this.setTranslations();this.currFromDate=this.from?n.fromFormat(this.from,this.format):undefined;this.currToDate=this.to?n.fromFormat(this.to,this.format):undefined;const o=(t=(e=this.currFromDate)===null||e===void 0?void 0:e.year)!==null&&t!==void 0?t:this.getDateTimeNow().year;this.startYear=o-5;this.endYear=o+5;this.selectedMonth=((i=(r=this.currFromDate)===null||r===void 0?void 0:r.month)!==null&&i!==void 0?i:this.getDateTimeNow().month)-1;this.selectedYear=o;this.tempMonth=this.selectedMonth;this.tempYear=this.selectedYear}componentWillRender(){this.calculateCalendar()}componentDidRender(){if(!this.monthChangedFromFocus&&!this.isDayFocus){return}const e=this.hostElement.shadowRoot.querySelector(`[id=day-cell-${this.focusedDay}]`);e.focus()}setTranslations(){this.dayNames=this.rotateWeekDayNames(c.weekdays("long",{locale:this.locale}),this.weekStartIndex);this.monthNames=c.months("long",{locale:this.locale})}rotateWeekDayNames(e,t){const r=[...e];if(t===0){return r}t=-t;const i=e.length;r.push(...r.splice(0,(-t%i+i)%i));return r}async onDone(){const e=await this.getCurrentDate();this.dateSelect.emit(e)}calculateCalendar(){const e=[];const t=n.utc(this.selectedYear,this.selectedMonth+1);const r=t.startOf("month");const i=t.endOf("month");let o=r.weekNumber;let a=i.weekNumber;let s=r.weekday-1;let d=i.weekday-1;if(this.weekStartIndex!==0){const e=c.weekdays();const t=e[r.weekday];s=this.dayNames.findIndex((e=>e===t));const o=e[i.weekday];d=this.dayNames.findIndex((e=>e===o))}let h=false;if(a===1){a=i.weeksInWeekYear+1;h=true}let l=false;if(o===r.weeksInWeekYear){o=1;a++;l=true}let u=1;for(let t=o;t<=a&&u<=31;t++){const n=[];for(let e=0;e<this.DAYS_IN_WEEK&&u<=31;e++){if(t===o&&e<s||t===a&&e>d){n.push(undefined)}else{n.push(u++)}}if(l||h){if(t===1){e.push({weekNumber:r.weeksInWeekYear,dayNumbers:n})}else if(t===i.weekNumber){e.push({weekNumber:1,dayNumbers:n})}else{e.push({weekNumber:t-1,dayNumbers:n})}continue}e.push({weekNumber:t,dayNumbers:n})}this.calendar=e}selectTempYear(e,t){e===null||e===void 0?void 0:e.stopPropagation();this.tempYear=t}focusMonth(){this.firstMonthRef.focus()}infiniteScrollYears(){const e=this.yearContainerRef.scrollTop;const t=this.yearContainerRef.scrollHeight;const r=e===0;const i=Math.round(e+this.yearContainerRef.offsetHeight)>=t;const o=200;if(this.endYear-this.startYear>o)return;if(r){const e=this.yearContainerRef.firstElementChild;this.startYear-=5;this.yearContainerRef.scrollTo(0,e.offsetTop);return}if(i){const e=this.yearContainerRef.lastElementChild;this.endYear+=5;this.yearContainerRef.scrollTo(0,e.offsetTop)}}selectMonth(e){this.selectedMonth=e;this.selectedYear=this.tempYear;this.tempMonth=e;this.hostElement.shadowRoot.querySelector("ix-dropdown").show=false}changeToAdjacentMonth(e){if(this.selectedMonth+e<0){this.selectedYear--;this.selectedMonth=11}else if(this.selectedMonth+e>11){this.selectedYear++;this.selectedMonth=0}else{this.selectedMonth+=e}}selectDay(e){const t=n.fromJSDate(new Date(this.selectedYear,this.selectedMonth,e));if(!this.range||this.currFromDate===undefined){this.currFromDate=t;this.onDateChange();return}if(this.currToDate!==undefined){this.currFromDate=t;this.currToDate=undefined;this.onDateChange();return}if(t<this.currFromDate){this.currToDate=this.currFromDate;this.currFromDate=t;this.onDateChange();return}this.currToDate=t;this.onDateChange()}onDateChange(){this.getCurrentDate().then((e=>{this.dateChange.emit(e);if(this.range){this.dateRangeChange.emit(e)}}))}getDayClasses(e){var t,r,i,o;if(!e){return}const a=this.getDateTimeNow();const s=n.fromJSDate(new Date(this.selectedYear,this.selectedMonth,e));return{"calendar-item":true,"empty-day":e===undefined,today:a.hasSame(s,"day"),selected:((t=this.currFromDate)===null||t===void 0?void 0:t.hasSame(s,"day"))||((r=this.currToDate)===null||r===void 0?void 0:r.hasSame(s,"day")),range:s.startOf("day")>((i=this.currFromDate)===null||i===void 0?void 0:i.startOf("day"))&&this.currToDate!==undefined&&s.startOf("day")<((o=this.currToDate)===null||o===void 0?void 0:o.startOf("day")),disabled:!this.isWithinMinMaxDate(s)}}isWithinMinMaxYear(e){const t=this.minDate?n.fromFormat(this.minDate,this.format).year:undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format).year:undefined;const i=t?e<t:false;const o=r?e>r:false;return!i&&!o}isWithinMinMaxMonth(e){const t=this.minDate?n.fromFormat(this.minDate,this.format):undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format):undefined;const i=t===null||t===void 0?void 0:t.month;const o=r===null||r===void 0?void 0:r.month;const a=i?this.tempYear===t.year&&e<i:false;const s=o?this.tempYear===r.year&&e>o:false;return!a&&!s}isWithinMinMaxDate(e){const t=this.minDate?n.fromFormat(this.minDate,this.format):undefined;const r=this.maxDate?n.fromFormat(this.maxDate,this.format):undefined;const i=t?e.startOf("day")<t.startOf("day"):false;const o=r?e.startOf("day")>r.startOf("day"):false;return!i&&!o}renderYears(){const e=[];for(let t=this.startYear;t<=this.endYear;t++){e.push(r("div",{key:t,class:{arrowYear:true,"month-dropdown-item":true,"disabled-item":!this.isWithinMinMaxYear(t)},onClick:e=>this.selectTempYear(e,t),onKeyUp:e=>{if(e.key==="Enter"){this.selectTempYear(null,t);this.focusMonth()}},tabIndex:0},r("ix-icon",{class:{hidden:this.tempYear!==t,arrowPosition:true},name:"chevron-right",size:"12"}),r("div",{style:{"min-width":"max-content"}},`${t}`)))}return e}render(){return r(i,{key:"559881c8673da97e842398f4bcfe67ef5ff27794"},r("ix-date-time-card",{key:"4550d5f5a242be0ff07110cc400ef12795475c5c",corners:this.corners,standaloneAppearance:this.standaloneAppearance},r("div",{key:"f10ccab02142ae7461ac4b4ba4e8a8eb57123438",class:"header",slot:"header"},r("ix-icon-button",{key:"52b171c5e04a5bbcb0832f0e6033947735521601",onClick:()=>this.changeToAdjacentMonth(-1),ghost:true,icon:"chevron-left",variant:"primary",class:"arrows"}),r("div",{key:"c48d51b3f22c9862c8006520530559ed44d16372",class:"selector"},r("ix-button",{key:"8c155fcbafb7c3f32dab3c9ebc912153813ce207",ghost:true,ref:e=>this.dropdownButtonRef=e,"data-testid":"year-month-button"},r("span",{key:"74c9634e13886d26238b4ee2262314914b1e8cf8",class:"fontSize capitalize"},this.monthNames[this.selectedMonth]," ",this.selectedYear)),r("ix-dropdown",{key:"ba249019d78a59e65f3a479a3ea8315b5990bcac","data-testid":"year-month-dropdown",class:"dropdown",trigger:this.dropdownButtonRef,ignoreRelatedSubmenu:true,placement:"bottom-start"},r("div",{key:"39365087bbb4c4dd4e0329828f61a90a1247b744",class:"wrapper"},r("div",{key:"017d16a032a473b0e791c8dc342b5e62481212e3","data-testid":"year-container",class:"overflow",onScroll:()=>this.infiniteScrollYears(),ref:e=>this.yearContainerRef=e},this.renderYears()),r("div",{key:"1bef58292da8545924f53fdbeddbc864936a56ef",class:"overflow","data-testid":"month-container"},this.monthNames.map(((e,t)=>r("div",{key:e,ref:t=>{if(e===this.monthNames[0]){this.firstMonthRef=t}},class:{arrowYear:true,"month-dropdown-item":true,selected:this.tempYear===this.selectedYear&&this.tempMonth===t,"disabled-item":!this.isWithinMinMaxMonth(t)},onClick:()=>this.selectMonth(t),onKeyUp:e=>e.key==="Enter"&&this.selectMonth(t),tabIndex:0},r("ix-icon",{class:{hidden:this.tempYear!==this.selectedYear||this.tempMonth!==t,checkPosition:true},name:"single-check",size:"16"}),r("div",null,r("span",{class:"capitalize monthMargin"},`${e} ${this.tempYear}`))))))))),r("ix-icon-button",{key:"f414faea937a05dd2690e82d01daf1f444fbce25",onClick:()=>this.changeToAdjacentMonth(1),ghost:true,icon:"chevron-right",variant:"primary",class:"arrows"})),r("div",{key:"b79a961fbfc8c8dd821a83ab172dd7146acc5ade",class:"grid"},r("div",{key:"7651643c6320b8598b52ffaa45dc70498854d1ad",class:"calendar-item week-day"}),this.dayNames.map((e=>r("div",{key:e,class:"calendar-item week-day"},e.slice(0,3)))),this.calendar.map((e=>r(a,null,r("div",{class:"calendar-item week-number"},e.weekNumber),e.dayNumbers.map((e=>r("div",{key:e,id:`day-cell-${e}`,"date-calender-day":true,class:this.getDayClasses(e),onClick:()=>this.selectDay(e),onKeyUp:t=>t.key==="Enter"&&this.selectDay(e),tabIndex:e===this.focusedDay?0:-1,onFocus:()=>this.onDayFocus(),onBlur:()=>this.onDayBlur()},e))))))),r("div",{key:"0e6b9845bfdb760777cbd0f2f8419aeb5b667799",class:{button:true,hidden:!this.range||!this.standaloneAppearance}},r("ix-button",{key:"bb02236b3e41f3168aa2d5aad2c8e4aa9af90a49",onClick:()=>this.onDone()},this.textSelectDate||this.i18nDone))))}get hostElement(){return s(this)}static get watchers(){return{from:["watchFromPropHandler"],to:["watchToPropHandler"],locale:["onLocaleChange"]}}};m([h("keydown")],k.prototype,"handleKeyUp",null);k.style=g;const p=":host{--ix-layout-grid-gutter:24px;display:block;flex:1 1 0%;width:100%;padding-left:calc(var(--ix-layout-grid-gutter) * 0.5);padding-right:calc(var(--ix-layout-grid-gutter) * 0.5)}:host(.no-margin){padding-left:0;padding-right:0}";const v=p;const y=class{constructor(t){e(this,t);this.noMargin=false;this.gap="24";this.columns=12}render(){return r(i,{key:"af1bab1dee014e6675fe2a2304802a5767a76624",class:{"no-margin":this.noMargin},style:{"--ix-layout-grid-columns":`${this.columns}`,"--ix-layout-grid-gutter":`${this.gap}px`}},r("slot",{key:"db8de47b0e374e37dad532533c503f4129ecc75b"}))}};y.style=v;const x=":host{display:flex;flex-wrap:wrap}:host(:not(:first-of-type)){margin-block-start:var(--ix-layout-grid-row-margin, 0)}";const w=x;const z=class{constructor(t){e(this,t)}render(){return r(i,{key:"a550981bb86cb6a4ddad9d8cb7b3e4e08c7efa7b"},r("slot",{key:"6c8d68477bf64d068ad8de922191f6dad6c4d2e1"}))}};z.style=w;export{b as ix_col,k as ix_date_picker,y as ix_layout_grid,z as ix_row};
+//# sourceMappingURL=p-62b089b6.entry.js.map

package/dist/siemens-ix/{p-e30ed20a.entry.js.map → p-62b089b6.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["colCss","IxColStyle0","Col","onResize","forceUpdate","this","getSize","breakpoint","size","sizeSm","sizeMd","sizeLg","getColumnSize","Breakpoints","forEach","isMediaQueryActive","matchBreakpoint","currentSize","getColumnSizeStyling","flex","width","colSize","render","h","Host","key","style","Object","assign","datePickerCss","IxDatePickerStyle0","DatePicker","DAYS_IN_WEEK","undefined","DateTime","now","toISO","watchFromPropHandler","newValue","currFromDate","fromFormat","format","_a","isValid","selectedYear","year","selectedMonth","month","watchToPropHandler","currToDate","onLocaleChange","setTranslations","getCurrentDate","_from","_b","toFormat","_to","_c","_d","range","from","to","handleKeyUp","event","isDayFocus","_focusedDay","focusedDay","getDaysInCurrentMonth","changeToAdjacentMonth","monthChangedFromFocus","utc","daysInMonth","getDateTimeNow","fromISO","today","onDayBlur","onDayFocus","componentWillLoad","startYear","endYear","tempMonth","tempYear","componentWillRender","calculateCalendar","componentDidRender","dayElem","hostElement","shadowRoot","querySelector","focus","dayNames","rotateWeekDayNames","Info","weekdays","locale","weekStartIndex","monthNames","months","index","clone","len","length","push","splice","onDone","date","dateSelect","emit","calendar","monthStart","startOf","monthEnd","endOf","startWeek","weekNumber","endWeek","monthStartWeekDayIndex","weekday","monthEndWeekDayIndex","monthStartWeekDayName","findIndex","d","monthEndWeekDayName","correctLastWeek","weeksInWeekYear","correctFirstWeek","currDayNumber","weekIndex","daysArr","j","dayNumbers","selectTempYear","stopPropagation","focusMonth","firstMonthRef","infiniteScrollYears","scroll","yearContainerRef","scrollTop","maxScroll","scrollHeight","atTop","atBottom","Math","round","offsetHeight","limit","first","firstElementChild","scrollTo","offsetTop","last","lastElementChild","selectMonth","show","number","selectDay","selectedDay","fromJSDate","Date","onDateChange","then","dateChange","dateRangeChange","getDayClasses","day","todayObj","selectedDayObj","hasSame","selected","disabled","isWithinMinMaxDate","isWithinMinMaxYear","minDateYear","minDate","maxDateYear","maxDate","isBefore","isAfter","isWithinMinMaxMonth","minDateObj","maxDateObj","minDateMonth","maxDateMonth","_minDate","_maxDate","renderYears","rows","class","arrowYear","onClick","onKeyUp","tabIndex","hidden","arrowPosition","name","corners","standaloneAppearance","slot","ghost","icon","variant","ref","dropdownButtonRef","trigger","ignoreRelatedSubmenu","placement","onScroll","map","checkPosition","slice","week","Fragment","id","e","onFocus","onBlur","button","textSelectDate","i18nDone","__decorate","OnListener","layoutGridCss","IxLayoutGridStyle0","LayoutGrid","noMargin","columns","gap","rowCss","IxRowStyle0","Row"],"sources":["src/components/col/col.scss?tag=ix-col&encapsulation=shadow","src/components/col/col.tsx","src/components/date-picker/date-picker.scss?tag=ix-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx","src/components/grid/layout-grid.scss?tag=ix-layout-grid&encapsulation=shadow","src/components/grid/layout-grid.tsx","src/components/row/row.scss?tag=ix-row&encapsulation=shadow","src/components/row/row.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/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  position: relative;\n  flex-basis: 0;\n  flex-grow: 1;\n  width: 100%;\n  max-width: 100%;\n  min-height: 1px;\n\n  padding: calc(var(--ix-layout-grid-gutter) * 0.5);\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, forceUpdate, h, Host, Listen, Prop } from '@stencil/core';\nimport { Breakpoint, matchBreakpoint } from '../utils/breakpoints';\n\ntype GridBreakpoint = Breakpoint | '';\n\nexport type ColumnSize =\n  | '1'\n  | '2'\n  | '3'\n  | '4'\n  | '5'\n  | '6'\n  | '7'\n  | '8'\n  | '9'\n  | '10'\n  | '11'\n  | '12'\n  | 'auto';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-col',\n  styleUrl: 'col.scss',\n  shadow: true,\n})\nexport class Col {\n  static Breakpoints: GridBreakpoint[] = ['', 'sm', 'md', 'lg'];\n\n  /**\n   * Size of the column\n   */\n  @Prop() size?: ColumnSize;\n\n  /**\n   * Size of the column for sm screens\n   */\n  @Prop() sizeSm?: ColumnSize;\n\n  /**\n   * Size of the column for md screens\n   */\n  @Prop() sizeMd?: ColumnSize;\n\n  /**\n   * Size of the column for lg screens\n   */\n  @Prop() sizeLg?: ColumnSize;\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    forceUpdate(this);\n  }\n\n  private getSize(breakpoint: GridBreakpoint) {\n    if (breakpoint === '') {\n      return this.size;\n    }\n\n    if (breakpoint === 'sm') {\n      return this.sizeSm;\n    }\n\n    if (breakpoint === 'md') {\n      return this.sizeMd;\n    }\n\n    if (breakpoint === 'lg') {\n      return this.sizeLg;\n    }\n  }\n\n  private getColumnSize() {\n    let size: ColumnSize;\n    Col.Breakpoints.forEach((breakpoint) => {\n      const isMediaQueryActive =\n        breakpoint !== '' ? matchBreakpoint(breakpoint) : true;\n\n      if (!isMediaQueryActive) {\n        return;\n      }\n\n      const currentSize = this.getSize(breakpoint);\n\n      if (currentSize) {\n        size = currentSize;\n      }\n    });\n\n    return size;\n  }\n\n  private getColumnSizeStyling() {\n    const size = this.getColumnSize();\n\n    if (!size) {\n      return;\n    }\n\n    if (size === 'auto') {\n      return {\n        flex: '0 0 auto',\n        width: 'auto',\n        'max-width': 'auto',\n      };\n    }\n\n    const colSize = `calc(calc(${size} / var(--ix-layout-grid-columns)) * 100%)`;\n\n    return {\n      flex: `0 0 ${colSize}`,\n      width: `${colSize}`,\n      'max-width': `${colSize}`,\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        style={{\n          ...this.getColumnSizeStyling(),\n        }}\n      >\n        <slot></slot>\n      </Host>\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 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  width: 22rem;\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n\n  .disabled-item {\n    pointer-events: none;\n    background-color: var(--theme-datepicker-day--background--disabled);\n    color: var(--theme-datepicker-day--color--disabled);\n    cursor: default;\n  }\n\n  .selector {\n    flex-basis: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: $tiny-space $default-space;\n\n    .dropdown {\n      color: var(--theme-menu-item--color);\n      font-size: 14px;\n      line-height: 20px;\n    }\n\n    .fontSize {\n      font-size: 16px;\n    }\n\n    .capitalize {\n      text-transform: capitalize;\n    }\n\n    .month-dropdown-item {\n      margin-left: 4px;\n      margin-right: 4px;\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n      }\n    }\n\n    .arrowYear {\n      display: flex;\n      position: relative;\n      padding: $medium-space $x-large-space;\n      align-items: center;\n      cursor: pointer;\n\n      &:hover {\n        background-color: var(--theme-select-list-item--background--hover);\n      }\n\n      &.selected {\n        background-color: var(--theme-select-list-item--background--selected);\n      }\n\n      .arrowPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 6px);\n      }\n\n      .checkPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 8px);\n      }\n\n      .monthMargin {\n        margin-left: 10px;\n      }\n    }\n  }\n\n  .wrapper {\n    display: flex;\n\n    .overflow {\n      overflow-y: scroll;\n      max-height: 250px;\n    }\n  }\n\n  .grid {\n    display: grid;\n    grid-template-columns: repeat(8, 40px);\n    grid-template-rows: repeat(7, 40px);\n    align-items: center;\n    justify-items: center;\n    justify-content: center;\n    color: var(--theme-datepicker-today--color);\n\n    .calendar-item {\n      position: relative;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      background-color: var(--theme-datepicker-day--background);\n      border: 1px solid var(--theme-datepicker-day--background);\n      width: 40px;\n      height: 40px;\n      cursor: pointer;\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n      }\n\n      &.today {\n        border: 1px solid var(--theme-datepicker-today--border-color);\n\n        &:hover {\n          background-color: var(--theme-datepicker-day--background--hover);\n        }\n\n        &:active {\n          background-color: var(--theme-datepicker-day--background--active);\n        }\n\n        &.selected {\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                            --theme-datepicker-day--background--selected-hover\n            );\n          }\n\n          &:active {\n            background-color: var(\n                            --theme-datepicker-day--background--selected-active\n            );\n          }\n\n          &.disabled {\n            pointer-events: none;\n            background-color: var(\n                            --theme-datepicker-day--background--selected-disabled\n            );\n            border: 1px solid\n            var(--theme-datepicker-day--background--selected-disabled);\n            color: var(--theme-datepicker-day--color--selected-disabled);\n          }\n        }\n\n        &.range {\n          background-color: var(--theme-datepicker-day--background--range);\n          color: var(--theme-datepicker-day--color--range);\n          border: 1px solid var(--theme-datepicker-today--border-color--range);\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                            --theme-datepicker-day--background--range-hover\n            );\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-hover);\n          }\n\n          &:active {\n            background-color: var(\n                            --theme-datepicker-day--background--range-active\n            );\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-active);\n          }\n\n          &.disabled {\n            background-color: var(\n                            --theme-datepicker-day--background--range-disabled\n            );\n            color: var(--theme-datepicker-day--color--range-disabled);\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-disabled);\n          }\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(--theme-datepicker-day--background--disabled);\n          color: var(--theme-datepicker-day--color--disabled);\n          cursor: default;\n        }\n      }\n\n      &:hover {\n        background-color: var(--theme-datepicker-day--background--hover);\n      }\n\n      &:active {\n        background-color: var(--theme-datepicker-day--background--active);\n      }\n\n      &.selected {\n        background-color: var(--theme-datepicker-day--background--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        border: 1px solid var(--theme-datepicker-day--background--selected);\n\n        &:hover {\n          background-color: var(\n                          --theme-datepicker-day--background--selected-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n                          --theme-datepicker-day--background--selected-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n                          --theme-datepicker-day--background--selected-disabled\n          );\n          color: var(--theme-datepicker-day--color--selected-disabled);\n        }\n      }\n\n      &.range {\n        background-color: var(--theme-datepicker-day--background--range);\n        color: var(--theme-datepicker-day--color--range);\n\n        &:hover {\n          background-color: var(\n                          --theme-datepicker-day--background--range-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n                          --theme-datepicker-day--background--range-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n                          --theme-datepicker-day--background--range-disabled\n          );\n          color: var(--theme-datepicker-day--color--range-disabled);\n        }\n      }\n\n      &.disabled {\n        pointer-events: none;\n        background-color: var(--theme-datepicker-day--background--disabled);\n        color: var(--theme-datepicker-day--color--disabled);\n      }\n\n      &.week-day {\n        color: var(--theme-datepicker-weekday--color);\n        font-size: 12px;\n        line-height: 20px;\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &.empty-day {\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &.week-number {\n        font-size: 10px;\n        line-height: 14px;\n        color: var(--theme-datepicker-weekday--color);\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &:focus-visible {\n        background-color: var(--theme-datepicker-day--background--selected);\n        border: inset 1px solid\n        var(--theme-datepicker-day--border-color--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        font-size: 14px;\n        line-height: 20px;\n        letter-spacing: 0;\n      }\n    }\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .hidden {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nimport { DateTime, Info } from 'luxon';\nimport { OnListener } from '../utils/listener';\n\nexport type DateChangeEvent = {\n  from: string;\n  to: string;\n};\n\nexport type DateTimeCorners = DateTimeCardCorners;\n\ninterface CalendarWeek {\n  weekNumber: number;\n  dayNumbers: number[];\n}\n\n@Component({\n  tag: 'ix-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n})\nexport class DatePicker {\n  @Element() hostElement: HTMLIxDatePickerElement;\n\n  /**\n   * Date format string.\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * If true a date-range can be selected (from/to).\n   */\n  @Prop() range: boolean = true;\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: DateTimeCardCorners = 'rounded';\n\n  /**\n   * The selected starting date. If the date-picker-rework is not in range mode this is the selected date.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() from: string | undefined;\n\n  @Watch('from')\n  watchFromPropHandler(newValue: string) {\n    this.currFromDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currFromDate?.isValid) {\n      this.selectedYear = this.currFromDate.year;\n      this.selectedMonth = this.currFromDate.month - 1;\n    }\n  }\n\n  /**\n   * The selected end date. If the the date-picker-rework is not in range mode this property has no impact.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() to: string | undefined;\n\n  @Watch('to')\n  watchToPropHandler(newValue: string) {\n    this.currToDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currToDate?.isValid) {\n      this.selectedYear = this.currToDate.year;\n      this.selectedMonth = this.currToDate.month - 1;\n    }\n  }\n\n  /**\n   * The earliest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() minDate: string;\n\n  /**\n   * The latest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() maxDate: string;\n\n  /**\n   * Text of the button that confirms date selection.\n   *\n   * @since 1.1.0\n   * @deprecated since 2.1.0. Use `i18nDone`\n   */\n  @Prop() textSelectDate: string;\n\n  /**\n   * Text of date select button\n   *\n   * @since 2.1.0\n   */\n  @Prop({ attribute: 'i18n-done' }) i18nDone = 'Done';\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   *\n   * @since 2.1.0\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * Format of time string\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   *\n   * @since 2.1.0\n   */\n  @Prop() locale: string = undefined;\n  @Watch('locale')\n  onLocaleChange() {\n    this.setTranslations();\n  }\n\n  /**\n   * @deprecated Not supported since 2.0.0.\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n   * This combination can be configured over the delimiter\n   *\n   * @since 1.1.0\n   * @deprecated Not used anymore see `this.dateChange`\n   */\n  @Prop() eventDelimiter = ' - ';\n\n  /** @internal */\n  @Prop() standaloneAppearance = true;\n\n  /** @internal */\n  @Prop() today = DateTime.now().toISO();\n\n  /**\n   * Triggers if the date selection changes.\n   * Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string`\n   *\n   * @since 2.1.0\n   */\n  @Event() dateChange: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Triggers if the date selection changes.\n   * Only triggered if date-picker-rework is in range mode.\n   *\n   * @since 2.1.0\n   */\n  @Event() dateRangeChange: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @since 1.1.0\n   */\n  @Event() dateSelect: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @deprecated NOT getting dispatched after 2.0.0. Use `dateSelect`.\n   */\n  @Event() done: EventEmitter<string>;\n\n  /**\n   * Get the currently selected date-range.\n   */\n  @Method()\n  async getCurrentDate() {\n    const _from = this.currFromDate?.isValid\n      ? this.currFromDate?.toFormat(this.format)\n      : undefined;\n    const _to = this.currToDate?.isValid\n      ? this.currToDate?.toFormat(this.format)\n      : undefined;\n\n    if (this.range) {\n      return {\n        from: _from,\n        to: _to,\n      };\n    }\n\n    return {\n      from: _from,\n      to: undefined,\n    };\n  }\n\n  @State() currFromDate: DateTime;\n  @State() currToDate: DateTime;\n\n  @State() selectedYear: number;\n  @State() tempYear: number;\n  @State() startYear: number;\n  @State() endYear: number;\n  @State() selectedMonth: number;\n  @State() tempMonth: number;\n\n  @State() dropdownButtonRef: HTMLElement;\n  @State() yearContainerRef: HTMLElement;\n\n  @State() dayNames: string[];\n  @State() monthNames: string[];\n  @State() firstMonthRef: HTMLElement;\n  @State() focusedDay: number = 1;\n  @State() focusedDayElem: HTMLElement;\n\n  private isDayFocus: boolean;\n  private monthChangedFromFocus: boolean;\n  private readonly DAYS_IN_WEEK = 7;\n  private calendar: CalendarWeek[];\n\n  @OnListener<DatePicker>('keydown')\n  handleKeyUp(event: KeyboardEvent) {\n    if (!this.isDayFocus) {\n      return;\n    }\n\n    let _focusedDay = this.focusedDay;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        _focusedDay--;\n        break;\n      case 'ArrowRight':\n        _focusedDay++;\n        break;\n      case 'ArrowUp':\n        _focusedDay = _focusedDay - 7;\n        break;\n      case 'ArrowDown':\n        _focusedDay = _focusedDay + 7;\n        break;\n      default:\n        return;\n    }\n\n    if (_focusedDay > this.getDaysInCurrentMonth()) {\n      _focusedDay = _focusedDay - this.getDaysInCurrentMonth();\n      this.changeToAdjacentMonth(1);\n      this.monthChangedFromFocus = true;\n    } else if (_focusedDay < 1) {\n      this.changeToAdjacentMonth(-1);\n      _focusedDay = _focusedDay + this.getDaysInCurrentMonth();\n      this.monthChangedFromFocus = true;\n    }\n\n    this.focusedDay = _focusedDay;\n  }\n\n  private getDaysInCurrentMonth(): number {\n    return DateTime.utc(this.selectedYear, this.selectedMonth + 1).daysInMonth;\n  }\n\n  private getDateTimeNow() {\n    return DateTime.fromISO(this.today);\n  }\n\n  onDayBlur() {\n    this.isDayFocus = false;\n  }\n\n  onDayFocus() {\n    this.isDayFocus = true;\n  }\n\n  componentWillLoad() {\n    this.setTranslations();\n\n    this.currFromDate = this.from\n      ? DateTime.fromFormat(this.from, this.format)\n      : undefined;\n    this.currToDate = this.to\n      ? DateTime.fromFormat(this.to, this.format)\n      : undefined;\n\n    const year = this.currFromDate?.year ?? this.getDateTimeNow().year;\n    this.startYear = year - 5;\n    this.endYear = year + 5;\n\n    this.selectedMonth =\n      (this.currFromDate?.month ?? this.getDateTimeNow().month) - 1;\n    this.selectedYear = year;\n    this.tempMonth = this.selectedMonth;\n    this.tempYear = this.selectedYear;\n  }\n\n  componentWillRender() {\n    this.calculateCalendar();\n  }\n\n  componentDidRender() {\n    if (!this.monthChangedFromFocus && !this.isDayFocus) {\n      return;\n    }\n\n    const dayElem = this.hostElement.shadowRoot.querySelector(\n      `[id=day-cell-${this.focusedDay}]`\n    ) as HTMLElement;\n    dayElem.focus();\n  }\n\n  private setTranslations() {\n    this.dayNames = this.rotateWeekDayNames(\n      Info.weekdays('long', {\n        locale: this.locale,\n      }),\n      this.weekStartIndex\n    );\n\n    this.monthNames = Info.months('long', {\n      locale: this.locale,\n    });\n  }\n\n  /**\n   * Rotate the WeekdayNames array.\n   * Based on the position that should be the new 0-index.\n   */\n  private rotateWeekDayNames(weekdays: string[], index: number): string[] {\n    const clone = [...weekdays];\n\n    if (index === 0) {\n      return clone;\n    }\n\n    index = -index;\n    const len = weekdays.length;\n\n    clone.push(...clone.splice(0, ((-index % len) + len) % len));\n    return clone;\n  }\n\n  private async onDone() {\n    const date = await this.getCurrentDate();\n    this.dateSelect.emit(date);\n  }\n\n  private calculateCalendar() {\n    const calendar: CalendarWeek[] = [];\n    const month = DateTime.utc(this.selectedYear, this.selectedMonth + 1);\n    const monthStart = month.startOf('month');\n    const monthEnd = month.endOf('month');\n    let startWeek = monthStart.weekNumber;\n    let endWeek = monthEnd.weekNumber;\n    let monthStartWeekDayIndex = monthStart.weekday - 1;\n    let monthEndWeekDayIndex = monthEnd.weekday - 1;\n\n    if (this.weekStartIndex !== 0) {\n      // Find the positions where to start/stop counting the day-numbers based on which day the week starts\n      const weekdays = Info.weekdays();\n      const monthStartWeekDayName = weekdays[monthStart.weekday];\n\n      monthStartWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthStartWeekDayName\n      );\n      const monthEndWeekDayName = weekdays[monthEnd.weekday];\n      monthEndWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthEndWeekDayName\n      );\n    }\n\n    let correctLastWeek = false;\n    if (endWeek === 1) {\n      endWeek = monthEnd.weeksInWeekYear + 1;\n      correctLastWeek = true;\n    }\n\n    let correctFirstWeek = false;\n    if (startWeek === monthStart.weeksInWeekYear) {\n      startWeek = 1;\n      endWeek++;\n\n      correctFirstWeek = true;\n    }\n\n    let currDayNumber = 1;\n    for (\n      let weekIndex = startWeek;\n      weekIndex <= endWeek && currDayNumber <= 31;\n      weekIndex++\n    ) {\n      const daysArr: number[] = [];\n\n      for (let j = 0; j < this.DAYS_IN_WEEK && currDayNumber <= 31; j++) {\n        // Display empty cells until the calender starts/has ended\n        if (\n          (weekIndex === startWeek && j < monthStartWeekDayIndex) ||\n          (weekIndex === endWeek && j > monthEndWeekDayIndex)\n        ) {\n          daysArr.push(undefined);\n        } else {\n          daysArr.push(currDayNumber++);\n        }\n      }\n\n      if (correctFirstWeek || correctLastWeek) {\n        if (weekIndex === 1) {\n          calendar.push({\n            weekNumber: monthStart.weeksInWeekYear,\n            dayNumbers: daysArr,\n          });\n        } else if (weekIndex === monthEnd.weekNumber) {\n          calendar.push({\n            weekNumber: 1,\n            dayNumbers: daysArr,\n          });\n        } else {\n          calendar.push({\n            weekNumber: weekIndex - 1,\n            dayNumbers: daysArr,\n          });\n        }\n        continue;\n      }\n\n      calendar.push({\n        weekNumber: weekIndex,\n        dayNumbers: daysArr,\n      });\n    }\n\n    this.calendar = calendar;\n  }\n\n  private selectTempYear(event: MouseEvent, year: number) {\n    event?.stopPropagation();\n    this.tempYear = year;\n  }\n\n  private focusMonth() {\n    this.firstMonthRef.focus();\n  }\n\n  private infiniteScrollYears() {\n    const scroll = this.yearContainerRef.scrollTop;\n    const maxScroll = this.yearContainerRef.scrollHeight;\n    const atTop = scroll === 0;\n    const atBottom =\n      Math.round(scroll + this.yearContainerRef.offsetHeight) >= maxScroll;\n    const limit = 200;\n\n    if (this.endYear - this.startYear > limit) return;\n\n    if (atTop) {\n      const first = this.yearContainerRef.firstElementChild as HTMLElement;\n      this.startYear -= 5;\n      this.yearContainerRef.scrollTo(0, first.offsetTop);\n\n      return;\n    }\n\n    if (atBottom) {\n      const last = this.yearContainerRef.lastElementChild as HTMLElement;\n      this.endYear += 5;\n      this.yearContainerRef.scrollTo(0, last.offsetTop);\n    }\n  }\n\n  private selectMonth(month: number) {\n    this.selectedMonth = month;\n    this.selectedYear = this.tempYear;\n    this.tempMonth = month;\n\n    this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;\n  }\n\n  private changeToAdjacentMonth(number: -1 | 1) {\n    if (this.selectedMonth + number < 0) {\n      this.selectedYear--;\n      this.selectedMonth = 11;\n    } else if (this.selectedMonth + number > 11) {\n      this.selectedYear++;\n      this.selectedMonth = 0;\n    } else {\n      this.selectedMonth += number;\n    }\n  }\n\n  private selectDay(selectedDay: number) {\n    const date = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, selectedDay)\n    );\n\n    if (!this.range || this.currFromDate === undefined) {\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Reset the range selection\n    if (this.currToDate !== undefined) {\n      this.currFromDate = date;\n      this.currToDate = undefined;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Swap from/to if the second date is before the current date\n    if (date < this.currFromDate) {\n      this.currToDate = this.currFromDate;\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Set the range normally\n    this.currToDate = date;\n    this.onDateChange();\n  }\n\n  private onDateChange() {\n    this.getCurrentDate().then((date) => {\n      this.dateChange.emit(date);\n      if (this.range) {\n        this.dateRangeChange.emit(date);\n      }\n    });\n  }\n\n  private getDayClasses(day: number): any {\n    if (!day) {\n      return;\n    }\n\n    const todayObj = this.getDateTimeNow();\n    const selectedDayObj = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, day)\n    );\n\n    return {\n      'calendar-item': true,\n      'empty-day': day === undefined,\n      today: todayObj.hasSame(selectedDayObj, 'day'),\n      selected:\n        this.currFromDate?.hasSame(selectedDayObj, 'day') ||\n        this.currToDate?.hasSame(selectedDayObj, 'day'),\n      range:\n        selectedDayObj.startOf('day') > this.currFromDate?.startOf('day') &&\n        this.currToDate !== undefined &&\n        selectedDayObj.startOf('day') < this.currToDate?.startOf('day'),\n      disabled: !this.isWithinMinMaxDate(selectedDayObj),\n    };\n  }\n\n  private isWithinMinMaxYear(year: number): boolean {\n    const minDateYear = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format).year\n      : undefined;\n    const maxDateYear = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format).year\n      : undefined;\n    const isBefore = minDateYear ? year < minDateYear : false;\n    const isAfter = maxDateYear ? year > maxDateYear : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxMonth(month: number): boolean {\n    const minDateObj = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const maxDateObj = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const minDateMonth = minDateObj?.month;\n    const maxDateMonth = maxDateObj?.month;\n    const isBefore = minDateMonth\n      ? this.tempYear === minDateObj.year && month < minDateMonth\n      : false;\n    const isAfter = maxDateMonth\n      ? this.tempYear === maxDateObj.year && month > maxDateMonth\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxDate(date: DateTime): boolean {\n    const _minDate = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const _maxDate = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const isBefore = _minDate\n      ? date.startOf('day') < _minDate.startOf('day')\n      : false;\n    const isAfter = _maxDate\n      ? date.startOf('day') > _maxDate.startOf('day')\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private renderYears(): any[] {\n    const rows = [];\n\n    for (let year = this.startYear; year <= this.endYear; year++) {\n      rows.push(\n        <div\n          key={year}\n          class={{\n            arrowYear: true,\n            'month-dropdown-item': true,\n            'disabled-item': !this.isWithinMinMaxYear(year),\n          }}\n          onClick={(event) => this.selectTempYear(event, year)}\n          onKeyUp={(event) => {\n            if (event.key === 'Enter') {\n              this.selectTempYear(null, year);\n              this.focusMonth();\n            }\n          }}\n          tabIndex={0}\n        >\n          <ix-icon\n            class={{\n              hidden: this.tempYear !== year,\n              arrowPosition: true,\n            }}\n            name=\"chevron-right\"\n            size=\"12\"\n          ></ix-icon>\n          <div style={{ 'min-width': 'max-content' }}>{`${year}`}</div>\n        </div>\n      );\n    }\n\n    return rows;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-date-time-card\n          corners={this.corners}\n          standaloneAppearance={this.standaloneAppearance}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(-1)}\n              ghost\n              icon=\"chevron-left\"\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n            <div class=\"selector\">\n              <ix-button\n                ghost\n                ref={(ref) => (this.dropdownButtonRef = ref)}\n                data-testid=\"year-month-button\"\n              >\n                <span class=\"fontSize capitalize\">\n                  {this.monthNames[this.selectedMonth]} {this.selectedYear}\n                </span>\n              </ix-button>\n              <ix-dropdown\n                data-testid=\"year-month-dropdown\"\n                class=\"dropdown\"\n                trigger={this.dropdownButtonRef}\n                ignoreRelatedSubmenu\n                placement=\"bottom-start\"\n              >\n                <div class=\"wrapper\">\n                  <div\n                    data-testid=\"year-container\"\n                    class=\"overflow\"\n                    onScroll={() => this.infiniteScrollYears()}\n                    ref={(ref) => (this.yearContainerRef = ref)}\n                  >\n                    {this.renderYears()}\n                  </div>\n                  <div class=\"overflow\" data-testid=\"month-container\">\n                    {this.monthNames.map((month, index) => (\n                      <div\n                        key={month}\n                        ref={(ref) => {\n                          if (month === this.monthNames[0]) {\n                            this.firstMonthRef = ref as HTMLElement;\n                          }\n                        }}\n                        class={{\n                          arrowYear: true,\n                          'month-dropdown-item': true,\n                          selected:\n                            this.tempYear === this.selectedYear &&\n                            this.tempMonth === index,\n                          'disabled-item': !this.isWithinMinMaxMonth(index),\n                        }}\n                        onClick={() => this.selectMonth(index)}\n                        onKeyUp={(event) =>\n                          event.key === 'Enter' && this.selectMonth(index)\n                        }\n                        tabIndex={0}\n                      >\n                        <ix-icon\n                          class={{\n                            hidden:\n                              this.tempYear !== this.selectedYear ||\n                              this.tempMonth !== index,\n                            checkPosition: true,\n                          }}\n                          name=\"single-check\"\n                          size=\"16\"\n                        ></ix-icon>\n                        <div>\n                          <span class=\"capitalize monthMargin\">{`${month} ${this.tempYear}`}</span>\n                        </div>\n                      </div>\n                    ))}\n                  </div>\n                </div>\n              </ix-dropdown>\n            </div>\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(1)}\n              ghost\n              icon=\"chevron-right\"\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n          </div>\n          <div class=\"grid\">\n            <div class=\"calendar-item week-day\"></div>\n            {this.dayNames.map((name) => (\n              <div key={name} class=\"calendar-item week-day\">\n                {name.slice(0, 3)}\n              </div>\n            ))}\n            {this.calendar.map((week) => {\n              return (\n                <Fragment>\n                  <div class=\"calendar-item week-number\">{week.weekNumber}</div>\n                  {week.dayNumbers.map((day) => (\n                    <div\n                      key={day}\n                      id={`day-cell-${day}`}\n                      date-calender-day\n                      class={this.getDayClasses(day)}\n                      onClick={() => this.selectDay(day)}\n                      onKeyUp={(e) => e.key === 'Enter' && this.selectDay(day)}\n                      tabIndex={day === this.focusedDay ? 0 : -1}\n                      onFocus={() => this.onDayFocus()}\n                      onBlur={() => this.onDayBlur()}\n                    >\n                      {day}\n                    </div>\n                  ))}\n                </Fragment>\n              );\n            })}\n          </div>\n          <div\n            class={{\n              button: true,\n              hidden: !this.range || !this.standaloneAppearance,\n            }}\n          >\n            <ix-button onClick={() => this.onDone()}>\n              {this.textSelectDate || this.i18nDone}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\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:host {\n  --ix-layout-grid-gutter: 24px;\n\n  display: block;\n  flex: 1 1 0%;\n  width: 100%;\n\n  padding-left: calc(var(--ix-layout-grid-gutter) * 0.5);\n  padding-right: calc(var(--ix-layout-grid-gutter) * 0.5);\n}\n\n:host(.no-margin) {\n  padding-left: 0;\n  padding-right: 0;\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, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-layout-grid',\n  styleUrl: 'layout-grid.scss',\n  shadow: true,\n})\nexport class LayoutGrid {\n  /**\n   * The grid will not have any horizontal padding\n   */\n  @Prop() noMargin = false;\n\n  /**\n   * Grid gap\n   */\n  @Prop() gap: '8' | '12' | '16' | '24' = '24';\n\n  /**\n   * Overwrite the default number of columns. Choose between 2 and 12 columns.\n   */\n  @Prop() columns = 12;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'no-margin': this.noMargin,\n        }}\n        style={{\n          '--ix-layout-grid-columns': `${this.columns}`,\n          '--ix-layout-grid-gutter': `${this.gap}px`,\n        }}\n      >\n        <slot></slot>\n      </Host>\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:host {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n:host(:not(:first-of-type)) {\n  margin-block-start: var(--ix-layout-grid-row-margin, 0);\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, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-row',\n  styleUrl: 'row.scss',\n  shadow: true,\n})\nexport class Row {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["colCss","IxColStyle0","Col","onResize","forceUpdate","this","getSize","breakpoint","size","sizeSm","sizeMd","sizeLg","getColumnSize","Breakpoints","forEach","isMediaQueryActive","matchBreakpoint","currentSize","getColumnSizeStyling","flex","width","colSize","render","h","Host","key","style","Object","assign","datePickerCss","IxDatePickerStyle0","DatePicker","DAYS_IN_WEEK","undefined","DateTime","now","toISO","watchFromPropHandler","newValue","currFromDate","fromFormat","format","_a","isValid","selectedYear","year","selectedMonth","month","watchToPropHandler","currToDate","onLocaleChange","setTranslations","getCurrentDate","_from","_b","toFormat","_to","_c","_d","range","from","to","handleKeyUp","event","isDayFocus","_focusedDay","focusedDay","getDaysInCurrentMonth","changeToAdjacentMonth","monthChangedFromFocus","utc","daysInMonth","getDateTimeNow","fromISO","today","onDayBlur","onDayFocus","componentWillLoad","startYear","endYear","tempMonth","tempYear","componentWillRender","calculateCalendar","componentDidRender","dayElem","hostElement","shadowRoot","querySelector","focus","dayNames","rotateWeekDayNames","Info","weekdays","locale","weekStartIndex","monthNames","months","index","clone","len","length","push","splice","onDone","date","dateSelect","emit","calendar","monthStart","startOf","monthEnd","endOf","startWeek","weekNumber","endWeek","monthStartWeekDayIndex","weekday","monthEndWeekDayIndex","monthStartWeekDayName","findIndex","d","monthEndWeekDayName","correctLastWeek","weeksInWeekYear","correctFirstWeek","currDayNumber","weekIndex","daysArr","j","dayNumbers","selectTempYear","stopPropagation","focusMonth","firstMonthRef","infiniteScrollYears","scroll","yearContainerRef","scrollTop","maxScroll","scrollHeight","atTop","atBottom","Math","round","offsetHeight","limit","first","firstElementChild","scrollTo","offsetTop","last","lastElementChild","selectMonth","show","number","selectDay","selectedDay","fromJSDate","Date","onDateChange","then","dateChange","dateRangeChange","getDayClasses","day","todayObj","selectedDayObj","hasSame","selected","disabled","isWithinMinMaxDate","isWithinMinMaxYear","minDateYear","minDate","maxDateYear","maxDate","isBefore","isAfter","isWithinMinMaxMonth","minDateObj","maxDateObj","minDateMonth","maxDateMonth","_minDate","_maxDate","renderYears","rows","class","arrowYear","onClick","onKeyUp","tabIndex","hidden","arrowPosition","name","corners","standaloneAppearance","slot","ghost","icon","variant","ref","dropdownButtonRef","trigger","ignoreRelatedSubmenu","placement","onScroll","map","checkPosition","slice","week","Fragment","id","e","onFocus","onBlur","button","textSelectDate","i18nDone","__decorate","OnListener","layoutGridCss","IxLayoutGridStyle0","LayoutGrid","noMargin","columns","gap","rowCss","IxRowStyle0","Row"],"sources":["src/components/col/col.scss?tag=ix-col&encapsulation=shadow","src/components/col/col.tsx","src/components/date-picker/date-picker.scss?tag=ix-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx","src/components/grid/layout-grid.scss?tag=ix-layout-grid&encapsulation=shadow","src/components/grid/layout-grid.tsx","src/components/row/row.scss?tag=ix-row&encapsulation=shadow","src/components/row/row.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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  position: relative;\n  flex-basis: 0;\n  flex-grow: 1;\n  width: 100%;\n  max-width: 100%;\n  min-height: 1px;\n\n  padding: calc(var(--ix-layout-grid-gutter) * 0.5);\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 { Component, forceUpdate, h, Host, Listen, Prop } from '@stencil/core';\nimport { Breakpoint, matchBreakpoint } from '../utils/breakpoints';\n\ntype GridBreakpoint = Breakpoint | '';\n\nexport type ColumnSize =\n  | '1'\n  | '2'\n  | '3'\n  | '4'\n  | '5'\n  | '6'\n  | '7'\n  | '8'\n  | '9'\n  | '10'\n  | '11'\n  | '12'\n  | 'auto';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-col',\n  styleUrl: 'col.scss',\n  shadow: true,\n})\nexport class Col {\n  static Breakpoints: GridBreakpoint[] = ['', 'sm', 'md', 'lg'];\n\n  /**\n   * Size of the column\n   */\n  @Prop() size?: ColumnSize;\n\n  /**\n   * Size of the column for sm screens\n   */\n  @Prop() sizeSm?: ColumnSize;\n\n  /**\n   * Size of the column for md screens\n   */\n  @Prop() sizeMd?: ColumnSize;\n\n  /**\n   * Size of the column for lg screens\n   */\n  @Prop() sizeLg?: ColumnSize;\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    forceUpdate(this);\n  }\n\n  private getSize(breakpoint: GridBreakpoint) {\n    if (breakpoint === '') {\n      return this.size;\n    }\n\n    if (breakpoint === 'sm') {\n      return this.sizeSm;\n    }\n\n    if (breakpoint === 'md') {\n      return this.sizeMd;\n    }\n\n    if (breakpoint === 'lg') {\n      return this.sizeLg;\n    }\n  }\n\n  private getColumnSize() {\n    let size: ColumnSize;\n    Col.Breakpoints.forEach((breakpoint) => {\n      const isMediaQueryActive =\n        breakpoint !== '' ? matchBreakpoint(breakpoint) : true;\n\n      if (!isMediaQueryActive) {\n        return;\n      }\n\n      const currentSize = this.getSize(breakpoint);\n\n      if (currentSize) {\n        size = currentSize;\n      }\n    });\n\n    return size;\n  }\n\n  private getColumnSizeStyling() {\n    const size = this.getColumnSize();\n\n    if (!size) {\n      return;\n    }\n\n    if (size === 'auto') {\n      return {\n        flex: '0 0 auto',\n        width: 'auto',\n        'max-width': 'auto',\n      };\n    }\n\n    const colSize = `calc(calc(${size} / var(--ix-layout-grid-columns)) * 100%)`;\n\n    return {\n      flex: `0 0 ${colSize}`,\n      width: `${colSize}`,\n      'max-width': `${colSize}`,\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        style={{\n          ...this.getColumnSizeStyling(),\n        }}\n      >\n        <slot></slot>\n      </Host>\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 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  width: 22rem;\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n\n  .disabled-item {\n    pointer-events: none;\n    background-color: var(--theme-datepicker-day--background--disabled);\n    color: var(--theme-datepicker-day--color--disabled);\n    cursor: default;\n  }\n\n  .selector {\n    flex-basis: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: $tiny-space $default-space;\n\n    .dropdown {\n      color: var(--theme-menu-item--color);\n      font-size: 14px;\n      line-height: 20px;\n    }\n\n    .fontSize {\n      font-size: 16px;\n    }\n\n    .capitalize {\n      text-transform: capitalize;\n    }\n\n    .month-dropdown-item {\n      margin-left: 4px;\n      margin-right: 4px;\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n      }\n    }\n\n    .arrowYear {\n      display: flex;\n      position: relative;\n      padding: $medium-space $x-large-space;\n      align-items: center;\n      cursor: pointer;\n\n      &:hover {\n        background-color: var(--theme-select-list-item--background--hover);\n      }\n\n      &.selected {\n        background-color: var(--theme-select-list-item--background--selected);\n      }\n\n      .arrowPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 6px);\n      }\n\n      .checkPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 8px);\n      }\n\n      .monthMargin {\n        margin-left: 10px;\n      }\n    }\n  }\n\n  .wrapper {\n    display: flex;\n\n    .overflow {\n      overflow-y: scroll;\n      max-height: 250px;\n    }\n  }\n\n  .grid {\n    display: grid;\n    grid-template-columns: repeat(8, 40px);\n    grid-template-rows: repeat(7, 40px);\n    align-items: center;\n    justify-items: center;\n    justify-content: center;\n    color: var(--theme-datepicker-today--color);\n\n    .calendar-item {\n      position: relative;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      background-color: var(--theme-datepicker-day--background);\n      border: 1px solid var(--theme-datepicker-day--background);\n      width: 40px;\n      height: 40px;\n      cursor: pointer;\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n      }\n\n      &.today {\n        border: 1px solid var(--theme-datepicker-today--border-color);\n\n        &:hover {\n          background-color: var(--theme-datepicker-day--background--hover);\n        }\n\n        &:active {\n          background-color: var(--theme-datepicker-day--background--active);\n        }\n\n        &.selected {\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                            --theme-datepicker-day--background--selected-hover\n            );\n          }\n\n          &:active {\n            background-color: var(\n                            --theme-datepicker-day--background--selected-active\n            );\n          }\n\n          &.disabled {\n            pointer-events: none;\n            background-color: var(\n                            --theme-datepicker-day--background--selected-disabled\n            );\n            border: 1px solid\n            var(--theme-datepicker-day--background--selected-disabled);\n            color: var(--theme-datepicker-day--color--selected-disabled);\n          }\n        }\n\n        &.range {\n          background-color: var(--theme-datepicker-day--background--range);\n          color: var(--theme-datepicker-day--color--range);\n          border: 1px solid var(--theme-datepicker-today--border-color--range);\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                            --theme-datepicker-day--background--range-hover\n            );\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-hover);\n          }\n\n          &:active {\n            background-color: var(\n                            --theme-datepicker-day--background--range-active\n            );\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-active);\n          }\n\n          &.disabled {\n            background-color: var(\n                            --theme-datepicker-day--background--range-disabled\n            );\n            color: var(--theme-datepicker-day--color--range-disabled);\n            border: 1px solid\n            var(--theme-datepicker-today--border-color--range-disabled);\n          }\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(--theme-datepicker-day--background--disabled);\n          color: var(--theme-datepicker-day--color--disabled);\n          cursor: default;\n        }\n      }\n\n      &:hover {\n        background-color: var(--theme-datepicker-day--background--hover);\n      }\n\n      &:active {\n        background-color: var(--theme-datepicker-day--background--active);\n      }\n\n      &.selected {\n        background-color: var(--theme-datepicker-day--background--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        border: 1px solid var(--theme-datepicker-day--background--selected);\n\n        &:hover {\n          background-color: var(\n                          --theme-datepicker-day--background--selected-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n                          --theme-datepicker-day--background--selected-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n                          --theme-datepicker-day--background--selected-disabled\n          );\n          color: var(--theme-datepicker-day--color--selected-disabled);\n        }\n      }\n\n      &.range {\n        background-color: var(--theme-datepicker-day--background--range);\n        color: var(--theme-datepicker-day--color--range);\n\n        &:hover {\n          background-color: var(\n                          --theme-datepicker-day--background--range-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n                          --theme-datepicker-day--background--range-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n                          --theme-datepicker-day--background--range-disabled\n          );\n          color: var(--theme-datepicker-day--color--range-disabled);\n        }\n      }\n\n      &.disabled {\n        pointer-events: none;\n        background-color: var(--theme-datepicker-day--background--disabled);\n        color: var(--theme-datepicker-day--color--disabled);\n      }\n\n      &.week-day {\n        color: var(--theme-datepicker-weekday--color);\n        font-size: 12px;\n        line-height: 20px;\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &.empty-day {\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &.week-number {\n        font-size: 10px;\n        line-height: 14px;\n        color: var(--theme-datepicker-weekday--color);\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &:focus-visible {\n        background-color: var(--theme-datepicker-day--background--selected);\n        border: inset 1px solid\n        var(--theme-datepicker-day--border-color--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        font-size: 14px;\n        line-height: 20px;\n        letter-spacing: 0;\n      }\n    }\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .hidden {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nimport { DateTime, Info } from 'luxon';\nimport { OnListener } from '../utils/listener';\n\nexport type DateChangeEvent = {\n  from: string;\n  to: string;\n};\n\nexport type DateTimeCorners = DateTimeCardCorners;\n\ninterface CalendarWeek {\n  weekNumber: number;\n  dayNumbers: number[];\n}\n\n@Component({\n  tag: 'ix-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n})\nexport class DatePicker {\n  @Element() hostElement: HTMLIxDatePickerElement;\n\n  /**\n   * Date format string.\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * If true a date-range can be selected (from/to).\n   */\n  @Prop() range: boolean = true;\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: DateTimeCardCorners = 'rounded';\n\n  /**\n   * The selected starting date. If the date-picker-rework is not in range mode this is the selected date.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() from: string | undefined;\n\n  @Watch('from')\n  watchFromPropHandler(newValue: string) {\n    this.currFromDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currFromDate?.isValid) {\n      this.selectedYear = this.currFromDate.year;\n      this.selectedMonth = this.currFromDate.month - 1;\n    }\n  }\n\n  /**\n   * The selected end date. If the the date-picker-rework is not in range mode this property has no impact.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() to: string | undefined;\n\n  @Watch('to')\n  watchToPropHandler(newValue: string) {\n    this.currToDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currToDate?.isValid) {\n      this.selectedYear = this.currToDate.year;\n      this.selectedMonth = this.currToDate.month - 1;\n    }\n  }\n\n  /**\n   * The earliest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() minDate: string;\n\n  /**\n   * The latest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() maxDate: string;\n\n  /**\n   * Text of the button that confirms date selection.\n   *\n   * @since 1.1.0\n   * @deprecated since 2.1.0. Use `i18nDone`\n   */\n  @Prop() textSelectDate: string;\n\n  /**\n   * Text of date select button\n   *\n   * @since 2.1.0\n   */\n  @Prop({ attribute: 'i18n-done' }) i18nDone = 'Done';\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   *\n   * @since 2.1.0\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * Format of time string\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   *\n   * @since 2.1.0\n   */\n  @Prop() locale: string = undefined;\n  @Watch('locale')\n  onLocaleChange() {\n    this.setTranslations();\n  }\n\n  /**\n   * @deprecated Not supported since 2.0.0.\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n   * This combination can be configured over the delimiter\n   *\n   * @since 1.1.0\n   * @deprecated Not used anymore see `this.dateChange`\n   */\n  @Prop() eventDelimiter = ' - ';\n\n  /** @internal */\n  @Prop() standaloneAppearance = true;\n\n  /** @internal */\n  @Prop() today = DateTime.now().toISO();\n\n  /**\n   * Triggers if the date selection changes.\n   * Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string`\n   *\n   * @since 2.1.0\n   */\n  @Event() dateChange: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Triggers if the date selection changes.\n   * Only triggered if date-picker-rework is in range mode.\n   *\n   * @since 2.1.0\n   */\n  @Event() dateRangeChange: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @since 1.1.0\n   */\n  @Event() dateSelect: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @deprecated NOT getting dispatched after 2.0.0. Use `dateSelect`.\n   */\n  @Event() done: EventEmitter<string>;\n\n  /**\n   * Get the currently selected date-range.\n   */\n  @Method()\n  async getCurrentDate() {\n    const _from = this.currFromDate?.isValid\n      ? this.currFromDate?.toFormat(this.format)\n      : undefined;\n    const _to = this.currToDate?.isValid\n      ? this.currToDate?.toFormat(this.format)\n      : undefined;\n\n    if (this.range) {\n      return {\n        from: _from,\n        to: _to,\n      };\n    }\n\n    return {\n      from: _from,\n      to: undefined,\n    };\n  }\n\n  @State() currFromDate: DateTime;\n  @State() currToDate: DateTime;\n\n  @State() selectedYear: number;\n  @State() tempYear: number;\n  @State() startYear: number;\n  @State() endYear: number;\n  @State() selectedMonth: number;\n  @State() tempMonth: number;\n\n  @State() dropdownButtonRef: HTMLElement;\n  @State() yearContainerRef: HTMLElement;\n\n  @State() dayNames: string[];\n  @State() monthNames: string[];\n  @State() firstMonthRef: HTMLElement;\n  @State() focusedDay: number = 1;\n  @State() focusedDayElem: HTMLElement;\n\n  private isDayFocus: boolean;\n  private monthChangedFromFocus: boolean;\n  private readonly DAYS_IN_WEEK = 7;\n  private calendar: CalendarWeek[];\n\n  @OnListener<DatePicker>('keydown')\n  handleKeyUp(event: KeyboardEvent) {\n    if (!this.isDayFocus) {\n      return;\n    }\n\n    let _focusedDay = this.focusedDay;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        _focusedDay--;\n        break;\n      case 'ArrowRight':\n        _focusedDay++;\n        break;\n      case 'ArrowUp':\n        _focusedDay = _focusedDay - 7;\n        break;\n      case 'ArrowDown':\n        _focusedDay = _focusedDay + 7;\n        break;\n      default:\n        return;\n    }\n\n    if (_focusedDay > this.getDaysInCurrentMonth()) {\n      _focusedDay = _focusedDay - this.getDaysInCurrentMonth();\n      this.changeToAdjacentMonth(1);\n      this.monthChangedFromFocus = true;\n    } else if (_focusedDay < 1) {\n      this.changeToAdjacentMonth(-1);\n      _focusedDay = _focusedDay + this.getDaysInCurrentMonth();\n      this.monthChangedFromFocus = true;\n    }\n\n    this.focusedDay = _focusedDay;\n  }\n\n  private getDaysInCurrentMonth(): number {\n    return DateTime.utc(this.selectedYear, this.selectedMonth + 1).daysInMonth;\n  }\n\n  private getDateTimeNow() {\n    return DateTime.fromISO(this.today);\n  }\n\n  onDayBlur() {\n    this.isDayFocus = false;\n  }\n\n  onDayFocus() {\n    this.isDayFocus = true;\n  }\n\n  componentWillLoad() {\n    this.setTranslations();\n\n    this.currFromDate = this.from\n      ? DateTime.fromFormat(this.from, this.format)\n      : undefined;\n    this.currToDate = this.to\n      ? DateTime.fromFormat(this.to, this.format)\n      : undefined;\n\n    const year = this.currFromDate?.year ?? this.getDateTimeNow().year;\n    this.startYear = year - 5;\n    this.endYear = year + 5;\n\n    this.selectedMonth =\n      (this.currFromDate?.month ?? this.getDateTimeNow().month) - 1;\n    this.selectedYear = year;\n    this.tempMonth = this.selectedMonth;\n    this.tempYear = this.selectedYear;\n  }\n\n  componentWillRender() {\n    this.calculateCalendar();\n  }\n\n  componentDidRender() {\n    if (!this.monthChangedFromFocus && !this.isDayFocus) {\n      return;\n    }\n\n    const dayElem = this.hostElement.shadowRoot.querySelector(\n      `[id=day-cell-${this.focusedDay}]`\n    ) as HTMLElement;\n    dayElem.focus();\n  }\n\n  private setTranslations() {\n    this.dayNames = this.rotateWeekDayNames(\n      Info.weekdays('long', {\n        locale: this.locale,\n      }),\n      this.weekStartIndex\n    );\n\n    this.monthNames = Info.months('long', {\n      locale: this.locale,\n    });\n  }\n\n  /**\n   * Rotate the WeekdayNames array.\n   * Based on the position that should be the new 0-index.\n   */\n  private rotateWeekDayNames(weekdays: string[], index: number): string[] {\n    const clone = [...weekdays];\n\n    if (index === 0) {\n      return clone;\n    }\n\n    index = -index;\n    const len = weekdays.length;\n\n    clone.push(...clone.splice(0, ((-index % len) + len) % len));\n    return clone;\n  }\n\n  private async onDone() {\n    const date = await this.getCurrentDate();\n    this.dateSelect.emit(date);\n  }\n\n  private calculateCalendar() {\n    const calendar: CalendarWeek[] = [];\n    const month = DateTime.utc(this.selectedYear, this.selectedMonth + 1);\n    const monthStart = month.startOf('month');\n    const monthEnd = month.endOf('month');\n    let startWeek = monthStart.weekNumber;\n    let endWeek = monthEnd.weekNumber;\n    let monthStartWeekDayIndex = monthStart.weekday - 1;\n    let monthEndWeekDayIndex = monthEnd.weekday - 1;\n\n    if (this.weekStartIndex !== 0) {\n      // Find the positions where to start/stop counting the day-numbers based on which day the week starts\n      const weekdays = Info.weekdays();\n      const monthStartWeekDayName = weekdays[monthStart.weekday];\n\n      monthStartWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthStartWeekDayName\n      );\n      const monthEndWeekDayName = weekdays[monthEnd.weekday];\n      monthEndWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthEndWeekDayName\n      );\n    }\n\n    let correctLastWeek = false;\n    if (endWeek === 1) {\n      endWeek = monthEnd.weeksInWeekYear + 1;\n      correctLastWeek = true;\n    }\n\n    let correctFirstWeek = false;\n    if (startWeek === monthStart.weeksInWeekYear) {\n      startWeek = 1;\n      endWeek++;\n\n      correctFirstWeek = true;\n    }\n\n    let currDayNumber = 1;\n    for (\n      let weekIndex = startWeek;\n      weekIndex <= endWeek && currDayNumber <= 31;\n      weekIndex++\n    ) {\n      const daysArr: number[] = [];\n\n      for (let j = 0; j < this.DAYS_IN_WEEK && currDayNumber <= 31; j++) {\n        // Display empty cells until the calender starts/has ended\n        if (\n          (weekIndex === startWeek && j < monthStartWeekDayIndex) ||\n          (weekIndex === endWeek && j > monthEndWeekDayIndex)\n        ) {\n          daysArr.push(undefined);\n        } else {\n          daysArr.push(currDayNumber++);\n        }\n      }\n\n      if (correctFirstWeek || correctLastWeek) {\n        if (weekIndex === 1) {\n          calendar.push({\n            weekNumber: monthStart.weeksInWeekYear,\n            dayNumbers: daysArr,\n          });\n        } else if (weekIndex === monthEnd.weekNumber) {\n          calendar.push({\n            weekNumber: 1,\n            dayNumbers: daysArr,\n          });\n        } else {\n          calendar.push({\n            weekNumber: weekIndex - 1,\n            dayNumbers: daysArr,\n          });\n        }\n        continue;\n      }\n\n      calendar.push({\n        weekNumber: weekIndex,\n        dayNumbers: daysArr,\n      });\n    }\n\n    this.calendar = calendar;\n  }\n\n  private selectTempYear(event: MouseEvent, year: number) {\n    event?.stopPropagation();\n    this.tempYear = year;\n  }\n\n  private focusMonth() {\n    this.firstMonthRef.focus();\n  }\n\n  private infiniteScrollYears() {\n    const scroll = this.yearContainerRef.scrollTop;\n    const maxScroll = this.yearContainerRef.scrollHeight;\n    const atTop = scroll === 0;\n    const atBottom =\n      Math.round(scroll + this.yearContainerRef.offsetHeight) >= maxScroll;\n    const limit = 200;\n\n    if (this.endYear - this.startYear > limit) return;\n\n    if (atTop) {\n      const first = this.yearContainerRef.firstElementChild as HTMLElement;\n      this.startYear -= 5;\n      this.yearContainerRef.scrollTo(0, first.offsetTop);\n\n      return;\n    }\n\n    if (atBottom) {\n      const last = this.yearContainerRef.lastElementChild as HTMLElement;\n      this.endYear += 5;\n      this.yearContainerRef.scrollTo(0, last.offsetTop);\n    }\n  }\n\n  private selectMonth(month: number) {\n    this.selectedMonth = month;\n    this.selectedYear = this.tempYear;\n    this.tempMonth = month;\n\n    this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;\n  }\n\n  private changeToAdjacentMonth(number: -1 | 1) {\n    if (this.selectedMonth + number < 0) {\n      this.selectedYear--;\n      this.selectedMonth = 11;\n    } else if (this.selectedMonth + number > 11) {\n      this.selectedYear++;\n      this.selectedMonth = 0;\n    } else {\n      this.selectedMonth += number;\n    }\n  }\n\n  private selectDay(selectedDay: number) {\n    const date = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, selectedDay)\n    );\n\n    if (!this.range || this.currFromDate === undefined) {\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Reset the range selection\n    if (this.currToDate !== undefined) {\n      this.currFromDate = date;\n      this.currToDate = undefined;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Swap from/to if the second date is before the current date\n    if (date < this.currFromDate) {\n      this.currToDate = this.currFromDate;\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Set the range normally\n    this.currToDate = date;\n    this.onDateChange();\n  }\n\n  private onDateChange() {\n    this.getCurrentDate().then((date) => {\n      this.dateChange.emit(date);\n      if (this.range) {\n        this.dateRangeChange.emit(date);\n      }\n    });\n  }\n\n  private getDayClasses(day: number): any {\n    if (!day) {\n      return;\n    }\n\n    const todayObj = this.getDateTimeNow();\n    const selectedDayObj = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, day)\n    );\n\n    return {\n      'calendar-item': true,\n      'empty-day': day === undefined,\n      today: todayObj.hasSame(selectedDayObj, 'day'),\n      selected:\n        this.currFromDate?.hasSame(selectedDayObj, 'day') ||\n        this.currToDate?.hasSame(selectedDayObj, 'day'),\n      range:\n        selectedDayObj.startOf('day') > this.currFromDate?.startOf('day') &&\n        this.currToDate !== undefined &&\n        selectedDayObj.startOf('day') < this.currToDate?.startOf('day'),\n      disabled: !this.isWithinMinMaxDate(selectedDayObj),\n    };\n  }\n\n  private isWithinMinMaxYear(year: number): boolean {\n    const minDateYear = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format).year\n      : undefined;\n    const maxDateYear = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format).year\n      : undefined;\n    const isBefore = minDateYear ? year < minDateYear : false;\n    const isAfter = maxDateYear ? year > maxDateYear : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxMonth(month: number): boolean {\n    const minDateObj = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const maxDateObj = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const minDateMonth = minDateObj?.month;\n    const maxDateMonth = maxDateObj?.month;\n    const isBefore = minDateMonth\n      ? this.tempYear === minDateObj.year && month < minDateMonth\n      : false;\n    const isAfter = maxDateMonth\n      ? this.tempYear === maxDateObj.year && month > maxDateMonth\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxDate(date: DateTime): boolean {\n    const _minDate = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const _maxDate = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const isBefore = _minDate\n      ? date.startOf('day') < _minDate.startOf('day')\n      : false;\n    const isAfter = _maxDate\n      ? date.startOf('day') > _maxDate.startOf('day')\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private renderYears(): any[] {\n    const rows = [];\n\n    for (let year = this.startYear; year <= this.endYear; year++) {\n      rows.push(\n        <div\n          key={year}\n          class={{\n            arrowYear: true,\n            'month-dropdown-item': true,\n            'disabled-item': !this.isWithinMinMaxYear(year),\n          }}\n          onClick={(event) => this.selectTempYear(event, year)}\n          onKeyUp={(event) => {\n            if (event.key === 'Enter') {\n              this.selectTempYear(null, year);\n              this.focusMonth();\n            }\n          }}\n          tabIndex={0}\n        >\n          <ix-icon\n            class={{\n              hidden: this.tempYear !== year,\n              arrowPosition: true,\n            }}\n            name=\"chevron-right\"\n            size=\"12\"\n          ></ix-icon>\n          <div style={{ 'min-width': 'max-content' }}>{`${year}`}</div>\n        </div>\n      );\n    }\n\n    return rows;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-date-time-card\n          corners={this.corners}\n          standaloneAppearance={this.standaloneAppearance}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(-1)}\n              ghost\n              icon=\"chevron-left\"\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n            <div class=\"selector\">\n              <ix-button\n                ghost\n                ref={(ref) => (this.dropdownButtonRef = ref)}\n                data-testid=\"year-month-button\"\n              >\n                <span class=\"fontSize capitalize\">\n                  {this.monthNames[this.selectedMonth]} {this.selectedYear}\n                </span>\n              </ix-button>\n              <ix-dropdown\n                data-testid=\"year-month-dropdown\"\n                class=\"dropdown\"\n                trigger={this.dropdownButtonRef}\n                ignoreRelatedSubmenu\n                placement=\"bottom-start\"\n              >\n                <div class=\"wrapper\">\n                  <div\n                    data-testid=\"year-container\"\n                    class=\"overflow\"\n                    onScroll={() => this.infiniteScrollYears()}\n                    ref={(ref) => (this.yearContainerRef = ref)}\n                  >\n                    {this.renderYears()}\n                  </div>\n                  <div class=\"overflow\" data-testid=\"month-container\">\n                    {this.monthNames.map((month, index) => (\n                      <div\n                        key={month}\n                        ref={(ref) => {\n                          if (month === this.monthNames[0]) {\n                            this.firstMonthRef = ref as HTMLElement;\n                          }\n                        }}\n                        class={{\n                          arrowYear: true,\n                          'month-dropdown-item': true,\n                          selected:\n                            this.tempYear === this.selectedYear &&\n                            this.tempMonth === index,\n                          'disabled-item': !this.isWithinMinMaxMonth(index),\n                        }}\n                        onClick={() => this.selectMonth(index)}\n                        onKeyUp={(event) =>\n                          event.key === 'Enter' && this.selectMonth(index)\n                        }\n                        tabIndex={0}\n                      >\n                        <ix-icon\n                          class={{\n                            hidden:\n                              this.tempYear !== this.selectedYear ||\n                              this.tempMonth !== index,\n                            checkPosition: true,\n                          }}\n                          name=\"single-check\"\n                          size=\"16\"\n                        ></ix-icon>\n                        <div>\n                          <span class=\"capitalize monthMargin\">{`${month} ${this.tempYear}`}</span>\n                        </div>\n                      </div>\n                    ))}\n                  </div>\n                </div>\n              </ix-dropdown>\n            </div>\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(1)}\n              ghost\n              icon=\"chevron-right\"\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n          </div>\n          <div class=\"grid\">\n            <div class=\"calendar-item week-day\"></div>\n            {this.dayNames.map((name) => (\n              <div key={name} class=\"calendar-item week-day\">\n                {name.slice(0, 3)}\n              </div>\n            ))}\n            {this.calendar.map((week) => {\n              return (\n                <Fragment>\n                  <div class=\"calendar-item week-number\">{week.weekNumber}</div>\n                  {week.dayNumbers.map((day) => (\n                    <div\n                      key={day}\n                      id={`day-cell-${day}`}\n                      date-calender-day\n                      class={this.getDayClasses(day)}\n                      onClick={() => this.selectDay(day)}\n                      onKeyUp={(e) => e.key === 'Enter' && this.selectDay(day)}\n                      tabIndex={day === this.focusedDay ? 0 : -1}\n                      onFocus={() => this.onDayFocus()}\n                      onBlur={() => this.onDayBlur()}\n                    >\n                      {day}\n                    </div>\n                  ))}\n                </Fragment>\n              );\n            })}\n          </div>\n          <div\n            class={{\n              button: true,\n              hidden: !this.range || !this.standaloneAppearance,\n            }}\n          >\n            <ix-button onClick={() => this.onDone()}>\n              {this.textSelectDate || this.i18nDone}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\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:host {\n  --ix-layout-grid-gutter: 24px;\n\n  display: block;\n  flex: 1 1 0%;\n  width: 100%;\n\n  padding-left: calc(var(--ix-layout-grid-gutter) * 0.5);\n  padding-right: calc(var(--ix-layout-grid-gutter) * 0.5);\n}\n\n:host(.no-margin) {\n  padding-left: 0;\n  padding-right: 0;\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 { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-layout-grid',\n  styleUrl: 'layout-grid.scss',\n  shadow: true,\n})\nexport class LayoutGrid {\n  /**\n   * The grid will not have any horizontal padding\n   */\n  @Prop() noMargin = false;\n\n  /**\n   * Grid gap\n   */\n  @Prop() gap: '8' | '12' | '16' | '24' = '24';\n\n  /**\n   * Overwrite the default number of columns. Choose between 2 and 12 columns.\n   */\n  @Prop() columns = 12;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'no-margin': this.noMargin,\n        }}\n        style={{\n          '--ix-layout-grid-columns': `${this.columns}`,\n          '--ix-layout-grid-gutter': `${this.gap}px`,\n        }}\n      >\n        <slot></slot>\n      </Host>\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\n:host {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n:host(:not(:first-of-type)) {\n  margin-block-start: var(--ix-layout-grid-row-margin, 0);\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 { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-row',\n  styleUrl: 'row.scss',\n  shadow: true,\n})\nexport class Row {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-63f0755e.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as a,h as t,H as s}from"./p-f87cd962.js";const c=":host{display:block}";const n=c;const o=class{constructor(t){e(this,t);this.labelChange=a(this,"labelChange",7);this.label=undefined}watchLabel(e,a){this.labelChange.emit({name:"ix-menu-about-item",oldLabel:a,newLabel:e})}render(){return t(s,{key:"50457bcc0164d0923b4a360819e4759583d4f535"},t("slot",{key:"1f5acfdce0e58ab137145a7322e8a0348456a81e"}))}static get watchers(){return{label:["watchLabel"]}}};o.style=n;export{o as ix_menu_about_item};
+//# sourceMappingURL=p-63f0755e.entry.js.map

package/dist/siemens-ix/{p-14a41c8c.entry.js → p-6618b2db.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as t,H as o,g as s}from"./p-f87cd962.js";import{a as e}from"./p-71206084.js";import{A as a}from"./p-46a6cd9d.js";const i=":host{display:block;position:relative;width:22rem;height:100%;padding:0}: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(.visible){border-right:2px solid var(--theme-color-soft-bdr);padding:1.5rem 0.5rem 0}";const l=i;const b=class{constructor(t){r(this,t);this.visible=true}listenToggleEvent(){const r=!this.visible;const t={targets:this.hostElement,width:r?["0","22rem"]:["22rem","0"],opacity:r?[0,1]:[1,0],easing:"easeInSine",duration:a.defaultTime};const o=()=>{this.visible=r};if(r){t.begin=o.bind(this)}else{t.complete=o.bind(this)}e(t)}render(){return t(o,{key:"fe0f54c79115877bac6d0032320550ad2e3fe089",slot:"application-sidebar",class:{visible:this.visible}},this.visible?t("slot",null):null)}get hostElement(){return s(this)}};b.style=l;export{b as ix_application_sidebar};
-//# sourceMappingURL=p-14a41c8c.entry.js.map
+import{r,h as t,H as o,g as s}from"./p-f87cd962.js";import{a as e}from"./p-71206084.js";import{A as a}from"./p-46a6cd9d.js";const i=":host{display:block;position:relative;width:22rem;height:100%;padding:0}: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(.visible){border-right:2px solid var(--theme-color-soft-bdr);padding:1.5rem 0.5rem 0}";const l=i;const b=class{constructor(t){r(this,t);this.visible=true}listenToggleEvent(){const r=!this.visible;const t={targets:this.hostElement,width:r?["0","22rem"]:["22rem","0"],opacity:r?[0,1]:[1,0],easing:"easeInSine",duration:a.defaultTime};const o=()=>{this.visible=r};if(r){t.begin=o.bind(this)}else{t.complete=o.bind(this)}e(t)}render(){return t(o,{key:"58452e01549d1141ba862068da508cf9cb57ce39",slot:"application-sidebar",class:{visible:this.visible}},this.visible?t("slot",null):null)}get hostElement(){return s(this)}};b.style=l;export{b as ix_application_sidebar};
+//# sourceMappingURL=p-6618b2db.entry.js.map

package/dist/siemens-ix/{p-0653a145.entry.js → p-67f44540.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as t,h as i,H as r}from"./p-f87cd962.js";import{a as o}from"./p-4f8ac3bf.js";const s=":host{}: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 .event-list-item{display:flex;align-items:center;position:relative;height:var(--event-list-item-height, 2.5rem);max-height:var(--event-list-item-height, 2.5rem);border-radius:var(--event-list-item-border-radius, 0.25rem);background-color:var(--theme-event-item--background);overflow:hidden;transition:var(--theme-default-time);cursor:pointer;margin-bottom:var(--event-list-item-margin-bottom, 0.5rem)}:host .event-list-item .indicator{height:100%;width:0.5rem;max-width:0.5rem;min-width:0.5rem;border-top-left-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:var(--event-list-item-border-radius, 0.25rem)}:host .event-list-item .indicator-empty{border:var(--theme-weak-bdr-1);border-right:none}:host .event-list-item .event-list-item-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-grow:1;width:calc(100% - (1rem + 0.5rem));height:100%;border:0.062rem solid;border-color:var(--theme-event-item--border);border-top-left-radius:0;border-top-right-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:0;border-bottom-right-radius:var(--event-list-item-border-radius, 0.25rem);border-left:none;padding-left:1rem}:host .event-list-item .event-content{display:flex;align-items:center;width:100%;height:var(--event-list-item-height, 100%);max-height:var(--event-list-item-height, 100%);white-space:var(--event-list-item-content-white-space, inherit);overflow:hidden;padding-inline-end:0.5rem}:host .event-list-item .chevron-icon{margin-left:auto;margin-right:0.5rem;opacity:0.6;align-self:center}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):hover{background-color:var(--theme-event-item--background--hover)}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected):not(.disabled):not(:disabled).active{background-color:var(--theme-event-item--background--active)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):hover{border-color:var(--theme-event-item--border--hover)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled).active{border-color:var(--theme-event-item--border--active)}:host .event-list-item.selected .event-list-item-container{background-color:var(--theme-event-item--background--selected);border-color:var(--theme-event-item--border--selected)}:host .event-list-item[disabled],:host .event-list-item.disabled{pointer-events:none}:host .event-list-item[disabled] .event-list-item-container,:host .event-list-item.disabled .event-list-item-container{background-color:var(--theme-event-item--background--disabled);border-color:var(--theme-event-item--border--disabled)}:host(.disabled){pointer-events:none}";const n=s;const a=class{constructor(i){e(this,i);this.itemClick=t(this,"itemClick",7);this.color=undefined;this.itemColor=undefined;this.selected=undefined;this.disabled=undefined;this.chevron=undefined}handleItemClick(){this.itemClick.emit()}render(){var e,t,s,n;let a=((e=this.itemColor)===null||e===void 0?void 0:e.startsWith("--theme"))?`var(${this.itemColor})`:`var(--theme-${this.itemColor})`;if(this.color){a=((t=this.color)===null||t===void 0?void 0:t.startsWith("--theme"))?`var(${this.color})`:`var(--theme-${this.color})`}return i(r,{key:"f4867d7f68254b7f4929ce6746172eb03aa5caea",class:{disabled:this.disabled}},i("li",{key:"325588cc80c9b8988b37aaeb72a8d9c7affc088e","aria-disabled":o(this.disabled),class:{"event-list-item":true,selected:this.selected,disabled:this.disabled}},i("div",{key:"24ef52d3c26ccb528934fa0366c9ebdce05ca38d",class:`indicator ${!((s=this.itemColor)!==null&&s!==void 0?s:this.color)?"indicator-empty":""}`,style:{"background-color":((n=this.itemColor)!==null&&n!==void 0?n:this.color)?a:"inherit",opacity:`${this.disabled?.4:1}`}}),i("div",{key:"74fac568b74471bcd6051f25d13bbac6d3aaadb4",class:"event-list-item-container"},i("div",{key:"47d69475c3d448ca417b1892b30f22e7de77b19f",class:"event-content"},i("slot",{key:"c87d4fc509bdbc2041122e274caa2860a2530843"})),this.chevron&&i("ix-icon",{key:"8626b6e5ff1f23163d4a75d5c3a114adc3942c2c",name:"chevron-right",size:"16",class:"chevron-icon"}))))}};a.style=n;export{a as ix_event_list_item};
-//# sourceMappingURL=p-0653a145.entry.js.map
+import{r as e,c as t,h as i,H as r}from"./p-f87cd962.js";import{a as o}from"./p-157b1b28.js";const s=":host{}: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 .event-list-item{display:flex;align-items:center;position:relative;height:var(--event-list-item-height, 2.5rem);max-height:var(--event-list-item-height, 2.5rem);border-radius:var(--event-list-item-border-radius, 0.25rem);background-color:var(--theme-event-item--background);overflow:hidden;transition:var(--theme-default-time);cursor:pointer;margin-bottom:var(--event-list-item-margin-bottom, 0.5rem)}:host .event-list-item .indicator{height:100%;width:0.5rem;max-width:0.5rem;min-width:0.5rem;border-top-left-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:var(--event-list-item-border-radius, 0.25rem)}:host .event-list-item .indicator-empty{border:var(--theme-weak-bdr-1);border-right:none}:host .event-list-item .event-list-item-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-grow:1;width:calc(100% - (1rem + 0.5rem));height:100%;border:0.062rem solid;border-color:var(--theme-event-item--border);border-top-left-radius:0;border-top-right-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:0;border-bottom-right-radius:var(--event-list-item-border-radius, 0.25rem);border-left:none;padding-left:1rem}:host .event-list-item .event-content{display:flex;align-items:center;width:100%;height:var(--event-list-item-height, 100%);max-height:var(--event-list-item-height, 100%);white-space:var(--event-list-item-content-white-space, inherit);overflow:hidden;padding-inline-end:0.5rem}:host .event-list-item .chevron-icon{margin-left:auto;margin-right:0.5rem;opacity:0.6;align-self:center}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):hover{background-color:var(--theme-event-item--background--hover)}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected):not(.disabled):not(:disabled).active{background-color:var(--theme-event-item--background--active)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):hover{border-color:var(--theme-event-item--border--hover)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled).active{border-color:var(--theme-event-item--border--active)}:host .event-list-item.selected .event-list-item-container{background-color:var(--theme-event-item--background--selected);border-color:var(--theme-event-item--border--selected)}:host .event-list-item[disabled],:host .event-list-item.disabled{pointer-events:none}:host .event-list-item[disabled] .event-list-item-container,:host .event-list-item.disabled .event-list-item-container{background-color:var(--theme-event-item--background--disabled);border-color:var(--theme-event-item--border--disabled)}:host(.disabled){pointer-events:none}";const n=s;const d=class{constructor(i){e(this,i);this.itemClick=t(this,"itemClick",7);this.color=undefined;this.itemColor=undefined;this.selected=undefined;this.disabled=undefined;this.chevron=undefined}handleItemClick(){this.itemClick.emit()}render(){var e,t,s,n;let d=((e=this.itemColor)===null||e===void 0?void 0:e.startsWith("--theme"))?`var(${this.itemColor})`:`var(--theme-${this.itemColor})`;if(this.color){d=((t=this.color)===null||t===void 0?void 0:t.startsWith("--theme"))?`var(${this.color})`:`var(--theme-${this.color})`}return i(r,{key:"115c40df6986d283ac53ecc1ef7d5cfbe751864e",class:{disabled:this.disabled}},i("li",{key:"431cc4b56030d9f5db39923380067fdb98e77b88","aria-disabled":o(this.disabled),class:{"event-list-item":true,selected:this.selected,disabled:this.disabled}},i("div",{key:"44cc672e3416136a20c4f256c6c6ffd9f82097d5",class:`indicator ${!((s=this.itemColor)!==null&&s!==void 0?s:this.color)?"indicator-empty":""}`,style:{"background-color":((n=this.itemColor)!==null&&n!==void 0?n:this.color)?d:"inherit",opacity:`${this.disabled?.4:1}`}}),i("div",{key:"d894014deacd0fd725c0e88e57e5d40a4d329113",class:"event-list-item-container"},i("div",{key:"3a016426709b4abc7853bc67aeca4a3e11e5d6c1",class:"event-content"},i("slot",{key:"c5cdf2b4a04834d540af8d8df19a8889ee6e0ffb"})),this.chevron&&i("ix-icon",{key:"9646e270e1496247c2ab8223452eb76d2f9f902e",name:"chevron-right",size:"16",class:"chevron-icon"}))))}};d.style=n;export{d as ix_event_list_item};
+//# sourceMappingURL=p-67f44540.entry.js.map

package/dist/siemens-ix/{p-15b3c17e.entry.js → p-6e4c9e3d.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as o,H as t,c as e,g as a}from"./p-f87cd962.js";import{a as s}from"./p-712e0ee0.js";const c=":host{display:block;position:relative;overflow:auto;padding:0.25rem 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}";const l=c;const b=class{constructor(o){r(this,o)}render(){return o(t,{key:"709b6b9fda6d3560e4a8b2703f8c72f271490a4c"},o("slot",{key:"900625af9e6dbb6b0254fb13fc6acc8cb4e98fc4"}))}};b.style=l;const i=":host{display:flex;padding:0.5rem;align-items:center;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-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 .modal-close{margin-left:auto;margin-right:-1rem}:host .modal-icon{margin-right:1rem}";const h=i;const n=class{constructor(o){r(this,o);this.closeClick=e(this,"closeClick",7);this.hideClose=false;this.icon=undefined;this.iconColor=undefined}onIconChange(r){if(this.parentDialog){if(r){this.parentDialog.classList.add("with-icon")}else{this.parentDialog.classList.remove("with-icon")}}}componentDidLoad(){this.parentDialog=s(this.hostElement,"ix-modal");this.onIconChange(this.icon)}onCloseClick(r){const o=this.closeClick.emit(r);if(o.defaultPrevented||r.defaultPrevented){return}this.parentDialog.dismissModal()}render(){return o(t,{key:"e0edc0b5eca59209ecbe32b5777383244e6e1153"},this.icon?o("ix-icon",{class:"modal-icon",name:this.icon,color:this.iconColor}):null,o("ix-typography",{key:"4981a025990dfc2776afed400aba5cf9114bc44d",variant:"default-title"},o("slot",{key:"d9915d27dbccf15f71b97b6c7e34e294c07e31e7"})),!this.hideClose?o("ix-icon-button",{onClick:r=>this.onCloseClick(r),ghost:true,icon:"close",class:"modal-close"}):null)}get hostElement(){return a(this)}static get watchers(){return{icon:["onIconChange"]}}};n.style=h;export{b as ix_modal_content,n as ix_modal_header};
-//# sourceMappingURL=p-15b3c17e.entry.js.map
+import{r,h as o,H as t,c as e,g as a}from"./p-f87cd962.js";import{a as s}from"./p-345e1c73.js";const c=":host{display:block;position:relative;overflow:auto;padding:0.25rem 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}";const l=c;const b=class{constructor(o){r(this,o)}render(){return o(t,{key:"c44dbc0e48d38a350ee7194196bfb28317bd08fb"},o("slot",{key:"de26d99ab3ff09cff42810d985580a225d1d5167"}))}};b.style=l;const i=":host{display:flex;padding:0.5rem;align-items:center;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-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 .modal-close{margin-left:auto;margin-right:-1rem}:host .modal-icon{margin-right:1rem}";const h=i;const n=class{constructor(o){r(this,o);this.closeClick=e(this,"closeClick",7);this.hideClose=false;this.icon=undefined;this.iconColor=undefined}onIconChange(r){if(this.parentDialog){if(r){this.parentDialog.classList.add("with-icon")}else{this.parentDialog.classList.remove("with-icon")}}}componentDidLoad(){this.parentDialog=s(this.hostElement,"ix-modal");this.onIconChange(this.icon)}onCloseClick(r){const o=this.closeClick.emit(r);if(o.defaultPrevented||r.defaultPrevented){return}this.parentDialog.dismissModal()}render(){return o(t,{key:"0e31772ecc258bed3aabc881736a5a55b8e2dcf8"},this.icon?o("ix-icon",{class:"modal-icon",name:this.icon,color:this.iconColor}):null,o("ix-typography",{key:"1d821172c63942206ba76f4a46cce6b89a3dd451",variant:"default-title"},o("slot",{key:"6b7225b02d3f34a3c9ee4e8d7378d09acebd701a"})),!this.hideClose?o("ix-icon-button",{onClick:r=>this.onCloseClick(r),ghost:true,icon:"close",class:"modal-close"}):null)}get hostElement(){return a(this)}static get watchers(){return{icon:["onIconChange"]}}};n.style=h;export{b as ix_modal_content,n as ix_modal_header};
+//# sourceMappingURL=p-6e4c9e3d.entry.js.map

package/dist/siemens-ix/{p-15b3c17e.entry.js.map → p-6e4c9e3d.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["modalContentCss","IxModalContentStyle0","ModalContent","render","h","Host","key","modalHeaderCss","IxModalHeaderStyle0","ModalHeader","onIconChange","icon","this","parentDialog","classList","add","remove","componentDidLoad","closestPassShadow","hostElement","onCloseClick","event","ce","closeClick","emit","defaultPrevented","dismissModal","class","name","color","iconColor","variant","hideClose","onClick","ghost"],"sources":["src/components/modal-content/modal-content.scss?tag=ix-modal-content&encapsulation=shadow","src/components/modal-content/modal-content.tsx","src/components/modal-header/modal-header.scss?tag=ix-modal-header&encapsulation=shadow","src/components/modal-header/modal-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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n  overflow: auto;\n  padding: 0.25rem 0.75rem;\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, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-content',\n  styleUrl: 'modal-content.scss',\n  shadow: true,\n})\nexport class ModalContent {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  padding: 0.5rem;\n  align-items: center;\n  align-self: stretch;\n\n  .modal-close {\n    margin-left: auto;\n    margin-right: -1rem;\n  }\n\n  .modal-icon {\n    margin-right: 1rem;\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  Prop,\n  Watch,\n} from '@stencil/core';\nimport { closestPassShadow } from '../utils/shadow-dom';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-header',\n  styleUrl: 'modal-header.scss',\n  shadow: true,\n})\nexport class ModalHeader {\n  @Element() hostElement!: HTMLIxModalHeaderElement;\n\n  /**\n   * Hide the close button\n   */\n  @Prop() hideClose = false;\n\n  /**\n   * Icon of the Header\n   */\n  @Prop() icon: string;\n\n  @Watch('icon')\n  onIconChange(icon: string) {\n    if (this.parentDialog) {\n      if (icon) {\n        this.parentDialog.classList.add('with-icon');\n      } else {\n        this.parentDialog.classList.remove('with-icon');\n      }\n    }\n  }\n\n  /**\n   * Icon color\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Emits when close icon is clicked and closes the modal\n   * Can be prevented, in which case only the event is triggered, and the modal remains open\n   */\n  @Event() closeClick: EventEmitter<MouseEvent>;\n\n  private parentDialog: HTMLIxModalElement;\n\n  componentDidLoad() {\n    this.parentDialog = closestPassShadow(\n      this.hostElement,\n      'ix-modal'\n    ) as HTMLIxModalElement;\n    this.onIconChange(this.icon);\n  }\n\n  private onCloseClick(event: MouseEvent) {\n    const ce = this.closeClick.emit(event);\n    if (ce.defaultPrevented || event.defaultPrevented) {\n      return;\n    }\n\n    this.parentDialog.dismissModal();\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.icon ? (\n          <ix-icon\n            class={'modal-icon'}\n            name={this.icon}\n            color={this.iconColor}\n          ></ix-icon>\n        ) : null}\n        <ix-typography variant={'default-title'}>\n          <slot></slot>\n        </ix-typography>\n        {!this.hideClose ? (\n          <ix-icon-button\n            onClick={(event) => this.onCloseClick(event)}\n            ghost\n            icon=\"close\"\n            class={'modal-close'}\n          ></ix-icon-button>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"+FAAA,MAAMA,EAAkB,u0BACxB,MAAAC,EAAeD,E,MCkBFE,EAAY,M,yBACvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C,aCvBR,MAAMC,EAAiB,85BACvB,MAAAC,EAAeD,E,MC4BFE,EAAW,M,+EAMF,M,6CAQpB,YAAAC,CAAaC,GACX,GAAIC,KAAKC,aAAc,CACrB,GAAIF,EAAM,CACRC,KAAKC,aAAaC,UAAUC,IAAI,Y,KAC3B,CACLH,KAAKC,aAAaC,UAAUE,OAAO,Y,GAkBzC,gBAAAC,GACEL,KAAKC,aAAeK,EAClBN,KAAKO,YACL,YAEFP,KAAKF,aAAaE,KAAKD,K,CAGjB,YAAAS,CAAaC,GACnB,MAAMC,EAAKV,KAAKW,WAAWC,KAAKH,GAChC,GAAIC,EAAGG,kBAAoBJ,EAAMI,iBAAkB,CACjD,M,CAGFb,KAAKC,aAAaa,c,CAGpB,MAAAvB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFM,KAAKD,KACJP,EAAA,WACEuB,MAAO,aACPC,KAAMhB,KAAKD,KACXkB,MAAOjB,KAAKkB,YAEZ,KACJ1B,EAAA,iBAAAE,IAAA,2CAAeyB,QAAS,iBACtB3B,EAAA,QAAAE,IAAA,+CAEAM,KAAKoB,UACL5B,EAAA,kBACE6B,QAAUZ,GAAUT,KAAKQ,aAAaC,GACtCa,MAAK,KACLvB,KAAK,QACLgB,MAAO,gBAEP,K"}
+{"version":3,"names":["modalContentCss","IxModalContentStyle0","ModalContent","render","h","Host","key","modalHeaderCss","IxModalHeaderStyle0","ModalHeader","onIconChange","icon","this","parentDialog","classList","add","remove","componentDidLoad","closestPassShadow","hostElement","onCloseClick","event","ce","closeClick","emit","defaultPrevented","dismissModal","class","name","color","iconColor","variant","hideClose","onClick","ghost"],"sources":["src/components/modal-content/modal-content.scss?tag=ix-modal-content&encapsulation=shadow","src/components/modal-content/modal-content.tsx","src/components/modal-header/modal-header.scss?tag=ix-modal-header&encapsulation=shadow","src/components/modal-header/modal-header.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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n  overflow: auto;\n  padding: 0.25rem 0.75rem;\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, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-content',\n  styleUrl: 'modal-content.scss',\n  shadow: true,\n})\nexport class ModalContent {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  padding: 0.5rem;\n  align-items: center;\n  align-self: stretch;\n\n  .modal-close {\n    margin-left: auto;\n    margin-right: -1rem;\n  }\n\n  .modal-icon {\n    margin-right: 1rem;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { closestPassShadow } from '../utils/shadow-dom';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-header',\n  styleUrl: 'modal-header.scss',\n  shadow: true,\n})\nexport class ModalHeader {\n  @Element() hostElement!: HTMLIxModalHeaderElement;\n\n  /**\n   * Hide the close button\n   */\n  @Prop() hideClose = false;\n\n  /**\n   * Icon of the Header\n   */\n  @Prop() icon: string;\n\n  @Watch('icon')\n  onIconChange(icon: string) {\n    if (this.parentDialog) {\n      if (icon) {\n        this.parentDialog.classList.add('with-icon');\n      } else {\n        this.parentDialog.classList.remove('with-icon');\n      }\n    }\n  }\n\n  /**\n   * Icon color\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Emits when close icon is clicked and closes the modal\n   * Can be prevented, in which case only the event is triggered, and the modal remains open\n   */\n  @Event() closeClick: EventEmitter<MouseEvent>;\n\n  private parentDialog: HTMLIxModalElement;\n\n  componentDidLoad() {\n    this.parentDialog = closestPassShadow(\n      this.hostElement,\n      'ix-modal'\n    ) as HTMLIxModalElement;\n    this.onIconChange(this.icon);\n  }\n\n  private onCloseClick(event: MouseEvent) {\n    const ce = this.closeClick.emit(event);\n    if (ce.defaultPrevented || event.defaultPrevented) {\n      return;\n    }\n\n    this.parentDialog.dismissModal();\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.icon ? (\n          <ix-icon\n            class={'modal-icon'}\n            name={this.icon}\n            color={this.iconColor}\n          ></ix-icon>\n        ) : null}\n        <ix-typography variant={'default-title'}>\n          <slot></slot>\n        </ix-typography>\n        {!this.hideClose ? (\n          <ix-icon-button\n            onClick={(event) => this.onCloseClick(event)}\n            ghost\n            icon=\"close\"\n            class={'modal-close'}\n          ></ix-icon-button>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"+FAAA,MAAMA,EAAkB,u0BACxB,MAAAC,EAAeD,E,MCkBFE,EAAY,M,yBACvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C,aCvBR,MAAMC,EAAiB,85BACvB,MAAAC,EAAeD,E,MC4BFE,EAAW,M,+EAMF,M,6CAQpB,YAAAC,CAAaC,GACX,GAAIC,KAAKC,aAAc,CACrB,GAAIF,EAAM,CACRC,KAAKC,aAAaC,UAAUC,IAAI,Y,KAC3B,CACLH,KAAKC,aAAaC,UAAUE,OAAO,Y,GAkBzC,gBAAAC,GACEL,KAAKC,aAAeK,EAClBN,KAAKO,YACL,YAEFP,KAAKF,aAAaE,KAAKD,K,CAGjB,YAAAS,CAAaC,GACnB,MAAMC,EAAKV,KAAKW,WAAWC,KAAKH,GAChC,GAAIC,EAAGG,kBAAoBJ,EAAMI,iBAAkB,CACjD,M,CAGFb,KAAKC,aAAaa,c,CAGpB,MAAAvB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFM,KAAKD,KACJP,EAAA,WACEuB,MAAO,aACPC,KAAMhB,KAAKD,KACXkB,MAAOjB,KAAKkB,YAEZ,KACJ1B,EAAA,iBAAAE,IAAA,2CAAeyB,QAAS,iBACtB3B,EAAA,QAAAE,IAAA,+CAEAM,KAAKoB,UACL5B,EAAA,kBACE6B,QAAUZ,GAAUT,KAAKQ,aAAaC,GACtCa,MAAK,KACLvB,KAAK,QACLgB,MAAO,gBAEP,K"}

package/dist/siemens-ix/p-7402f42a.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as o,g as i}from"./p-f87cd962.js";import{c as s}from"./p-e898862b.js";import{m as a}from"./p-64c3fa3d.js";import{m as r}from"./p-c146af8e.js";import"./p-c4749812.js";const h=':host{position:relative;display:block;cursor:pointer;height:var(--ix-menu-item-height, 3rem);min-height:var(--ix-menu-item-height, 3rem);max-height:var(--ix-menu-item-height, 3rem)}:host .tab{all:unset;box-sizing:border-box;display:flex;position:relative;align-items:center;height:var(--ix-menu-item-height, 3rem);width:100%;z-index:500;padding-left:0.875rem}:host .tab:not(.disabled):not(:disabled).hover,:host .tab:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host .tab:not(.disabled):not(:disabled).active,:host .tab:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host .tab-icon{color:var(--theme-nav-item-primary-icon--color);position:relative;pointer-events:none}:host .tab:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:-1px}:host .notification{display:inline-flex;position:absolute;top:0.25rem;left:1.5rem}:host .notification .pill{display:inline-flex;justify-content:center;align-items:center;height:0.5rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}:host .tab-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1rem 0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}:host(.active) .tab,:host(.selected) .tab{background-color:var(--theme-nav-item-primary--background--selected)}:host(.active) .tab::before,:host(.selected) .tab::before{content:"";background-color:var(--theme-nav-item-primary--border-color--selected);height:var(--ix-menu-item-height, 3rem);width:0.25rem;left:0;position:absolute}:host(.active) .tab>.glyph,:host(.selected) .tab>.glyph{color:var(--theme-nav-item-primary-icon--color--selected)}:host(.disabled){color:var(--theme-color-weak-text);pointer-events:none;cursor:default}:host(.disabled) .tab>.tab-icon{color:var(--theme-color-weak-text)}:host(.disabled) .tab-text{color:var(--theme-color-weak-text)}:host(.bottom-tab),:host([slot=bottom]){min-height:2.25rem;height:2.25rem;max-height:2.25rem}:host(.bottom-tab) .tab,:host([slot=bottom]) .tab{height:2.25rem}:host(.bottom-tab) .tab::before,:host([slot=bottom]) .tab::before{height:2.25rem;background-color:transparent}:host(.bottom-tab).active:hover,:host(.bottom-tab).selected:hover,:host([slot=bottom]).active:hover,:host([slot=bottom]).selected:hover{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab).active:active,:host(.bottom-tab).selected:active,:host([slot=bottom]).active:active,:host([slot=bottom]).selected:active{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab.active) .tab,:host(.bottom-tab.selected) .tab,:host(.active[slot=bottom]) .tab,:host(.selected[slot=bottom]) .tab{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.tab-nested) .tab{flex-direction:row;padding-left:1.375rem}:host(.tab-nested) .tab .notification{position:relative;top:0;left:0;padding-left:0.5rem}:host(.tab-nested) .tab .tab-icon{padding-left:0.5rem;padding-right:0.5rem}:host(.tab-nested) .tab .tab-text{margin-left:0.5rem}:host(.tab-nested) .tab::before{display:none}';const n=h;const c=class{constructor(e){t(this,e);this.buttonRef=a();this.isHostedInsideCategory=false;this.observer=s((()=>{this.setTooltip()}));this.label=undefined;this.home=false;this.bottom=false;this.tabIcon=undefined;this.icon=undefined;this.notifications=undefined;this.active=false;this.disabled=false;this.isCategory=false;this.tooltip=undefined;this.menuExpanded=false}componentWillLoad(){this.isHostedInsideCategory=!!this.hostElement.closest("ix-menu-category");this.onIconChange();this.onTabIconChange();this.menuExpanded=r.nativeElement.expand;this.menuExpandedDisposer=r.expandChange.on((t=>this.menuExpanded=t))}componentWillRender(){this.setTooltip()}setTooltip(){var t;this.tooltip=(t=this.label)!==null&&t!==void 0?t:this.hostElement.textContent}connectedCallback(){this.observer.observe(this.hostElement,{subtree:true,childList:true,characterData:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}if(this.menuExpandedDisposer){this.menuExpandedDisposer.dispose()}}onIconChange(){if(!this.isHostedInsideCategory&&!this.hostElement.icon&&!this.hostElement.tabIcon){this.icon="document"}}onTabIconChange(){if(!this.isHostedInsideCategory&&!this.hostElement.icon&&!this.hostElement.tabIcon){this.tabIcon="document"}}render(){var t;let i={};if(this.home){i={slot:"home"}}if(this.bottom){i={slot:"bottom"}}return e(o,Object.assign({key:"44759af10c986ca08135dae3ab3b2258c933d8ef",class:{disabled:this.disabled,"home-tab":this.home,"bottom-tab":this.bottom,active:this.active,"tab-nested":this.isHostedInsideCategory}},i),e("button",{key:"e30dbc8b43973f06f0d1f387ca886f11c088c0b9",class:"tab",tabIndex:this.disabled?-1:0,role:"listitem",ref:this.buttonRef},(this.icon||this.tabIcon)&&e("ix-icon",{key:"11163d983423f020b14de4bcae24dbf55068e645",class:"tab-icon",name:(t=this.icon)!==null&&t!==void 0?t:this.tabIcon}),this.notifications?e("div",{class:"notification"},e("div",{class:"pill"},this.notifications)):null,e("span",{key:"3a62db4c5e965a9fec6d5e4648a9587b7ff6271d",class:"tab-text text-default"},this.label,e("slot",{key:"1c9c5c22c13da93176d68f93c516e4005506d43e"}))),!this.isCategory&&!this.isHostedInsideCategory&&!this.menuExpanded&&e("ix-tooltip",{key:"ec5fd96cbe7c0937202a70ebfba24abc66afd203",for:this.buttonRef.waitForCurrent(),placement:"right",showDelay:1e3},this.tooltip))}get hostElement(){return i(this)}static get watchers(){return{icon:["onIconChange"],tabIcon:["onTabIconChange"]}}};c.style=n;export{c as ix_menu_item};
+//# sourceMappingURL=p-7402f42a.entry.js.map