@siemens/ix 3.0.0-alpha.4 → 3.0.0

package/dist/siemens-ix/{p-f8a852c3.entry.js → p-4dac8359.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as a,H as t,g as i}from"./p-BNpBEtDH.js";import{u as o,A as r}from"./p--2LOMK-5.js";import{a as s}from"./p-CyFFBc_G.js";import{m as n}from"./p-DDHkNPby.js";import{h as l}from"./p-i60z1FJC.js";import{t as c}from"./p-Dp4RJcgZ.js";import"./p-BdCnOrqW.js";import"./p-D6vSVaHq.js";const h=":host{display:flex;position:relative;width:100vw;height:100vh;flex-direction:column}: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 ix-application-header{z-index:calc(var(--theme-z-index-sticky) + 1)}:host .logo-wrapper{display:contents}:host .application{display:flex;position:relative;flex-direction:row;height:100%;width:100%;overflow:hidden}:host .content-area{display:flex;position:relative;flex-direction:column;flex-wrap:nowrap;height:calc(100% - var(--ix-safe-area-inset-bottom, 0px));width:100%;margin-left:var(--ix-application-menu-margin-left)}:host main{display:block;position:relative;flex-grow:1;width:100%;padding-bottom:var(--ix-safe-area-inset-bottom);overflow:auto}:host footer{display:block;position:relative;width:100%}:host(.breakpoint-md){--ix-application-menu-margin-left:calc(\n    3.25rem + var(--ix-application-menu-safe-area-left, 0rem)\n  )}:host(.breakpoint-md) aside.slotted{margin-left:var(--ix-application-menu-margin-left)}:host(.breakpoint-md) aside.slotted+.content-area{margin-left:0}:host(.breakpoint-md) aside:not(.slotted)+.content-area{margin-left:var(--ix-application-menu-margin-left)}:host(.breakpoint-lg){--ix-application-menu-margin-left:0}:host(.breakpoint-sm){--ix-application-menu-margin-left:var(\n    --ix-application-menu-safe-area-left,\n    0rem\n  )}";const d=class{constructor(a){e(this,a);this.themeSystemAppearance=false;this.breakpoints=["sm","md","lg"];this.breakpoint="lg";this.applicationSidebarSlotted=false}forceLayoutChange(e){if(!e){s.enableBreakpointDetection();return}s.disableBreakpointDetection();s.setBreakpoint(e)}onBreakpointsChange(e){s.setBreakpoints(e)}get menu(){return this.hostElement.querySelector("ix-menu")}get applicationSidebarSlot(){return this.hostElement.shadowRoot.querySelector(".application-sidebar slot")}onContentClick(){var e;if(n.isPinned){return}(e=this.menu)===null||e===void 0?void 0:e.toggleMenu(false)}componentWillLoad(){s.setBreakpoints(this.breakpoints);this.contextProvider=o(this.hostElement,r,{hideHeader:false,host:"basic-navigation",sidebar:this.applicationSidebarSlotted,appSwitchConfig:this.appSwitchConfig});this.modeDisposable=s.onChange.on((e=>{this.breakpoint=e}));this.breakpoint=s.breakpoint;if(this.forceBreakpoint){this.forceLayoutChange(this.forceBreakpoint)}this.changeTheme()}disconnectedCallback(){var e;(e=this.modeDisposable)===null||e===void 0?void 0:e.dispose()}changeTheme(){if(!this.theme){if(this.themeSystemAppearance){c.setVariant()}return}if(c.hasVariantSuffix(this.theme)){c.setTheme(`theme-${this.theme}`);return}c.setTheme(`theme-${this.theme}-dark`,this.themeSystemAppearance)}onApplicationSidebarChange(){if(!this.contextProvider){console.error("Context provider not available");return}this.contextProvider.emit({hideHeader:false,host:"basic-navigation",sidebar:this.applicationSidebarSlotted,appSwitchConfig:this.appSwitchConfig})}render(){return a(t,{key:"50ca923e8983045fce768740d5ed1e939f87ab5d","data-role":"",class:{[`breakpoint-${this.breakpoint}`]:true}},a("slot",{key:"25816ef9a2ca0755899f548d82422b36bdff0ea2",name:"application-header"}),a("div",{key:"b6decbb58f86e676b0f38f74d1a0b1cf06a0a047",class:"application"},a("slot",{key:"ce9aa0dadca4c0fc457f46175accb2f2463b4f99",name:"menu"}),a("aside",{key:"5bbed7f3373138a202c4ac5c5e53db200ae6c497",class:{"application-sidebar":true,slotted:this.applicationSidebarSlotted},onClick:()=>this.onContentClick()},a("slot",{key:"0d7177030baeb9798a88b596a051e3189e0f48c7",name:"application-sidebar",onSlotchange:()=>this.applicationSidebarSlotted=l(this.applicationSidebarSlot)})),a("div",{key:"fbadd8c31611153d09cb8923a45602ba87066f73",class:"content-area"},a("main",{key:"1800db092639a1cbcbbc3506a4fe911c3ad8f2df",class:"content",onClick:()=>this.onContentClick()},a("slot",{key:"b4f6e4327073f70991b6460a7b300721685e615f"})),a("footer",{key:"83534298e878b0ef312ea138e475057d7a81166f",class:"footer"},a("slot",{key:"bafee309d2384d9f358c6940f4e647ae267a866b",name:"bottom"})))))}get hostElement(){return i(this)}static get watchers(){return{breakpoints:["onBreakpointsChange"],theme:["changeTheme"],themeSystemAppearance:["changeTheme"],appSwitchConfig:["onApplicationSidebarChange"],applicationSidebarSlotted:["onApplicationSidebarChange"]}}};d.style=h;export{d as ix_application};
-//# sourceMappingURL=p-f8a852c3.entry.js.map
+import{r as e,h as t,H as a,g as i}from"./p-BNpBEtDH.js";import{u as o,A as r}from"./p--2LOMK-5.js";import{a as s}from"./p-CyFFBc_G.js";import{m as n}from"./p-DDHkNPby.js";import{h as l}from"./p-i60z1FJC.js";import{t as c}from"./p-Dp4RJcgZ.js";import"./p-BdCnOrqW.js";import"./p-D6vSVaHq.js";const h=":host{display:flex;position:relative;width:100vw;height:100vh;flex-direction:column}: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 ix-application-header{z-index:calc(var(--theme-z-index-sticky) + 1)}:host .logo-wrapper{display:contents}:host .application{display:flex;position:relative;flex-direction:row;height:100%;width:100%;overflow:hidden}:host .content-area{display:flex;position:relative;flex-direction:column;flex-wrap:nowrap;height:calc(100% - var(--ix-safe-area-inset-bottom, 0px));width:100%;margin-left:var(--ix-application-menu-margin-left)}:host main{display:block;position:relative;flex-grow:1;width:100%;padding-bottom:var(--ix-safe-area-inset-bottom);overflow:auto}:host footer{display:block;position:relative;width:100%}:host(.breakpoint-md){--ix-application-menu-margin-left:calc(\n    3.25rem + var(--ix-application-menu-safe-area-left, 0rem)\n  )}:host(.breakpoint-md) aside.slotted{margin-left:var(--ix-application-menu-margin-left)}:host(.breakpoint-md) aside.slotted+.content-area{margin-left:0}:host(.breakpoint-md) aside:not(.slotted)+.content-area{margin-left:var(--ix-application-menu-margin-left)}:host(.breakpoint-lg){--ix-application-menu-margin-left:0}:host(.breakpoint-sm){--ix-application-menu-margin-left:var(\n    --ix-application-menu-safe-area-left,\n    0rem\n  )}";const d=class{constructor(t){e(this,t);this.themeSystemAppearance=false;this.breakpoints=["sm","md","lg"];this.breakpoint="lg";this.applicationSidebarSlotted=false}forceLayoutChange(e){if(!e){s.enableBreakpointDetection();return}s.disableBreakpointDetection();s.setBreakpoint(e)}onBreakpointsChange(e){s.setBreakpoints(e)}get menu(){return this.hostElement.querySelector("ix-menu")}get applicationSidebarSlot(){return this.hostElement.shadowRoot.querySelector(".application-sidebar slot")}onContentClick(){var e;if(n.isPinned){return}(e=this.menu)===null||e===void 0?void 0:e.toggleMenu(false)}componentWillLoad(){s.setBreakpoints(this.breakpoints);this.contextProvider=o(this.hostElement,r,{hideHeader:false,host:"basic-navigation",sidebar:this.applicationSidebarSlotted,appSwitchConfig:this.appSwitchConfig});this.modeDisposable=s.onChange.on((e=>{this.breakpoint=e}));this.breakpoint=s.breakpoint;if(this.forceBreakpoint){this.forceLayoutChange(this.forceBreakpoint)}this.changeTheme()}disconnectedCallback(){var e;(e=this.modeDisposable)===null||e===void 0?void 0:e.dispose()}changeTheme(){if(!this.theme){if(this.themeSystemAppearance){c.setVariant()}return}if(c.hasVariantSuffix(this.theme)){c.setTheme(`theme-${this.theme}`);return}c.setTheme(`theme-${this.theme}-dark`,this.themeSystemAppearance)}onApplicationSidebarChange(){if(!this.contextProvider){console.error("Context provider not available");return}this.contextProvider.emit({hideHeader:false,host:"basic-navigation",sidebar:this.applicationSidebarSlotted,appSwitchConfig:this.appSwitchConfig})}render(){return t(a,{key:"12df5f0b5c589e0174dbf8459d92af4190a96c0f","data-role":"",class:{[`breakpoint-${this.breakpoint}`]:true}},t("slot",{key:"a3d1468fbc1193ef21107a230d7306f75f35925b",name:"application-header"}),t("div",{key:"dc8ede839e213b5998a3ebd419ea2fded65da5eb",class:"application"},t("slot",{key:"cfe19639784db5f834c1f19358221694d8a4ae67",name:"menu"}),t("aside",{key:"014df49acba12b350b853084e5a20296d1d905c6",class:{"application-sidebar":true,slotted:this.applicationSidebarSlotted},onClick:()=>this.onContentClick()},t("slot",{key:"522327d4f0e94b92d0437268e2a7126b153ebc92",name:"application-sidebar",onSlotchange:()=>this.applicationSidebarSlotted=l(this.applicationSidebarSlot)})),t("div",{key:"72193d09002c9e34539c3f2f7134b25ec23ebdc3",class:"content-area"},t("main",{key:"1aa61d4160d06dccda6934f4093148d75530e973",class:"content",onClick:()=>this.onContentClick()},t("slot",{key:"f893c9dd078ee90fdfc195a4a29677296c2e8856"})),t("footer",{key:"a8a3e42fc670b3e998e6eb6875e8b76878957b41",class:"footer"},t("slot",{key:"cad5c975e5b9698197cdede76f0316264ca92dca",name:"bottom"})))))}get hostElement(){return i(this)}static get watchers(){return{breakpoints:["onBreakpointsChange"],theme:["changeTheme"],themeSystemAppearance:["changeTheme"],appSwitchConfig:["onApplicationSidebarChange"],applicationSidebarSlotted:["onApplicationSidebarChange"]}}};d.style=h;export{d as ix_application};
+//# sourceMappingURL=p-4dac8359.entry.js.map

package/dist/siemens-ix/p-4dac8359.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["applicationCss","Application","constructor","hostRef","this","themeSystemAppearance","breakpoints","breakpoint","applicationSidebarSlotted","forceLayoutChange","newMode","applicationLayoutService","enableBreakpointDetection","disableBreakpointDetection","setBreakpoint","onBreakpointsChange","setBreakpoints","menu","hostElement","querySelector","applicationSidebarSlot","shadowRoot","onContentClick","menuController","isPinned","_a","toggleMenu","componentWillLoad","contextProvider","useContextProvider","ApplicationLayoutContext","hideHeader","host","sidebar","appSwitchConfig","modeDisposable","onChange","on","mode","forceBreakpoint","changeTheme","disconnectedCallback","dispose","theme","themeSwitcher","setVariant","hasVariantSuffix","setTheme","onApplicationSidebarChange","console","error","emit","render","h","Host","key","class","name","slotted","onClick","onSlotchange","hasSlottedElements"],"sources":["src/components/application/application.scss?tag=ix-application&encapsulation=shadow","src/components/application/application.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n\n  flex-direction: column;\n\n  ix-application-header {\n    z-index: calc(var(--theme-z-index-sticky) + 1);\n  }\n\n  .logo-wrapper {\n    display: contents;\n  }\n\n  .application {\n    display: flex;\n    position: relative;\n    flex-direction: row;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n  }\n\n  .content-area {\n    display: flex;\n    position: relative;\n    flex-direction: column;\n    flex-wrap: nowrap;\n    height: calc(100% - var(--ix-safe-area-inset-bottom, 0px));\n    width: 100%;\n    margin-left: var(--ix-application-menu-margin-left);\n  }\n\n  main {\n    display: block;\n    position: relative;\n    flex-grow: 1;\n\n    width: 100%;\n    padding-bottom: var(--ix-safe-area-inset-bottom);\n    overflow: auto;\n  }\n\n  footer {\n    display: block;\n    position: relative;\n    width: 100%;\n  }\n}\n\n:host(.breakpoint-md) {\n  --ix-application-menu-margin-left: calc(\n    3.25rem + var(--ix-application-menu-safe-area-left, 0rem)\n  );\n\n  aside.slotted {\n    margin-left: var(--ix-application-menu-margin-left);\n  }\n\n  aside.slotted + .content-area {\n    margin-left: 0;\n  }\n\n  aside:not(.slotted) + .content-area {\n    margin-left: var(--ix-application-menu-margin-left);\n  }\n}\n\n:host(.breakpoint-lg) {\n  --ix-application-menu-margin-left: 0;\n}\n\n:host(.breakpoint-sm) {\n  --ix-application-menu-margin-left: var(\n    --ix-application-menu-safe-area-left,\n    0rem\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 { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport {\n  ApplicationLayoutContext,\n  AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { applicationLayoutService } from '../utils/application-layout/service';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextProvider, useContextProvider } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { IxTheme, themeSwitcher } from '../utils/theme-switcher';\nimport { Disposable } from '../utils/typed-event';\n\n@Component({\n  tag: 'ix-application',\n  styleUrl: 'application.scss',\n  shadow: true,\n})\nexport class Application {\n  @Element() hostElement!: HTMLIxApplicationElement;\n\n  /**\n   * Application theme\n   */\n  @Prop() theme?: IxTheme;\n\n  /**\n   * Use the system appearance dark or light\n   */\n  @Prop() themeSystemAppearance = false;\n\n  /**\n   * Change the responsive layout of the menu structure\n   */\n  @Prop() forceBreakpoint: Breakpoint | undefined;\n  forceLayoutChange(newMode: Breakpoint | undefined) {\n    if (!newMode) {\n      applicationLayoutService.enableBreakpointDetection();\n      return;\n    }\n\n    applicationLayoutService.disableBreakpointDetection();\n    applicationLayoutService.setBreakpoint(newMode);\n  }\n\n  /**\n   * Supported layouts\n   */\n  @Prop() breakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  @Watch('breakpoints')\n  onBreakpointsChange(breakpoints: Breakpoint[]) {\n    applicationLayoutService.setBreakpoints(breakpoints);\n  }\n\n  /**\n   * Define application switch configuration\n   */\n  @Prop() appSwitchConfig?: AppSwitchConfiguration;\n\n  @State() breakpoint: Breakpoint = 'lg';\n  @State() applicationSidebarSlotted = false;\n\n  private contextProvider?: ContextProvider<typeof ApplicationLayoutContext>;\n\n  get menu(): HTMLIxMenuElement | null {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  get applicationSidebarSlot() {\n    return this.hostElement.shadowRoot!.querySelector(\n      '.application-sidebar slot'\n    ) as HTMLSlotElement;\n  }\n\n  private modeDisposable?: Disposable;\n\n  private onContentClick() {\n    if (menuController.isPinned) {\n      return;\n    }\n    this.menu?.toggleMenu(false);\n  }\n\n  componentWillLoad() {\n    applicationLayoutService.setBreakpoints(this.breakpoints);\n\n    this.contextProvider = useContextProvider(\n      this.hostElement,\n      ApplicationLayoutContext,\n      {\n        hideHeader: false,\n        host: 'basic-navigation',\n        sidebar: this.applicationSidebarSlotted,\n        appSwitchConfig: this.appSwitchConfig,\n      }\n    );\n\n    this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n      this.breakpoint = mode;\n    });\n    this.breakpoint = applicationLayoutService.breakpoint;\n\n    if (this.forceBreakpoint) {\n      this.forceLayoutChange(this.forceBreakpoint);\n    }\n\n    this.changeTheme();\n  }\n\n  disconnectedCallback() {\n    this.modeDisposable?.dispose();\n  }\n\n  @Watch('theme')\n  @Watch('themeSystemAppearance')\n  private changeTheme() {\n    if (!this.theme) {\n      if (this.themeSystemAppearance) {\n        themeSwitcher.setVariant();\n      }\n\n      return;\n    }\n\n    if (themeSwitcher.hasVariantSuffix(this.theme)) {\n      themeSwitcher.setTheme(`theme-${this.theme}`);\n      return;\n    }\n\n    themeSwitcher.setTheme(\n      `theme-${this.theme}-dark`,\n      this.themeSystemAppearance\n    );\n  }\n\n  @Watch('appSwitchConfig')\n  @Watch('applicationSidebarSlotted')\n  onApplicationSidebarChange() {\n    if (!this.contextProvider) {\n      console.error('Context provider not available');\n      return;\n    }\n    this.contextProvider.emit({\n      hideHeader: false,\n      host: 'basic-navigation',\n      sidebar: this.applicationSidebarSlotted,\n      appSwitchConfig: this.appSwitchConfig,\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        data-role=\"\"\n        class={{\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n      >\n        <slot name=\"application-header\"></slot>\n        <div class=\"application\">\n          <slot name=\"menu\"></slot>\n          <aside\n            class={{\n              'application-sidebar': true,\n              slotted: this.applicationSidebarSlotted,\n            }}\n            onClick={() => this.onContentClick()}\n          >\n            <slot\n              name=\"application-sidebar\"\n              onSlotchange={() =>\n                (this.applicationSidebarSlotted = hasSlottedElements(\n                  this.applicationSidebarSlot\n                ))\n              }\n            ></slot>\n          </aside>\n          <div class=\"content-area\">\n            <main class=\"content\" onClick={() => this.onContentClick()}>\n              <slot></slot>\n            </main>\n            <footer class=\"footer\">\n              <slot name=\"bottom\"></slot>\n            </footer>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oSAAA,MAAMA,EAAiB,y+D,MC2BVC,EAAW,MALxB,WAAAC,CAAAC,G,UAgBUC,KAAqBC,sBAAG,MAmBxBD,KAAWE,YAAiB,CAAC,KAAM,KAAM,MAWxCF,KAAUG,WAAe,KACzBH,KAAyBI,0BAAG,KAiItC,CA1JC,iBAAAC,CAAkBC,GAChB,IAAKA,EAAS,CACZC,EAAyBC,4BACzB,M,CAGFD,EAAyBE,6BACzBF,EAAyBG,cAAcJ,E,CAQzC,mBAAAK,CAAoBT,GAClBK,EAAyBK,eAAeV,E,CAa1C,QAAIW,GACF,OAAOb,KAAKc,YAAYC,cAAc,U,CAGxC,0BAAIC,GACF,OAAOhB,KAAKc,YAAYG,WAAYF,cAClC,4B,CAMI,cAAAG,G,MACN,GAAIC,EAAeC,SAAU,CAC3B,M,EAEFC,EAAArB,KAAKa,QAAI,MAAAQ,SAAA,SAAAA,EAAEC,WAAW,M,CAGxB,iBAAAC,GACEhB,EAAyBK,eAAeZ,KAAKE,aAE7CF,KAAKwB,gBAAkBC,EACrBzB,KAAKc,YACLY,EACA,CACEC,WAAY,MACZC,KAAM,mBACNC,QAAS7B,KAAKI,0BACd0B,gBAAiB9B,KAAK8B,kBAI1B9B,KAAK+B,eAAiBxB,EAAyByB,SAASC,IAAIC,IAC1DlC,KAAKG,WAAa+B,CAAI,IAExBlC,KAAKG,WAAaI,EAAyBJ,WAE3C,GAAIH,KAAKmC,gBAAiB,CACxBnC,KAAKK,kBAAkBL,KAAKmC,gB,CAG9BnC,KAAKoC,a,CAGP,oBAAAC,G,OACEhB,EAAArB,KAAK+B,kBAAgB,MAAAV,SAAA,SAAAA,EAAAiB,S,CAKf,WAAAF,GACN,IAAKpC,KAAKuC,MAAO,CACf,GAAIvC,KAAKC,sBAAuB,CAC9BuC,EAAcC,Y,CAGhB,M,CAGF,GAAID,EAAcE,iBAAiB1C,KAAKuC,OAAQ,CAC9CC,EAAcG,SAAS,SAAS3C,KAAKuC,SACrC,M,CAGFC,EAAcG,SACZ,SAAS3C,KAAKuC,aACdvC,KAAKC,sB,CAMT,0BAAA2C,GACE,IAAK5C,KAAKwB,gBAAiB,CACzBqB,QAAQC,MAAM,kCACd,M,CAEF9C,KAAKwB,gBAAgBuB,KAAK,CACxBpB,WAAY,MACZC,KAAM,mBACNC,QAAS7B,KAAKI,0BACd0B,gBAAiB9B,KAAK8B,iB,CAI1B,MAAAkB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,uDACO,GACVC,MAAO,CACL,CAAC,cAAcpD,KAAKG,cAAe,OAGrC8C,EAAM,QAAAE,IAAA,2CAAAE,KAAK,uBACXJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,eACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,SACXJ,EAAA,SAAAE,IAAA,2CACEC,MAAO,CACL,sBAAuB,KACvBE,QAAStD,KAAKI,2BAEhBmD,QAAS,IAAMvD,KAAKkB,kBAEpB+B,EACE,QAAAE,IAAA,2CAAAE,KAAK,sBACLG,aAAc,IACXxD,KAAKI,0BAA4BqD,EAChCzD,KAAKgB,2BAKbiC,EAAK,OAAAE,IAAA,2CAAAC,MAAM,gBACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,UAAUG,QAAS,IAAMvD,KAAKkB,kBACxC+B,EAAA,QAAAE,IAAA,8CAEFF,EAAQ,UAAAE,IAAA,2CAAAC,MAAM,UACZH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,c","ignoreList":[]}

