@siemens/ix 0.0.0-20240522074328 → 0.0.0-pr-1373-20240705054533

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

@@ -0,0 +1 @@
+{"version":3,"names":["paneCss","IxPaneStyle0","Pane","this","validPositions","collapsedPane","collapsedPaneMobile","animations","Map","animationCounter","currentSlot","hostElement","getAttribute","isBottomTopPane","composition","isLeftRightPane","isMobileTop","componentWillLoad","setIcons","floating","variant","expanded","onParentSizeChange","isMobile","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","parentWidthPx","borderBoxSize","inlineSize","parentHeightPx","blockSize","disconnectedCallback","_a","disconnect","_b","value","includes","getExpandPaneSize","expandPaneSize","size","referenceValue","Math","round","currentValue","Number","replace","expandIcon","minimizeIcon","getIconNames","getKey","toString","animateVerticalFadeIn","key","animation","anime","targets","duration","Animation","mediumTime","width","easing","delay","begin","showContent","animateVerticalPadding","complete","delete","set","animateHorizontalFadeIn","height","animateHorizontalPadding","removePadding","shadowRoot","querySelector","paddingTop","paddingBottom","paddingLeft","paddingRight","clearAnimations","pause","clear","onMobileChange","style","removeProperty","onPositionChange","onHideOnCollapseChange","hideOnCollapseChanged","hideOnCollapse","onVariantChange","variantChanged","onBorderlessChange","borderlessChanged","borderless","onExpandedChange","onSizeChange","expandedChanged","minHeight","render","h","Host","class","id","title","icon","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: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/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: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  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';\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/**\n * @since 2.1.0\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 validPositions = ['top', 'left', 'bottom', 'right'];\n  private collapsedPane = '40px';\n  private collapsedPaneMobile = '48px';\n  private 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    this.setPosition(this.currentSlot);\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            this.setPosition(newSlot);\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 (this.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          ? 'double-chevron-up'\n          : 'double-chevron-left';\n        minimizeIcon = this.isMobile\n          ? 'double-chevron-down'\n          : 'double-chevron-right';\n        break;\n      case 'right':\n        expandIcon = this.isMobile\n          ? 'double-chevron-down'\n          : 'double-chevron-right';\n        minimizeIcon = this.isMobile\n          ? 'double-chevron-up'\n          : 'double-chevron-left';\n        break;\n      case 'bottom':\n        expandIcon = 'double-chevron-down';\n        minimizeIcon = 'double-chevron-up';\n        break;\n      case 'top':\n        expandIcon = 'double-chevron-up';\n        minimizeIcon = 'double-chevron-down';\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  @Watch('expanded')\n  onExpandedChange() {\n    this.onSizeChange();\n\n    this.expandedChanged.emit({\n      slot: this.currentSlot,\n      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          : this.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = this.hideOnCollapse\n            ? '0'\n            : this.collapsedPane;\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : this.collapsedPane;\n        }\n      }\n    }\n  }\n\n  @Watch('size')\n  onSizeChange() {\n    if (this.expanded) {\n      if (this.isMobile) {\n        this.hostElement.style.minHeight = this.hideOnCollapse\n          ? '0'\n          : this.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            : this.collapsedPane;\n          this.animateHorizontalFadeIn(expandPaneSize);\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : this.collapsedPane;\n          this.animateVerticalFadeIn(expandPaneSize);\n        }\n      }\n    } else {\n      this.showContent = false;\n\n      if (this.isMobile) {\n        this.hostElement.style.height = this.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.animateHorizontalFadeIn(this.collapsedPane);\n        } else {\n          this.animateVerticalFadeIn(this.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          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                    ? 'close'\n                    : this.expandIcon\n                  : this.minimizeIcon\n              }\n              ghost\n              onClick={() => {\n                this.expanded = !this.expanded;\n              }}\n              aria-controls={this.composition + 'ToggleButton'}\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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"}

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

@@ -0,0 +1,2 @@
+import{r as t,a as e,h as o,F as r,H as i,g as a}from"./p-f87cd962.js";import{s}from"./p-0ca3528f.js";import{a as n}from"./p-fbe017b7.js";import{a as l,A as d}from"./p-7c36d3fa.js";import{m as h}from"./p-c146af8e.js";import{h as c}from"./p-712e0ee0.js";import"./p-46a6cd9d.js";import"./p-6e6efb4c.js";import"./p-c4749812.js";import"./p-68a274e7.js";const m=":host{display:flex;align-items:center;position:relative;width:100%;height:2.75rem;min-height:2.75rem;padding:0 1rem 0 0.625rem;color:var(--theme-app-header--color);background-color:var(--theme-app-header--background);border-bottom:var(--theme-app-header--border-width) solid var(--theme-app-header--border-color);z-index:var(--theme-z-index-fixed)}: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 .app-switch{margin-right:1rem}:host .name{overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis;text-wrap:nowrap;max-width:50%;margin-left:1.5rem;margin-right:2.5rem;color:var(--theme-app-header--color)}:host .logo{display:inline-flex;align-items:center;position:relative;height:32px;overflow:hidden;line-height:0rem;color:var(--theme-app-header-logo--color);margin-left:0.375rem}:host .content{display:flex;position:relative;flex-direction:row;margin-left:auto;margin-right:0px}:host .dropdown{overflow:visible}:host .dropdown-content{padding:1rem}:host .context-menu{display:none}:host .context-menu.context-menu-visible{display:block}@media only screen and (max-width: 48em){:host .logo{display:none}}:host ::slotted(ix-avatar){margin-left:1rem}:host(.breakpoint-sm){padding-left:0.625rem}:host(.breakpoint-sm) .logo{margin-left:0.5rem}";const p=m;const b=class{constructor(e){t(this,e);this.name=undefined;this.breakpoint="lg";this.menuExpanded=false;this.suppressResponsive=false;this.hasSlottedElements=false;this.applicationLayoutContext=undefined}get contentBackground(){return this.hostElement.shadowRoot.querySelector(".dropdown-content")}componentWillLoad(){l(this.hostElement,d,(t=>{if((t===null||t===void 0?void 0:t.host)==="map-navigation"){this.suppressResponsive=true;this.breakpoint="md";return}this.breakpoint=n.breakpoint;this.applicationLayoutContext=t;this.tryUpdateAppSwitch()}),true);this.menuDisposable=h.expandChange.on((t=>{this.menuExpanded=t}));this.modeDisposable=n.onChange.on((t=>{if(this.suppressResponsive){this.breakpoint="md";return}this.breakpoint=t}));this.updateIsSlottedContent()}componentDidLoad(){this.attachSiemensLogoIfLoaded()}disconnectedCallback(){var t,e;(t=this.menuDisposable)===null||t===void 0?void 0:t.dispose();(e=this.modeDisposable)===null||e===void 0?void 0:e.dispose()}isLogoSlotted(){const t=this.hostElement.shadowRoot.querySelector('slot[name="logo"]');const e=t.assignedNodes({flatten:true});return e.length!==0}async attachSiemensLogoIfLoaded(){await window.customElements.whenDefined("ix-siemens-logo");const t=document.createElement("ix-siemens-logo");if(!this.isLogoSlotted()){this.hostElement.shadowRoot.querySelector(".logo").appendChild(t)}}async onMenuClick(){h.toggle()}resolveContextMenuButton(){return new Promise((t=>e((()=>t(this.hostElement.shadowRoot.querySelector("[data-context-menu]"))))))}tryUpdateAppSwitch(){var t;if(!this.callbackUpdateAppSwitchModal){return}this.callbackUpdateAppSwitchModal((t=this.applicationLayoutContext)===null||t===void 0?void 0:t.appSwitchConfig)}async showAppSwitch(){var t;this.callbackUpdateAppSwitchModal=await s((t=this.applicationLayoutContext)===null||t===void 0?void 0:t.appSwitchConfig)}updateIsSlottedContent(){const t=this.hostElement.shadowRoot.querySelector(".content slot");this.hasSlottedElements=c(t)}onContentBgClick(t){if(t.target===this.contentBackground){t.preventDefault()}}render(){var t;return o(i,{key:"58565e3136e17a2d3cae46a4add8f2ba245b59bc",class:{[`breakpoint-${this.breakpoint}`]:true},slot:"application-header"},this.breakpoint==="sm"&&this.suppressResponsive===false&&o("ix-menu-expand-icon",{key:"da63965f1ced1898c799a48212eb7a4afdf35ffd",onClick:()=>this.onMenuClick(),expanded:this.menuExpanded}),((t=this.applicationLayoutContext)===null||t===void 0?void 0:t.appSwitchConfig)&&this.breakpoint!=="sm"&&this.suppressResponsive===false&&o("ix-icon-button",{key:"fce7acda771398cd8f8f79dcb05254354e9524c8",onClick:()=>this.showAppSwitch(),icon:"apps",ghost:true,class:"app-switch"}),o("div",{key:"20d47359153147df9636a2170e4987113871e701",class:"logo"},o("slot",{key:"3889ece809965cd8c5a256e6551b1d4961774977",name:"logo"})),o("div",{key:"4e9c07f44beb7c476d61657bb303764c74ee174e",class:"name"},this.name),o("div",{key:"099a3a4842da94cd54f789ee29380ab057957550",class:"content"},this.breakpoint==="sm"?o(r,null,o("ix-icon-button",{class:{["context-menu"]:true,["context-menu-visible"]:this.hasSlottedElements},"data-context-menu":true,icon:"more-menu",ghost:true}),o("ix-dropdown",{"data-overflow-dropdown":true,class:"dropdown",discoverAllSubmenus:true,trigger:this.resolveContextMenuButton()},o("div",{class:"dropdown-content",onClick:t=>this.onContentBgClick(t)},o("slot",{onSlotchange:()=>this.updateIsSlottedContent()})))):o("slot",{onSlotchange:()=>this.updateIsSlottedContent()}),o("slot",{key:"ba4c1d46798c9cb325b933905df7bb17a4aedfc6",name:"ix-application-header-avatar"})))}get hostElement(){return a(this)}};b.style=p;export{b as ix_application_header};
+//# sourceMappingURL=p-c45601cb.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["applicationHeaderCss","IxApplicationHeaderStyle0","ApplicationHeader","contentBackground","this","hostElement","shadowRoot","querySelector","componentWillLoad","useContextConsumer","ApplicationLayoutContext","ctx","host","suppressResponsive","breakpoint","applicationLayoutService","applicationLayoutContext","tryUpdateAppSwitch","menuDisposable","menuController","expandChange","on","show","menuExpanded","modeDisposable","onChange","mode","updateIsSlottedContent","componentDidLoad","attachSiemensLogoIfLoaded","disconnectedCallback","_a","dispose","_b","isLogoSlotted","slotElement","nodes","assignedNodes","flatten","length","window","customElements","whenDefined","logoElement","document","createElement","appendChild","onMenuClick","toggle","resolveContextMenuButton","Promise","resolve","readTask","callbackUpdateAppSwitchModal","appSwitchConfig","showAppSwitch","hasSlottedElements","onContentBgClick","e","target","preventDefault","render","h","Host","key","class","slot","onClick","expanded","icon","ghost","name","Fragment","discoverAllSubmenus","trigger","onSlotchange"],"sources":["src/components/application-header/application-header.scss?tag=ix-application-header&encapsulation=shadow","src/components/application-header/application-header.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n @import 'mixins/shadow-dom/component';\n @import 'mixins/break-points';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: 2.75rem;\n  min-height: 2.75rem;\n  padding: 0 1rem 0 0.625rem;\n\n  color: var(--theme-app-header--color);\n  background-color: var(--theme-app-header--background);\n\n  border-bottom: var(--theme-app-header--border-width) solid\n    var(--theme-app-header--border-color);\n\n  z-index: var(--theme-z-index-fixed);\n\n  .app-switch {\n    margin-right: 1rem;\n  }\n\n  .name {\n    overflow: hidden;\n    overflow-wrap: anywhere;\n    text-overflow: ellipsis;\n    text-wrap: nowrap;\n    max-width: 50%;\n    margin-left: 1.5rem;\n    margin-right: 2.5rem;\n    color: var(--theme-app-header--color);\n  }\n\n  .logo {\n    display: inline-flex;\n    align-items: center;\n    position: relative;\n    height: 32px;\n    overflow: hidden;\n    line-height: 0rem;\n    color: var(--theme-app-header-logo--color);\n    margin-left: 0.375rem;\n  }\n\n  .content {\n    display: flex;\n    position: relative;\n    flex-direction: row;\n    margin-left: auto;\n    margin-right: 0px;\n  }\n\n  .dropdown {\n    overflow: visible;\n  }\n\n  .dropdown-content {\n    padding: 1rem;\n  }\n\n  .context-menu {\n    display: none;\n  }\n\n  .context-menu.context-menu-visible {\n    display: block;\n  }\n\n  @include media-breakpoint-match('sm') {\n    .logo {\n      display: none;\n    }\n  }\n\n  ::slotted(ix-avatar) {\n    margin-left: 1rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  padding-left: 0.625rem;\n\n  .logo {\n    margin-left: 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  Element,\n  Fragment,\n  h,\n  Host,\n  Prop,\n  readTask,\n  State,\n} from '@stencil/core';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport {\n  ApplicationLayoutContext,\n  AppSwitchConfiguration,\n} from '../utils/application-layout/context';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { hasSlottedElements } from '../utils/shadow-dom';\nimport { Disposable } from '../utils/typed-event';\n\n/**\n * @slot logo - Location of the logo\n */\n@Component({\n  tag: 'ix-application-header',\n  styleUrl: 'application-header.scss',\n  shadow: true,\n})\nexport class ApplicationHeader {\n  @Element() hostElement!: HTMLIxApplicationHeaderElement;\n\n  /**\n   * Application name\n   */\n  @Prop() name: string;\n\n  @State() breakpoint: Breakpoint = 'lg';\n  @State() menuExpanded = false;\n  @State() suppressResponsive = false;\n\n  @State() hasSlottedElements = false;\n\n  private menuDisposable?: Disposable;\n  private modeDisposable?: Disposable;\n  private callbackUpdateAppSwitchModal?: (\n    config: AppSwitchConfiguration\n  ) => void;\n\n  @State() applicationLayoutContext: ContextType<\n    typeof ApplicationLayoutContext\n  >;\n\n  get contentBackground() {\n    return this.hostElement.shadowRoot.querySelector('.dropdown-content');\n  }\n\n  componentWillLoad() {\n    useContextConsumer(\n      this.hostElement,\n      ApplicationLayoutContext,\n      (ctx) => {\n        if (ctx?.host === 'map-navigation') {\n          this.suppressResponsive = true;\n          this.breakpoint = 'md';\n          return;\n        }\n\n        this.breakpoint = applicationLayoutService.breakpoint;\n        this.applicationLayoutContext = ctx;\n\n        this.tryUpdateAppSwitch();\n      },\n      true\n    );\n\n    this.menuDisposable = menuController.expandChange.on((show) => {\n      this.menuExpanded = show;\n    });\n\n    this.modeDisposable = applicationLayoutService.onChange.on((mode) => {\n      if (this.suppressResponsive) {\n        this.breakpoint = 'md';\n        return;\n      }\n\n      this.breakpoint = mode;\n    });\n\n    this.updateIsSlottedContent();\n  }\n\n  componentDidLoad() {\n    this.attachSiemensLogoIfLoaded();\n  }\n\n  disconnectedCallback() {\n    this.menuDisposable?.dispose();\n    this.modeDisposable?.dispose();\n  }\n\n  private isLogoSlotted() {\n    const slotElement = this.hostElement.shadowRoot.querySelector(\n      'slot[name=\"logo\"]'\n    ) as HTMLSlotElement;\n    const nodes = slotElement.assignedNodes({\n      flatten: true,\n    });\n\n    return nodes.length !== 0;\n  }\n\n  private async attachSiemensLogoIfLoaded() {\n    await window.customElements.whenDefined('ix-siemens-logo');\n    const logoElement = document.createElement('ix-siemens-logo');\n    if (!this.isLogoSlotted()) {\n      this.hostElement.shadowRoot\n        .querySelector('.logo')\n        .appendChild(logoElement);\n    }\n  }\n\n  private async onMenuClick() {\n    menuController.toggle();\n  }\n\n  private resolveContextMenuButton() {\n    return new Promise<HTMLElement>((resolve) =>\n      readTask(() =>\n        resolve(\n          this.hostElement.shadowRoot.querySelector(\n            '[data-context-menu]'\n          ) as HTMLElement\n        )\n      )\n    );\n  }\n\n  private tryUpdateAppSwitch() {\n    if (!this.callbackUpdateAppSwitchModal) {\n      return;\n    }\n\n    this.callbackUpdateAppSwitchModal(\n      this.applicationLayoutContext?.appSwitchConfig\n    );\n  }\n\n  private async showAppSwitch() {\n    this.callbackUpdateAppSwitchModal = await showAppSwitch(\n      this.applicationLayoutContext?.appSwitchConfig\n    );\n  }\n\n  private updateIsSlottedContent() {\n    const slotElement =\n      this.hostElement.shadowRoot.querySelector('.content slot');\n\n    this.hasSlottedElements = hasSlottedElements(slotElement);\n  }\n\n  private onContentBgClick(e: MouseEvent) {\n    if (e.target === this.contentBackground) {\n      e.preventDefault();\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{ [`breakpoint-${this.breakpoint}`]: true }}\n        slot=\"application-header\"\n      >\n        {this.breakpoint === 'sm' && this.suppressResponsive === false && (\n          <ix-menu-expand-icon\n            onClick={() => this.onMenuClick()}\n            expanded={this.menuExpanded}\n          ></ix-menu-expand-icon>\n        )}\n        {this.applicationLayoutContext?.appSwitchConfig &&\n          this.breakpoint !== 'sm' &&\n          this.suppressResponsive === false && (\n            <ix-icon-button\n              onClick={() => this.showAppSwitch()}\n              icon=\"apps\"\n              ghost\n              class=\"app-switch\"\n            ></ix-icon-button>\n          )}\n        <div class=\"logo\">\n          <slot name=\"logo\"></slot>\n        </div>\n        <div class=\"name\">{this.name}</div>\n        <div class=\"content\">\n          {this.breakpoint === 'sm' ? (\n            <Fragment>\n              <ix-icon-button\n                class={{\n                  ['context-menu']: true,\n                  ['context-menu-visible']: this.hasSlottedElements,\n                }}\n                data-context-menu\n                icon=\"more-menu\"\n                ghost\n              ></ix-icon-button>\n              <ix-dropdown\n                data-overflow-dropdown\n                class=\"dropdown\"\n                discoverAllSubmenus\n                trigger={this.resolveContextMenuButton()}\n              >\n                <div\n                  class=\"dropdown-content\"\n                  onClick={(e) => this.onContentBgClick(e)}\n                >\n                  <slot\n                    onSlotchange={() => this.updateIsSlottedContent()}\n                  ></slot>\n                </div>\n              </ix-dropdown>\n            </Fragment>\n          ) : (\n            <slot onSlotchange={() => this.updateIsSlottedContent()}></slot>\n          )}\n          <slot name=\"ix-application-header-avatar\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/{p-a6fbea5b.entry.js → p-c55db6c7.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as t,h as o,H as r,g as i}from"./p-26e9d40e.js";import{c as s}from"./p-e898862b.js";import{h as d}from"./p-712e0ee0.js";const a=":host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;max-width:19.75rem;border-color:var(--theme-group-item--border-color)}:host .group-header{height:4rem;min-height:4rem;max-height:4rem;border-radius:var(--theme-group--border-radius) var(--theme-group--border-radius) 0 0;display:flex;background-color:var(--theme-group-item--background);color:var(--theme-group-header--color);cursor:pointer}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover)}:host .group-header:not(.disabled):not(:disabled):hover.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):active,:host .group-header:not(.disabled):not(:disabled).active{background-color:var(--theme-group-item--background--active)}:host .group-header:not(.disabled):not(:disabled):active.selected,:host .group-header:not(.disabled):not(:disabled).active.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled):focus-visible{border:1px solid var(--theme-color-focus-bdr);border-radius:var(--theme-default-border-radius) var(--theme-default-border-radius) 0px 0px;outline:none}:host .group-header.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header.selected .group-header-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header .group-header-selection-indicator{background-color:var(--theme-color-input--focus)}:host .group-header .group-header-selection-indicator.group-header-selection-indicator-item-selected{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header-clickable{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}:host .group-header-selection-indicator{width:0.25rem;border-top-left-radius:var(--theme-group--border-radius)}:host .group-header-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;flex-grow:1;flex-basis:0;padding:0.5rem;padding-left:0}:host .group-header-content .group-header-props-container{width:100%}:host .group-header-content .group-header-title{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}:host .group-header-content .group-header-title>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;padding-right:0}:host .group-header-content .group-subheader{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}:host .expand-icon{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}:host .btn-expand-header{margin:0.5rem;margin-inline-end:0.25rem;min-width:1.5rem}:host .group-content{display:flex;flex-direction:column;gap:1px;margin-top:1px}:host .footer{visibility:collapse;height:auto;min-height:0}:host .footer-visible{visibility:visible}:host .hidden{display:none}";const h=a;const n=class{constructor(o){e(this,o);this.selectGroup=t(this,"selectGroup",7);this.selectItem=t(this,"selectItem",7);this.collapsedChanged=t(this,"collapsedChanged",7);this.suppressHeaderSelection=false;this.header=undefined;this.subHeader=undefined;this.collapsed=true;this.selected=undefined;this.index=undefined;this.expandOnHeaderClick=false;this.itemSelected=false;this.dropdownTriggerRef=undefined;this.slotSize=this.groupItems.length;this.footerVisible=false;this.showExpandCollapsedIcon=false}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-dropdown-item"))}get groupItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-item:not(.footer)"))}get groupContent(){return this.hostElement.shadowRoot.querySelector(".group-content")}onExpandClick(e){this.collapsed=!this.collapsed;this.collapsedChanged.emit(this.collapsed);e.stopPropagation()}onHeaderClick(e){this.setGroupSelection(!this.selected);if(this.suppressHeaderSelection){this.onExpandClick(e)}}onItemClick(e){if(e===this.index){this.index=undefined;this.selectItem.emit(undefined)}else{this.index=e;this.selectItem.emit(e)}if(this.index>=0){this.itemSelected=true}else this.itemSelected=false;this.setGroupSelection(false)}setGroupSelection(e){if(!this.suppressHeaderSelection){this.selected=e;this.selectGroup.emit(this.selected)}}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector('slot[name="footer"]');if(e){this.footerVisible=d(e)}}componentWillRender(){this.groupItems.forEach(((e,t)=>{if(this.selected===true){e.selected=false;this.index=undefined;this.itemSelected=false;return}e.selected=t===this.index;e.index=t}))}componentDidLoad(){this.observer=s((()=>{this.slotSize=this.groupItems.length}));this.observer.observe(this.groupContent,{childList:true});this.groupContent.addEventListener("selectedChanged",(e=>{this.onItemClick(e.detail.index)}))}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return o(r,{key:"6b775c7d0b0184c3d33c46c2401b378c3b6c4c08"},o("div",{key:"9a3c57add7b086b0223e8957e7863e0f0caa5c0b",class:{"group-header":true,expand:!this.collapsed,selected:this.selected},tabindex:"0"},o("div",{key:"ff7b3e3b0dd048cac13a13d892abaf3d9b12de08",class:"group-header-clickable",onClick:e=>this.onHeaderClick(e)},o("div",{key:"1b60a84b9c98de13a498ab54e88f72c54fa3d35c",class:{"group-header-selection-indicator":true,"group-header-selection-indicator-item-selected":this.itemSelected}}),o("div",{key:"bc128ad0a4fa2af31cbd03cb67fd8785f605bac1",class:"btn-expand-header"},o("ix-icon",{key:"8fbfe095e0d37b74804e67c174b347cca9471f60","data-testid":"expand-collapsed-icon",class:{hidden:!this.showExpandCollapsedIcon},name:this.collapsed?"chevron-right-small":"chevron-down-small",onClick:e=>this.onExpandClick(e)})),o("div",{key:"78551a007fe0e0919f556742020a9d2d510d2fb0",class:"group-header-content"},this.header?o("div",{class:"group-header-props-container"},o("div",{class:"group-header-title"},o("span",{title:this.header},this.header)),o("div",{class:"group-subheader",title:this.subHeader},this.subHeader)):null,o("slot",{key:"ad99eba2934c2a910e5260ac8f8c62f43319b674",name:"header"}))),o("ix-group-context-menu",{key:"b4203f23bc8c19bd45ad088c6314c5bb03187932"},o("slot",{key:"9b77656e2282afdfe7836c54bc970effb2c351f7",name:"dropdown"}))),o("div",{key:"a26dd0dfac3d432920ba566dc5d2dc5776ea7fce",class:{"group-content":true}},o("div",{key:"ba7fd9e27461fe30ed804e03d0e7b99b377f0dff",style:{display:this.collapsed?"none":"contents"}},o("slot",{key:"e4ce555634eae2b89f64d18ce2220d6ec677baf1",onSlotchange:()=>{const e=this.hostElement.shadowRoot.querySelector("slot:not([name])");this.showExpandCollapsedIcon=d(e)}}),o("ix-group-item",{key:"1f50e8d0639ad719f84dd938e8c30f28856a2ee3",suppressSelection:true,focusable:false,class:{footer:true,"footer-visible":this.footerVisible}},o("slot",{key:"96a102b08e08ff95f0f56ddf06b6ff47efdbb89c",name:"footer",onSlotchange:()=>this.onSlotChange()})))))}get hostElement(){return i(this)}};n.style=h;export{n as ix_group};
-//# sourceMappingURL=p-a6fbea5b.entry.js.map
+import{r as e,c as t,h as o,H as r,g as i}from"./p-f87cd962.js";import{c as s}from"./p-e898862b.js";import{h as d}from"./p-712e0ee0.js";const a=":host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;max-width:19.75rem;border-color:var(--theme-group-item--border-color)}:host .group-header{height:4rem;min-height:4rem;max-height:4rem;border-radius:var(--theme-group--border-radius) var(--theme-group--border-radius) 0 0;display:flex;background-color:var(--theme-group-item--background);color:var(--theme-group-header--color);cursor:pointer}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover)}:host .group-header:not(.disabled):not(:disabled):hover.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):active,:host .group-header:not(.disabled):not(:disabled).active{background-color:var(--theme-group-item--background--active)}:host .group-header:not(.disabled):not(:disabled):active.selected,:host .group-header:not(.disabled):not(:disabled).active.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled):focus-visible{border:1px solid var(--theme-color-focus-bdr);border-radius:var(--theme-default-border-radius) var(--theme-default-border-radius) 0px 0px;outline:none}:host .group-header.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header.selected .group-header-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header .group-header-selection-indicator{background-color:var(--theme-color-input--focus)}:host .group-header .group-header-selection-indicator.group-header-selection-indicator-item-selected{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header-clickable{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}:host .group-header-selection-indicator{width:0.25rem;border-top-left-radius:var(--theme-group--border-radius)}:host .group-header-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;flex-grow:1;flex-basis:0;padding:0.5rem;padding-left:0}:host .group-header-content .group-header-props-container{width:100%}:host .group-header-content .group-header-title{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}:host .group-header-content .group-header-title>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;padding-right:0}:host .group-header-content .group-subheader{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}:host .expand-icon{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}:host .btn-expand-header{margin:0.5rem;margin-inline-end:0.25rem;min-width:1.5rem}:host .group-content{display:flex;flex-direction:column;gap:1px;margin-top:1px}:host .footer{visibility:collapse;height:auto;min-height:0}:host .footer-visible{visibility:visible}:host .hidden{display:none}";const h=a;const n=class{constructor(o){e(this,o);this.selectGroup=t(this,"selectGroup",7);this.selectItem=t(this,"selectItem",7);this.collapsedChanged=t(this,"collapsedChanged",7);this.suppressHeaderSelection=false;this.header=undefined;this.subHeader=undefined;this.collapsed=true;this.selected=undefined;this.index=undefined;this.expandOnHeaderClick=false;this.itemSelected=false;this.dropdownTriggerRef=undefined;this.slotSize=this.groupItems.length;this.footerVisible=false;this.showExpandCollapsedIcon=false}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-dropdown-item"))}get groupItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-item:not(.footer)"))}get groupContent(){return this.hostElement.shadowRoot.querySelector(".group-content")}onExpandClick(e){this.collapsed=!this.collapsed;this.collapsedChanged.emit(this.collapsed);e.stopPropagation()}onHeaderClick(e){this.setGroupSelection(!this.selected);if(this.suppressHeaderSelection){this.onExpandClick(e)}}onItemClick(e){if(e===this.index){this.index=undefined;this.selectItem.emit(undefined)}else{this.index=e;this.selectItem.emit(e)}if(this.index>=0){this.itemSelected=true}else this.itemSelected=false;this.setGroupSelection(false)}setGroupSelection(e){if(!this.suppressHeaderSelection){this.selected=e;this.selectGroup.emit(this.selected)}}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector('slot[name="footer"]');if(e){this.footerVisible=d(e)}}componentWillRender(){this.groupItems.forEach(((e,t)=>{if(this.selected===true){e.selected=false;this.index=undefined;this.itemSelected=false;return}e.selected=t===this.index;e.index=t}))}componentDidLoad(){this.observer=s((()=>{this.slotSize=this.groupItems.length}));this.observer.observe(this.groupContent,{childList:true});this.groupContent.addEventListener("selectedChanged",(e=>{this.onItemClick(e.detail.index)}))}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return o(r,{key:"a6c09009cd058c03a46699d1514a51e5befb5018"},o("div",{key:"7d0802bd7566f7d47062e91a8264b6d783a8a44b",class:{"group-header":true,expand:!this.collapsed,selected:this.selected},tabindex:"0"},o("div",{key:"3f2e851b6d35893c2a3393348474e6cefa06ae79",class:"group-header-clickable",onClick:e=>this.onHeaderClick(e)},o("div",{key:"dfed4e7962f4f3b071cc6b8d64b4efa06f139ebb",class:{"group-header-selection-indicator":true,"group-header-selection-indicator-item-selected":this.itemSelected}}),o("div",{key:"afe8c9b382b2506f1c86a56abe4b29da07c52b9f",class:"btn-expand-header"},o("ix-icon",{key:"de63d1492943de8e4bcf2f1f76b61feab1beea50","data-testid":"expand-collapsed-icon",class:{hidden:!this.showExpandCollapsedIcon},name:this.collapsed?"chevron-right-small":"chevron-down-small",onClick:e=>this.onExpandClick(e)})),o("div",{key:"5ca15ab167295402b4fc5f226b14697777b3abba",class:"group-header-content"},this.header?o("div",{class:"group-header-props-container"},o("div",{class:"group-header-title"},o("span",{title:this.header},this.header)),o("div",{class:"group-subheader",title:this.subHeader},this.subHeader)):null,o("slot",{key:"2f78d4b163682214e6325b49ce69f2f737da0399",name:"header"}))),o("ix-group-context-menu",{key:"56a4bcd4e623012de4a7a1bcc66bb1f280f66e90"},o("slot",{key:"439f0ba04c6ec4543f740ca70b965cd50eae669f",name:"dropdown"}))),o("div",{key:"3cd56e5f026a12ad05ccf85760d2bb4a72ad47d4",class:{"group-content":true}},o("div",{key:"c4fb98c378079efb91edc03c5e88e7a01b33a223",style:{display:this.collapsed?"none":"contents"}},o("slot",{key:"f77631e111614e753f99ec942ff88142c2739c36",onSlotchange:()=>{const e=this.hostElement.shadowRoot.querySelector("slot:not([name])");this.showExpandCollapsedIcon=d(e)}}),o("ix-group-item",{key:"9f84823ab01988af424b0b3beff5acc7ec963d01",suppressSelection:true,focusable:false,class:{footer:true,"footer-visible":this.footerVisible}},o("slot",{key:"14b0b37dfd590c88021c8c4c714a362dc0e82188",name:"footer",onSlotchange:()=>this.onSlotChange()})))))}get hostElement(){return i(this)}};n.style=h;export{n as ix_group};
+//# sourceMappingURL=p-c55db6c7.entry.js.map

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