package/dist/siemens-ix/{p-576fade1.entry.js → p-521dfa2a.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,H as s,g as h}from"./p-BNpBEtDH.js";import{a as o}from"./p-Ou74PMQs.js";import{A as a}from"./p-Dp15M30K.js";import{a as r}from"./p-CyFFBc_G.js";import{m as n}from"./p-D6vSVaHq.js";import{p as l,D as d,E as p,F as c,G as b}from"./p-CrTP-icT.js";import"./p-BdCnOrqW.js";const m=":host{background-color:var(--theme-color-2);display:flex;position:relative;overflow:hidden;box-sizing:border-box}: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 aside{width:100%;height:100%}:host .title-text{display:flex;align-items:center;gap:var(--theme-space-1);overflow:hidden}:host .title-text .title-text-overflow{width:100%;height:100%;display:contents}:host .title-text .title-text-overflow *{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .header-gap{gap:var(--theme-space-1)}:host .top-bottom-pane{display:flex;flex-direction:column;flex-grow:1}:host .top-bottom-pane .title{display:flex;flex-direction:row;align-items:center;margin:var(--theme-space--1) var(--theme-space-2) var(--theme-space--1) var(--theme-space-2)}:host .top-bottom-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .top-bottom-pane .title-expanded{display:flex;flex-direction:row}:host .top-bottom-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane{display:flex;flex-grow:1}:host .left-right-pane .title{display:flex;flex-direction:column;align-items:center;margin:var(--theme-space-2) var(--theme-space--1) var(--theme-space-2) var(--theme-space--1)}:host .left-right-pane .title .title-text{flex-direction:row-reverse;justify-content:start;flex-direction:row}:host .left-right-pane .title .rotate{writing-mode:vertical-lr;text-orientation:mixed;transform:rotate(180deg);flex-direction:row-reverse}:host .left-right-pane .title .rotate ix-icon{transform:rotate(90deg)}:host .left-right-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane .title-expanded{display:flex;flex-direction:row}:host .left-right-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane.expanded{flex-direction:column}:host .mobile-pane{display:flex;flex-direction:column;flex-grow:1}:host .mobile-pane .title-mobile{display:flex;flex-direction:row-reverse;justify-content:space-between;margin:var(--theme-space-1) var(--theme-space-2)}:host .side-pane-content{padding:var(--theme-space-1) var(--theme-space-2);overflow:auto;height:100%;width:100%}:host(.not-visible){display:none}:host(.inline-color){background-color:var(--theme-color-1)}:host(.box-shadow){box-shadow:0 0 1rem black}:host(.nav-left-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-weak-bdr)}:host(.left-pane-border){border-right:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.right-pane-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-pane-border){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.bottom-pane-border){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-overlay){width:100%;position:absolute;z-index:100 !important}:host(.mobile-overlay) .side-pane-content{height:calc(100% - 2.5rem)}:host(.mobile-border-top){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-border-bottom){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-expanded){top:0}:host(.bottom-expanded){bottom:0}:host(.left-right-pane){height:100%}:host(.top-bottom-pane){width:100%}";const f=class{constructor(i){t(this,i);this.expandedChanged=e(this,"expandedChanged",7);this.variantChanged=e(this,"variantChanged",7);this.borderlessChanged=e(this,"borderlessChanged",7);this.hideOnCollapseChanged=e(this,"hideOnCollapseChanged",7);this.slotChanged=e(this,"slotChanged",7);this.variant="inline";this.hideOnCollapse=false;this.size="240px";this.borderless=false;this.expanded=false;this.composition="top";this.ignoreLayoutSettings=false;this.isMobile=false;this.expandIcon="";this.showContent=false;this.minimizeIcon="";this.floating=false;this.parentWidthPx=0;this.parentHeightPx=0;this.animations=new Map;this.animationCounter=0}get currentSlot(){return this.hostElement.getAttribute("slot")}get isBottomTopPane(){return this.composition==="bottom"||this.composition==="top"}get isLeftRightPane(){return this.composition==="left"||this.composition==="right"}get isMobileTop(){return this.composition==="top"||this.composition==="left"}componentWillLoad(){this.setIcons();this.floating=this.variant==="floating";if(this.expanded){this.onParentSizeChange()}this.isMobile=n("sm");r.onChange.on((()=>{this.isMobile=n("sm")}));if(this.currentSlot){this.setPosition(this.currentSlot)}this.mutationObserver=new MutationObserver((t=>{t.forEach((t=>{if(t.type==="attributes"&&t.attributeName==="slot"){const e=this.currentSlot;const i=t.oldValue;if(e!==i){this.slotChanged.emit({slot:i!==null&&i!==void 0?i:"",newSlot:e!==null&&e!==void 0?e:""});if(e){this.setPosition(e)}}}}))}));this.mutationObserver.observe(this.hostElement,{attributes:true,attributeOldValue:true});const t=this.hostElement.parentElement;this.resizeObserver=new ResizeObserver((t=>{this.parentWidthPx=t[0].borderBoxSize[0].inlineSize;this.parentHeightPx=t[0].borderBoxSize[0].blockSize}));if(t)this.resizeObserver.observe(t)}disconnectedCallback(){var t,e;(t=this.mutationObserver)===null||t===void 0?void 0:t.disconnect();(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect()}setPosition(t){if(f.validPositions.includes(t)){this.composition=t}}getExpandPaneSize(){let t;if(this.isBottomTopPane){if(this.size.includes("px")){const e=Math.round(this.parentHeightPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentHeightPx/2)}px`}else{t=`${Math.round(this.parentHeightPx/3)}px`}}}else{if(this.size.includes("px")){const e=Math.round(this.parentWidthPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentWidthPx/2)}px`}else{t=`${Math.round(this.parentWidthPx/3)}px`}}}return t}setIcons(){const{expandIcon:t,minimizeIcon:e}=this.getIconNames();this.expandIcon=t;this.minimizeIcon=e}getIconNames(){let t="";let e="";switch(this.composition){case"left":t=this.isMobile?d:b;e=this.isMobile?p:c;break;case"right":t=this.isMobile?p:c;e=this.isMobile?d:b;break;case"bottom":t=p;e=d;break;case"top":t=d;e=p;break}return{expandIcon:t,minimizeIcon:e}}getKey(){return(this.animationCounter++).toString()}animateVerticalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,width:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;this.animateVerticalPadding("0px")}else{this.animateVerticalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}animateHorizontalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,height:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;if(!this.isMobile)this.animateHorizontalPadding("0px")}else{if(!this.isMobile)this.animateHorizontalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}removePadding(){o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:0,paddingTop:0,paddingBottom:0,paddingLeft:0,paddingRight:0,delay:0})}animateHorizontalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingTop:t,paddingBottom:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}animateVerticalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingLeft:t,paddingRight:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}clearAnimations(){this.animations.forEach((t=>t.pause()));this.animations.clear();this.animationCounter=0}onMobileChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.hostElement.style.removeProperty("min-height");this.onParentSizeChange()}onPositionChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.onParentSizeChange()}onHideOnCollapseChange(t){var e;this.onParentSizeChange();this.hideOnCollapseChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",hideOnCollapse:t})}onVariantChange(t){var e;this.floating=t==="floating";this.variantChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",variant:t})}onBorderlessChange(t){var e;this.borderlessChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",borderless:t})}dispatchExpandedChangedEvent(){var t;const e=this.expandedChanged.emit({slot:(t=this.currentSlot)!==null&&t!==void 0?t:"",expanded:!this.expanded});if(!e.defaultPrevented){this.expanded=!this.expanded}}onParentSizeChange(){this.clearAnimations();this.removePadding();if(this.expanded){if(this.isMobile){this.hostElement.style.height="100%"}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=t;this.animateHorizontalPadding("8px",0)}else{this.hostElement.style.width=t;this.animateVerticalPadding("8px",0)}}this.showContent=true}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane}}}}onSizeChange(){if(this.expanded){if(this.isMobile){this.hostElement.style.minHeight=this.hideOnCollapse?"0":f.collapsedPaneMobile;this.animateHorizontalFadeIn("100%")}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane;this.animateHorizontalFadeIn(t)}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane;this.animateVerticalFadeIn(t)}}}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.animateHorizontalFadeIn(f.collapsedPane)}else{this.animateVerticalFadeIn(f.collapsedPane)}}}}render(){return i(s,{key:"48aefc1145058d559cb713356c94b112f9b6c236",class:{"inline-color":!this.floating,"mobile-overlay":this.expanded&&this.isMobile,"top-expanded":this.expanded&&this.isMobileTop&&this.isMobile,"bottom-expanded":this.expanded&&!this.isMobileTop&&this.isMobile,"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,[`${this.composition}-pane-border`]:!this.borderless&&!this.isMobile&&!this.floating,"nav-left-border":!this.borderless&&!this.isMobile&&this.composition!=="right"&&this.floating,"mobile-border-top":!this.borderless&&this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"mobile-border-bottom":!this.borderless&&!this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"box-shadow":this.floating,"aria-expanded":this.expanded,"not-visible":this.hideOnCollapse&&!this.expanded}},i("aside",{key:"373c760c22f98edff6f27e3c6c161d2c1d90c527",id:`pane-${this.composition}`,class:{"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,"mobile-pane":this.isMobile,expanded:this.expanded}},i("div",{key:"2fcbd2bc94f9c3e518e41ce42be7d8c56daa91b4",id:"title-div",class:{title:!this.isMobile&&!this.hideOnCollapse&&!this.showContent,"title-finished":!this.isMobile&&!this.hideOnCollapse&&this.showContent,"title-expanded":!this.isMobile&&!this.hideOnCollapse&&this.expanded,"title-hide-on-collapse":!this.isMobile&&this.hideOnCollapse,"title-mobile":this.isMobile,"header-gap":!this.isMobile&&!this.hideOnCollapse}},i("ix-icon-button",{key:"cbb99e9885a41c88a66d839c45d4f67f37d37f80",class:"title-icon",size:"24",icon:this.expanded?this.isMobile||this.hideOnCollapse?l:this.expandIcon:this.minimizeIcon,ghost:true,onClick:()=>this.dispatchExpandedChangedEvent(),"aria-controls":`pane-${this.composition}`}),i("span",{key:"edc04216716b06e9c13dbf94500225e71099e6d5",class:{"title-text":true,rotate:!this.expanded&&!this.isMobile&&this.isLeftRightPane}},this.icon?i("ix-icon",{size:"24",name:this.icon}):null,i("div",{key:"2a1f686a93e3aee1b4374405df12b79c9b5f787b",class:"title-text-overflow"},i("ix-typography",{key:"b0a42df1078d4360d2058262ac07551220fed513",format:"h4"},this.heading)))),i("div",{key:"5c4f24e9e0dee32bfb1d5502f487fdaf6b4c9859",class:"side-pane-content",hidden:!this.showContent},i("slot",{key:"f28c9aa0dde2a4d14cf16f0849ec31025a80c37b"}))))}get hostElement(){return h(this)}static get watchers(){return{isMobile:["onMobileChange"],composition:["onPositionChange"],hideOnCollapse:["onHideOnCollapseChange"],variant:["onVariantChange"],borderless:["onBorderlessChange"],parentHeightPx:["onParentSizeChange"],parentWidthPx:["onParentSizeChange"],expanded:["onSizeChange"],size:["onSizeChange"]}}};f.validPositions=["top","left","bottom","right"];f.collapsedPane="40px";f.collapsedPaneMobile="48px";f.style=m;export{f as ix_pane};
-//# sourceMappingURL=p-576fade1.entry.js.map
+import{r as t,c as e,h as i,H as s,g as h}from"./p-BNpBEtDH.js";import{a as o}from"./p-Ou74PMQs.js";import{A as a}from"./p-Dp15M30K.js";import{a as r}from"./p-CyFFBc_G.js";import{m as n}from"./p-D6vSVaHq.js";import{p as l,D as d,E as p,F as c,G as b}from"./p-CrTP-icT.js";import"./p-BdCnOrqW.js";const m=":host{background-color:var(--theme-color-2);display:flex;position:relative;overflow:hidden;box-sizing:border-box}: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 aside{width:100%;height:100%}:host .title-text{display:flex;align-items:center;gap:var(--theme-space-1);overflow:hidden}:host .title-text .title-text-overflow{width:100%;height:100%;display:contents}:host .title-text .title-text-overflow *{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .header-gap{gap:var(--theme-space-1)}:host .top-bottom-pane{display:flex;flex-direction:column;flex-grow:1}:host .top-bottom-pane .title{display:flex;flex-direction:row;align-items:center;margin:var(--theme-space--1) var(--theme-space-2) var(--theme-space--1) var(--theme-space-2)}:host .top-bottom-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .top-bottom-pane .title-expanded{display:flex;flex-direction:row}:host .top-bottom-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane{display:flex;flex-grow:1}:host .left-right-pane .title{display:flex;flex-direction:column;align-items:center;margin:var(--theme-space-2) var(--theme-space--1) var(--theme-space-2) var(--theme-space--1)}:host .left-right-pane .title .title-text{flex-direction:row-reverse;justify-content:start;flex-direction:row}:host .left-right-pane .title .rotate{writing-mode:vertical-lr;text-orientation:mixed;transform:rotate(180deg);flex-direction:row-reverse}:host .left-right-pane .title .rotate ix-icon{transform:rotate(90deg)}:host .left-right-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane .title-expanded{display:flex;flex-direction:row}:host .left-right-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane.expanded{flex-direction:column}:host .mobile-pane{display:flex;flex-direction:column;flex-grow:1}:host .mobile-pane .title-mobile{display:flex;flex-direction:row-reverse;justify-content:space-between;margin:var(--theme-space-1) var(--theme-space-2)}:host .side-pane-content{padding:var(--theme-space-1) var(--theme-space-2);overflow:auto;height:100%;width:100%}:host(.not-visible){display:none}:host(.inline-color){background-color:var(--theme-color-1)}:host(.box-shadow){box-shadow:0 0 1rem black}:host(.nav-left-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-weak-bdr)}:host(.left-pane-border){border-right:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.right-pane-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-pane-border){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.bottom-pane-border){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-overlay){width:100%;position:absolute;z-index:100 !important}:host(.mobile-overlay) .side-pane-content{height:calc(100% - 2.5rem)}:host(.mobile-border-top){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-border-bottom){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-expanded){top:0}:host(.bottom-expanded){bottom:0}:host(.left-right-pane){height:100%}:host(.top-bottom-pane){width:100%}";const f=class{constructor(i){t(this,i);this.expandedChanged=e(this,"expandedChanged",7);this.variantChanged=e(this,"variantChanged",7);this.borderlessChanged=e(this,"borderlessChanged",7);this.hideOnCollapseChanged=e(this,"hideOnCollapseChanged",7);this.slotChanged=e(this,"slotChanged",7);this.variant="inline";this.hideOnCollapse=false;this.size="240px";this.borderless=false;this.expanded=false;this.composition="top";this.ignoreLayoutSettings=false;this.isMobile=false;this.expandIcon="";this.showContent=false;this.minimizeIcon="";this.floating=false;this.parentWidthPx=0;this.parentHeightPx=0;this.animations=new Map;this.animationCounter=0}get currentSlot(){return this.hostElement.getAttribute("slot")}get isBottomTopPane(){return this.composition==="bottom"||this.composition==="top"}get isLeftRightPane(){return this.composition==="left"||this.composition==="right"}get isMobileTop(){return this.composition==="top"||this.composition==="left"}componentWillLoad(){this.setIcons();this.floating=this.variant==="floating";if(this.expanded){this.onParentSizeChange()}this.isMobile=n("sm");r.onChange.on((()=>{this.isMobile=n("sm")}));if(this.currentSlot){this.setPosition(this.currentSlot)}this.mutationObserver=new MutationObserver((t=>{t.forEach((t=>{if(t.type==="attributes"&&t.attributeName==="slot"){const e=this.currentSlot;const i=t.oldValue;if(e!==i){this.slotChanged.emit({slot:i!==null&&i!==void 0?i:"",newSlot:e!==null&&e!==void 0?e:""});if(e){this.setPosition(e)}}}}))}));this.mutationObserver.observe(this.hostElement,{attributes:true,attributeOldValue:true});const t=this.hostElement.parentElement;this.resizeObserver=new ResizeObserver((t=>{this.parentWidthPx=t[0].borderBoxSize[0].inlineSize;this.parentHeightPx=t[0].borderBoxSize[0].blockSize}));if(t)this.resizeObserver.observe(t)}disconnectedCallback(){var t,e;(t=this.mutationObserver)===null||t===void 0?void 0:t.disconnect();(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect()}setPosition(t){if(f.validPositions.includes(t)){this.composition=t}}getExpandPaneSize(){let t;if(this.isBottomTopPane){if(this.size.includes("px")){const e=Math.round(this.parentHeightPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentHeightPx/2)}px`}else{t=`${Math.round(this.parentHeightPx/3)}px`}}}else{if(this.size.includes("px")){const e=Math.round(this.parentWidthPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentWidthPx/2)}px`}else{t=`${Math.round(this.parentWidthPx/3)}px`}}}return t}setIcons(){const{expandIcon:t,minimizeIcon:e}=this.getIconNames();this.expandIcon=t;this.minimizeIcon=e}getIconNames(){let t="";let e="";switch(this.composition){case"left":t=this.isMobile?d:b;e=this.isMobile?p:c;break;case"right":t=this.isMobile?p:c;e=this.isMobile?d:b;break;case"bottom":t=p;e=d;break;case"top":t=d;e=p;break}return{expandIcon:t,minimizeIcon:e}}getKey(){return(this.animationCounter++).toString()}animateVerticalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,width:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;this.animateVerticalPadding("0px")}else{this.animateVerticalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}animateHorizontalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,height:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;if(!this.isMobile)this.animateHorizontalPadding("0px")}else{if(!this.isMobile)this.animateHorizontalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}removePadding(){o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:0,paddingTop:0,paddingBottom:0,paddingLeft:0,paddingRight:0,delay:0})}animateHorizontalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingTop:t,paddingBottom:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}animateVerticalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingLeft:t,paddingRight:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}clearAnimations(){this.animations.forEach((t=>t.pause()));this.animations.clear();this.animationCounter=0}onMobileChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.hostElement.style.removeProperty("min-height");this.onParentSizeChange()}onPositionChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.onParentSizeChange()}onHideOnCollapseChange(t){var e;this.onParentSizeChange();this.hideOnCollapseChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",hideOnCollapse:t})}onVariantChange(t){var e;this.floating=t==="floating";this.variantChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",variant:t})}onBorderlessChange(t){var e;this.borderlessChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",borderless:t})}dispatchExpandedChangedEvent(){var t;const e=this.expandedChanged.emit({slot:(t=this.currentSlot)!==null&&t!==void 0?t:"",expanded:!this.expanded});if(!e.defaultPrevented){this.expanded=!this.expanded}}onParentSizeChange(){this.clearAnimations();this.removePadding();if(this.expanded){if(this.isMobile){this.hostElement.style.height="100%"}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=t;this.animateHorizontalPadding("8px",0)}else{this.hostElement.style.width=t;this.animateVerticalPadding("8px",0)}}this.showContent=true}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane}}}}onSizeChange(){if(this.expanded){if(this.isMobile){this.hostElement.style.minHeight=this.hideOnCollapse?"0":f.collapsedPaneMobile;this.animateHorizontalFadeIn("100%")}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane;this.animateHorizontalFadeIn(t)}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane;this.animateVerticalFadeIn(t)}}}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.animateHorizontalFadeIn(f.collapsedPane)}else{this.animateVerticalFadeIn(f.collapsedPane)}}}}render(){return i(s,{key:"ef23679a524b6ef0920ed74618700e39d332698d",class:{"inline-color":!this.floating,"mobile-overlay":this.expanded&&this.isMobile,"top-expanded":this.expanded&&this.isMobileTop&&this.isMobile,"bottom-expanded":this.expanded&&!this.isMobileTop&&this.isMobile,"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,[`${this.composition}-pane-border`]:!this.borderless&&!this.isMobile&&!this.floating,"nav-left-border":!this.borderless&&!this.isMobile&&this.composition!=="right"&&this.floating,"mobile-border-top":!this.borderless&&this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"mobile-border-bottom":!this.borderless&&!this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"box-shadow":this.floating,"aria-expanded":this.expanded,"not-visible":this.hideOnCollapse&&!this.expanded}},i("aside",{key:"836145f46f598131cd0f7d48e1870b2b3fe56436",id:`pane-${this.composition}`,class:{"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,"mobile-pane":this.isMobile,expanded:this.expanded}},i("div",{key:"5a74c72e36309bb8dd5c0ec4b34a61a97c6499c2",id:"title-div",class:{title:!this.isMobile&&!this.hideOnCollapse&&!this.showContent,"title-finished":!this.isMobile&&!this.hideOnCollapse&&this.showContent,"title-expanded":!this.isMobile&&!this.hideOnCollapse&&this.expanded,"title-hide-on-collapse":!this.isMobile&&this.hideOnCollapse,"title-mobile":this.isMobile,"header-gap":!this.isMobile&&!this.hideOnCollapse}},i("ix-icon-button",{key:"58d5341a003c95577340aba395ad373cd47448e6",class:"title-icon",size:"24",icon:this.expanded?this.isMobile||this.hideOnCollapse?l:this.expandIcon:this.minimizeIcon,ghost:true,onClick:()=>this.dispatchExpandedChangedEvent(),"aria-controls":`pane-${this.composition}`}),i("span",{key:"50bc7296628c1f82932f4e59c6ff4438f7c911a3",class:{"title-text":true,rotate:!this.expanded&&!this.isMobile&&this.isLeftRightPane}},this.icon?i("ix-icon",{size:"24",name:this.icon}):null,i("div",{key:"1d2017fad228bba526a69bb943ac139611e0fa9f",class:"title-text-overflow"},i("ix-typography",{key:"d92fabb3423abb36c474fc9342cb792dfcd1c162",format:"h4"},this.heading)))),i("div",{key:"ebc766b4b3010f6c0f93177e7fb71f002bbe0dfb",class:"side-pane-content",hidden:!this.showContent},i("slot",{key:"bbf3740942b66907306b07b97fc396b0eb98a50d"}))))}get hostElement(){return h(this)}static get watchers(){return{isMobile:["onMobileChange"],composition:["onPositionChange"],hideOnCollapse:["onHideOnCollapseChange"],variant:["onVariantChange"],borderless:["onBorderlessChange"],parentHeightPx:["onParentSizeChange"],parentWidthPx:["onParentSizeChange"],expanded:["onSizeChange"],size:["onSizeChange"]}}};f.validPositions=["top","left","bottom","right"];f.collapsedPane="40px";f.collapsedPaneMobile="48px";f.style=m;export{f as ix_pane};
+//# sourceMappingURL=p-521dfa2a.entry.js.map

package/dist/siemens-ix/p-521dfa2a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["paneCss","Pane","constructor","hostRef","this","variant","hideOnCollapse","size","borderless","expanded","composition","ignoreLayoutSettings","isMobile","expandIcon","showContent","minimizeIcon","floating","parentWidthPx","parentHeightPx","animations","Map","animationCounter","currentSlot","hostElement","getAttribute","isBottomTopPane","isLeftRightPane","isMobileTop","componentWillLoad","setIcons","onParentSizeChange","matchBreakpoint","applicationLayoutService","onChange","on","setPosition","mutationObserver","MutationObserver","mutations","forEach","mutation","type","attributeName","newSlot","oldSlot","oldValue","slotChanged","emit","slot","observe","attributes","attributeOldValue","parentElement","resizeObserver","ResizeObserver","entries","borderBoxSize","inlineSize","blockSize","disconnectedCallback","_a","disconnect","_b","value","validPositions","includes","getExpandPaneSize","expandPaneSize","referenceValue","Math","round","currentValue","Number","replace","getIconNames","iconDoubleChevronUp","iconDoubleChevronLeft","iconDoubleChevronDown","iconDoubleChevronRight","getKey","toString","animateVerticalFadeIn","key","animation","anime","targets","duration","Animation","mediumTime","width","easing","delay","begin","animateVerticalPadding","complete","delete","set","animateHorizontalFadeIn","height","animateHorizontalPadding","removePadding","shadowRoot","querySelector","paddingTop","paddingBottom","paddingLeft","paddingRight","clearAnimations","pause","clear","onMobileChange","style","removeProperty","onPositionChange","onHideOnCollapseChange","hideOnCollapseChanged","onVariantChange","variantChanged","onBorderlessChange","borderlessChanged","dispatchExpandedChangedEvent","event","expandedChanged","defaultPrevented","collapsedPaneMobile","collapsedPane","onSizeChange","minHeight","render","h","Host","class","id","title","icon","iconClose","ghost","onClick","rotate","name","format","heading","hidden"],"sources":["src/components/pane/pane.scss?tag=ix-pane&encapsulation=shadow","src/components/pane/pane.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n@mixin set-border($composition) {\n  @if $composition {\n    border-#{$composition}: var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr);\n  }\n}\n\n:host {\n  @include ix-component;\n  background-color: var(--theme-color-2);\n  display: flex;\n  position: relative;\n  overflow: hidden;\n  box-sizing: border-box;\n\n  aside {\n    width: 100%;\n    height: 100%;\n  }\n\n  .title-text {\n    display: flex;\n    align-items: center;\n    gap: var(--theme-space-1);\n    overflow: hidden;\n\n    .title-text-overflow {\n      width: 100%;\n      height: 100%;\n      display: contents;\n\n      * {\n        text-overflow: ellipsis;\n        white-space: nowrap;\n        overflow: hidden;\n      }\n    }\n  }\n\n  .header-gap {\n    gap: var(--theme-space-1);\n  }\n\n  .top-bottom-pane {\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n\n    .title {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      margin: var(--theme-space--1) var(--theme-space-2) var(--theme-space--1) var(--theme-space-2);\n    }\n\n    .title-finished {\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n\n    .title-expanded {\n      display: flex;\n      flex-direction: row;\n    }\n\n    .title-hide-on-collapse {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n  }\n\n  .left-right-pane {\n    display: flex;\n    flex-grow: 1;\n\n    .title {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      margin: var(--theme-space-2) var(--theme-space--1)  var(--theme-space-2) var(--theme-space--1);\n\n      .title-text {\n        flex-direction: row-reverse;\n        justify-content: start;\n        flex-direction: row;\n      }\n\n      .rotate {\n        writing-mode: vertical-lr;\n        text-orientation: mixed;\n        transform: rotate(180deg);\n        flex-direction: row-reverse;\n\n        ix-icon {\n          transform: rotate(90deg);\n        }\n      }\n    }\n\n    .title-finished {\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n\n    .title-expanded {\n      display: flex;\n      flex-direction: row;\n    }\n\n    .title-hide-on-collapse {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n  }\n\n  .left-right-pane.expanded {\n    flex-direction: column;\n  }\n\n  .mobile-pane {\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n\n    .title-mobile {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      margin: var(--theme-space-1) var(--theme-space-2);\n    }\n  }\n\n  .side-pane-content {\n    padding: var(--theme-space-1) var(--theme-space-2);\n    overflow: auto;\n    height: 100%;\n    width: 100%;\n  }\n}\n\n:host(.not-visible) {\n  display: none;\n}\n\n:host(.inline-color) {\n  background-color: var(--theme-color-1);\n}\n\n:host(.box-shadow) {\n  box-shadow: 0 0 1rem black;\n}\n\n:host(.nav-left-border) {\n  border-left: var(--theme-app-header--border-width) solid var(--theme-color-weak-bdr);\n}\n\n:host(.left-pane-border) {\n  @include set-border(right);\n}\n\n:host(.right-pane-border) {\n  @include set-border(left);\n}\n\n:host(.top-pane-border) {\n  @include set-border(bottom);\n}\n\n:host(.bottom-pane-border) {\n  @include set-border(top);\n}\n\n:host(.mobile-overlay) {\n  width: 100%;\n  position: absolute;\n  z-index: 100 !important;\n\n  .side-pane-content {\n    height: calc(100% - 2.5rem);\n  }\n}\n\n:host(.mobile-border-top) {\n  @include set-border(bottom);\n}\n\n:host(.mobile-border-bottom) {\n  @include set-border(top);\n}\n\n:host(.top-expanded) {\n  top: 0;\n}\n\n:host(.bottom-expanded) {\n  bottom: 0;\n}\n\n:host(.left-right-pane) {\n  height: 100%;\n}\n\n:host(.top-bottom-pane) {\n  width: 100%;\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport Animation from '../utils/animation';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport { matchBreakpoint } from '../utils/breakpoints';\nimport {\n  iconClose,\n  iconDoubleChevronDown,\n  iconDoubleChevronLeft,\n  iconDoubleChevronRight,\n  iconDoubleChevronUp,\n} from '@siemens/ix-icons/icons';\n\nexport type Composition = 'top' | 'left' | 'bottom' | 'right';\nexport type ExpandedChangedEvent = {\n  slot: string;\n  expanded: boolean;\n};\nexport type SlotChangedEvent = {\n  slot: string;\n  newSlot: string;\n};\nexport type HideOnCollapseChangedEvent = {\n  slot: string;\n  hideOnCollapse: boolean;\n};\nexport type VariantChangedEvent = {\n  slot: string;\n  variant: 'floating' | 'inline';\n};\nexport type BorderlessChangedEvent = {\n  slot: string;\n  borderless: boolean;\n};\n\n@Component({\n  tag: 'ix-pane',\n  styleUrl: 'pane.scss',\n  shadow: true,\n})\nexport class Pane {\n  @Element() hostElement!: HTMLIxPaneElement;\n\n  /**\n   * Title of the side panel\n   */\n  @Prop() heading?: string;\n\n  /**\n   * Variant of the side pane.\n   * Defaults to the variant attribute of the pane layout. If used standalone it defaults to inline.\n   */\n  @Prop() variant: 'floating' | 'inline' = 'inline';\n\n  /**\n   * Define if the pane should have a collapsed state\n   */\n  @Prop() hideOnCollapse: boolean = false;\n\n  /**\n   * The maximum size of the sidebar, when it is expanded\n   */\n  @Prop() size:\n    | '240px'\n    | '320px'\n    | '360px'\n    | '480px'\n    | '600px'\n    | '33%'\n    | '50%' = '240px';\n\n  /**\n   * Toggle the border of the pane.\n   * Defaults to the borderless attribute of the pane layout. If used standalone it defaults to false.\n   */\n  @Prop() borderless: boolean = false;\n\n  /**\n   * State of the pane\n   */\n  @Prop({ mutable: true }) expanded: boolean = false;\n\n  /**\n   * Defines the position of the pane inside it's container.\n   * Inside a pane layout this property will automatically be set to the name of slot the pane is assigned to.\n   */\n  @Prop({ mutable: true }) composition: Composition = 'top';\n\n  /**\n   * Name of the icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * @internal\n   * Prevents overwriting of the variant and borderless property when used inside layout\n   */\n  @Prop() ignoreLayoutSettings: boolean = false;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true }) isMobile: boolean = false;\n\n  /**\n   * This event is triggered when the pane either expands or contracts\n   */\n  @Event() expandedChanged!: EventEmitter<ExpandedChangedEvent>;\n\n  /**\n   * This event is triggered when the variant of the pane is changed\n   */\n  @Event() variantChanged!: EventEmitter<VariantChangedEvent>;\n\n  /**\n   * This event is triggered when the variant of the pane is changed\n   */\n  @Event() borderlessChanged!: EventEmitter<BorderlessChangedEvent>;\n\n  /**\n   * @internal\n   */\n  @Event() hideOnCollapseChanged!: EventEmitter<HideOnCollapseChangedEvent>;\n\n  /**\n   * @internal\n   */\n  @Event() slotChanged!: EventEmitter<SlotChangedEvent>;\n\n  @State() private expandIcon = '';\n  @State() private showContent = false;\n  @State() private minimizeIcon = '';\n  @State() private floating = false;\n  @State() private parentWidthPx = 0;\n  @State() private parentHeightPx = 0;\n\n  private static readonly validPositions = ['top', 'left', 'bottom', 'right'];\n  private static readonly collapsedPane = '40px';\n  private static readonly collapsedPaneMobile = '48px';\n  private readonly animations: Map<string, anime.AnimeInstance> = new Map();\n  private animationCounter = 0;\n\n  private mutationObserver?: MutationObserver;\n  private resizeObserver?: ResizeObserver;\n\n  get currentSlot() {\n    return this.hostElement.getAttribute('slot');\n  }\n\n  get isBottomTopPane() {\n    return this.composition === 'bottom' || this.composition === 'top';\n  }\n\n  get isLeftRightPane() {\n    return this.composition === 'left' || this.composition === 'right';\n  }\n\n  get isMobileTop() {\n    return this.composition === 'top' || this.composition === 'left';\n  }\n\n  componentWillLoad() {\n    this.setIcons();\n\n    this.floating = this.variant === 'floating';\n\n    if (this.expanded) {\n      this.onParentSizeChange();\n    }\n\n    this.isMobile = matchBreakpoint('sm');\n    applicationLayoutService.onChange.on(() => {\n      this.isMobile = matchBreakpoint('sm');\n    });\n\n    if (this.currentSlot) {\n      this.setPosition(this.currentSlot);\n    }\n\n    this.mutationObserver = new MutationObserver((mutations) => {\n      mutations.forEach((mutation) => {\n        if (\n          mutation.type === 'attributes' &&\n          mutation.attributeName === 'slot'\n        ) {\n          const newSlot = this.currentSlot;\n          const oldSlot = mutation.oldValue;\n\n          if (newSlot !== oldSlot) {\n            this.slotChanged.emit({\n              slot: oldSlot ?? '',\n              newSlot: newSlot ?? '',\n            });\n\n            if (newSlot) {\n              this.setPosition(newSlot);\n            }\n          }\n        }\n      });\n    });\n    this.mutationObserver.observe(this.hostElement, {\n      attributes: true,\n      attributeOldValue: true,\n    });\n\n    const parentElement = this.hostElement.parentElement;\n    this.resizeObserver = new ResizeObserver((entries) => {\n      this.parentWidthPx = entries[0].borderBoxSize[0].inlineSize;\n      this.parentHeightPx = entries[0].borderBoxSize[0].blockSize;\n    });\n    if (parentElement) this.resizeObserver.observe(parentElement);\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n    this.resizeObserver?.disconnect();\n  }\n\n  private setPosition(value: string) {\n    if (Pane.validPositions.includes(value)) {\n      this.composition = value as Composition;\n    }\n  }\n\n  private getExpandPaneSize() {\n    let expandPaneSize: string;\n\n    if (this.isBottomTopPane) {\n      if (this.size.includes('px')) {\n        const referenceValue = Math.round(this.parentHeightPx / 2);\n        const currentValue = Number(this.size.replace('px', ''));\n\n        if (referenceValue && referenceValue < currentValue) {\n          expandPaneSize = `${referenceValue}px`;\n        } else {\n          expandPaneSize = `${currentValue}px`;\n        }\n      } else {\n        if (this.size === '50%') {\n          expandPaneSize = `${Math.round(this.parentHeightPx / 2)}px`;\n        } else {\n          expandPaneSize = `${Math.round(this.parentHeightPx / 3)}px`;\n        }\n      }\n    } else {\n      if (this.size.includes('px')) {\n        const referenceValue = Math.round(this.parentWidthPx / 2);\n        const currentValue = Number(this.size.replace('px', ''));\n\n        if (referenceValue && referenceValue < currentValue) {\n          expandPaneSize = `${referenceValue}px`;\n        } else {\n          expandPaneSize = `${currentValue}px`;\n        }\n      } else {\n        if (this.size === '50%') {\n          expandPaneSize = `${Math.round(this.parentWidthPx / 2)}px`;\n        } else {\n          expandPaneSize = `${Math.round(this.parentWidthPx / 3)}px`;\n        }\n      }\n    }\n\n    return expandPaneSize;\n  }\n\n  private setIcons() {\n    const { expandIcon, minimizeIcon } = this.getIconNames();\n    this.expandIcon = expandIcon;\n    this.minimizeIcon = minimizeIcon;\n  }\n\n  private getIconNames(): { expandIcon: string; minimizeIcon: string } {\n    let expandIcon = '';\n    let minimizeIcon = '';\n\n    switch (this.composition) {\n      case 'left':\n        expandIcon = this.isMobile\n          ? iconDoubleChevronUp\n          : iconDoubleChevronLeft;\n        minimizeIcon = this.isMobile\n          ? iconDoubleChevronDown\n          : iconDoubleChevronRight;\n        break;\n      case 'right':\n        expandIcon = this.isMobile\n          ? iconDoubleChevronDown\n          : iconDoubleChevronRight;\n        minimizeIcon = this.isMobile\n          ? iconDoubleChevronUp\n          : iconDoubleChevronLeft;\n        break;\n      case 'bottom':\n        expandIcon = iconDoubleChevronDown;\n        minimizeIcon = iconDoubleChevronUp;\n        break;\n      case 'top':\n        expandIcon = iconDoubleChevronUp;\n        minimizeIcon = iconDoubleChevronDown;\n        break;\n    }\n\n    return { expandIcon, minimizeIcon };\n  }\n\n  private getKey() {\n    return (this.animationCounter++).toString();\n  }\n\n  private animateVerticalFadeIn(size: string) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement,\n      duration: Animation.mediumTime,\n      width: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      begin: () => {\n        if (!this.expanded) {\n          this.showContent = false;\n          this.animateVerticalPadding('0px');\n        } else {\n          this.animateVerticalPadding('8px');\n        }\n      },\n      complete: () => {\n        if (this.expanded) {\n          this.showContent = true;\n        }\n\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private animateHorizontalFadeIn(size: string) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement,\n      duration: Animation.mediumTime,\n      height: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      begin: () => {\n        if (!this.expanded) {\n          this.showContent = false;\n          if (!this.isMobile) this.animateHorizontalPadding('0px');\n        } else {\n          if (!this.isMobile) this.animateHorizontalPadding('8px');\n        }\n      },\n      complete: () => {\n        if (this.expanded) {\n          this.showContent = true;\n        }\n\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private removePadding() {\n    anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: 0,\n      paddingTop: 0,\n      paddingBottom: 0,\n      paddingLeft: 0,\n      paddingRight: 0,\n      delay: 0,\n    });\n  }\n\n  private animateHorizontalPadding(\n    size: string,\n    duration = Animation.mediumTime\n  ) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: duration,\n      paddingTop: size,\n      paddingBottom: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      complete: () => {\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private animateVerticalPadding(\n    size: string,\n    duration = Animation.mediumTime\n  ) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: duration,\n      paddingLeft: size,\n      paddingRight: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      complete: () => {\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private clearAnimations() {\n    this.animations.forEach((animation) => animation.pause());\n    this.animations.clear();\n    this.animationCounter = 0;\n  }\n\n  @Watch('isMobile')\n  onMobileChange() {\n    this.setIcons();\n    this.hostElement.style.removeProperty('width');\n    this.hostElement.style.removeProperty('height');\n    this.hostElement.style.removeProperty('min-height');\n    this.onParentSizeChange();\n  }\n\n  @Watch('composition')\n  onPositionChange() {\n    this.setIcons();\n    this.hostElement.style.removeProperty('width');\n    this.hostElement.style.removeProperty('height');\n    this.onParentSizeChange();\n  }\n\n  @Watch('hideOnCollapse')\n  onHideOnCollapseChange(value: boolean) {\n    this.onParentSizeChange();\n\n    this.hideOnCollapseChanged.emit({\n      slot: this.currentSlot ?? '',\n      hideOnCollapse: value,\n    });\n  }\n\n  @Watch('variant')\n  onVariantChange(value: 'inline' | 'floating') {\n    this.floating = value === 'floating';\n\n    this.variantChanged.emit({\n      slot: this.currentSlot ?? '',\n      variant: value,\n    });\n  }\n\n  @Watch('borderless')\n  onBorderlessChange(value: boolean) {\n    this.borderlessChanged.emit({\n      slot: this.currentSlot ?? '',\n      borderless: value,\n    });\n  }\n\n  private dispatchExpandedChangedEvent() {\n    const event = this.expandedChanged.emit({\n      slot: this.currentSlot ?? '',\n      expanded: !this.expanded,\n    });\n\n    if (!event.defaultPrevented) {\n      this.expanded = !this.expanded;\n    }\n  }\n\n  @Watch('parentHeightPx')\n  @Watch('parentWidthPx')\n  onParentSizeChange() {\n    this.clearAnimations();\n    this.removePadding();\n\n    if (this.expanded) {\n      if (this.isMobile) {\n        this.hostElement.style.height = '100%';\n      } else {\n        const expandPaneSize = this.getExpandPaneSize();\n\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = expandPaneSize;\n          this.animateHorizontalPadding('8px', 0);\n        } else {\n          this.hostElement.style.width = expandPaneSize;\n          this.animateVerticalPadding('8px', 0);\n        }\n      }\n\n      this.showContent = true;\n    } else {\n      this.showContent = false;\n\n      if (this.isMobile) {\n        this.hostElement.style.height = this.hideOnCollapse\n          ? '0'\n          : Pane.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n        }\n      }\n    }\n  }\n\n  @Watch('expanded')\n  @Watch('size')\n  onSizeChange() {\n    if (this.expanded) {\n      if (this.isMobile) {\n        this.hostElement.style.minHeight = this.hideOnCollapse\n          ? '0'\n          : Pane.collapsedPaneMobile;\n        this.animateHorizontalFadeIn('100%');\n      } else {\n        const expandPaneSize = this.getExpandPaneSize();\n\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n          this.animateHorizontalFadeIn(expandPaneSize);\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n          this.animateVerticalFadeIn(expandPaneSize);\n        }\n      }\n    } else {\n      this.showContent = false;\n\n      if (this.isMobile) {\n        this.hostElement.style.height = Pane.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.animateHorizontalFadeIn(Pane.collapsedPane);\n        } else {\n          this.animateVerticalFadeIn(Pane.collapsedPane);\n        }\n      }\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'inline-color': !this.floating,\n          'mobile-overlay': this.expanded && this.isMobile,\n          'top-expanded': this.expanded && this.isMobileTop && this.isMobile,\n          'bottom-expanded':\n            this.expanded && !this.isMobileTop && this.isMobile,\n          'top-bottom-pane': this.isBottomTopPane && !this.isMobile,\n          'left-right-pane': this.isLeftRightPane && !this.isMobile,\n          [`${this.composition}-pane-border`]:\n            !this.borderless && !this.isMobile && !this.floating,\n          'nav-left-border':\n            !this.borderless &&\n            !this.isMobile &&\n            this.composition !== 'right' &&\n            this.floating,\n          'mobile-border-top':\n            !this.borderless &&\n            this.isMobileTop &&\n            this.isMobile &&\n            !this.expanded &&\n            !this.floating,\n          'mobile-border-bottom':\n            !this.borderless &&\n            !this.isMobileTop &&\n            this.isMobile &&\n            !this.expanded &&\n            !this.floating,\n          'box-shadow': this.floating,\n          'aria-expanded': this.expanded,\n          'not-visible': this.hideOnCollapse && !this.expanded,\n        }}\n      >\n        <aside\n          id={`pane-${this.composition}`}\n          class={{\n            'top-bottom-pane': this.isBottomTopPane && !this.isMobile,\n            'left-right-pane': this.isLeftRightPane && !this.isMobile,\n            'mobile-pane': this.isMobile,\n            expanded: this.expanded,\n          }}\n        >\n          <div\n            id=\"title-div\"\n            class={{\n              title:\n                !this.isMobile && !this.hideOnCollapse && !this.showContent,\n              'title-finished':\n                !this.isMobile && !this.hideOnCollapse && this.showContent,\n              'title-expanded':\n                !this.isMobile && !this.hideOnCollapse && this.expanded,\n              'title-hide-on-collapse': !this.isMobile && this.hideOnCollapse,\n              'title-mobile': this.isMobile,\n              'header-gap': !this.isMobile && !this.hideOnCollapse,\n            }}\n          >\n            <ix-icon-button\n              class=\"title-icon\"\n              size=\"24\"\n              icon={\n                this.expanded\n                  ? this.isMobile || this.hideOnCollapse\n                    ? iconClose\n                    : this.expandIcon\n                  : this.minimizeIcon\n              }\n              ghost\n              onClick={() => this.dispatchExpandedChangedEvent()}\n              aria-controls={`pane-${this.composition}`}\n            />\n            <span\n              class={{\n                'title-text': true,\n                rotate:\n                  !this.expanded && !this.isMobile && this.isLeftRightPane,\n              }}\n            >\n              {this.icon ? (\n                <ix-icon size=\"24\" name={this.icon}></ix-icon>\n              ) : null}\n              <div class=\"title-text-overflow\">\n                <ix-typography format=\"h4\">{this.heading}</ix-typography>\n              </div>\n            </span>\n          </div>\n          <div class=\"side-pane-content\" hidden={!this.showContent}>\n            <slot></slot>\n          </div>\n        </aside>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-6de38c2a.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as i,g as s}from"./p-BNpBEtDH.js";import{H as r}from"./p-DHml78Yc.js";import{m as a}from"./p-bcj7UEIC.js";const o=":host{display:inline-block;position:relative}:host .checkbox-container{display:flex;flex-direction:column;gap:1rem;margin:0.375rem 0;flex-wrap:wrap}:host .checkbox-container.row-layout{flex-direction:row}";var l=undefined&&undefined.__decorate||function(e,t,i,s){var r=arguments.length,a=r<3?t:s===null?s=Object.getOwnPropertyDescriptor(t,i):s,o;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")a=Reflect.decorate(e,t,i,s);else for(var l=e.length-1;l>=0;l--)if(o=e[l])a=(r<3?o(a):r>3?o(t,i,a):o(t,i))||a;return r>3&&a&&Object.defineProperty(t,i,a),a};const c=class{constructor(t){e(this,t);this.direction="column";this.showTextAsTooltip=false;this.required=false;this.isInvalid=false;this.isInfo=false;this.isValid=false;this.isWarning=false;this.touched=false;this.groupRef=a();this.observer=new MutationObserver((()=>{this.checkForRequiredCheckbox()}))}get checkboxElements(){return Array.from(this.hostElement.querySelectorAll("ix-checkbox"))}checkForRequiredCheckbox(){this.required=this.checkboxElements.some((e=>e.required))}connectedCallback(){this.observer.observe(this.hostElement,{childList:true,subtree:true,attributes:true,attributeFilter:["checked","required"]})}componentWillLoad(){this.checkForRequiredCheckbox()}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}onClassFieldUpdate({isInvalid:e,isInvalidByRequired:t,isInfo:i,isValid:s,isWarning:r}){this.isInvalid=e||t;this.isInfo=i;this.isValid=s;this.isWarning=r}isTouched(){return Promise.resolve(this.touched)}hasValidValue(){return Promise.resolve(this.checkboxElements.some((e=>e.checked)))}render(){return t(i,{key:"77b87f092dc2a4d95adbd496cbbbc22eb0c923c3",ref:this.groupRef,onIxBlur:()=>this.touched=true},t("ix-field-wrapper",{key:"b0a0db7727ff7bd6cd554a8ef14afea3ed4ff46a",label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,validText:this.validText,warningText:this.warningText,showTextAsTooltip:this.showTextAsTooltip,isInvalid:this.isInvalid,isInfo:this.isInfo,isValid:this.isValid,isWarning:this.isWarning,controlRef:this.groupRef},t("div",{key:"7bcf7ecacfe94c995a335f72b78f01f554a3d469",class:{"checkbox-container":true,"row-layout":this.direction==="row"}},t("slot",{key:"416117ca60b21153342224b27261faa3f81f87a2"}))))}get hostElement(){return s(this)}};l([r({includeChildren:true})],c.prototype,"onClassFieldUpdate",null);c.style=o;export{c as ix_checkbox_group};
+//# sourceMappingURL=p-6de38c2a.entry.js.map

package/dist/siemens-ix/p-6de38c2a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["checkboxGroupCss","CheckboxGroup","constructor","hostRef","this","direction","showTextAsTooltip","required","isInvalid","isInfo","isValid","isWarning","touched","groupRef","makeRef","observer","MutationObserver","checkForRequiredCheckbox","checkboxElements","Array","from","hostElement","querySelectorAll","some","checkbox","connectedCallback","observe","childList","subtree","attributes","attributeFilter","componentWillLoad","disconnectedCallback","disconnect","onClassFieldUpdate","isInvalidByRequired","isTouched","Promise","resolve","hasValidValue","checked","render","h","Host","key","ref","onIxBlur","label","helperText","invalidText","infoText","validText","warningText","controlRef","class","__decorate","HookValidationLifecycle","includeChildren","prototype"],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ix-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  .checkbox-container {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n    margin: 0.375rem 0;\n    flex-wrap: wrap;\n\n    &.row-layout {\n      flex-direction: row;\n    }\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Method,\n  Prop,\n  State,\n  h,\n} from '@stencil/core';\nimport {\n  FieldWrapperInterface,\n  HookValidationLifecycle,\n  IxFormValidationState,\n  ValidationResults,\n} from '../utils/input';\nimport { IxComponent } from '../utils/internal';\nimport { makeRef } from '../utils/make-ref';\n\n/**\n * @form-ready\n */\n@Component({\n  tag: 'ix-checkbox-group',\n  styleUrl: 'checkbox-group.scss',\n  shadow: true,\n})\nexport class CheckboxGroup\n  implements FieldWrapperInterface, IxFormValidationState, IxComponent\n{\n  @Element() hostElement!: HTMLIxCheckboxGroupElement;\n  /**\n   * Optional helper text displayed below the checkbox group\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * Label for the checkbox group\n   */\n  @Prop() label?: string;\n\n  /**\n   * Alignment of the checkboxes in the group\n   */\n  @Prop() direction: 'row' | 'column' = 'column';\n\n  /**\n   * Error text for the checkbox group\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * Info text for the checkbox group\n   */\n  @Prop() infoText?: string;\n  /**\n   * Valid text for the checkbox group\n   */\n  @Prop() validText?: string;\n  /**\n   * Warning text for the checkbox group\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * Show helper, info, warning, error and valid text as tooltip\n   */\n  @Prop() showTextAsTooltip = false;\n\n  /**\n   * @internal\n   */\n  @Prop() required = false;\n\n  @State() isInvalid = false;\n  @State() isInfo = false;\n  @State() isValid = false;\n  @State() isWarning = false;\n\n  private touched = false;\n  private readonly groupRef = makeRef<HTMLIxCheckboxGroupElement>();\n\n  get checkboxElements(): HTMLIxCheckboxElement[] {\n    return Array.from(this.hostElement.querySelectorAll('ix-checkbox'));\n  }\n\n  private readonly observer = new MutationObserver(() => {\n    this.checkForRequiredCheckbox();\n  });\n\n  private checkForRequiredCheckbox() {\n    this.required = this.checkboxElements.some((checkbox) => checkbox.required);\n  }\n\n  connectedCallback(): void {\n    this.observer.observe(this.hostElement, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      attributeFilter: ['checked', 'required'],\n    });\n  }\n\n  componentWillLoad(): void | Promise<void> {\n    this.checkForRequiredCheckbox();\n  }\n\n  disconnectedCallback(): void {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  @HookValidationLifecycle({\n    includeChildren: true,\n  })\n  onClassFieldUpdate({\n    isInvalid,\n    isInvalidByRequired,\n    isInfo,\n    isValid,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  /**\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  /**\n   * @internal\n   */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(\n      this.checkboxElements.some((checkbox) => checkbox.checked)\n    );\n  }\n\n  render() {\n    return (\n      <Host ref={this.groupRef} onIxBlur={() => (this.touched = true)}>\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          validText={this.validText}\n          warningText={this.warningText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isInfo={this.isInfo}\n          isValid={this.isValid}\n          isWarning={this.isWarning}\n          controlRef={this.groupRef}\n        >\n          <div\n            class={{\n              'checkbox-container': true,\n              'row-layout': this.direction === 'row',\n            }}\n          >\n            <slot></slot>\n          </div>\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"mappings":"iIAAA,MAAMA,EAAmB,+M,iXC0BZC,EAAa,MAL1B,WAAAC,CAAAC,G,UAsBUC,KAASC,UAAqB,SAuB9BD,KAAiBE,kBAAG,MAKpBF,KAAQG,SAAG,MAEVH,KAASI,UAAG,MACZJ,KAAMK,OAAG,MACTL,KAAOM,QAAG,MACVN,KAASO,UAAG,MAEbP,KAAOQ,QAAG,MACDR,KAAQS,SAAGC,IAMXV,KAAAW,SAAW,IAAIC,kBAAiB,KAC/CZ,KAAKa,0BAA0B,GAyFlC,CA9FC,oBAAIC,GACF,OAAOC,MAAMC,KAAKhB,KAAKiB,YAAYC,iBAAiB,e,CAO9C,wBAAAL,GACNb,KAAKG,SAAWH,KAAKc,iBAAiBK,MAAMC,GAAaA,EAASjB,U,CAGpE,iBAAAkB,GACErB,KAAKW,SAASW,QAAQtB,KAAKiB,YAAa,CACtCM,UAAW,KACXC,QAAS,KACTC,WAAY,KACZC,gBAAiB,CAAC,UAAW,a,CAIjC,iBAAAC,GACE3B,KAAKa,0B,CAGP,oBAAAe,GACE,GAAI5B,KAAKW,SAAU,CACjBX,KAAKW,SAASkB,Y,EAOlB,kBAAAC,EAAmB1B,UACjBA,EAAS2B,oBACTA,EAAmB1B,OACnBA,EAAMC,QACNA,EAAOC,UACPA,IAEAP,KAAKI,UAAYA,GAAa2B,EAC9B/B,KAAKK,OAASA,EACdL,KAAKM,QAAUA,EACfN,KAAKO,UAAYA,C,CAOnB,SAAAyB,GACE,OAAOC,QAAQC,QAAQlC,KAAKQ,Q,CAO9B,aAAA2B,GACE,OAAOF,QAAQC,QACblC,KAAKc,iBAAiBK,MAAMC,GAAaA,EAASgB,U,CAItD,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,IAAKzC,KAAKS,SAAUiC,SAAU,IAAO1C,KAAKQ,QAAU,MACxD8B,EAAA,oBAAAE,IAAA,2CACEG,MAAO3C,KAAK2C,MACZC,WAAY5C,KAAK4C,WACjBC,YAAa7C,KAAK6C,YAClBC,SAAU9C,KAAK8C,SACfC,UAAW/C,KAAK+C,UAChBC,YAAahD,KAAKgD,YAClB9C,kBAAmBF,KAAKE,kBACxBE,UAAWJ,KAAKI,UAChBC,OAAQL,KAAKK,OACbC,QAASN,KAAKM,QACdC,UAAWP,KAAKO,UAChB0C,WAAYjD,KAAKS,UAEjB6B,EAAA,OAAAE,IAAA,2CACEU,MAAO,CACL,qBAAsB,KACtB,aAAclD,KAAKC,YAAc,QAGnCqC,EAAA,QAAAE,IAAA,+C,oCAtDVW,EAAA,CAHCC,EAAwB,CACvBC,gBAAiB,QAalBxD,EAAAyD,UAAA,2B","ignoreList":[]}

package/dist/siemens-ix/{p-34ff567f.entry.js → p-70cbacb8.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as e,h as t,H as r}from"./p-BNpBEtDH.js";import{D as n}from"./p-bDicGJUN.js";import{L as a,q as i,M as l,h as d}from"./p-CrTP-icT.js";const s='input{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}textarea{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea[type=number]{text-align:right}textarea[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea{min-height:2rem;height:3.25rem;padding:calc(0.375rem - var(--theme-input--border-thickness)) calc(0.5rem - var(--theme-input--border-thickness))}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:block;position:relative;width:21rem}: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 .ix-form-control,:host .ix-form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}:host .ix-form-control::-moz-placeholder,:host .ix-form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}:host .ix-form-control::placeholder,:host .ix-form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .ix-form-control:focus-visible{color:var(--theme-input--color)}:host .ix-form-control[type=number]{text-align:right}:host .ix-form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}:host .ix-form-control.readonly,:host .ix-form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}:host .ix-form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .ix-form-control:read-only,:host .ix-form-control[readonly],:host .ix-form-control[readOnly],:host .ix-form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .ix-form-control:read-only::-moz-placeholder,:host .ix-form-control[readonly]::-moz-placeholder,:host .ix-form-control[readOnly]::-moz-placeholder,:host .ix-form-control.readonly::-moz-placeholder{color:transparent}:host .ix-form-control:-moz-read-only::placeholder{color:transparent}:host .ix-form-control:read-only::placeholder,:host .ix-form-control[readonly]::placeholder,:host .ix-form-control[readOnly]::placeholder,:host .ix-form-control.readonly::placeholder{color:transparent}:host .ix-form-control:disabled,:host .ix-form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}:host .ix-form-control:disabled::-moz-placeholder,:host .ix-form-control.disabled::-moz-placeholder{color:transparent}:host .ix-form-control:disabled::placeholder,:host .ix-form-control.disabled::placeholder{color:transparent}:host .ix-form-control-plaintext{outline:0}:host .form-group{position:relative}:host .input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}:host .input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}:host .input-wrapper>input{padding-inline-start:2.2rem}:host select.ix-form-control{padding:0 0.312rem}:host textarea.ix-form-control{padding:0.375rem 0.5rem}:host input.ix-form-control.disabled,:host input.ix-form-control:disabled{color:var(--theme-input--color--disabled)}:host input.ix-form-control:-moz-read-only{cursor:default}:host input.ix-form-control:read-only,:host input.ix-form-control.readonly{cursor:default}@media (max-width: 576px){:host .clock{padding:1.5rem 0 1rem 0}:host .header{height:1.5rem !important}}@media (min-width: 576px){:host .clock{padding:4.25rem 0 3.75rem 0}:host .header{height:2.5rem !important}}:host .header{display:flex;align-items:center;justify-content:center;height:2.5rem}:host .flex{display:flex}:host .clock{display:flex;justify-content:center;align-items:center}:host input,:host .time-reference{width:2.625rem;height:1.5rem;text-align:center;margin-top:0.25rem;margin-bottom:0.25rem;}:host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button,:host .time-reference::-webkit-outer-spin-button,:host .time-reference::-webkit-inner-spin-button{-webkit-appearance:none;margin:0 0.3125rem}:host input[type=number],:host .time-reference[type=number]{-moz-appearance:textfield}:host .ix-form-control[type=number]{text-align:center}:host .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around}:host .column-seperator{display:flex;align-items:center;margin:0 0.25rem}:host .button{display:flex;justify-content:flex-end}:host .button.standalone{padding-top:0.5rem}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}:host .hidden{display:none}:host .time-reference{margin-top:0.5rem;margin-bottom:0.5rem}';const c=class{constructor(t){o(this,t);this.timeSelect=e(this,"timeSelect",7);this.timeChange=e(this,"timeChange",7);this.format="TT";this.corners="rounded";this.standaloneAppearance=true;this.showHour=true;this.showMinutes=true;this.showSeconds=true;this.time=n.now().toFormat(this.format);this.textSelectTime="Done";this.textTime="Time"}watchTimePropHandler(o){this._time=n.fromFormat(o,this.format);if(!this._time.isValid){throw new Error("Format is not supported or not correct")}}componentWillLoad(){this._time=n.fromFormat(this.time,this.format);if(!this._time.isValid){console.error(`Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`);return}this._timeRef=this.format.includes("a")?n.fromFormat(this.time,this.format).toFormat("a"):undefined;this.formatTime()}formatTime(){if(!this._time){return}const[o,e,t]=this._time.toFormat(this.format).split(" ")[0].split(":");this._formattedTime={hour:o,minute:e,second:t}}onInternalTimeChange(){var o,e;this.timeChange.emit((o=this._time)===null||o===void 0?void 0:o.toFormat(this.format));if(this._timeRef)this._timeRef=(e=this._time)===null||e===void 0?void 0:e.toFormat("a")}timeUpdate(o,e){var t;let r=n.now().endOf("day").get(o);if(this._timeRef==="PM"&&o==="hour")e+=12;if(this._timeRef==="AM"&&o==="hour")r=12;if(e>r){e=r}else if(e<0){e=0}this._time=(t=this._time)===null||t===void 0?void 0:t.set({[o]:e});return e}changeTimeReference(){var o,e;this._timeRef=this._timeRef==="AM"?"PM":"AM";if(!((o=this._time)===null||o===void 0?void 0:o.toFormat("a").includes(this._timeRef))){this._time=(e=this._time)===null||e===void 0?void 0:e.plus({hour:12})}}async getCurrentTime(){var o;return(o=this._time)===null||o===void 0?void 0:o.toFormat(this.format)}render(){let o=[{unit:"hour",placeholder:"HH",hidden:!this.showHour},{unit:"minute",placeholder:"MM",hidden:!this.showMinutes},{unit:"second",placeholder:"SS",hidden:!this.showSeconds}];o=o.filter((o=>!o.hidden));return t(r,{key:"3324e541eaee13441527be68f301725504662914"},t("ix-date-time-card",{key:"5cca6cc594555537fabb7559fa772f0108288f02",standaloneAppearance:this.standaloneAppearance,corners:this.corners},t("div",{key:"23dd6dbf7b2ce70d43ac1175e7142732561e4a4c",class:"header",slot:"header"},t("ix-typography",{key:"e3357692be47ce40ed0082febf7d2c0e7ce25749",format:"h5"},this.textTime||"Time")),t("div",{key:"a1b0ccb5870ee7f3bb06ccb0b1d3c24c7df3c892",class:"clock"},o.map(((e,r)=>t("div",{class:"flex"},t("div",{class:{columns:true,hidden:e.hidden}},t("ix-icon-button",{size:"16",onClick:()=>{var o;return this._time=(o=this._time)===null||o===void 0?void 0:o.plus({[e.unit]:1})},ghost:true,icon:a,variant:"primary",class:"arrows"}),t("input",{class:"ix-form-control",name:e.unit,type:"number",placeholder:e.placeholder,value:this._formattedTime?this._formattedTime[e.unit]:"",onKeyDown:o=>{var t;if(o.key!=="ArrowUp"&&o.key!=="ArrowDown")return;const r=o.key==="ArrowUp"?1:-1;this._time=(t=this._time)===null||t===void 0?void 0:t.plus({[e.unit]:r});o.preventDefault()},onChange:o=>{let t=o.target;t.value=this.timeUpdate(e.unit,+t.value).toString()}}),t("ix-icon-button",{size:"16",onClick:()=>{var o;return this._time=(o=this._time)===null||o===void 0?void 0:o.minus({[e.unit]:1})},ghost:true,icon:i,variant:"primary",class:"arrows"})),r!==o.length-1&&t("div",{class:{"column-seperator":true,hidden:e.hidden}},":")))),t("div",{key:"cc807c62c8d7f1a6d4d45c1460cdf5f25afdffd6",class:{columns:true,"default-space":true,hidden:this._timeRef===undefined}},t("ix-icon-button",{key:"80fd8ec8d709cfadff53f09b0d2d047e242568a0",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:l,variant:"primary",class:"arrows"}),t("div",{key:"e7d47e9686c937fc83c614176e0722885d7c2b55",class:"time-reference"},this._timeRef),t("ix-icon-button",{key:"7ca882f6dae9cae2bc180b79eff475a7c1ac944f",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:d,variant:"primary",class:"arrows"}))),t("div",{key:"63e6c67d7116d607b5b5635f7f47dec23978c126",class:{button:true,hidden:!this.standaloneAppearance,standalone:true}},t("ix-button",{key:"382a7d16a98d76b8687d0e84ecf8efaaa21a6d06",onClick:()=>{var o;this.timeSelect.emit((o=this._time)===null||o===void 0?void 0:o.toFormat(this.format))}},this.textSelectTime))))}static get watchers(){return{time:["watchTimePropHandler"],_time:["formatTime","onInternalTimeChange"]}}};c.style=s;export{c as ix_time_picker};
-//# sourceMappingURL=p-34ff567f.entry.js.map
+import{r as o,c as e,h as t,H as r}from"./p-BNpBEtDH.js";import{D as n}from"./p-bDicGJUN.js";import{L as a,q as i,M as l,h as d}from"./p-CrTP-icT.js";const s='input{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}textarea{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea[type=number]{text-align:right}textarea[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea{min-height:2rem;height:3.25rem;padding:calc(0.375rem - var(--theme-input--border-thickness)) calc(0.5rem - var(--theme-input--border-thickness))}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:block;position:relative;width:21rem}: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 .ix-form-control,:host .ix-form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}:host .ix-form-control::-moz-placeholder,:host .ix-form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}:host .ix-form-control::placeholder,:host .ix-form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .ix-form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .ix-form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .ix-form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .ix-form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .ix-form-control:focus-visible{color:var(--theme-input--color)}:host .ix-form-control[type=number]{text-align:right}:host .ix-form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}:host .ix-form-control.readonly,:host .ix-form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}:host .ix-form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .ix-form-control:read-only,:host .ix-form-control[readonly],:host .ix-form-control[readOnly],:host .ix-form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .ix-form-control:read-only::-moz-placeholder,:host .ix-form-control[readonly]::-moz-placeholder,:host .ix-form-control[readOnly]::-moz-placeholder,:host .ix-form-control.readonly::-moz-placeholder{color:transparent}:host .ix-form-control:-moz-read-only::placeholder{color:transparent}:host .ix-form-control:read-only::placeholder,:host .ix-form-control[readonly]::placeholder,:host .ix-form-control[readOnly]::placeholder,:host .ix-form-control.readonly::placeholder{color:transparent}:host .ix-form-control:disabled,:host .ix-form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}:host .ix-form-control:disabled::-moz-placeholder,:host .ix-form-control.disabled::-moz-placeholder{color:transparent}:host .ix-form-control:disabled::placeholder,:host .ix-form-control.disabled::placeholder{color:transparent}:host .ix-form-control-plaintext{outline:0}:host .form-group{position:relative}:host .input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}:host .input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}:host .input-wrapper>input{padding-inline-start:2.2rem}:host select.ix-form-control{padding:0 0.312rem}:host textarea.ix-form-control{padding:0.375rem 0.5rem}:host input.ix-form-control.disabled,:host input.ix-form-control:disabled{color:var(--theme-input--color--disabled)}:host input.ix-form-control:-moz-read-only{cursor:default}:host input.ix-form-control:read-only,:host input.ix-form-control.readonly{cursor:default}@media (max-width: 576px){:host .clock{padding:1.5rem 0 1rem 0}:host .header{height:1.5rem !important}}@media (min-width: 576px){:host .clock{padding:4.25rem 0 3.75rem 0}:host .header{height:2.5rem !important}}:host .header{display:flex;align-items:center;justify-content:center;height:2.5rem}:host .flex{display:flex}:host .clock{display:flex;justify-content:center;align-items:center}:host input,:host .time-reference{width:2.625rem;height:1.5rem;text-align:center;margin-top:0.25rem;margin-bottom:0.25rem;}:host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button,:host .time-reference::-webkit-outer-spin-button,:host .time-reference::-webkit-inner-spin-button{-webkit-appearance:none;margin:0 0.3125rem}:host input[type=number],:host .time-reference[type=number]{-moz-appearance:textfield}:host .ix-form-control[type=number]{text-align:center}:host .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around}:host .column-seperator{display:flex;align-items:center;margin:0 0.25rem}:host .button{display:flex;justify-content:flex-end}:host .button.standalone{padding-top:0.5rem}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}:host .hidden{display:none}:host .time-reference{margin-top:0.5rem;margin-bottom:0.5rem}';const c=class{constructor(t){o(this,t);this.timeSelect=e(this,"timeSelect",7);this.timeChange=e(this,"timeChange",7);this.format="TT";this.corners="rounded";this.standaloneAppearance=true;this.showHour=true;this.showMinutes=true;this.showSeconds=true;this.time=n.now().toFormat(this.format);this.textSelectTime="Done";this.textTime="Time"}watchTimePropHandler(o){this._time=n.fromFormat(o,this.format);if(!this._time.isValid){throw new Error("Format is not supported or not correct")}}componentWillLoad(){this._time=n.fromFormat(this.time,this.format);if(!this._time.isValid){console.error(`Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`);return}this._timeRef=this.format.includes("a")?n.fromFormat(this.time,this.format).toFormat("a"):undefined;this.formatTime()}formatTime(){if(!this._time){return}const[o,e,t]=this._time.toFormat(this.format).split(" ")[0].split(":");this._formattedTime={hour:o,minute:e,second:t}}onInternalTimeChange(){var o,e;this.timeChange.emit((o=this._time)===null||o===void 0?void 0:o.toFormat(this.format));if(this._timeRef)this._timeRef=(e=this._time)===null||e===void 0?void 0:e.toFormat("a")}timeUpdate(o,e){var t;let r=n.now().endOf("day").get(o);if(this._timeRef==="PM"&&o==="hour")e+=12;if(this._timeRef==="AM"&&o==="hour")r=12;if(e>r){e=r}else if(e<0){e=0}this._time=(t=this._time)===null||t===void 0?void 0:t.set({[o]:e});return e}changeTimeReference(){var o,e;this._timeRef=this._timeRef==="AM"?"PM":"AM";if(!((o=this._time)===null||o===void 0?void 0:o.toFormat("a").includes(this._timeRef))){this._time=(e=this._time)===null||e===void 0?void 0:e.plus({hour:12})}}async getCurrentTime(){var o;return(o=this._time)===null||o===void 0?void 0:o.toFormat(this.format)}render(){let o=[{unit:"hour",placeholder:"HH",hidden:!this.showHour},{unit:"minute",placeholder:"MM",hidden:!this.showMinutes},{unit:"second",placeholder:"SS",hidden:!this.showSeconds}];o=o.filter((o=>!o.hidden));return t(r,{key:"e88bc5d942730fa74a70bfaa04ea0658be50692b"},t("ix-date-time-card",{key:"720c83b1a2711c1e27b445d361ae5ddead39b49d",standaloneAppearance:this.standaloneAppearance,corners:this.corners},t("div",{key:"9916f41e86163d411496bf98bc2295e579b8bbdf",class:"header",slot:"header"},t("ix-typography",{key:"dfb71fb42d5f848c79c2cda7a0d9a9a0379c1783",format:"h5"},this.textTime||"Time")),t("div",{key:"18354a0657a181ba08c5b861641259493d914922",class:"clock"},o.map(((e,r)=>t("div",{class:"flex"},t("div",{class:{columns:true,hidden:e.hidden}},t("ix-icon-button",{size:"16",onClick:()=>{var o;return this._time=(o=this._time)===null||o===void 0?void 0:o.plus({[e.unit]:1})},ghost:true,icon:a,variant:"primary",class:"arrows"}),t("input",{class:"ix-form-control",name:e.unit,type:"number",placeholder:e.placeholder,value:this._formattedTime?this._formattedTime[e.unit]:"",onKeyDown:o=>{var t;if(o.key!=="ArrowUp"&&o.key!=="ArrowDown")return;const r=o.key==="ArrowUp"?1:-1;this._time=(t=this._time)===null||t===void 0?void 0:t.plus({[e.unit]:r});o.preventDefault()},onChange:o=>{let t=o.target;t.value=this.timeUpdate(e.unit,+t.value).toString()}}),t("ix-icon-button",{size:"16",onClick:()=>{var o;return this._time=(o=this._time)===null||o===void 0?void 0:o.minus({[e.unit]:1})},ghost:true,icon:i,variant:"primary",class:"arrows"})),r!==o.length-1&&t("div",{class:{"column-seperator":true,hidden:e.hidden}},":")))),t("div",{key:"a2f591181b00b98848238267e49399b66c8f6f38",class:{columns:true,"default-space":true,hidden:this._timeRef===undefined}},t("ix-icon-button",{key:"fb3e96cf66d0a9e7b6946b901ee395185c8bae24",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:l,variant:"primary",class:"arrows"}),t("div",{key:"196388fb7200fe812e5de8dcd0d45746f655e69e",class:"time-reference"},this._timeRef),t("ix-icon-button",{key:"4930ff7fab12df13685d35fdf3cdd669d023e937",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:d,variant:"primary",class:"arrows"}))),t("div",{key:"5d9b76e8f7047e9a550b5d86391f2e9f3bd0f434",class:{button:true,hidden:!this.standaloneAppearance,standalone:true}},t("ix-button",{key:"135b0d00c830734b46bd94fc1d69e044e679edaf",onClick:()=>{var o;this.timeSelect.emit((o=this._time)===null||o===void 0?void 0:o.toFormat(this.format))}},this.textSelectTime))))}static get watchers(){return{time:["watchTimePropHandler"],_time:["formatTime","onInternalTimeChange"]}}};c.style=s;export{c as ix_time_picker};
+//# sourceMappingURL=p-70cbacb8.entry.js.map

package/dist/siemens-ix/p-70cbacb8.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["timePickerCss","TimePicker","constructor","hostRef","this","format","corners","standaloneAppearance","showHour","showMinutes","showSeconds","time","DateTime","now","toFormat","textSelectTime","textTime","watchTimePropHandler","newValue","_time","fromFormat","isValid","Error","componentWillLoad","console","error","invalidReason","invalidExplanation","_timeRef","includes","undefined","formatTime","hour","minute","second","split","_formattedTime","onInternalTimeChange","timeChange","emit","_a","_b","timeUpdate","unit","value","maxValue","endOf","get","set","changeTimeReference","plus","getCurrentTime","render","timepickerInformation","placeholder","hidden","filter","item","h","Host","key","class","slot","map","descriptor","index","columns","size","onClick","ghost","icon","iconChevronUpSmall","variant","name","type","onKeyDown","e","preventDefault","onChange","inputElement","target","toString","minus","iconChevronDownSmall","length","iconChevronUp","iconChevronDown","button","standalone","timeSelect"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-picker.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@import 'mixins/input';\n\n@include form;\n\n:host {\n  @include ix-component;\n  @import 'legacy/components/forms';\n\n  display: block;\n  position: relative;\n  width: 21rem;\n\n  @media (max-width: 576px) {\n    .clock {\n      padding: 1.5rem 0 1rem 0;\n    }\n\n    .header {\n      height: $medium-control-height !important;\n    }\n  }\n\n  @media (min-width: 576px) {\n    .clock {\n      padding: 4.25rem 0 3.75rem 0;\n    }\n\n    .header {\n      height: $large-control-height !important;\n    }\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: $large-control-height;\n  }\n\n  .flex {\n    display: flex;\n  }\n\n  .clock {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  input,\n  .time-reference {\n    width: 2.625rem;\n    height: $large-space;\n    text-align: center;\n    margin-top: 0.25rem;\n    margin-bottom: 0.25rem;\n\n    /* Chrome, Safari, Edge, Opera */\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0 0.3125rem;\n    }\n\n    /* Firefox */\n    &[type='number'] {\n      -moz-appearance: textfield;\n    }\n  }\n\n  .ix-form-control[type='number'] {\n    text-align: center;\n  }\n\n  .columns {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: space-around;\n  }\n\n  .column-seperator {\n    display: flex;\n    align-items: center;\n    margin: 0 $tiny-space;\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n\n    &.standalone {\n      padding-top: 0.5rem;\n    }\n  }\n\n  .default-space {\n    margin-left: $default-space;\n  }\n\n  .text-align {\n    text-align: center;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .time-reference {\n    margin-top: 0.5rem;\n    margin-bottom: 0.5rem;\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  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\nimport {\n  iconChevronDown,\n  iconChevronDownSmall,\n  iconChevronUp,\n  iconChevronUpSmall,\n} from '@siemens/ix-icons/icons';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ninterface TimePickerDescriptor {\n  unit: 'hour' | 'minute' | 'second';\n  placeholder: string;\n  hidden: boolean;\n}\n\ninterface TimeOutputFormat {\n  hour: string;\n  minute: string;\n  second: string;\n}\n\n@Component({\n  tag: 'ix-time-picker',\n  styleUrl: 'time-picker.scss',\n  shadow: true,\n})\nexport class TimePicker {\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  @Prop() format: string = 'TT';\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: TimePickerCorners = 'rounded';\n\n  /**\n   * Controls the visual presentation and styling of the component when it is displayed as a standalone element\n   */\n  @Prop() standaloneAppearance: boolean = true;\n\n  /**\n   * Show hour input\n   */\n  @Prop() showHour = true;\n\n  /**\n   * Show minutes input\n   */\n  @Prop() showMinutes = true;\n\n  /**\n   * Show seconds input\n   */\n  @Prop() showSeconds = true;\n\n  /**\n   * Select time with format string\n   * Format has to match the `format` property.\n   */\n  @Prop() time: string = DateTime.now().toFormat(this.format);\n\n  @Watch('time')\n  watchTimePropHandler(newValue: string) {\n    this._time = DateTime.fromFormat(newValue, this.format);\n    if (!this._time.isValid) {\n      throw new Error('Format is not supported or not correct');\n    }\n  }\n\n  /**\n   * Set time reference\n   */\n  @Prop() timeReference: 'AM' | 'PM' | undefined;\n\n  /**\n   * Text of date select button\n   */\n  @Prop() textSelectTime = 'Done';\n\n  /**\n   * Text for top label\n   */\n  @Prop() textTime: string = 'Time';\n\n  /**\n   * Time event\n   */\n  @Event() timeSelect!: EventEmitter<string>;\n\n  /**\n   * Time change event\n   */\n  @Event() timeChange!: EventEmitter<string>;\n\n  @State() private _time?: DateTime;\n  @State() private _timeRef?: 'AM' | 'PM';\n  @State() private _formattedTime?: TimeOutputFormat;\n\n  componentWillLoad() {\n    this._time = DateTime.fromFormat(this.time, this.format);\n\n    if (!this._time.isValid) {\n      console.error(\n        `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n      );\n      return;\n    }\n\n    this._timeRef = this.format.includes('a')\n      ? (DateTime.fromFormat(this.time, this.format).toFormat('a') as\n          | 'AM'\n          | 'PM')\n      : undefined;\n    this.formatTime();\n  }\n\n  @Watch('_time')\n  formatTime() {\n    if (!this._time) {\n      return;\n    }\n\n    const [hour, minute, second] = this._time\n      .toFormat(this.format)\n      .split(' ')[0]\n      .split(':');\n\n    this._formattedTime = {\n      hour: hour,\n      minute: minute,\n      second: second,\n    };\n  }\n\n  @Watch('_time')\n  onInternalTimeChange() {\n    this.timeChange.emit(this._time?.toFormat(this.format));\n    if (this._timeRef) this._timeRef = this._time?.toFormat('a') as 'AM' | 'PM';\n  }\n\n  timeUpdate(unit: 'hour' | 'minute' | 'second', value: number): number {\n    let maxValue = DateTime.now().endOf('day').get(unit);\n\n    if (this._timeRef === 'PM' && unit === 'hour') value += 12;\n    if (this._timeRef === 'AM' && unit === 'hour') maxValue = 12;\n\n    if (value > maxValue) {\n      value = maxValue;\n    } else if (value < 0) {\n      value = 0;\n    }\n\n    this._time = this._time?.set({\n      [unit]: value,\n    });\n    return value;\n  }\n\n  changeTimeReference() {\n    this._timeRef = this._timeRef === 'AM' ? 'PM' : 'AM';\n\n    if (!this._time?.toFormat('a').includes(this._timeRef)) {\n      this._time = this._time?.plus({\n        hour: 12,\n      });\n    }\n  }\n\n  /**\n   * Get the current time based on the wanted format\n   */\n  @Method()\n  async getCurrentTime() {\n    return this._time?.toFormat(this.format);\n  }\n\n  render() {\n    let timepickerInformation: TimePickerDescriptor[] = [\n      {\n        unit: 'hour',\n        placeholder: 'HH',\n        hidden: !this.showHour,\n      },\n      {\n        unit: 'minute',\n        placeholder: 'MM',\n        hidden: !this.showMinutes,\n      },\n      {\n        unit: 'second',\n        placeholder: 'SS',\n        hidden: !this.showSeconds,\n      },\n    ];\n\n    timepickerInformation = timepickerInformation.filter(\n      (item) => !item.hidden\n    );\n\n    return (\n      <Host>\n        <ix-date-time-card\n          standaloneAppearance={this.standaloneAppearance}\n          corners={this.corners}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-typography format=\"h5\">{this.textTime || 'Time'}</ix-typography>\n          </div>\n          <div class=\"clock\">\n            {timepickerInformation.map((descriptor, index: number) => (\n              <div class=\"flex\">\n                <div class={{ columns: true, hidden: descriptor.hidden }}>\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time?.plus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon={iconChevronUpSmall}\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n\n                  <input\n                    class=\"ix-form-control\"\n                    name={descriptor.unit}\n                    type=\"number\"\n                    placeholder={descriptor.placeholder}\n                    value={\n                      this._formattedTime\n                        ? this._formattedTime[descriptor.unit]\n                        : ''\n                    }\n                    onKeyDown={(e) => {\n                      if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;\n\n                      const value = e.key === 'ArrowUp' ? 1 : -1;\n                      this._time = this._time?.plus({\n                        [descriptor.unit]: value,\n                      });\n                      e.preventDefault();\n                    }}\n                    onChange={(e: any) => {\n                      let inputElement = e.target as HTMLInputElement;\n                      inputElement.value = this.timeUpdate(\n                        descriptor.unit,\n                        +inputElement.value\n                      ).toString();\n                    }}\n                  ></input>\n\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time?.minus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon={iconChevronDownSmall}\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n                </div>\n\n                {index !== timepickerInformation.length - 1 && (\n                  <div\n                    class={{\n                      'column-seperator': true,\n                      hidden: descriptor.hidden,\n                    }}\n                  >\n                    :\n                  </div>\n                )}\n              </div>\n            ))}\n\n            <div\n              class={{\n                columns: true,\n                'default-space': true,\n                hidden: this._timeRef === undefined,\n              }}\n            >\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon={iconChevronUp}\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n              <div class=\"time-reference\">{this._timeRef}</div>\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon={iconChevronDown}\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n            </div>\n          </div>\n          <div\n            class={{\n              button: true,\n              hidden: !this.standaloneAppearance,\n              standalone: true,\n            }}\n          >\n            <ix-button\n              onClick={() => {\n                this.timeSelect.emit(this._time?.toFormat(this.format));\n              }}\n            >\n              {this.textSelectTime}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sJAAA,MAAMA,EAAgB,gnkB,MCgDTC,EAAU,MALvB,WAAAC,CAAAC,G,wFAUUC,KAAMC,OAAW,KAKjBD,KAAOE,QAAsB,UAK7BF,KAAoBG,qBAAY,KAKhCH,KAAQI,SAAG,KAKXJ,KAAWK,YAAG,KAKdL,KAAWM,YAAG,KAMdN,KAAAO,KAAeC,EAASC,MAAMC,SAASV,KAAKC,QAkB5CD,KAAcW,eAAG,OAKjBX,KAAQY,SAAW,MAmP5B,CAvQC,oBAAAC,CAAqBC,GACnBd,KAAKe,MAAQP,EAASQ,WAAWF,EAAUd,KAAKC,QAChD,IAAKD,KAAKe,MAAME,QAAS,CACvB,MAAM,IAAIC,MAAM,yC,EAiCpB,iBAAAC,GACEnB,KAAKe,MAAQP,EAASQ,WAAWhB,KAAKO,KAAMP,KAAKC,QAEjD,IAAKD,KAAKe,MAAME,QAAS,CACvBG,QAAQC,MACN,4FAA4FrB,KAAKe,MAAMO,kBAAkBtB,KAAKe,MAAMQ,sBAEtI,M,CAGFvB,KAAKwB,SAAWxB,KAAKC,OAAOwB,SAAS,KAChCjB,EAASQ,WAAWhB,KAAKO,KAAMP,KAAKC,QAAQS,SAAS,KAGtDgB,UACJ1B,KAAK2B,Y,CAIP,UAAAA,GACE,IAAK3B,KAAKe,MAAO,CACf,M,CAGF,MAAOa,EAAMC,EAAQC,GAAU9B,KAAKe,MACjCL,SAASV,KAAKC,QACd8B,MAAM,KAAK,GACXA,MAAM,KAET/B,KAAKgC,eAAiB,CACpBJ,KAAMA,EACNC,OAAQA,EACRC,OAAQA,E,CAKZ,oBAAAG,G,QACEjC,KAAKkC,WAAWC,MAAKC,EAAApC,KAAKe,SAAK,MAAAqB,SAAA,SAAAA,EAAE1B,SAASV,KAAKC,SAC/C,GAAID,KAAKwB,SAAUxB,KAAKwB,UAAWa,EAAArC,KAAKe,SAAK,MAAAsB,SAAA,SAAAA,EAAE3B,SAAS,I,CAG1D,UAAA4B,CAAWC,EAAoCC,G,MAC7C,IAAIC,EAAWjC,EAASC,MAAMiC,MAAM,OAAOC,IAAIJ,GAE/C,GAAIvC,KAAKwB,WAAa,MAAQe,IAAS,OAAQC,GAAS,GACxD,GAAIxC,KAAKwB,WAAa,MAAQe,IAAS,OAAQE,EAAW,GAE1D,GAAID,EAAQC,EAAU,CACpBD,EAAQC,C,MACH,GAAID,EAAQ,EAAG,CACpBA,EAAQ,C,CAGVxC,KAAKe,OAAQqB,EAAApC,KAAKe,SAAO,MAAAqB,SAAA,SAAAA,EAAAQ,IAAI,CAC3BL,CAACA,GAAOC,IAEV,OAAOA,C,CAGT,mBAAAK,G,QACE7C,KAAKwB,SAAWxB,KAAKwB,WAAa,KAAO,KAAO,KAEhD,MAAKY,EAAApC,KAAKe,SAAK,MAAAqB,SAAA,SAAAA,EAAE1B,SAAS,KAAKe,SAASzB,KAAKwB,WAAW,CACtDxB,KAAKe,OAAQsB,EAAArC,KAAKe,SAAO,MAAAsB,SAAA,SAAAA,EAAAS,KAAK,CAC5BlB,KAAM,I,EASZ,oBAAMmB,G,MACJ,OAAOX,EAAApC,KAAKe,SAAK,MAAAqB,SAAA,SAAAA,EAAE1B,SAASV,KAAKC,O,CAGnC,MAAA+C,GACE,IAAIC,EAAgD,CAClD,CACEV,KAAM,OACNW,YAAa,KACbC,QAASnD,KAAKI,UAEhB,CACEmC,KAAM,SACNW,YAAa,KACbC,QAASnD,KAAKK,aAEhB,CACEkC,KAAM,SACNW,YAAa,KACbC,QAASnD,KAAKM,cAIlB2C,EAAwBA,EAAsBG,QAC3CC,IAAUA,EAAKF,SAGlB,OACEG,EAACC,EAAI,CAAAC,IAAA,4CACHF,EACE,qBAAAE,IAAA,2CAAArD,qBAAsBH,KAAKG,qBAC3BD,QAASF,KAAKE,SAEdoD,EAAA,OAAAE,IAAA,2CAAKC,MAAM,SAASC,KAAK,UACvBJ,EAAe,iBAAAE,IAAA,2CAAAvD,OAAO,MAAMD,KAAKY,UAAY,SAE/C0C,EAAK,OAAAE,IAAA,2CAAAC,MAAM,SACRR,EAAsBU,KAAI,CAACC,EAAYC,IACtCP,EAAK,OAAAG,MAAM,QACTH,EAAA,OAAKG,MAAO,CAAEK,QAAS,KAAMX,OAAQS,EAAWT,SAC9CG,EAAA,kBACES,KAAK,KACLC,QAAS,K,MACP,OAAChE,KAAKe,OAAQqB,EAAApC,KAAKe,SAAO,MAAAqB,SAAA,SAAAA,EAAAU,KAAK,CAC7B,CAACc,EAAWrB,MAAO,GACnB,EAEJ0B,MAAK,KACLC,KAAMC,EACNC,QAAQ,UACRX,MAAM,WAGRH,EACE,SAAAG,MAAM,kBACNY,KAAMT,EAAWrB,KACjB+B,KAAK,SACLpB,YAAaU,EAAWV,YACxBV,MACExC,KAAKgC,eACDhC,KAAKgC,eAAe4B,EAAWrB,MAC/B,GAENgC,UAAYC,I,MACV,GAAIA,EAAEhB,MAAQ,WAAagB,EAAEhB,MAAQ,YAAa,OAElD,MAAMhB,EAAQgC,EAAEhB,MAAQ,UAAY,GAAI,EACxCxD,KAAKe,OAAQqB,EAAApC,KAAKe,SAAO,MAAAqB,SAAA,SAAAA,EAAAU,KAAK,CAC5B,CAACc,EAAWrB,MAAOC,IAErBgC,EAAEC,gBAAgB,EAEpBC,SAAWF,IACT,IAAIG,EAAeH,EAAEI,OACrBD,EAAanC,MAAQxC,KAAKsC,WACxBsB,EAAWrB,MACVoC,EAAanC,OACdqC,UAAU,IAIhBvB,EAAA,kBACES,KAAK,KACLC,QAAS,K,MACP,OAAChE,KAAKe,OAAQqB,EAAApC,KAAKe,SAAO,MAAAqB,SAAA,SAAAA,EAAA0C,MAAM,CAC9B,CAAClB,EAAWrB,MAAO,GACnB,EAEJ0B,MAAK,KACLC,KAAMa,EACNX,QAAQ,UACRX,MAAM,YAITI,IAAUZ,EAAsB+B,OAAS,GACxC1B,EACE,OAAAG,MAAO,CACL,mBAAoB,KACpBN,OAAQS,EAAWT,SAIjB,QAKZG,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACLK,QAAS,KACT,gBAAiB,KACjBX,OAAQnD,KAAKwB,WAAaE,YAG5B4B,EACE,kBAAAE,IAAA,2CAAAO,KAAK,KACLC,QAAS,IAAMhE,KAAK6C,sBACpBoB,MACA,KAAAC,KAAMe,EACNb,QAAQ,UACRX,MAAM,WAERH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBAAkBzD,KAAKwB,UAClC8B,EAAA,kBAAAE,IAAA,2CACEO,KAAK,KACLC,QAAS,IAAMhE,KAAK6C,sBACpBoB,MAAK,KACLC,KAAMgB,EACNd,QAAQ,UACRX,MAAM,aAIZH,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL0B,OAAQ,KACRhC,QAASnD,KAAKG,qBACdiF,WAAY,OAGd9B,EACE,aAAAE,IAAA,2CAAAQ,QAAS,K,MACPhE,KAAKqF,WAAWlD,MAAKC,EAAApC,KAAKe,SAAK,MAAAqB,SAAA,SAAAA,EAAE1B,SAASV,KAAKC,QAAQ,GAGxDD,KAAKW,kB","ignoreList":[]}

package/dist/siemens-ix/{p-f8b08d7b.entry.js → p-71b2c8cd.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as e,H as o}from"./p-BNpBEtDH.js";const n='.typography-label,:host(.typography-label){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-xs,:host(.typography-label-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--2);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xxl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-sm,:host(.typography-label-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-lg,:host(.typography-label-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body,:host(.typography-body){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-xs,:host(.typography-body-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--2);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xxl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-sm,:host(.typography-body-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-lg,:host(.typography-body-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display,:host(.typography-display){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-3);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xs,:host(.typography-display-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-sm,:host(.typography-display-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-2);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-lg,:host(.typography-display-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-4);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xl,:host(.typography-display-xl){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-5);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xxl,:host(.typography-display-xxl){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-6);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h6,.h6,.typography-h6,:host(.typography-h6){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h5,.h5,.typography-h5,:host(.typography-h5){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h4,.h4,.typography-h4,:host(.typography-h4){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h3,.h3,.typography-h3,:host(.typography-h3){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-2);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h2,.h2,.typography-h2,:host(.typography-h2){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-3);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h1,.h1,.typography-h1,:host(.typography-h1){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-4);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code,:host(.typography-code){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code-lg,:host(.typography-code-lg){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code-sm,:host(.typography-code-sm){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-decoration-none,:host(.typography-decoration-none){text-decoration:none !important}.typography-decoration-underline,:host(.typography-decoration-underline){text-decoration:underline !important}.typography-decoration-line-through,:host(.typography-decoration-line-through){text-decoration:line-through !important}.typography-weight-bold,:host(.typography-weight-bold){font-weight:700 !important}a{color:var(--theme-color-primary)}:host{display:block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host(.text-xs){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}:host(.text-s){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-caption){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-caption-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}:host(.text-default){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host(.text-default-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}:host(.text-default-title){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host(.text-default-title-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}:host(.text-l){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-l-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}:host(.text-l-title){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-l-title-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}:host(.text-h2){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}:host(.text-xl){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}';const i=class{constructor(e){t(this,e);this.bold=false;this.textDecoration="none"}static getTextColor(t){if(t.startsWith("inv-")||!t.endsWith("-contrast")){return`var(--theme-color-${t}-text)`}return`var(--theme-color-${t.replace("-","--")})`}render(){var t;let n={};n[`typography-${(t=this.format)!==null&&t!==void 0?t:"body"}`]=true;if(this.textDecoration!=="none"){n[`typography-decoration-${this.textDecoration}`]=true}n["typography-weight-bold"]=this.bold;let a={};if(this.textColor){a={color:i.getTextColor(this.textColor)}}return e(o,{key:"98b5d010c3167750cd167157c45a9305f382c19a",class:n,style:a},e("slot",{key:"01586058f3ff1bcd88bdc5044c102dd4b09569d3"}))}};i.style=n;export{i as ix_typography};
-//# sourceMappingURL=p-f8b08d7b.entry.js.map
+import{r as t,h as e,H as o}from"./p-BNpBEtDH.js";const n='.typography-label,:host(.typography-label){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-xs,:host(.typography-label-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--2);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xxl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-sm,:host(.typography-label-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-label-lg,:host(.typography-label-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body,:host(.typography-body){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-xs,:host(.typography-body-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--2);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xxl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-sm,:host(.typography-body-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-body-lg,:host(.typography-body-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display,:host(.typography-display){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-3);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xs,:host(.typography-display-xs){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-sm,:host(.typography-display-sm){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-2);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-lg,:host(.typography-display-lg){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-4);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xl,:host(.typography-display-xl){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-5);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-display-xxl,:host(.typography-display-xxl){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-6);line-height:var(--theme-line-height-xs);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-sm);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h6,.h6,.typography-h6,:host(.typography-h6){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h5,.h5,.typography-h5,:host(.typography-h5){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h4,.h4,.typography-h4,:host(.typography-h4){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h3,.h3,.typography-h3,:host(.typography-h3){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-2);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-lg);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h2,.h2,.typography-h2,:host(.typography-h2){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-3);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}h1,.h1,.typography-h1,:host(.typography-h1){font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-4);line-height:var(--theme-line-height-sm);font-weight:var(--theme-font-weight-bold);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code,:host(.typography-code){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code-lg,:host(.typography-code-lg){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-md);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-code-sm,:host(.typography-code-sm){font-feature-settings:"clig" off, "liga" off;font-family:JetBrainsMono, Courier New, monospace, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms--1);line-height:var(--theme-line-height-lg);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.typography-decoration-none,:host(.typography-decoration-none){text-decoration:none !important}.typography-decoration-underline,:host(.typography-decoration-underline){text-decoration:underline !important}.typography-decoration-line-through,:host(.typography-decoration-line-through){text-decoration:line-through !important}.typography-weight-bold,:host(.typography-weight-bold){font-weight:700 !important}a{color:var(--theme-color-primary)}:host{display:block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host(.text-xs){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}:host(.text-s){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-caption){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-caption-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}:host(.text-default){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host(.text-default-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}:host(.text-default-title){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host(.text-default-title-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}:host(.text-l){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-l-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}:host(.text-l-title){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host(.text-l-title-single){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}:host(.text-h2){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}:host(.text-xl){-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}';const i=class{constructor(e){t(this,e);this.bold=false;this.textDecoration="none"}static getTextColor(t){if(t.startsWith("inv-")||!t.endsWith("-contrast")){return`var(--theme-color-${t}-text)`}return`var(--theme-color-${t.replace("-","--")})`}render(){var t;let n={};n[`typography-${(t=this.format)!==null&&t!==void 0?t:"body"}`]=true;if(this.textDecoration!=="none"){n[`typography-decoration-${this.textDecoration}`]=true}n["typography-weight-bold"]=this.bold;let a={};if(this.textColor){a={color:i.getTextColor(this.textColor)}}return e(o,{key:"faabb05682b1dd7817dc82aae7569fb57b6caa02",class:n,style:a},e("slot",{key:"62737116884ff4a52ad2484886f5b063d2702ece"}))}};i.style=n;export{i as ix_typography};
+//# sourceMappingURL=p-71b2c8cd.entry.js.map

package/dist/siemens-ix/{p-f8b08d7b.entry.js.map → p-71b2c8cd.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["typographyCss","IxTypography","constructor","hostRef","this","bold","textDecoration","getTextColor","color","startsWith","endsWith","replace","render","typographyClass","_a","format","style","textColor","h","Host","key","class"],"sources":["src/components/typography/typography.scss?tag=ix-typography&encapsulation=shadow","src/components/typography/typography.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@import 'legacy/mixins/fonts';\n@import 'components/fonts';\n@import 'mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n}\n\n:host(.text-xs) {\n  @include text-xs;\n}\n\n:host(.text-s) {\n  @include text-s;\n}\n\n:host(.text-caption) {\n  @include text-caption;\n}\n\n:host(.text-caption-single) {\n  @include text-caption-single;\n}\n\n:host(.text-default) {\n  @include text-default;\n}\n\n:host(.text-default-single) {\n  @include text-default-single;\n}\n\n:host(.text-default-title) {\n  @include text-default-title;\n}\n\n:host(.text-default-title-single) {\n  @include text-default-title-single;\n}\n\n:host(.text-l) {\n  @include text-l;\n}\n\n:host(.text-l-single) {\n  @include text-l-single;\n}\n\n:host(.text-l-title) {\n  @include text-l-title;\n}\n\n:host(.text-l-title-single) {\n  @include text-l-title-single;\n}\n\n:host(.text-h2) {\n  @include text-h2;\n}\n\n:host(.text-xl) {\n  @include text-xl;\n}\n\n$typography-formats: label, label-xs, label-sm, label-lg, body, body-xs, body-sm,\n  body-lg, display, display-xs, display-sm, display-lg, display-xl, display-xxl,\n  h6, h5, h4, h3, h2, h1, code, code-sm, code-lg;\n\n@each $format in $typography-formats {\n  :host(.typography-#{$format}) {\n    @extend .typography-#{$format};\n  }\n}\n\n$typography-decoration: none, underline, line-through;\n@each $decoration in $typography-decoration {\n  :host(.typography-decoration-#{$decoration}) {\n    @extend .typography-decoration-#{$decoration};\n  }\n}\n\n:host(.typography-weight-bold) {\n  @extend .typography-weight-bold;\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\nexport type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'large-title'\n  | 'large-title-single'\n  | 'h2'\n  | 'display-large';\n\nexport type TypographyColors =\n  | 'alarm'\n  | 'alarm-contrast'\n  | 'contrast'\n  | 'critical-contrast'\n  | 'info-contrast'\n  | 'inv-contrast'\n  | 'inv-soft'\n  | 'inv-std'\n  | 'inv-weak'\n  | 'neutral-contrast'\n  | 'primary-contrast'\n  | 'soft'\n  | 'std'\n  | 'success-contrast'\n  | 'warning-contrast'\n  | 'weak';\n\ntype TypographyFormatLabel = 'label' | 'label-xs' | 'label-sm' | 'label-lg';\ntype TypographyFormatBody = 'body' | 'body-xs' | 'body-sm' | 'body-lg';\ntype TypographyFormatDisplay =\n  | 'display'\n  | 'display-xs'\n  | 'display-sm'\n  | 'display-lg'\n  | 'display-xl'\n  | 'display-xxl';\ntype TypographyFormatHeading = 'h6' | 'h5' | 'h4' | 'h3' | 'h2' | 'h1';\ntype TypographyFormatCode = 'code' | 'code-sm' | 'code-lg';\n\nexport type TypographyFormat =\n  | TypographyFormatLabel\n  | TypographyFormatBody\n  | TypographyFormatDisplay\n  | TypographyFormatHeading\n  | TypographyFormatCode;\n\nexport type TextDecoration = 'none' | 'underline' | 'line-through';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-typography',\n  styleUrl: 'typography.scss',\n  shadow: true,\n})\nexport class IxTypography {\n  /**\n   * Text format\n   */\n  @Prop() format?: TypographyFormat;\n\n  /**\n   * Text color based on theme variables\n   */\n  @Prop() textColor?: TypographyColors;\n\n  /**\n   * Display text bold\n   */\n  @Prop() bold = false;\n\n  /**\n   * Text decoration\n   */\n  @Prop() textDecoration: TextDecoration = 'none';\n\n  private static getTextColor(color: TypographyColors) {\n    if (color.startsWith('inv-') || !color.endsWith('-contrast')) {\n      return `var(--theme-color-${color}-text)`;\n    }\n\n    return `var(--theme-color-${color.replace('-', '--')})`;\n  }\n\n  render() {\n    let typographyClass: Record<string, boolean> = {};\n    typographyClass[`typography-${this.format ?? 'body'}`] = true;\n\n    if (this.textDecoration !== 'none') {\n      typographyClass[`typography-decoration-${this.textDecoration}`] = true;\n    }\n\n    typographyClass['typography-weight-bold'] = this.bold;\n\n    let style = {};\n\n    if (this.textColor) {\n      style = {\n        color: IxTypography.getTextColor(this.textColor),\n      };\n    }\n\n    return (\n      <Host class={typographyClass} style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,oxb,MC0ETC,EAAY,MALzB,WAAAC,CAAAC,G,UAmBUC,KAAIC,KAAG,MAKPD,KAAcE,eAAmB,MAkC1C,CAhCS,mBAAOC,CAAaC,GAC1B,GAAIA,EAAMC,WAAW,UAAYD,EAAME,SAAS,aAAc,CAC5D,MAAO,qBAAqBF,S,CAG9B,MAAO,qBAAqBA,EAAMG,QAAQ,IAAK,Q,CAGjD,MAAAC,G,MACE,IAAIC,EAA2C,GAC/CA,EAAgB,eAAcC,EAAAV,KAAKW,UAAU,MAAAD,SAAA,EAAAA,EAAA,UAAY,KAEzD,GAAIV,KAAKE,iBAAmB,OAAQ,CAClCO,EAAgB,yBAAyBT,KAAKE,kBAAoB,I,CAGpEO,EAAgB,0BAA4BT,KAAKC,KAEjD,IAAIW,EAAQ,GAEZ,GAAIZ,KAAKa,UAAW,CAClBD,EAAQ,CACNR,MAAOP,EAAaM,aAAaH,KAAKa,W,CAI1C,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,MAAOR,EAAiBG,MAAOA,GACnCE,EAAa,QAAAE,IAAA,6C","ignoreList":[]}
+{"version":3,"names":["typographyCss","IxTypography","constructor","hostRef","this","bold","textDecoration","getTextColor","color","startsWith","endsWith","replace","render","typographyClass","_a","format","style","textColor","h","Host","key","class"],"sources":["src/components/typography/typography.scss?tag=ix-typography&encapsulation=shadow","src/components/typography/typography.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@import 'legacy/mixins/fonts';\n@import 'components/fonts';\n@import 'mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n}\n\n:host(.text-xs) {\n  @include text-xs;\n}\n\n:host(.text-s) {\n  @include text-s;\n}\n\n:host(.text-caption) {\n  @include text-caption;\n}\n\n:host(.text-caption-single) {\n  @include text-caption-single;\n}\n\n:host(.text-default) {\n  @include text-default;\n}\n\n:host(.text-default-single) {\n  @include text-default-single;\n}\n\n:host(.text-default-title) {\n  @include text-default-title;\n}\n\n:host(.text-default-title-single) {\n  @include text-default-title-single;\n}\n\n:host(.text-l) {\n  @include text-l;\n}\n\n:host(.text-l-single) {\n  @include text-l-single;\n}\n\n:host(.text-l-title) {\n  @include text-l-title;\n}\n\n:host(.text-l-title-single) {\n  @include text-l-title-single;\n}\n\n:host(.text-h2) {\n  @include text-h2;\n}\n\n:host(.text-xl) {\n  @include text-xl;\n}\n\n$typography-formats: label, label-xs, label-sm, label-lg, body, body-xs, body-sm,\n  body-lg, display, display-xs, display-sm, display-lg, display-xl, display-xxl,\n  h6, h5, h4, h3, h2, h1, code, code-sm, code-lg;\n\n@each $format in $typography-formats {\n  :host(.typography-#{$format}) {\n    @extend .typography-#{$format};\n  }\n}\n\n$typography-decoration: none, underline, line-through;\n@each $decoration in $typography-decoration {\n  :host(.typography-decoration-#{$decoration}) {\n    @extend .typography-decoration-#{$decoration};\n  }\n}\n\n:host(.typography-weight-bold) {\n  @extend .typography-weight-bold;\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\nexport type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'large-title'\n  | 'large-title-single'\n  | 'h2'\n  | 'display-large';\n\nexport type TypographyColors =\n  | 'alarm'\n  | 'alarm-contrast'\n  | 'contrast'\n  | 'critical-contrast'\n  | 'info-contrast'\n  | 'inv-contrast'\n  | 'inv-soft'\n  | 'inv-std'\n  | 'inv-weak'\n  | 'neutral-contrast'\n  | 'primary-contrast'\n  | 'soft'\n  | 'std'\n  | 'success-contrast'\n  | 'warning-contrast'\n  | 'weak';\n\ntype TypographyFormatLabel = 'label' | 'label-xs' | 'label-sm' | 'label-lg';\ntype TypographyFormatBody = 'body' | 'body-xs' | 'body-sm' | 'body-lg';\ntype TypographyFormatDisplay =\n  | 'display'\n  | 'display-xs'\n  | 'display-sm'\n  | 'display-lg'\n  | 'display-xl'\n  | 'display-xxl';\ntype TypographyFormatHeading = 'h6' | 'h5' | 'h4' | 'h3' | 'h2' | 'h1';\ntype TypographyFormatCode = 'code' | 'code-sm' | 'code-lg';\n\nexport type TypographyFormat =\n  | TypographyFormatLabel\n  | TypographyFormatBody\n  | TypographyFormatDisplay\n  | TypographyFormatHeading\n  | TypographyFormatCode;\n\nexport type TextDecoration = 'none' | 'underline' | 'line-through';\n\n@Component({\n  tag: 'ix-typography',\n  styleUrl: 'typography.scss',\n  shadow: true,\n})\nexport class IxTypography {\n  /**\n   * Text format\n   */\n  @Prop() format?: TypographyFormat;\n\n  /**\n   * Text color based on theme variables\n   */\n  @Prop() textColor?: TypographyColors;\n\n  /**\n   * Display text bold\n   */\n  @Prop() bold = false;\n\n  /**\n   * Text decoration\n   */\n  @Prop() textDecoration: TextDecoration = 'none';\n\n  private static getTextColor(color: TypographyColors) {\n    if (color.startsWith('inv-') || !color.endsWith('-contrast')) {\n      return `var(--theme-color-${color}-text)`;\n    }\n\n    return `var(--theme-color-${color.replace('-', '--')})`;\n  }\n\n  render() {\n    let typographyClass: Record<string, boolean> = {};\n    typographyClass[`typography-${this.format ?? 'body'}`] = true;\n\n    if (this.textDecoration !== 'none') {\n      typographyClass[`typography-decoration-${this.textDecoration}`] = true;\n    }\n\n    typographyClass['typography-weight-bold'] = this.bold;\n\n    let style = {};\n\n    if (this.textColor) {\n      style = {\n        color: IxTypography.getTextColor(this.textColor),\n      };\n    }\n\n    return (\n      <Host class={typographyClass} style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,oxb,MCuETC,EAAY,MALzB,WAAAC,CAAAC,G,UAmBUC,KAAIC,KAAG,MAKPD,KAAcE,eAAmB,MAkC1C,CAhCS,mBAAOC,CAAaC,GAC1B,GAAIA,EAAMC,WAAW,UAAYD,EAAME,SAAS,aAAc,CAC5D,MAAO,qBAAqBF,S,CAG9B,MAAO,qBAAqBA,EAAMG,QAAQ,IAAK,Q,CAGjD,MAAAC,G,MACE,IAAIC,EAA2C,GAC/CA,EAAgB,eAAcC,EAAAV,KAAKW,UAAU,MAAAD,SAAA,EAAAA,EAAA,UAAY,KAEzD,GAAIV,KAAKE,iBAAmB,OAAQ,CAClCO,EAAgB,yBAAyBT,KAAKE,kBAAoB,I,CAGpEO,EAAgB,0BAA4BT,KAAKC,KAEjD,IAAIW,EAAQ,GAEZ,GAAIZ,KAAKa,UAAW,CAClBD,EAAQ,CACNR,MAAOP,EAAaM,aAAaH,KAAKa,W,CAI1C,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,MAAOR,EAAiBG,MAAOA,GACnCE,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/siemens-ix/{p-e365aee3.entry.js → p-7535cbf6.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as e,H as i,g as s}from"./p-BNpBEtDH.js";import{c as o,a as r}from"./p-2j3Ly91D.js";import{r as n}from"./p-CFHLJNAe.js";import"./p-CrTP-icT.js";const a=":host{display:block}:host .bottom-text{display:flex;position:relative;align-items:flex-start;justify-content:flex-start;gap:0.25rem;margin-right:0.25rem}:host .text-icon{margin:0.125rem}:host .text-icon.invalid{color:var(--theme-helper-icon--color--invalid)}:host .text-icon.info{color:var(--theme-helper-icon--color--info)}:host .text-icon.warning{color:var(--theme-helper-icon--color--warning)}:host .text-icon.valid{color:var(--theme-helper-icon--color--valid)}";const l=class{constructor(e){t(this,e);this.validationResults={isInfo:false,isInvalid:false,isValid:false,isWarning:false,isInvalidByRequired:false};this.observer=new MutationObserver((()=>this.checkForRequired()))}connectedCallback(){this.observer.observe(window.document,{childList:true,subtree:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentWillRender(){this.checkForRequired()}async checkForRequired(){if(!this.htmlFor){return}const t=document.getElementById(this.htmlFor);if(!t){return}if(this.classObserver){this.classObserver.destroy()}this.classObserver=o(t,(()=>{this.validationResults=r(t)}));this.validationResults=r(t)}render(){return e(i,{key:"f406e4120213d1d6fa4e2e68bb410e368f56942e"},n(Object.assign({helperText:this.helperText,invalidText:this.invalidText,validText:this.validText,infoText:this.infoText,warningText:this.warningText},this.validationResults)))}get hostElement(){return s(this)}};l.style=a;export{l as ix_helper_text};
-//# sourceMappingURL=p-e365aee3.entry.js.map
+import{r as t,h as e,H as i,g as s}from"./p-BNpBEtDH.js";import{c as o,a as r}from"./p-DHml78Yc.js";import{r as n}from"./p-CFHLJNAe.js";import"./p-CrTP-icT.js";const a=":host{display:block}:host .bottom-text{display:flex;position:relative;align-items:flex-start;justify-content:flex-start;gap:0.25rem;margin-right:0.25rem}:host .text-icon{margin:0.125rem}:host .text-icon.invalid{color:var(--theme-helper-icon--color--invalid)}:host .text-icon.info{color:var(--theme-helper-icon--color--info)}:host .text-icon.warning{color:var(--theme-helper-icon--color--warning)}:host .text-icon.valid{color:var(--theme-helper-icon--color--valid)}";const l=class{constructor(e){t(this,e);this.validationResults={isInfo:false,isInvalid:false,isValid:false,isWarning:false,isInvalidByRequired:false};this.observer=new MutationObserver((()=>this.checkForRequired()))}connectedCallback(){this.observer.observe(window.document,{childList:true,subtree:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentWillRender(){this.checkForRequired()}async checkForRequired(){if(!this.htmlFor){return}const t=document.getElementById(this.htmlFor);if(!t){return}if(this.classObserver){this.classObserver.destroy()}this.classObserver=o(t,(()=>{this.validationResults=r(t)}));this.validationResults=r(t)}render(){return e(i,{key:"f406e4120213d1d6fa4e2e68bb410e368f56942e"},n(Object.assign({helperText:this.helperText,invalidText:this.invalidText,validText:this.validText,infoText:this.infoText,warningText:this.warningText},this.validationResults)))}get hostElement(){return s(this)}};l.style=a;export{l as ix_helper_text};
+//# sourceMappingURL=p-7535cbf6.entry.js.map