@@ -0,0 +1,2 @@
+import{r as e,h as o,H as t,g as r}from"./p-f87cd962.js";const a="label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}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:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-moz-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:-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,input:hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus,input:focus{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-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-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{box-shadow:none;background-color:transparent;outline:none;border:none;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{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{height:3.25rem;padding:0.375rem 1.25rem 0.375rem 0.5rem}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:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-moz-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:-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,textarea:hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus,textarea:focus{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-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-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{box-shadow:none;background-color:transparent;outline:none;border:none;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{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;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}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}:host{display:contents}";const n=a;const i=class{constructor(o){e(this,o);this.label=undefined}get inputElement(){return this.hostElement.querySelector("input")}componentWillLoad(){}render(){return o(t,{key:"34305cf7e6ee023ae323d2c1b13248bb08f50001"},this.label?o("label",{htmlFor:this.inputElement.id},this.label):null,o("slot",{key:"7d9937b61fd5f5aa4711a7551c0665a1f048bb47"}))}get hostElement(){return r(this)}};i.style=n;export{i as ix_form_field};
+//# sourceMappingURL=p-d03df401.entry.js.map

package/dist/siemens-ix/{p-43a58a77.entry.js.map → p-d03df401.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["formFieldCss","IxFormFieldStyle0","FormField","inputElement","this","hostElement","querySelector","componentWillLoad","render","h","Host","key","label","htmlFor","id"],"sources":["src/components/form-field/form-field.scss?tag=ix-form-field&encapsulation=shadow","src/components/form-field/form-field.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'components/form/input';\n\n:host {\n  display: contents;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-form-field',\n  styleUrl: 'form-field.scss',\n  shadow: true,\n})\nexport class FormField {\n  @Element() hostElement!: HTMLIxFormFieldElement;\n\n  /**\n   * Label\n   */\n  @Prop() label: string;\n\n  private get inputElement() {\n    return this.hostElement.querySelector('input');\n  }\n\n  componentWillLoad() {}\n\n  render() {\n    return (\n      <Host>\n        {this.label ? (\n          <label htmlFor={this.inputElement.id}>{this.label}</label>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAe,opSACrB,MAAAC,EAAeD,E,MCcFE,EAAS,M,8CAQpB,gBAAYC,GACV,OAAOC,KAAKC,YAAYC,cAAc,Q,CAGxC,iBAAAC,GAAiB,CAEjB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFP,KAAKQ,MACJH,EAAA,SAAOI,QAAST,KAAKD,aAAaW,IAAKV,KAAKQ,OAC1C,KACJH,EAAA,QAAAE,IAAA,6C"}
+{"version":3,"names":["formFieldCss","IxFormFieldStyle0","FormField","inputElement","this","hostElement","querySelector","componentWillLoad","render","h","Host","key","label","htmlFor","id"],"sources":["src/components/form-field/form-field.scss?tag=ix-form-field&encapsulation=shadow","src/components/form-field/form-field.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'components/form/input';\n\n:host {\n  display: contents;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-form-field',\n  styleUrl: 'form-field.scss',\n  shadow: true,\n})\nexport class FormField {\n  @Element() hostElement!: HTMLIxFormFieldElement;\n\n  /**\n   * Label\n   */\n  @Prop() label: string;\n\n  private get inputElement() {\n    return this.hostElement.querySelector('input');\n  }\n\n  componentWillLoad() {}\n\n  render() {\n    return (\n      <Host>\n        {this.label ? (\n          <label htmlFor={this.inputElement.id}>{this.label}</label>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAe,wsSACrB,MAAAC,EAAeD,E,MCcFE,EAAS,M,8CAQpB,gBAAYC,GACV,OAAOC,KAAKC,YAAYC,cAAc,Q,CAGxC,iBAAAC,GAAiB,CAEjB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFP,KAAKQ,MACJH,EAAA,SAAOI,QAAST,KAAKD,aAAaW,IAAKV,KAAKQ,OAC1C,KACJH,EAAA,QAAAE,IAAA,6C"}

package/dist/siemens-ix/{p-2637665e.entry.js → p-d14024d3.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as a,H as s}from"./p-26e9d40e.js";const i=":host{display:flex;flex-direction:row;align-items:flex-start;padding:0px}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0%}:host .subtitle{margin-top:0.5rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";const o=i;const c=class{constructor(a){t(this,a);this.backButtonClick=e(this,"backButtonClick",7);this.variant="primary";this.headerTitle=undefined;this.headerSubtitle=undefined;this.hasBackButton=false}render(){return a(s,{key:"eae27014039b16c023892b60cc904609e55b89ad"},this.hasBackButton?a("ix-icon-button",{class:"backButton",variant:"primary",icon:"arrow-left",ghost:true,onClick:()=>this.backButtonClick.emit()}):null,a("div",{key:"397be2503715bb15d260bcfada2260a8eb72e33b",class:"titleGroup"},a("ix-typography",{key:"5d08e001eb5178aaf4b089a4faa15bc759a43b6b",variant:this.variant==="secondary"?"large-single":"h2"},this.headerTitle),this.headerSubtitle!==undefined?a("ix-typography",{variant:"caption",color:"soft",class:"subtitle"},this.headerSubtitle):null),a("div",{key:"6c6cc165c96307a6ee2c2bec59a80d6cd62a02cf",class:"buttons"},a("slot",{key:"0ac3730bb5ec852b127554e8dbdd73970204e275"})))}};c.style=o;export{c as ix_content_header};
-//# sourceMappingURL=p-2637665e.entry.js.map
+import{r as t,c as e,h as a,H as s}from"./p-f87cd962.js";const i=":host{display:flex;flex-direction:row;align-items:flex-start;padding:0px}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0%}:host .subtitle{margin-top:0.5rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";const c=i;const o=class{constructor(a){t(this,a);this.backButtonClick=e(this,"backButtonClick",7);this.variant="primary";this.headerTitle=undefined;this.headerSubtitle=undefined;this.hasBackButton=false}render(){return a(s,{key:"eae27014039b16c023892b60cc904609e55b89ad"},this.hasBackButton?a("ix-icon-button",{class:"backButton",variant:"primary",icon:"arrow-left",ghost:true,onClick:()=>this.backButtonClick.emit()}):null,a("div",{key:"397be2503715bb15d260bcfada2260a8eb72e33b",class:"titleGroup"},a("ix-typography",{key:"5d08e001eb5178aaf4b089a4faa15bc759a43b6b",variant:this.variant==="secondary"?"large-single":"h2"},this.headerTitle),this.headerSubtitle!==undefined?a("ix-typography",{variant:"caption",color:"soft",class:"subtitle"},this.headerSubtitle):null),a("div",{key:"6c6cc165c96307a6ee2c2bec59a80d6cd62a02cf",class:"buttons"},a("slot",{key:"0ac3730bb5ec852b127554e8dbdd73970204e275"})))}};o.style=c;export{o as ix_content_header};
+//# sourceMappingURL=p-d14024d3.entry.js.map

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

@@ -0,0 +1,2 @@
+import{r as t,h as o,H as r,g as e}from"./p-f87cd962.js";const i=":host{display:inline-block;position:relative;height:2rem;width:auto}: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 .hide{display:none}:host .dropdown-button{display:block;position:relative;width:100%;height:100%}:host .dropdown-button>ix-button{width:100%;height:100%}:host .dropdown-button .button-label{margin-right:auto;min-width:0px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .dropdown-button .dropdown-icon{margin-right:0.25rem}:host .triangle{position:absolute;margin-inline-start:1.5625rem;margin-block-start:-0.4375rem;border-right:0 solid transparent;border-left:4px solid transparent;border-top:0 solid transparent;border-bottom:4px solid;color:var(--theme-btn-primary--color)}:host .triangle.primary.ghost{color:var(--theme-btn-invisible-primary--color)}:host .triangle.primary.outline{color:var(--theme-btn-outline-primary--color)}:host .triangle.primary.ghost.disabled{color:var(--theme-btn-invisible-primary--color--disabled)}:host .triangle.primary.outline.disabled{color:var(--theme-btn-outline-primary--color--disabled)}:host .triangle.primary.disabled{color:var(--theme-btn-primary--color--disabled)}:host .triangle.secondary.ghost{color:var(--theme-btn-invisible-secondary--color)}:host .triangle.secondary.outline{color:var(--theme-btn-outline-secondary--color)}:host .triangle.secondary.ghost.disabled{color:var(--theme-btn-invisible-secondary--color--disabled)}:host .triangle.secondary.outline.disabled{color:var(--theme-btn-outline-secondary--color--disabled)}:host .triangle.secondary.disabled{color:var(--theme-btn-secondary--color--disabled)}:host .content{display:flex;align-items:center}:host(.disabled){pointer-events:none}";const s=i;const a=class{constructor(o){t(this,o);this.variant="primary";this.outline=false;this.ghost=false;this.disabled=false;this.label=undefined;this.icon=undefined;this.closeBehavior="both";this.placement=undefined;this.dropdownAnchor=undefined}getTriangle(){return o("div",{class:{triangle:true,hide:this.label!=="",primary:this.variant==="primary",secondary:this.variant==="secondary",ghost:this.ghost,outline:this.outline,disabled:this.disabled}})}render(){return o(r,{key:"8669f7d302b6009aa9ab9cadb3c86e4bbcc6330f",class:{disabled:this.disabled},ref:t=>{this.dropdownAnchor=t}},o("div",{key:"5561196cfa6584097b0395ca1d4bf61db522b5a8",class:"dropdown-button"},this.label?o("ix-button",{variant:this.variant,outline:this.outline,ghost:this.ghost,disabled:this.disabled,alignment:"start"},o("div",{class:"content"},this.icon?o("ix-icon",{name:this.icon,size:"24",class:"dropdown-icon"}):null,o("div",{class:"button-label"},this.label),o("ix-icon",{name:"chevron-down-small",size:"24"}))):o("div",null,o("ix-icon-button",{icon:this.icon,variant:this.variant,outline:this.outline,ghost:this.ghost,disabled:this.disabled}),this.getTriangle())),o("ix-dropdown",{key:"4b738dfff8c84360e1d561560c3b29ba21684de6",class:"dropdown",trigger:this.dropdownAnchor,placement:this.placement,closeBehavior:this.closeBehavior},o("slot",{key:"ad15df81aad664b12a3183b45e443b110d2b4393"})))}get hostElement(){return e(this)}};a.style=s;export{a as ix_dropdown_button};
+//# sourceMappingURL=p-d1f49940.entry.js.map

package/dist/siemens-ix/{p-902d1046.entry.js.map → p-d1f49940.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["dropdownButtonCss","IxDropdownButtonStyle0","DropdownButton","getTriangle","h","class","triangle","hide","this","label","primary","variant","secondary","ghost","outline","disabled","render","Host","key","ref","dropdownAnchor","alignment","icon","name","size","trigger","placement","closeBehavior"],"sources":["src/components/dropdown-button/dropdown-button.scss?tag=ix-dropdown-button&encapsulation=shadow","src/components/dropdown-button/dropdown-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: inline-block;\n  position: relative;\n  height: $x-large-space;\n  width: auto;\n\n  .hide {\n    display: none;\n  }\n\n  .dropdown-button {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button > ix-button {\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button .button-label {\n    margin-right: auto;\n    min-width: 0px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .dropdown-button .dropdown-icon {\n    margin-right: 0.25rem;\n  }\n\n  .triangle {\n    position: absolute;\n    margin-inline-start: 1.5625rem;\n    margin-block-start: -0.4375rem;\n    border-right: 0 solid transparent;\n    border-left: 4px solid transparent;\n    border-top: 0 solid transparent;\n    border-bottom: 4px solid;\n    color: var(--theme-btn-primary--color);\n  }\n\n  .triangle.primary {\n    &.ghost {\n      color: var(--theme-btn-invisible-primary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-primary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-primary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-primary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-primary--color--disabled);\n    }\n  }\n\n  .triangle.secondary {\n    &.ghost {\n      color: var(--theme-btn-invisible-secondary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-secondary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-secondary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-secondary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-secondary--color--disabled);\n    }\n  }\n\n  .content {\n    display: flex;\n    align-items: center;\n  }\n}\n\n:host(.disabled) {\n  pointer-events: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { ButtonVariant } from '../button/button';\nimport { AlignedPlacement } from '../dropdown/placement';\n\nexport type DropdownButtonVariant = ButtonVariant;\n\n/**\n * @since 1.3.0\n */\n@Component({\n  tag: 'ix-dropdown-button',\n  styleUrl: 'dropdown-button.scss',\n  shadow: true,\n})\nexport class DropdownButton {\n  @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n  /**\n   * Button variant\n   */\n  @Prop() variant: DropdownButtonVariant = 'primary';\n\n  /**\n   * Outline button\n   */\n  @Prop() outline = false;\n\n  /**\n   * Button with no background or outline\n   */\n  @Prop() ghost = false;\n\n  /**\n   * Disable button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set label\n   */\n  @Prop() label: string;\n\n  /**\n   * Button icon\n   */\n  @Prop() icon: string;\n\n  /**\n   * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n   * @since 2.1.0\n   */\n  @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n  /**\n   * Placement of the dropdown\n   *\n   * @since 2.0.0\n   */\n  @Prop() placement: AlignedPlacement;\n\n  @State() dropdownAnchor!: HTMLElement;\n\n  private getTriangle() {\n    return (\n      <div\n        class={{\n          triangle: true,\n          hide: this.label !== '',\n          primary: this.variant === 'primary',\n          secondary: this.variant === 'secondary',\n          ghost: this.ghost,\n          outline: this.outline,\n          disabled: this.disabled,\n        }}\n      ></div>\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n        ref={(ref) => {\n          this.dropdownAnchor = ref;\n        }}\n      >\n        <div class=\"dropdown-button\">\n          {this.label ? (\n            <ix-button\n              variant={this.variant}\n              outline={this.outline}\n              ghost={this.ghost}\n              disabled={this.disabled}\n              alignment=\"start\"\n            >\n              <div class={'content'}>\n                {this.icon ? (\n                  <ix-icon\n                    name={this.icon}\n                    size=\"24\"\n                    class={'dropdown-icon'}\n                  ></ix-icon>\n                ) : null}\n                <div class={'button-label'}>{this.label}</div>\n                <ix-icon name={'chevron-down-small'} size=\"24\"></ix-icon>\n              </div>\n            </ix-button>\n          ) : (\n            <div>\n              <ix-icon-button\n                icon={this.icon}\n                variant={this.variant}\n                outline={this.outline}\n                ghost={this.ghost}\n                disabled={this.disabled}\n              ></ix-icon-button>\n              {this.getTriangle()}\n            </div>\n          )}\n        </div>\n\n        <ix-dropdown\n          class=\"dropdown\"\n          trigger={this.dropdownAnchor}\n          placement={this.placement}\n          closeBehavior={this.closeBehavior}\n        >\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAoB,gsEAC1B,MAAAC,EAAeD,E,MCsBFE,EAAc,M,sCAMgB,U,aAKvB,M,WAKF,M,cAKG,M,4DAgB8C,O,uDAWzD,WAAAC,GACN,OACEC,EAAA,OACEC,MAAO,CACLC,SAAU,KACVC,KAAMC,KAAKC,QAAU,GACrBC,QAASF,KAAKG,UAAY,UAC1BC,UAAWJ,KAAKG,UAAY,YAC5BE,MAAOL,KAAKK,MACZC,QAASN,KAAKM,QACdC,SAAUP,KAAKO,W,CAMvB,MAAAC,GACE,OACEZ,EAACa,EAAI,CAAAC,IAAA,2CACHb,MAAO,CACLU,SAAUP,KAAKO,UAEjBI,IAAMA,IACJX,KAAKY,eAAiBD,CAAG,GAG3Bf,EAAA,OAAAc,IAAA,2CAAKb,MAAM,mBACRG,KAAKC,MACJL,EAAA,aACEO,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,SACfM,UAAU,SAEVjB,EAAA,OAAKC,MAAO,WACTG,KAAKc,KACJlB,EAAA,WACEmB,KAAMf,KAAKc,KACXE,KAAK,KACLnB,MAAO,kBAEP,KACJD,EAAA,OAAKC,MAAO,gBAAiBG,KAAKC,OAClCL,EAAA,WAASmB,KAAM,qBAAsBC,KAAK,SAI9CpB,EAAA,WACEA,EAAA,kBACEkB,KAAMd,KAAKc,KACXX,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,WAEhBP,KAAKL,gBAKZC,EAAA,eAAAc,IAAA,2CACEb,MAAM,WACNoB,QAASjB,KAAKY,eACdM,UAAWlB,KAAKkB,UAChBC,cAAenB,KAAKmB,eAEpBvB,EAAA,QAAAc,IAAA,8C"}
+{"version":3,"names":["dropdownButtonCss","IxDropdownButtonStyle0","DropdownButton","getTriangle","h","class","triangle","hide","this","label","primary","variant","secondary","ghost","outline","disabled","render","Host","key","ref","dropdownAnchor","alignment","icon","name","size","trigger","placement","closeBehavior"],"sources":["src/components/dropdown-button/dropdown-button.scss?tag=ix-dropdown-button&encapsulation=shadow","src/components/dropdown-button/dropdown-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: inline-block;\n  position: relative;\n  height: $x-large-space;\n  width: auto;\n\n  .hide {\n    display: none;\n  }\n\n  .dropdown-button {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button > ix-button {\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button .button-label {\n    margin-right: auto;\n    min-width: 0px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .dropdown-button .dropdown-icon {\n    margin-right: 0.25rem;\n  }\n\n  .triangle {\n    position: absolute;\n    margin-inline-start: 1.5625rem;\n    margin-block-start: -0.4375rem;\n    border-right: 0 solid transparent;\n    border-left: 4px solid transparent;\n    border-top: 0 solid transparent;\n    border-bottom: 4px solid;\n    color: var(--theme-btn-primary--color);\n  }\n\n  .triangle.primary {\n    &.ghost {\n      color: var(--theme-btn-invisible-primary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-primary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-primary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-primary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-primary--color--disabled);\n    }\n  }\n\n  .triangle.secondary {\n    &.ghost {\n      color: var(--theme-btn-invisible-secondary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-secondary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-secondary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-secondary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-secondary--color--disabled);\n    }\n  }\n\n  .content {\n    display: flex;\n    align-items: center;\n  }\n}\n\n:host(.disabled) {\n  pointer-events: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { ButtonVariant } from '../button/button';\nimport { AlignedPlacement } from '../dropdown/placement';\n\nexport type DropdownButtonVariant = ButtonVariant;\n\n/**\n * @since 1.3.0\n */\n@Component({\n  tag: 'ix-dropdown-button',\n  styleUrl: 'dropdown-button.scss',\n  shadow: true,\n})\nexport class DropdownButton {\n  @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n  /**\n   * Button variant\n   */\n  @Prop() variant: DropdownButtonVariant = 'primary';\n\n  /**\n   * Outline button\n   */\n  @Prop() outline = false;\n\n  /**\n   * Button with no background or outline\n   */\n  @Prop() ghost = false;\n\n  /**\n   * Disable button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set label\n   */\n  @Prop() label: string;\n\n  /**\n   * Button icon\n   */\n  @Prop() icon: string;\n\n  /**\n   * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n   * @since 2.1.0\n   */\n  @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n  /**\n   * Placement of the dropdown\n   *\n   * @since 2.0.0\n   */\n  @Prop() placement: AlignedPlacement;\n\n  @State() dropdownAnchor!: HTMLElement;\n\n  private getTriangle() {\n    return (\n      <div\n        class={{\n          triangle: true,\n          hide: this.label !== '',\n          primary: this.variant === 'primary',\n          secondary: this.variant === 'secondary',\n          ghost: this.ghost,\n          outline: this.outline,\n          disabled: this.disabled,\n        }}\n      ></div>\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n        ref={(ref) => {\n          this.dropdownAnchor = ref;\n        }}\n      >\n        <div class=\"dropdown-button\">\n          {this.label ? (\n            <ix-button\n              variant={this.variant}\n              outline={this.outline}\n              ghost={this.ghost}\n              disabled={this.disabled}\n              alignment=\"start\"\n            >\n              <div class={'content'}>\n                {this.icon ? (\n                  <ix-icon\n                    name={this.icon}\n                    size=\"24\"\n                    class={'dropdown-icon'}\n                  ></ix-icon>\n                ) : null}\n                <div class={'button-label'}>{this.label}</div>\n                <ix-icon name={'chevron-down-small'} size=\"24\"></ix-icon>\n              </div>\n            </ix-button>\n          ) : (\n            <div>\n              <ix-icon-button\n                icon={this.icon}\n                variant={this.variant}\n                outline={this.outline}\n                ghost={this.ghost}\n                disabled={this.disabled}\n              ></ix-icon-button>\n              {this.getTriangle()}\n            </div>\n          )}\n        </div>\n\n        <ix-dropdown\n          class=\"dropdown\"\n          trigger={this.dropdownAnchor}\n          placement={this.placement}\n          closeBehavior={this.closeBehavior}\n        >\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAoB,41EAC1B,MAAAC,EAAeD,E,MCsBFE,EAAc,M,sCAMgB,U,aAKvB,M,WAKF,M,cAKG,M,4DAgB8C,O,uDAWzD,WAAAC,GACN,OACEC,EAAA,OACEC,MAAO,CACLC,SAAU,KACVC,KAAMC,KAAKC,QAAU,GACrBC,QAASF,KAAKG,UAAY,UAC1BC,UAAWJ,KAAKG,UAAY,YAC5BE,MAAOL,KAAKK,MACZC,QAASN,KAAKM,QACdC,SAAUP,KAAKO,W,CAMvB,MAAAC,GACE,OACEZ,EAACa,EAAI,CAAAC,IAAA,2CACHb,MAAO,CACLU,SAAUP,KAAKO,UAEjBI,IAAMA,IACJX,KAAKY,eAAiBD,CAAG,GAG3Bf,EAAA,OAAAc,IAAA,2CAAKb,MAAM,mBACRG,KAAKC,MACJL,EAAA,aACEO,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,SACfM,UAAU,SAEVjB,EAAA,OAAKC,MAAO,WACTG,KAAKc,KACJlB,EAAA,WACEmB,KAAMf,KAAKc,KACXE,KAAK,KACLnB,MAAO,kBAEP,KACJD,EAAA,OAAKC,MAAO,gBAAiBG,KAAKC,OAClCL,EAAA,WAASmB,KAAM,qBAAsBC,KAAK,SAI9CpB,EAAA,WACEA,EAAA,kBACEkB,KAAMd,KAAKc,KACXX,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,WAEhBP,KAAKL,gBAKZC,EAAA,eAAAc,IAAA,2CACEb,MAAM,WACNoB,QAASjB,KAAKY,eACdM,UAAWlB,KAAKkB,UAChBC,cAAenB,KAAKmB,eAEpBvB,EAAA,QAAAc,IAAA,8C"}

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

@@ -0,0 +1,2 @@
+import{r as t,c as o,h as e,H as s,g as a}from"./p-f87cd962.js";const r=":host{display:flex;flex-direction:column;position:relative;min-width:17.5rem;max-width:17.5rem;min-height:3.5rem;pointer-events:all;background-color:var(--theme-toast--background);border:var(--theme-toast--border-thickness) solid var(--theme-toast--border-color);border-radius:var(--theme-toast--border-radius);box-shadow:var(--theme-toast--box-shadow);--animate-duration:300ms}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .toast-body{display:flex;position:relative;min-height:3.5rem;width:100%;flex-grow:1;padding:0.75rem}:host .toast-body .toast-icon{display:flex;align-items:flex-start;margin-right:1rem}:host .toast-body .toast-content{overflow:hidden;text-overflow:ellipsis;min-width:0;width:100%}:host .toast-body .toast-content .toast-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text);margin:0.25rem 0px}:host .toast-body .toast-content .toast-message{min-width:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host .toast-body .toast-icon+.toast-content{max-width:10.25rem}:host .toast-close{display:flex;position:relative;pointer-events:all;margin-left:auto;margin-right:0px}:host .toast-progress-bar{position:absolute;bottom:0;height:0.25rem;width:100%;background-color:var(--theme-toast-timer-value--background);transform-origin:left}:host .toast-progress-bar--animated{animation:trackProgress linear 1 forwards}@keyframes trackProgress{0%{transform:scaleX(1)}100%{transform:scaleX(0)}}";const i=r;const n=class{constructor(e){t(this,e);this.closeToast=o(this,"closeToast",7);this.type="info";this.toastTitle=undefined;this.autoCloseDelay=5e3;this.autoClose=true;this.icon=undefined;this.iconColor=undefined;this.progress=0;this.touched=false}getIcon(){if(this.icon){return e("ix-icon",{"data-testid":"toast-icon",name:this.icon,color:this.iconColor,size:"24"})}switch(this.type){case"info":return e("ix-icon",{"data-testid":"toast-icon",name:"info",size:"24",color:"color-std-text"});case"error":return e("ix-icon",{"data-testid":"toast-icon",name:"error",size:"24",color:"color-alarm"});case"success":return e("ix-icon",{"data-testid":"toast-icon",name:"success",size:"24",color:"color-success"});case"warning":return e("ix-icon",{"data-testid":"toast-icon",name:"warning",size:"24",color:"color-warning"});default:return""}}close(){if(this.hostElement){this.hostElement.classList.add("animate__fadeOut")}setTimeout((()=>{this.closeToast.emit()}),250)}render(){let t={};const o=["toast-progress-bar"];t={animationDuration:`${this.autoCloseDelay}ms`,animationPlayState:this.touched?"paused":"running"};o.push("toast-progress-bar--animated");return e(s,{key:"165e8ce47907c08afaef29ec7741efaddaf59d0f",class:"animate__animated animate__fadeIn"},e("div",{key:"fff7c4afb35bf57eead0fa4b484e0843dcf6c163",class:"toast-body",onPointerLeave:()=>{this.touched=false},onPointerEnter:()=>{this.touched=true}},this.type||this.icon?e("div",{class:"toast-icon"},this.getIcon()):null,e("div",{key:"cd9db0e7591fc8cc069608cff6c3824b4063b1df",class:"toast-content"},this.toastTitle?e("div",{class:"toast-title"},this.toastTitle):null,e("div",{key:"5c850aab1090ec83bfbb2ed4be68d665efaa403f",class:"toast-message"},e("slot",{key:"0f857c156d576f8bc62cca7f2ab50df00fe3e794"}))),e("div",{key:"47db8f9094de72a16be06466bd694923d86492ff",class:"toast-close"},e("ix-icon-button",{key:"db141553999f04175cb135c9b89b7655a5eae216",icon:"close",size:"24",ghost:true,onClick:()=>this.closeToast.emit()}))),this.autoClose?e("div",{class:o.join(" "),style:t,onAnimationEnd:()=>{this.close()},onTransitionEnd:()=>{if(this.progress===0){this.close()}}}):null)}get hostElement(){return a(this)}};n.style=i;export{n as ix_toast};
+//# sourceMappingURL=p-d95cbd1f.entry.js.map

package/dist/siemens-ix/{p-784fe260.entry.js.map → p-d95cbd1f.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["toastCss","IxToastStyle0","Toast","getIcon","this","icon","h","name","color","iconColor","size","type","close","hostElement","classList","add","setTimeout","closeToast","emit","render","progressBarStyle","progressBarClass","animationDuration","autoCloseDelay","animationPlayState","touched","push","Host","key","class","onPointerLeave","onPointerEnter","toastTitle","ghost","onClick","autoClose","join","style","onAnimationEnd","onTransitionEnd","progress"],"sources":["src/components/toast/toast.scss?tag=ix-toast&encapsulation=shadow","src/components/toast/toast.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n@import 'legacy/mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-width: 17.5rem;\n  max-width: 17.5rem;\n  min-height: 3.5rem;\n\n  pointer-events: all;\n\n  background-color: var(--theme-toast--background);\n  border: var(--theme-toast--border-thickness) solid\n    var(--theme-toast--border-color);\n  border-radius: var(--theme-toast--border-radius);\n  box-shadow: var(--theme-toast--box-shadow);\n\n  --animate-duration: #{$medium-time};\n\n  .toast-body {\n    display: flex;\n    position: relative;\n    min-height: 3.5rem;\n    width: 100%;\n    flex-grow: 1;\n    padding: 0.75rem;\n\n    .toast-icon {\n      display: flex;\n      align-items: flex-start;\n      margin-right: $default-space;\n    }\n\n    .toast-content {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n      width: 100%;\n\n      .toast-title {\n        @include text-default-title-single;\n        margin: 0.25rem 0px;\n      }\n\n      .toast-message {\n        min-width: 0;\n\n        @include text-default;\n      }\n    }\n\n    .toast-icon + .toast-content {\n      max-width: 10.25rem;\n    }\n  }\n\n  .toast-close {\n    display: flex;\n    position: relative;\n    pointer-events: all;\n    margin-left: auto;\n    margin-right: 0px;\n  }\n\n  .toast-progress-bar {\n    position: absolute;\n    bottom: 0;\n    height: $tiny-space;\n    width: 100%;\n    background-color: var(--theme-toast-timer-value--background);\n    transform-origin: left;\n\n    &--animated {\n      animation: trackProgress linear 1 forwards;\n    }\n  }\n\n  @keyframes trackProgress {\n    0% {\n      transform: scaleX(1);\n    }\n    100% {\n      transform: scaleX(0);\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { ToastType } from './toast-utils';\n\n@Component({\n  tag: 'ix-toast',\n  styleUrl: 'toast.scss',\n  shadow: true,\n})\nexport class Toast {\n  /**\n   * Toast type\n   */\n  @Prop() type: ToastType = 'info';\n\n  /**\n   * Toast title\n   */\n  @Prop() toastTitle: string;\n\n  /**\n   * Autoclose title after delay\n   */\n  @Prop() autoCloseDelay = 5000;\n\n  /**\n   * Autoclose behavior\n   */\n  @Prop() autoClose = true;\n\n  /**\n   * Icon of toast\n   */\n  @Prop() icon: string;\n\n  /**\n   * Icon color of toast\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Toast closed\n   */\n  @Event() closeToast: EventEmitter;\n\n  @State() progress = 0;\n  @State() touched = false;\n\n  @Element() hostElement!: HTMLIxToastElement;\n\n  private getIcon() {\n    if (this.icon) {\n      return (\n        <ix-icon\n          data-testid=\"toast-icon\"\n          name={this.icon}\n          color={this.iconColor}\n          size=\"24\"\n        />\n      );\n    }\n\n    switch (this.type) {\n      case 'info':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'info'}\n            size=\"24\"\n            color=\"color-std-text\"\n          />\n        );\n\n      case 'error':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'error'}\n            size=\"24\"\n            color=\"color-alarm\"\n          />\n        );\n\n      case 'success':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'success'}\n            size=\"24\"\n            color=\"color-success\"\n          />\n        );\n\n      case 'warning':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'warning'}\n            size=\"24\"\n            color=\"color-warning\"\n          />\n        );\n\n      default:\n        return '';\n    }\n  }\n\n  private close() {\n    if (this.hostElement) {\n      this.hostElement.classList.add('animate__fadeOut');\n    }\n    setTimeout(() => {\n      this.closeToast.emit();\n    }, 250);\n  }\n\n  render() {\n    let progressBarStyle: Record<string, string> = {};\n\n    const progressBarClass = ['toast-progress-bar'];\n\n    progressBarStyle = {\n      animationDuration: `${this.autoCloseDelay}ms`,\n      animationPlayState: this.touched ? 'paused' : 'running',\n    };\n\n    progressBarClass.push('toast-progress-bar--animated');\n\n    return (\n      <Host class=\"animate__animated animate__fadeIn\">\n        <div\n          class=\"toast-body\"\n          onPointerLeave={() => {\n            this.touched = false;\n          }}\n          onPointerEnter={() => {\n            this.touched = true;\n          }}\n        >\n          {this.type || this.icon ? (\n            <div class=\"toast-icon\">{this.getIcon()}</div>\n          ) : null}\n          <div class=\"toast-content\">\n            {this.toastTitle ? (\n              <div class=\"toast-title\">{this.toastTitle}</div>\n            ) : null}\n            <div class=\"toast-message\">\n              <slot></slot>\n            </div>\n          </div>\n          <div class=\"toast-close\">\n            <ix-icon-button\n              icon={'close'}\n              size=\"24\"\n              ghost\n              onClick={() => this.closeToast.emit()}\n            />\n          </div>\n        </div>\n        {this.autoClose ? (\n          <div\n            class={progressBarClass.join(' ')}\n            style={progressBarStyle}\n            onAnimationEnd={() => {\n              this.close();\n            }}\n            onTransitionEnd={() => {\n              if (this.progress === 0) {\n                this.close();\n              }\n            }}\n          ></div>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAW,utEACjB,MAAAC,EAAeD,E,MCyBFE,EAAK,M,0EAIU,O,8CAUD,I,eAKL,K,2DAiBA,E,aACD,K,CAIX,OAAAC,GACN,GAAIC,KAAKC,KAAM,CACb,OACEC,EAAA,yBACc,aACZC,KAAMH,KAAKC,KACXG,MAAOJ,KAAKK,UACZC,KAAK,M,CAKX,OAAQN,KAAKO,MACX,IAAK,OACH,OACEL,EAAA,yBACc,aACZC,KAAM,OACNG,KAAK,KACLF,MAAM,mBAIZ,IAAK,QACH,OACEF,EAAA,yBACc,aACZC,KAAM,QACNG,KAAK,KACLF,MAAM,gBAIZ,IAAK,UACH,OACEF,EAAA,yBACc,aACZC,KAAM,UACNG,KAAK,KACLF,MAAM,kBAIZ,IAAK,UACH,OACEF,EAAA,yBACc,aACZC,KAAM,UACNG,KAAK,KACLF,MAAM,kBAIZ,QACE,MAAO,G,CAIL,KAAAI,GACN,GAAIR,KAAKS,YAAa,CACpBT,KAAKS,YAAYC,UAAUC,IAAI,mB,CAEjCC,YAAW,KACTZ,KAAKa,WAAWC,MAAM,GACrB,I,CAGL,MAAAC,GACE,IAAIC,EAA2C,GAE/C,MAAMC,EAAmB,CAAC,sBAE1BD,EAAmB,CACjBE,kBAAmB,GAAGlB,KAAKmB,mBAC3BC,mBAAoBpB,KAAKqB,QAAU,SAAW,WAGhDJ,EAAiBK,KAAK,gCAEtB,OACEpB,EAACqB,EAAI,CAAAC,IAAA,2CAACC,MAAM,qCACVvB,EAAA,OAAAsB,IAAA,2CACEC,MAAM,aACNC,eAAgB,KACd1B,KAAKqB,QAAU,KAAK,EAEtBM,eAAgB,KACd3B,KAAKqB,QAAU,IAAI,GAGpBrB,KAAKO,MAAQP,KAAKC,KACjBC,EAAA,OAAKuB,MAAM,cAAczB,KAAKD,WAC5B,KACJG,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,iBACRzB,KAAK4B,WACJ1B,EAAA,OAAKuB,MAAM,eAAezB,KAAK4B,YAC7B,KACJ1B,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,iBACTvB,EAAA,QAAAsB,IAAA,+CAGJtB,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,eACTvB,EAAA,kBAAAsB,IAAA,2CACEvB,KAAM,QACNK,KAAK,KACLuB,MAAK,KACLC,QAAS,IAAM9B,KAAKa,WAAWC,WAIpCd,KAAK+B,UACJ7B,EAAA,OACEuB,MAAOR,EAAiBe,KAAK,KAC7BC,MAAOjB,EACPkB,eAAgB,KACdlC,KAAKQ,OAAO,EAEd2B,gBAAiB,KACf,GAAInC,KAAKoC,WAAa,EAAG,CACvBpC,KAAKQ,O,KAIT,K"}
+{"version":3,"names":["toastCss","IxToastStyle0","Toast","getIcon","this","icon","h","name","color","iconColor","size","type","close","hostElement","classList","add","setTimeout","closeToast","emit","render","progressBarStyle","progressBarClass","animationDuration","autoCloseDelay","animationPlayState","touched","push","Host","key","class","onPointerLeave","onPointerEnter","toastTitle","ghost","onClick","autoClose","join","style","onAnimationEnd","onTransitionEnd","progress"],"sources":["src/components/toast/toast.scss?tag=ix-toast&encapsulation=shadow","src/components/toast/toast.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n@import 'legacy/mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-width: 17.5rem;\n  max-width: 17.5rem;\n  min-height: 3.5rem;\n\n  pointer-events: all;\n\n  background-color: var(--theme-toast--background);\n  border: var(--theme-toast--border-thickness) solid\n    var(--theme-toast--border-color);\n  border-radius: var(--theme-toast--border-radius);\n  box-shadow: var(--theme-toast--box-shadow);\n\n  --animate-duration: #{$medium-time};\n\n  .toast-body {\n    display: flex;\n    position: relative;\n    min-height: 3.5rem;\n    width: 100%;\n    flex-grow: 1;\n    padding: 0.75rem;\n\n    .toast-icon {\n      display: flex;\n      align-items: flex-start;\n      margin-right: $default-space;\n    }\n\n    .toast-content {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n      width: 100%;\n\n      .toast-title {\n        @include text-default-title-single;\n        margin: 0.25rem 0px;\n      }\n\n      .toast-message {\n        min-width: 0;\n\n        @include text-default;\n      }\n    }\n\n    .toast-icon + .toast-content {\n      max-width: 10.25rem;\n    }\n  }\n\n  .toast-close {\n    display: flex;\n    position: relative;\n    pointer-events: all;\n    margin-left: auto;\n    margin-right: 0px;\n  }\n\n  .toast-progress-bar {\n    position: absolute;\n    bottom: 0;\n    height: $tiny-space;\n    width: 100%;\n    background-color: var(--theme-toast-timer-value--background);\n    transform-origin: left;\n\n    &--animated {\n      animation: trackProgress linear 1 forwards;\n    }\n  }\n\n  @keyframes trackProgress {\n    0% {\n      transform: scaleX(1);\n    }\n    100% {\n      transform: scaleX(0);\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { ToastType } from './toast-utils';\n\n@Component({\n  tag: 'ix-toast',\n  styleUrl: 'toast.scss',\n  shadow: true,\n})\nexport class Toast {\n  /**\n   * Toast type\n   */\n  @Prop() type: ToastType = 'info';\n\n  /**\n   * Toast title\n   */\n  @Prop() toastTitle: string;\n\n  /**\n   * Autoclose title after delay\n   */\n  @Prop() autoCloseDelay = 5000;\n\n  /**\n   * Autoclose behavior\n   */\n  @Prop() autoClose = true;\n\n  /**\n   * Icon of toast\n   */\n  @Prop() icon: string;\n\n  /**\n   * Icon color of toast\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Toast closed\n   */\n  @Event() closeToast: EventEmitter;\n\n  @State() progress = 0;\n  @State() touched = false;\n\n  @Element() hostElement!: HTMLIxToastElement;\n\n  private getIcon() {\n    if (this.icon) {\n      return (\n        <ix-icon\n          data-testid=\"toast-icon\"\n          name={this.icon}\n          color={this.iconColor}\n          size=\"24\"\n        />\n      );\n    }\n\n    switch (this.type) {\n      case 'info':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'info'}\n            size=\"24\"\n            color=\"color-std-text\"\n          />\n        );\n\n      case 'error':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'error'}\n            size=\"24\"\n            color=\"color-alarm\"\n          />\n        );\n\n      case 'success':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'success'}\n            size=\"24\"\n            color=\"color-success\"\n          />\n        );\n\n      case 'warning':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={'warning'}\n            size=\"24\"\n            color=\"color-warning\"\n          />\n        );\n\n      default:\n        return '';\n    }\n  }\n\n  private close() {\n    if (this.hostElement) {\n      this.hostElement.classList.add('animate__fadeOut');\n    }\n    setTimeout(() => {\n      this.closeToast.emit();\n    }, 250);\n  }\n\n  render() {\n    let progressBarStyle: Record<string, string> = {};\n\n    const progressBarClass = ['toast-progress-bar'];\n\n    progressBarStyle = {\n      animationDuration: `${this.autoCloseDelay}ms`,\n      animationPlayState: this.touched ? 'paused' : 'running',\n    };\n\n    progressBarClass.push('toast-progress-bar--animated');\n\n    return (\n      <Host class=\"animate__animated animate__fadeIn\">\n        <div\n          class=\"toast-body\"\n          onPointerLeave={() => {\n            this.touched = false;\n          }}\n          onPointerEnter={() => {\n            this.touched = true;\n          }}\n        >\n          {this.type || this.icon ? (\n            <div class=\"toast-icon\">{this.getIcon()}</div>\n          ) : null}\n          <div class=\"toast-content\">\n            {this.toastTitle ? (\n              <div class=\"toast-title\">{this.toastTitle}</div>\n            ) : null}\n            <div class=\"toast-message\">\n              <slot></slot>\n            </div>\n          </div>\n          <div class=\"toast-close\">\n            <ix-icon-button\n              icon={'close'}\n              size=\"24\"\n              ghost\n              onClick={() => this.closeToast.emit()}\n            />\n          </div>\n        </div>\n        {this.autoClose ? (\n          <div\n            class={progressBarClass.join(' ')}\n            style={progressBarStyle}\n            onAnimationEnd={() => {\n              this.close();\n            }}\n            onTransitionEnd={() => {\n              if (this.progress === 0) {\n                this.close();\n              }\n            }}\n          ></div>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAW,m3EACjB,MAAAC,EAAeD,E,MCyBFE,EAAK,M,0EAIU,O,8CAUD,I,eAKL,K,2DAiBA,E,aACD,K,CAIX,OAAAC,GACN,GAAIC,KAAKC,KAAM,CACb,OACEC,EAAA,yBACc,aACZC,KAAMH,KAAKC,KACXG,MAAOJ,KAAKK,UACZC,KAAK,M,CAKX,OAAQN,KAAKO,MACX,IAAK,OACH,OACEL,EAAA,yBACc,aACZC,KAAM,OACNG,KAAK,KACLF,MAAM,mBAIZ,IAAK,QACH,OACEF,EAAA,yBACc,aACZC,KAAM,QACNG,KAAK,KACLF,MAAM,gBAIZ,IAAK,UACH,OACEF,EAAA,yBACc,aACZC,KAAM,UACNG,KAAK,KACLF,MAAM,kBAIZ,IAAK,UACH,OACEF,EAAA,yBACc,aACZC,KAAM,UACNG,KAAK,KACLF,MAAM,kBAIZ,QACE,MAAO,G,CAIL,KAAAI,GACN,GAAIR,KAAKS,YAAa,CACpBT,KAAKS,YAAYC,UAAUC,IAAI,mB,CAEjCC,YAAW,KACTZ,KAAKa,WAAWC,MAAM,GACrB,I,CAGL,MAAAC,GACE,IAAIC,EAA2C,GAE/C,MAAMC,EAAmB,CAAC,sBAE1BD,EAAmB,CACjBE,kBAAmB,GAAGlB,KAAKmB,mBAC3BC,mBAAoBpB,KAAKqB,QAAU,SAAW,WAGhDJ,EAAiBK,KAAK,gCAEtB,OACEpB,EAACqB,EAAI,CAAAC,IAAA,2CAACC,MAAM,qCACVvB,EAAA,OAAAsB,IAAA,2CACEC,MAAM,aACNC,eAAgB,KACd1B,KAAKqB,QAAU,KAAK,EAEtBM,eAAgB,KACd3B,KAAKqB,QAAU,IAAI,GAGpBrB,KAAKO,MAAQP,KAAKC,KACjBC,EAAA,OAAKuB,MAAM,cAAczB,KAAKD,WAC5B,KACJG,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,iBACRzB,KAAK4B,WACJ1B,EAAA,OAAKuB,MAAM,eAAezB,KAAK4B,YAC7B,KACJ1B,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,iBACTvB,EAAA,QAAAsB,IAAA,+CAGJtB,EAAA,OAAAsB,IAAA,2CAAKC,MAAM,eACTvB,EAAA,kBAAAsB,IAAA,2CACEvB,KAAM,QACNK,KAAK,KACLuB,MAAK,KACLC,QAAS,IAAM9B,KAAKa,WAAWC,WAIpCd,KAAK+B,UACJ7B,EAAA,OACEuB,MAAOR,EAAiBe,KAAK,KAC7BC,MAAOjB,EACPkB,eAAgB,KACdlC,KAAKQ,OAAO,EAEd2B,gBAAiB,KACf,GAAInC,KAAKoC,WAAa,EAAG,CACvBpC,KAAKQ,O,KAIT,K"}

package/dist/siemens-ix/{p-9dc3e182.entry.js → p-d998415f.entry.js}

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

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

@@ -0,0 +1,2 @@
+import{r,h as e,H as t,g as o}from"./p-f87cd962.js";import{h as a}from"./p-712e0ee0.js";const c=":host{display:flex;flex-direction:column;position:relative;padding:1.5rem 0rem 0.25rem 2rem;width:100%;height:100%;overflow:hidden}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .content{flex-grow:1;overflow:auto;padding-right:1.5rem}:host .content-header.slotted{margin-bottom:1rem;padding-right:1.5rem}";const s=c;const b=class{constructor(e){r(this,e);this.isContentHeaderSlotted=false}get contentHeaderSlot(){return this.hostElement.shadowRoot.querySelector(".content-header slot")}render(){return e(t,{key:"61f9325ce908e838c83a286da21471c8f081cf7e"},e("div",{key:"66adfdde8a6f7e4cec46bc8ac3111f9fd344462c",class:{"content-header":true,slotted:this.isContentHeaderSlotted}},e("slot",{key:"00a1dffb70b39ae24c7ffc7a02649f5c870e95e9",name:"header",onSlotchange:()=>{this.isContentHeaderSlotted=a(this.contentHeaderSlot)}})),e("div",{key:"d27dfeb1305abb6cacdf16a5476e5d7b32d6f3ba",class:"content"},e("slot",{key:"054a581bc21257f46c3377c53c0e8dbacc4321b5"})))}get hostElement(){return o(this)}};b.style=s;export{b as ix_content};
+//# sourceMappingURL=p-dcb3e5be.entry.js.map

package/dist/siemens-ix/{p-021e1084.entry.js.map → p-dcb3e5be.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["contentCss","IxContentStyle0","Content","contentHeaderSlot","this","hostElement","shadowRoot","querySelector","render","h","Host","key","class","slotted","isContentHeaderSlotted","name","onSlotchange","hasSlottedElements"],"sources":["src/components/content/content.scss?tag=ix-content&encapsulation=shadow","src/components/content/content.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  padding: 1.5rem 0rem 0.25rem 2rem;\n\n  width: 100%;\n  height: 100%;\n\n  overflow: hidden;\n\n  .content {\n    flex-grow: 1;\n    overflow: auto;\n    padding-right: 1.5rem;\n  }\n\n  .content-header.slotted {\n    margin-bottom: 1rem;\n    padding-right: 1.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 { Component, Element, h, Host, State } from '@stencil/core';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n/**\n * @since 2.1.0\n * @slot header - Display content at the top of the content page\n */\n@Component({\n  tag: 'ix-content',\n  styleUrl: 'content.scss',\n  shadow: true,\n})\nexport class Content {\n  @Element() hostElement!: HTMLIxContentElement;\n\n  @State() isContentHeaderSlotted = false;\n\n  get contentHeaderSlot() {\n    return this.hostElement.shadowRoot.querySelector(\n      '.content-header slot'\n    ) as HTMLSlotElement;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'content-header': true,\n            slotted: this.isContentHeaderSlotted,\n          }}\n        >\n          <slot\n            name=\"header\"\n            onSlotchange={() => {\n              this.isContentHeaderSlotted = hasSlottedElements(\n                this.contentHeaderSlot\n              );\n            }}\n          ></slot>\n        </div>\n        <div class=\"content\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAa,s2BACnB,MAAAC,EAAeD,E,MCoBFE,EAAO,M,qDAGgB,K,CAElC,qBAAIC,GACF,OAAOC,KAAKC,YAAYC,WAAWC,cACjC,uB,CAIJ,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,iBAAkB,KAClBC,QAAST,KAAKU,yBAGhBL,EAAA,QAAAE,IAAA,2CACEI,KAAK,SACLC,aAAc,KACZZ,KAAKU,uBAAyBG,EAC5Bb,KAAKD,kBACN,KAIPM,EAAA,OAAAE,IAAA,2CAAKC,MAAM,WACTH,EAAA,QAAAE,IAAA,8C"}
+{"version":3,"names":["contentCss","IxContentStyle0","Content","contentHeaderSlot","this","hostElement","shadowRoot","querySelector","render","h","Host","key","class","slotted","isContentHeaderSlotted","name","onSlotchange","hasSlottedElements"],"sources":["src/components/content/content.scss?tag=ix-content&encapsulation=shadow","src/components/content/content.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  padding: 1.5rem 0rem 0.25rem 2rem;\n\n  width: 100%;\n  height: 100%;\n\n  overflow: hidden;\n\n  .content {\n    flex-grow: 1;\n    overflow: auto;\n    padding-right: 1.5rem;\n  }\n\n  .content-header.slotted {\n    margin-bottom: 1rem;\n    padding-right: 1.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 { Component, Element, h, Host, State } from '@stencil/core';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n/**\n * @since 2.1.0\n * @slot header - Display content at the top of the content page\n */\n@Component({\n  tag: 'ix-content',\n  styleUrl: 'content.scss',\n  shadow: true,\n})\nexport class Content {\n  @Element() hostElement!: HTMLIxContentElement;\n\n  @State() isContentHeaderSlotted = false;\n\n  get contentHeaderSlot() {\n    return this.hostElement.shadowRoot.querySelector(\n      '.content-header slot'\n    ) as HTMLSlotElement;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'content-header': true,\n            slotted: this.isContentHeaderSlotted,\n          }}\n        >\n          <slot\n            name=\"header\"\n            onSlotchange={() => {\n              this.isContentHeaderSlotted = hasSlottedElements(\n                this.contentHeaderSlot\n              );\n            }}\n          ></slot>\n        </div>\n        <div class=\"content\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wFAAA,MAAMA,EAAa,kgCACnB,MAAAC,EAAeD,E,MCoBFE,EAAO,M,qDAGgB,K,CAElC,qBAAIC,GACF,OAAOC,KAAKC,YAAYC,WAAWC,cACjC,uB,CAIJ,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,iBAAkB,KAClBC,QAAST,KAAKU,yBAGhBL,EAAA,QAAAE,IAAA,2CACEI,KAAK,SACLC,aAAc,KACZZ,KAAKU,uBAAyBG,EAC5Bb,KAAKD,kBACN,KAIPM,EAAA,OAAAE,IAAA,2CAAKC,MAAM,WACTH,EAAA,QAAAE,IAAA,8C"}

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

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as o,g as a}from"./p-f87cd962.js";import{u as i,A as r}from"./p-7c36d3fa.js";import{a as s}from"./p-fbe017b7.js";import{m as n}from"./p-c146af8e.js";import"./p-c4749812.js";import"./p-68a274e7.js";const h=":host{display:flex;position:relative;width:100%;height:100%;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 .content{display:flex;height:100%;width:100%;position:relative;margin-left:3.25rem;overflow:auto}:host .navigation-content{display:flex;position:relative;flex-direction:row;height:calc(100% - 2.75rem);width:100%}:host(.hide-header) .navigation-content,:host(.hide-header) .content{height:100%}:host(.breakpoint-lg) .content{margin-left:0rem}:host(.breakpoint-sm) .content{margin-left:0px;width:100%}";const c=h;const l=class{constructor(e){t(this,e);this.applicationName=undefined;this.hideHeader=false;this.forceBreakpoint=undefined;this.breakpoints=["sm","md","lg"];this.breakpoint="lg"}onHideHeaderChange(){var t;(t=this.contextProvider)===null||t===void 0?void 0:t.emit({hideHeader:this.hideHeader,host:"basic-navigation"});this.breakpoint=s.breakpoint}forceLayoutChange(t){if(!t){s.enableBreakpointDetection();return}s.disableBreakpointDetection();s.setBreakpoint(t)}onBreakpointsChange(t){s.setBreakpoints(t)}get menu(){return this.hostElement.querySelector("ix-menu")}onContentClick(){var t;if(n.isPinned){return}(t=this.menu)===null||t===void 0?void 0:t.toggleMenu(false)}componentWillLoad(){s.setBreakpoints(this.breakpoints);this.contextProvider=i(this.hostElement,r,{hideHeader:this.hideHeader,host:"basic-navigation"});this.modeDisposable=s.onChange.on((t=>{this.breakpoint=t}));this.breakpoint=s.breakpoint;if(this.forceBreakpoint){this.forceLayoutChange(this.forceBreakpoint)}}componentDidRender(){if(this.menu){this.menu.applicationName=this.applicationName}}disconnectedCallback(){var t;(t=this.modeDisposable)===null||t===void 0?void 0:t.dispose()}render(){return e(o,{key:"f7c1e352f7b85360afaa4aa7302394fbcefaa33a","data-role":"",class:{"hide-header":this.hideHeader,[`breakpoint-${this.breakpoint}`]:true}},!this.hideHeader?e("ix-application-header",{name:this.applicationName},e("slot",{name:"logo",slot:"logo"})):null,e("div",{key:"bbd969c401308a804a6b8973a038daca551fc8c4",class:"navigation-content"},e("slot",{key:"3b09f85c77fda585b91786049d590e94c6bc3717",name:"menu"}),e("div",{key:"05b1eb22f097cf421f0ed0c747364c5b33418190",class:"content",onClick:()=>this.onContentClick()},e("slot",{key:"e46d1d8ddc56270570e28ea814087506202e7217"}))))}get hostElement(){return a(this)}static get watchers(){return{hideHeader:["onHideHeaderChange"],breakpoints:["onBreakpointsChange"]}}};l.style=c;export{l as ix_basic_navigation};
+//# sourceMappingURL=p-dde7eb80.entry.js.map

package/dist/siemens-ix/{p-b24beb48.entry.js.map → p-dde7eb80.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["basicNavigationCss","IxBasicNavigationStyle0","BasicNavigation","onHideHeaderChange","_a","this","contextProvider","emit","hideHeader","host","breakpoint","applicationLayoutService","forceLayoutChange","newMode","enableBreakpointDetection","disableBreakpointDetection","setBreakpoint","onBreakpointsChange","breakpoints","setBreakpoints","menu","hostElement","querySelector","onContentClick","menuController","isPinned","toggleMenu","componentWillLoad","useContextProvider","ApplicationLayoutContext","modeDisposable","onChange","on","mode","forceBreakpoint","componentDidRender","applicationName","disconnectedCallback","dispose","render","h","Host","key","class","name","slot","onClick"],"sources":["src/components/basic-navigation/basic-navigation.scss?tag=ix-basic-navigation&encapsulation=shadow","src/components/basic-navigation/basic-navigation.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: 100%;\n  height: 100%;\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  .content {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    position: relative;\n    margin-left: 3.25rem;\n    overflow: auto;\n  }\n\n  .navigation-content {\n    display: flex;\n    position: relative;\n\n    flex-direction: row;\n\n    height: calc(100% - 2.75rem);\n    width: 100%;\n  }\n}\n\n:host(.hide-header) {\n  .navigation-content,\n  .content {\n    height: 100%;\n  }\n}\n\n:host(.breakpoint-lg) {\n  .content {\n    margin-left: 0rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  .content {\n    margin-left: 0px;\n    width: 100%;\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 { ApplicationLayoutContext } 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 { Disposable } from '../utils/typed-event';\n\n@Component({\n  tag: 'ix-basic-navigation',\n  styleUrl: 'basic-navigation.scss',\n  shadow: true,\n})\nexport class BasicNavigation {\n  @Element() hostElement: HTMLIxBasicNavigationElement;\n\n  /**\n   * Application name\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Hide application header. Will disable responsive feature of basic navigation.\n   */\n  @Prop() hideHeader = false;\n  @Watch('hideHeader')\n  onHideHeaderChange() {\n    this.contextProvider?.emit({\n      hideHeader: this.hideHeader,\n      host: 'basic-navigation',\n    });\n\n    this.breakpoint = applicationLayoutService.breakpoint;\n  }\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 e.g ['sm', 'md']\n   */\n  @Prop() breakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  @Watch('breakpoints')\n  onBreakpointsChange(breakpoints: Breakpoint[]) {\n    applicationLayoutService.setBreakpoints(breakpoints);\n  }\n\n  @State() breakpoint: Breakpoint = 'lg';\n\n  get menu(): HTMLIxMenuElement | null {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  private modeDisposable: Disposable;\n  private contextProvider: ContextProvider<typeof ApplicationLayoutContext>;\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: this.hideHeader,\n        host: 'basic-navigation',\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\n  componentDidRender() {\n    if (this.menu) {\n      this.menu.applicationName = this.applicationName;\n    }\n  }\n\n  disconnectedCallback() {\n    this.modeDisposable?.dispose();\n  }\n\n  render() {\n    return (\n      <Host\n        data-role=\"\"\n        class={{\n          'hide-header': this.hideHeader,\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n      >\n        {!this.hideHeader ? (\n          <ix-application-header name={this.applicationName}>\n            <slot name=\"logo\" slot=\"logo\"></slot>\n          </ix-application-header>\n        ) : null}\n        <div class=\"navigation-content\">\n          <slot name=\"menu\"></slot>\n          <div class=\"content\" onClick={() => this.onContentClick()}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4NAAA,MAAMA,EAAqB,qrCAC3B,MAAAC,EAAeD,E,MCqBFE,EAAe,M,wEAWL,M,gDA4Be,CAAC,KAAM,KAAM,M,gBAMf,I,CAhClC,kBAAAC,G,OACEC,EAAAC,KAAKC,mBAAe,MAAAF,SAAA,SAAAA,EAAEG,KAAK,CACzBC,WAAYH,KAAKG,WACjBC,KAAM,qBAGRJ,KAAKK,WAAaC,EAAyBD,U,CAO7C,iBAAAE,CAAkBC,GAChB,IAAKA,EAAS,CACZF,EAAyBG,4BACzB,M,CAGFH,EAAyBI,6BACzBJ,EAAyBK,cAAcH,E,CAQzC,mBAAAI,CAAoBC,GAClBP,EAAyBQ,eAAeD,E,CAK1C,QAAIE,GACF,OAAOf,KAAKgB,YAAYC,cAAc,U,CAMhC,cAAAC,G,MACN,GAAIC,EAAeC,SAAU,CAC3B,M,EAEFrB,EAAAC,KAAKe,QAAI,MAAAhB,SAAA,SAAAA,EAAEsB,WAAW,M,CAGxB,iBAAAC,GACEhB,EAAyBQ,eAAed,KAAKa,aAE7Cb,KAAKC,gBAAkBsB,EACrBvB,KAAKgB,YACLQ,EACA,CACErB,WAAYH,KAAKG,WACjBC,KAAM,qBAIVJ,KAAKyB,eAAiBnB,EAAyBoB,SAASC,IAAIC,IAC1D5B,KAAKK,WAAauB,CAAI,IAExB5B,KAAKK,WAAaC,EAAyBD,WAE3C,GAAIL,KAAK6B,gBAAiB,CACxB7B,KAAKO,kBAAkBP,KAAK6B,gB,EAIhC,kBAAAC,GACE,GAAI9B,KAAKe,KAAM,CACbf,KAAKe,KAAKgB,gBAAkB/B,KAAK+B,e,EAIrC,oBAAAC,G,OACEjC,EAAAC,KAAKyB,kBAAc,MAAA1B,SAAA,SAAAA,EAAEkC,S,CAGvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,uDACO,GACVC,MAAO,CACL,cAAetC,KAAKG,WACpB,CAAC,cAAcH,KAAKK,cAAe,QAGnCL,KAAKG,WACLgC,EAAA,yBAAuBI,KAAMvC,KAAK+B,iBAChCI,EAAA,QAAMI,KAAK,OAAOC,KAAK,UAEvB,KACJL,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,SACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUG,QAAS,IAAMzC,KAAKkB,kBACvCiB,EAAA,QAAAE,IAAA,+C"}
+{"version":3,"names":["basicNavigationCss","IxBasicNavigationStyle0","BasicNavigation","onHideHeaderChange","_a","this","contextProvider","emit","hideHeader","host","breakpoint","applicationLayoutService","forceLayoutChange","newMode","enableBreakpointDetection","disableBreakpointDetection","setBreakpoint","onBreakpointsChange","breakpoints","setBreakpoints","menu","hostElement","querySelector","onContentClick","menuController","isPinned","toggleMenu","componentWillLoad","useContextProvider","ApplicationLayoutContext","modeDisposable","onChange","on","mode","forceBreakpoint","componentDidRender","applicationName","disconnectedCallback","dispose","render","h","Host","key","class","name","slot","onClick"],"sources":["src/components/basic-navigation/basic-navigation.scss?tag=ix-basic-navigation&encapsulation=shadow","src/components/basic-navigation/basic-navigation.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: 100%;\n  height: 100%;\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  .content {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    position: relative;\n    margin-left: 3.25rem;\n    overflow: auto;\n  }\n\n  .navigation-content {\n    display: flex;\n    position: relative;\n\n    flex-direction: row;\n\n    height: calc(100% - 2.75rem);\n    width: 100%;\n  }\n}\n\n:host(.hide-header) {\n  .navigation-content,\n  .content {\n    height: 100%;\n  }\n}\n\n:host(.breakpoint-lg) {\n  .content {\n    margin-left: 0rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  .content {\n    margin-left: 0px;\n    width: 100%;\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 { ApplicationLayoutContext } 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 { Disposable } from '../utils/typed-event';\n\n@Component({\n  tag: 'ix-basic-navigation',\n  styleUrl: 'basic-navigation.scss',\n  shadow: true,\n})\nexport class BasicNavigation {\n  @Element() hostElement: HTMLIxBasicNavigationElement;\n\n  /**\n   * Application name\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Hide application header. Will disable responsive feature of basic navigation.\n   */\n  @Prop() hideHeader = false;\n  @Watch('hideHeader')\n  onHideHeaderChange() {\n    this.contextProvider?.emit({\n      hideHeader: this.hideHeader,\n      host: 'basic-navigation',\n    });\n\n    this.breakpoint = applicationLayoutService.breakpoint;\n  }\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 e.g ['sm', 'md']\n   */\n  @Prop() breakpoints: Breakpoint[] = ['sm', 'md', 'lg'];\n  @Watch('breakpoints')\n  onBreakpointsChange(breakpoints: Breakpoint[]) {\n    applicationLayoutService.setBreakpoints(breakpoints);\n  }\n\n  @State() breakpoint: Breakpoint = 'lg';\n\n  get menu(): HTMLIxMenuElement | null {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  private modeDisposable: Disposable;\n  private contextProvider: ContextProvider<typeof ApplicationLayoutContext>;\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: this.hideHeader,\n        host: 'basic-navigation',\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\n  componentDidRender() {\n    if (this.menu) {\n      this.menu.applicationName = this.applicationName;\n    }\n  }\n\n  disconnectedCallback() {\n    this.modeDisposable?.dispose();\n  }\n\n  render() {\n    return (\n      <Host\n        data-role=\"\"\n        class={{\n          'hide-header': this.hideHeader,\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n      >\n        {!this.hideHeader ? (\n          <ix-application-header name={this.applicationName}>\n            <slot name=\"logo\" slot=\"logo\"></slot>\n          </ix-application-header>\n        ) : null}\n        <div class=\"navigation-content\">\n          <slot name=\"menu\"></slot>\n          <div class=\"content\" onClick={() => this.onContentClick()}>\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4NAAA,MAAMA,EAAqB,i1CAC3B,MAAAC,EAAeD,E,MCqBFE,EAAe,M,wEAWL,M,gDA4Be,CAAC,KAAM,KAAM,M,gBAMf,I,CAhClC,kBAAAC,G,OACEC,EAAAC,KAAKC,mBAAe,MAAAF,SAAA,SAAAA,EAAEG,KAAK,CACzBC,WAAYH,KAAKG,WACjBC,KAAM,qBAGRJ,KAAKK,WAAaC,EAAyBD,U,CAO7C,iBAAAE,CAAkBC,GAChB,IAAKA,EAAS,CACZF,EAAyBG,4BACzB,M,CAGFH,EAAyBI,6BACzBJ,EAAyBK,cAAcH,E,CAQzC,mBAAAI,CAAoBC,GAClBP,EAAyBQ,eAAeD,E,CAK1C,QAAIE,GACF,OAAOf,KAAKgB,YAAYC,cAAc,U,CAMhC,cAAAC,G,MACN,GAAIC,EAAeC,SAAU,CAC3B,M,EAEFrB,EAAAC,KAAKe,QAAI,MAAAhB,SAAA,SAAAA,EAAEsB,WAAW,M,CAGxB,iBAAAC,GACEhB,EAAyBQ,eAAed,KAAKa,aAE7Cb,KAAKC,gBAAkBsB,EACrBvB,KAAKgB,YACLQ,EACA,CACErB,WAAYH,KAAKG,WACjBC,KAAM,qBAIVJ,KAAKyB,eAAiBnB,EAAyBoB,SAASC,IAAIC,IAC1D5B,KAAKK,WAAauB,CAAI,IAExB5B,KAAKK,WAAaC,EAAyBD,WAE3C,GAAIL,KAAK6B,gBAAiB,CACxB7B,KAAKO,kBAAkBP,KAAK6B,gB,EAIhC,kBAAAC,GACE,GAAI9B,KAAKe,KAAM,CACbf,KAAKe,KAAKgB,gBAAkB/B,KAAK+B,e,EAIrC,oBAAAC,G,OACEjC,EAAAC,KAAKyB,kBAAc,MAAA1B,SAAA,SAAAA,EAAEkC,S,CAGvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,uDACO,GACVC,MAAO,CACL,cAAetC,KAAKG,WACpB,CAAC,cAAcH,KAAKK,cAAe,QAGnCL,KAAKG,WACLgC,EAAA,yBAAuBI,KAAMvC,KAAK+B,iBAChCI,EAAA,QAAMI,KAAK,OAAOC,KAAK,UAEvB,KACJL,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,SACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUG,QAAS,IAAMzC,KAAKkB,kBACvCiB,EAAA,QAAAE,IAAA,+C"}

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

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