@siemens/ix 2.6.1 → 2.7.0

package/dist/siemens-ix/p-9f960c0b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["ApplicationSidebarToggleEvent","Event","constructor","force","super","bubbles","composed","this","menuCss","IxMenuStyle0","Menu","isTransitionDisabled","isVisible","elm","style","display","_b","_a","parentElement","pinnedChange","newPinned","applicationLayoutContext","host","console","warn","setPinned","pinned","applicationLayoutService","disableBreakpointDetection","setBreakpoint","enableBreakpointDetection","popoverArea","hostElement","shadowRoot","querySelector","menu","menuItemsContainer","overlayContainer","menuItems","Array","from","querySelectorAll","filter","menuBottomItems","homeTab","moreItemsDropdown","isMoreItemsDropdownEmpty","length","moreItemsDropdownItems","activeMoreTabContainer","activeMoreTab","aboutPopoverContainer","aboutNewsPopover","document","aboutTab","about","settings","isSettingsEmpty","tabsContainer","componentDidLoad","requestAnimationFrame","handleOverflowIndicator","componentWillLoad","useContextConsumer","ApplicationLayoutContext","ctx","hideHeader","onBreakpointChange","breakpoint","menuController","register","onChange","on","componentDidRender","show","appendFragments","showPinned","setIsPinned","mode","initial","toggleMenu","startExpanded","appendAboutNewsPopover","getAboutPopoverVerticalPosition","heightArrow","offsetArrow","rectAbout","getBoundingClientRect","bottom","window","innerHeight","height","offset","convertToRemString","contains","showMore","aboutItemLabel","activeTabLabel","toggleAbout","addEventListener","bind","body","appendChild","toggleMapExpand","undefined","mapExpand","expand","expanded","expandChange","emit","checkTransition","setTimeout","container","transitionProperty","isOverlayVisible","showAbout","showSettings","toggleSettings","animateOverlayFadeIn","resetOverlay","onOverlayClose","getCollapseText","i18nCollapse","i18nExpand","getCollapseIcon","isMenuItemClicked","event","target","HTMLElement","tagName","clientHeight","scrollTop","scrollHeight","itemsScrollShadowTop","itemsScrollShadowBottom","Math","round","animateOverlayFadeOut","anime","targets","duration","backdropFilter","translateX","opacity","easing","begin","onComplete","complete","onMenuItemsClick","isHiddenFromViewport","sidebarToggle","mapExpandChange","dispatchEvent","render","h","Host","key","class","slot","ixAriaLabel","i18nExpandSidebar","onClick","async","appSwitchConfig","showAppSwitch","icon","ghost","id","e","tabs","onScroll","name","disabled","active","label","i18nSettings","i18nLegal","enableToggleTheme","themeSwitcher","toggleMode","i18nToggleTheme","enableMapExpand","sidebar","visible","onTransitionEnd"],"sources":["src/components/application-sidebar/events.ts","src/components/menu/menu.scss?tag=ix-menu&encapsulation=shadow","src/components/menu/menu.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\nexport class ApplicationSidebarToggleEvent extends Event {\n  public constructor(public readonly force?: boolean) {\n    super('application-sidebar-toggle', { bubbles: true, composed: true });\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n@import '~animate.css/animate.min';\n\n$menu-expanded-width: 16rem;\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  flex-direction: row;\n  position: absolute;\n  height: 100%;\n  min-height: min-content;\n  z-index: var(--theme-z-index-sticky);\n  width: auto;\n\n  bottom: 0;\n\n  .tabs {\n    height: 100%;\n    position: relative;\n    overflow-y: auto;\n    pointer-events: all;\n\n    -ms-overflow-style: none;\n\n    scrollbar-width: none;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .show-scrollbar {\n    scrollbar-width: inherit;\n\n    &::-webkit-scrollbar {\n      display: inherit;\n    }\n  }\n\n  .tabs-shadow-container {\n    overflow: hidden;\n    display: block;\n    position: relative;\n    margin-bottom: 0.75rem;\n  }\n\n  .tabs--shadow {\n    opacity: 0;\n    position: absolute;\n    width: 100%;\n    height: 0.625rem;\n\n    background: linear-gradient(var(--theme-color-shadow-1), transparent);\n    pointer-events: none;\n    z-index: var(--theme-z-index-sticky);\n\n    transition: opacity var(--theme-default-time);\n  }\n  .tabs--shadow-top {\n    top: 0;\n    background: linear-gradient(var(--theme-color-shadow-1), transparent);\n  }\n\n  .tabs--shadow-bottom {\n    bottom: 0;\n    background: linear-gradient(transparent, var(--theme-color-shadow-1));\n  }\n\n  .tabs--shadow--show {\n    opacity: 1;\n  }\n\n  .menu {\n    display: flex;\n    flex-direction: column;\n    position: relative;\n    width: calc(3.25rem + var(--ix-application-menu-safe-area-left, 0rem));\n    height: 100%;\n    padding-block-end: calc(1rem + var(--ix-safe-area-inset-bottom, 0rem));\n    overflow: hidden;\n\n    padding-left: var(--ix-application-menu-safe-area-left, 0rem);\n\n    &.expanded {\n      box-shadow: var(--theme-navigation--box-shadow);\n    }\n\n    background-color: var(--theme-nav--background);\n    transition: width var(--theme-default-time) ease-in-out;\n  }\n\n  .menu-overlay {\n    display: none;\n    position: absolute;\n    width: calc(100vw - 3.25rem);\n    height: 100%;\n    left: 3.25rem;\n    z-index: -1;\n    backdrop-filter: blur(1rem);\n    background-color: var(--theme-sidebar-overlay-blur);\n    transition: left var(--theme-default-time) ease-in-out;\n  }\n\n  .menu-overlay.visible {\n    display: block;\n  }\n\n  .menu.expanded {\n    width: $menu-expanded-width;\n  }\n\n  .menu-overlay.expanded {\n    width: calc(100vw - $menu-expanded-width);\n    left: $menu-expanded-width;\n  }\n\n  .menu-overlay-container {\n    display: contents;\n  }\n\n  .menu-avatar {\n    max-height: 3rem;\n  }\n\n  .avatar {\n    margin-bottom: 2rem;\n  }\n\n  #cui-imprint {\n    .cui-imprint-product-name {\n      margin-bottom: $default-space;\n    }\n\n    .cui-imprint-product-description {\n      margin-bottom: $x-large-space;\n    }\n\n    .cui-imprint-link-container {\n      display: flex;\n      align-items: center;\n    }\n  }\n\n  .bottom-tab-divider {\n    margin-top: auto;\n  }\n\n  .menu-buttons {\n    margin: 0.5rem 0 0 0.625rem;\n  }\n\n  .menu-buttons > :last-child {\n    margin-bottom: 1rem;\n  }\n}\n\n:host(.breakpoint-sm) {\n  .menu:not(.expanded) {\n    width: 0;\n  }\n\n  .menu-overlay {\n    left: 0;\n    width: 100vw;\n  }\n}\n\n:host(.breakpoint-lg) {\n  position: relative;\n\n  .menu.expanded {\n    box-shadow: none;\n  }\n}\n\n:host {\n  ::slotted(a[href]) {\n    all: unset;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { ApplicationSidebarToggleEvent } from '../application-sidebar/events';\nimport { showAppSwitch } from '../utils/app-switch';\nimport { ApplicationLayoutContext } from '../utils/application-layout/context';\nimport { applicationLayoutService } from '../utils/application-layout/service';\nimport { Breakpoint } from '../utils/breakpoints';\nimport { ContextType, useContextConsumer } from '../utils/context';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { themeSwitcher } from '../utils/theme-switcher';\n\n@Component({\n  tag: 'ix-menu',\n  styleUrl: 'menu.scss',\n  shadow: true,\n})\nexport class Menu {\n  @Element() hostElement!: HTMLIxMenuElement;\n\n  /**\n   * Is settings tab visible\n   */\n  @Prop({ mutable: true }) showSettings = false;\n\n  /**\n   * Is about tab visible\n   */\n  @Prop({ mutable: true }) showAbout = false;\n\n  /**\n   * Show toggle between light and dark variant. Only if the provided theme have implemented both!\n   */\n  @Prop() enableToggleTheme = false;\n\n  /**\n   * Is settings tab is visible\n   */\n  @Prop() enableSettings = true;\n\n  /**\n   * Internal\n   */\n  @Prop() enableMapExpand = false;\n\n  /**\n   * Should only be set if you use ix-menu standalone\n   */\n  @Prop() applicationName?: string;\n\n  /**\n   * Should only be set if you use ix-menu standalone\n   */\n  @Prop() applicationDescription = '';\n\n  /**\n   * Maximum number of menu items to show in case enough vertical space is available.\n   * Extra menu items will be collapsed to 'show more' menu item.\n   *\n   * @deprecated - Has no effect on component. Will get removed with next major release (v3)\n   */\n  @Prop() maxVisibleMenuItems = 9;\n\n  /**\n   * Accessibility i18n label for the burger menu of the sidebar\n   */\n  @Prop() i18nExpandSidebar = 'Expand sidebar';\n\n  /**\n   *  Toggle the expand state of the menu\n   */\n  @Prop({ mutable: true, reflect: true }) expand = false;\n\n  /**\n   *  If set the menu will be expanded initially. This will only take effect at the breakpoint 'lg'.\n   *\n   *  @since 2.2.0\n   */\n  @Prop() startExpanded = false;\n\n  /**\n   * Menu stays pinned to the left\n   */\n  @Prop() pinned = false;\n\n  @Watch('pinned')\n  pinnedChange(newPinned: boolean) {\n    if (this.applicationLayoutContext?.host === 'map-navigation') {\n      console.warn('ix-map-navigation does not support pinning of the menu');\n      return;\n    }\n    this.setPinned(this.pinned);\n    if (newPinned) {\n      applicationLayoutService.disableBreakpointDetection();\n      applicationLayoutService.setBreakpoint('lg');\n      return;\n    }\n\n    applicationLayoutService.enableBreakpointDetection();\n  }\n\n  /**\n   */\n  @Prop() i18nLegal = 'About & legal information';\n\n  /**\n   */\n  @Prop() i18nSettings = 'Settings';\n\n  /**\n   */\n  @Prop() i18nToggleTheme = 'Toggle theme';\n\n  /**\n   */\n  @Prop() i18nExpand = ' Expand';\n\n  /**\n   */\n  @Prop() i18nCollapse = 'Collapse';\n\n  /**\n   * Menu expanded\n   */\n  @Event() expandChange!: EventEmitter<boolean>;\n\n  /**\n   * Map Sidebar expanded\n   */\n  @Event() mapExpandChange!: EventEmitter<boolean>;\n\n  @State() showPinned = false;\n  @State() mapExpand = true;\n  @State() breakpoint: Breakpoint = 'lg';\n  @State() itemsScrollShadowTop = false;\n  @State() itemsScrollShadowBottom = false;\n  @State() applicationLayoutContext?: ContextType<\n    typeof ApplicationLayoutContext\n  >;\n  private isTransitionDisabled = false;\n\n  // FBC IAM workaround #488\n  private readonly isVisible = (elm: HTMLElement) => {\n    return (\n      elm.style.display !== 'none' &&\n      elm.parentElement?.parentElement?.style.display !== 'none'\n    );\n  };\n\n  get popoverArea() {\n    return this.hostElement.shadowRoot!.querySelector('#popover-area');\n  }\n\n  get menu() {\n    return this.hostElement.shadowRoot!.querySelector('.menu');\n  }\n\n  get menuItemsContainer(): HTMLDivElement {\n    return this.menu!.querySelector('.tabs')!;\n  }\n\n  get overlayContainer() {\n    return this.hostElement.shadowRoot!.querySelector(\n      '.menu-overlay'\n    ) as HTMLDivElement;\n  }\n\n  get menuItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(\n        'ix-menu-item:not(.internal-tab):not(.home-tab):not(.bottom-tab):not([slot=\"bottom\"])'\n      )\n    ).filter((elm) => this.isVisible(elm as HTMLElement));\n  }\n\n  get menuBottomItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(\n        'ix-menu-item.bottom-tab:not(.internal-tab):not(.home-tab)'\n      )\n    ).filter((elm) => this.isVisible(elm as HTMLElement));\n  }\n\n  get homeTab() {\n    return this.hostElement.querySelector('ix-menu-item.home-tab');\n  }\n\n  get moreItemsDropdown(): HTMLElement {\n    return this.hostElement.shadowRoot!.querySelector(\n      '.internal-tab ix-dropdown'\n    )!;\n  }\n\n  get isMoreItemsDropdownEmpty(): boolean {\n    return (\n      this.hostElement.shadowRoot!.querySelectorAll(\n        '.internal-tab ix-dropdown .appended'\n      ).length === 0\n    );\n  }\n\n  get moreItemsDropdownItems() {\n    return this.hostElement.shadowRoot!.querySelectorAll(\n      '.internal-tab ix-dropdown ix-menu-item'\n    );\n  }\n\n  get activeMoreTabContainer() {\n    return this.hostElement.shadowRoot!.querySelector('.active-more-tab');\n  }\n\n  get activeMoreTab() {\n    return this.hostElement.shadowRoot!.querySelector(\n      '.active-more-tab ix-menu-item'\n    );\n  }\n\n  get aboutPopoverContainer(): HTMLElement {\n    return this.hostElement.querySelector('.about-news')!;\n  }\n\n  get aboutNewsPopover(): HTMLIxMenuAboutNewsElement {\n    return (\n      document.querySelector('ix-menu-about-news') ??\n      this.hostElement.querySelector('ix-menu-about-news')!\n    );\n  }\n\n  get aboutTab(): HTMLElement | null {\n    return this.hostElement.shadowRoot!.querySelector('#aboutAndLegal');\n  }\n\n  get about(): HTMLIxMenuAboutElement | null {\n    return this.hostElement.querySelector('ix-menu-about');\n  }\n\n  get settings(): HTMLIxMenuSettingsElement | null {\n    return this.hostElement.querySelector('ix-menu-settings');\n  }\n\n  get isSettingsEmpty(): boolean {\n    return (\n      Array.from(\n        this.hostElement.shadowRoot!.querySelectorAll('ix-menu-settings-item')\n      ).length === 0\n    );\n  }\n\n  get tabsContainer() {\n    return this.hostElement;\n  }\n\n  componentDidLoad() {\n    requestAnimationFrame(() => {\n      this.handleOverflowIndicator();\n    });\n\n    if (this.pinned) {\n      this.pinnedChange(this.pinned);\n    }\n  }\n\n  componentWillLoad() {\n    useContextConsumer(\n      this.hostElement,\n      ApplicationLayoutContext,\n      (ctx) => {\n        this.applicationLayoutContext = ctx;\n        if (ctx.hideHeader === true) {\n          this.onBreakpointChange('md');\n          return;\n        }\n\n        this.onBreakpointChange(applicationLayoutService.breakpoint);\n      },\n      true\n    );\n\n    menuController.register(this.hostElement);\n    applicationLayoutService.onChange.on((breakpoint) =>\n      this.onBreakpointChange(breakpoint)\n    );\n    this.onBreakpointChange(applicationLayoutService.breakpoint, true);\n  }\n\n  componentDidRender() {\n    if (!this.about && this.aboutNewsPopover) {\n      this.aboutNewsPopover.show = false;\n    }\n    this.appendFragments();\n  }\n\n  private setPinned(pinned: boolean) {\n    this.showPinned = pinned;\n    menuController.setIsPinned(pinned);\n  }\n\n  private onBreakpointChange(mode: Breakpoint, initial = false) {\n    if (!this.applicationLayoutContext && mode === 'sm') {\n      return;\n    }\n    if (this.applicationLayoutContext?.host === 'map-navigation') {\n      this.breakpoint = 'md';\n      return;\n    }\n    if (!this.applicationLayoutContext) {\n      return;\n    }\n\n    if (this.applicationLayoutContext.hideHeader && mode === 'sm') {\n      return;\n    }\n\n    this.setPinned(mode === 'lg');\n    if (initial || mode !== this.breakpoint)\n      this.toggleMenu(mode === 'lg' && this.startExpanded);\n\n    this.breakpoint = mode;\n  }\n\n  private appendFragments() {\n    this.appendAboutNewsPopover();\n  }\n\n  private getAboutPopoverVerticalPosition() {\n    const heightArrow = 12;\n    const offsetArrow = 6;\n    const rectAbout = this.aboutTab?.getBoundingClientRect() || {\n      bottom: -window.innerHeight,\n      height: 0,\n    };\n    const offset =\n      window.innerHeight -\n      (rectAbout.bottom - rectAbout.height / 2 + heightArrow / 2 + offsetArrow);\n    return convertToRemString(offset);\n  }\n\n  private appendAboutNewsPopover() {\n    if (!this.aboutNewsPopover || !this.about) {\n      return;\n    }\n\n    this.aboutNewsPopover.style.bottom = this.getAboutPopoverVerticalPosition();\n\n    if (!this.popoverArea?.contains(this.aboutNewsPopover)) {\n      const showMore = () => {\n        if (this.aboutNewsPopover?.aboutItemLabel && this.about) {\n          this.about.activeTabLabel = this.aboutNewsPopover.aboutItemLabel;\n          this.toggleAbout(true);\n        }\n      };\n\n      this.aboutNewsPopover.addEventListener('showMore', showMore.bind(this));\n      document.body.appendChild(this.aboutNewsPopover);\n    }\n  }\n\n  /**\n   * Toggle map sidebar expand\n   * @param show\n   */\n  @Method()\n  async toggleMapExpand(show?: boolean) {\n    if (show !== undefined) {\n      this.mapExpand = show;\n    } else {\n      this.mapExpand = !this.mapExpand;\n    }\n  }\n\n  /**\n   * Toggle menu\n   * @param show\n   */\n  @Method()\n  async toggleMenu(show?: boolean) {\n    if (show !== undefined) {\n      this.expand = show;\n    } else {\n      this.expand = !this.expand;\n    }\n\n    if (this.aboutNewsPopover) {\n      this.aboutNewsPopover.expanded = this.expand;\n    }\n\n    this.expandChange.emit(this.expand);\n\n    this.isTransitionDisabled = false;\n    this.checkTransition();\n\n    if (this.breakpoint == 'sm' && this.expand) {\n      setTimeout(() => {\n        this.handleOverflowIndicator();\n      }, 100);\n    }\n  }\n\n  /**\n   * Disable transition of overlay while menu animation is running.\n   */\n  private checkTransition() {\n    const container = this.overlayContainer;\n\n    if (!container) {\n      return;\n    }\n\n    if (this.isTransitionDisabled) {\n      container.style.transitionProperty = 'left';\n    } else {\n      container.style.transitionProperty = 'all';\n    }\n  }\n\n  private isOverlayVisible() {\n    return this.showAbout || this.showSettings;\n  }\n\n  /**\n   * Toggle Settings tabs\n   * @param show\n   */\n  @Method()\n  async toggleSettings(show: boolean) {\n    if (!this.settings) {\n      return;\n    }\n\n    if (!this.isOverlayVisible()) {\n      this.animateOverlayFadeIn();\n    }\n\n    if (show) {\n      this.resetOverlay();\n      this.showSettings = show;\n      this.settings.show = this.showSettings;\n    } else {\n      this.onOverlayClose();\n    }\n  }\n\n  /**\n   * Toggle About tabs\n   * @param show\n   */\n  @Method()\n  async toggleAbout(show: boolean) {\n    if (!this.about) {\n      return;\n    }\n\n    if (!this.isOverlayVisible()) {\n      this.animateOverlayFadeIn();\n    }\n\n    if (show) {\n      this.resetOverlay();\n      this.showAbout = show;\n      this.about.show = this.showAbout;\n    } else {\n      this.onOverlayClose();\n    }\n  }\n\n  private resetOverlay() {\n    this.showSettings = false;\n    this.showAbout = false;\n\n    if (this.settings) {\n      this.settings.show = false;\n    }\n\n    if (this.about) {\n      this.about.show = false;\n    }\n  }\n\n  private getCollapseText() {\n    return this.mapExpand ? this.i18nCollapse : this.i18nExpand;\n  }\n\n  private getCollapseIcon() {\n    return this.mapExpand ? 'navigation-left' : 'navigation-right';\n  }\n\n  private isMenuItemClicked(event: Event) {\n    if (event.target instanceof HTMLElement) {\n      return event.target.tagName === 'IX-MENU-ITEM';\n    }\n\n    return false;\n  }\n\n  @Listen('resize', { target: 'window' })\n  private handleOverflowIndicator() {\n    const { clientHeight, scrollTop, scrollHeight } = this.menuItemsContainer;\n    this.itemsScrollShadowTop = scrollTop > 0;\n    this.itemsScrollShadowBottom =\n      Math.round(scrollTop + clientHeight) < scrollHeight;\n  }\n\n  @Listen('close')\n  onOverlayClose() {\n    this.animateOverlayFadeOut(() => {\n      this.resetOverlay();\n    });\n  }\n\n  private animateOverlayFadeIn() {\n    requestAnimationFrame(() => {\n      anime({\n        targets: this.overlayContainer,\n        duration: 300,\n        backdropFilter: [0, 'blur(1rem)'],\n        translateX: ['-4rem', 0],\n        opacity: [0, 1],\n        easing: 'easeInSine',\n        begin: () => {\n          if (this.showPinned) {\n            return;\n          }\n\n          this.toggleMenu(false);\n        },\n      });\n    });\n  }\n\n  private animateOverlayFadeOut(onComplete: Function) {\n    requestAnimationFrame(() => {\n      anime({\n        targets: this.overlayContainer,\n        duration: 300,\n        backdropFilter: ['blur(1rem)', 0],\n        translateX: [0, '-4rem'],\n        opacity: [1, 0],\n        easing: 'easeInSine',\n        complete: () => onComplete(),\n      });\n    });\n  }\n\n  private onMenuItemsClick(event: Event) {\n    if (this.isMenuItemClicked(event)) {\n      if (!this.showPinned) {\n        this.toggleMenu(false);\n      }\n      this.onOverlayClose();\n    }\n  }\n\n  private isHiddenFromViewport() {\n    return this.breakpoint === 'sm' && this.expand === false;\n  }\n\n  private sidebarToggle() {\n    this.mapExpandChange.emit(this.mapExpand);\n\n    this.hostElement.dispatchEvent(\n      new ApplicationSidebarToggleEvent(this.mapExpand)\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.expand,\n          [`breakpoint-${this.breakpoint}`]: true,\n        }}\n        slot=\"menu\"\n      >\n        <nav\n          class={{\n            menu: true,\n            expanded: this.expand,\n          }}\n        >\n          <div class=\"menu-buttons\">\n            {this.breakpoint !== 'sm' && (\n              <ix-menu-expand-icon\n                breakpoint={this.breakpoint}\n                expanded={this.expand}\n                pinned={this.pinned}\n                class=\"menu-expand-icon\"\n                ixAriaLabel={this.i18nExpandSidebar}\n                onClick={async () => this.toggleMenu()}\n              ></ix-menu-expand-icon>\n            )}\n            {this.breakpoint === 'sm' &&\n              this.applicationLayoutContext?.appSwitchConfig && (\n                <ix-icon-button\n                  onClick={() => {\n                    if (this.applicationLayoutContext?.appSwitchConfig) {\n                      showAppSwitch(\n                        this.applicationLayoutContext.appSwitchConfig\n                      );\n                    }\n                  }}\n                  icon=\"apps\"\n                  ghost\n                ></ix-icon-button>\n              )}\n          </div>\n\n          <div\n            id=\"menu-tabs\"\n            style={{\n              display: 'contents',\n            }}\n            onClick={(e) => this.onMenuItemsClick(e)}\n          >\n            <div class=\"tabs-shadow-container\">\n              <div\n                class={{\n                  'tabs--shadow': true,\n                  'tabs--shadow-top': true,\n                  'tabs--shadow--show': this.itemsScrollShadowTop,\n                }}\n              ></div>\n              <div\n                class={{\n                  tabs: true,\n                  'show-scrollbar': this.expand,\n                }}\n                onScroll={() => this.handleOverflowIndicator()}\n              >\n                <div class=\"menu-avatar\">\n                  <slot name=\"ix-menu-avatar\"></slot>\n                </div>\n                <slot name=\"home\"></slot>\n                {this.breakpoint !== 'sm' || !this.isHiddenFromViewport() ? (\n                  <slot></slot>\n                ) : null}\n              </div>\n              <div\n                class={{\n                  'tabs--shadow': true,\n                  'tabs--shadow-bottom': true,\n                  'tabs--shadow--show': this.itemsScrollShadowBottom,\n                }}\n              ></div>\n            </div>\n          </div>\n          <div class=\"bottom-tab-divider\"></div>\n          {this.settings ? (\n            <ix-menu-item\n              disabled={this.isHiddenFromViewport()}\n              id=\"settings\"\n              class={{\n                'internal-tab': true,\n                'bottom-tab': true,\n                active: this.showSettings,\n              }}\n              icon={'cogwheel'}\n              onClick={async () => this.toggleSettings(!this.showSettings)}\n              label={this.i18nSettings}\n            ></ix-menu-item>\n          ) : null}\n          <div onClick={(e) => this.onMenuItemsClick(e)}>\n            <slot name=\"bottom\"></slot>\n          </div>\n\n          <div id=\"popover-area\"></div>\n          {this.about ? (\n            <ix-menu-item\n              disabled={this.isHiddenFromViewport()}\n              id=\"aboutAndLegal\"\n              class={{\n                'internal-tab': true,\n                'bottom-tab': true,\n                active: this.showAbout,\n              }}\n              icon={'info'}\n              onClick={async () => this.toggleAbout(!this.showAbout)}\n              label={this.i18nLegal}\n            ></ix-menu-item>\n          ) : null}\n          {this.enableToggleTheme ? (\n            <ix-menu-item\n              disabled={this.isHiddenFromViewport()}\n              id=\"toggleTheme\"\n              onClick={() => themeSwitcher.toggleMode()}\n              class=\"internal-tab bottom-tab\"\n              icon={'light-dark'}\n              label={this.i18nToggleTheme}\n            ></ix-menu-item>\n          ) : null}\n          {this.enableMapExpand || this.applicationLayoutContext?.sidebar ? (\n            <ix-menu-item\n              disabled={this.isHiddenFromViewport()}\n              id=\"menu-collapse\"\n              onClick={() => this.sidebarToggle()}\n              class=\"internal-tab bottom-tab\"\n              icon={`${this.getCollapseIcon()}`}\n              label={this.getCollapseText()}\n            ></ix-menu-item>\n          ) : null}\n        </nav>\n        <div\n          class={{\n            'menu-overlay': true,\n            visible: this.isOverlayVisible(),\n            expanded: this.expand,\n          }}\n          onTransitionEnd={() => {\n            this.isTransitionDisabled = true;\n            this.checkTransition();\n          }}\n        >\n          <div class={'menu-overlay-container'}>\n            {this.showSettings ? <slot name=\"ix-menu-settings\"></slot> : null}\n          </div>\n          <div class={'menu-overlay-container'}>\n            {this.showAbout ? <slot name=\"ix-menu-about\"></slot> : null}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["colCss","IxColStyle0","Col","onResize","forceUpdate","this","getSize","breakpoint","size","sizeSm","sizeMd","sizeLg","getColumnSize","Breakpoints","forEach","isMediaQueryActive","matchBreakpoint","currentSize","getColumnSizeStyling","flex","width","colSize","render","h","Host","key","style","Object","assign","datePickerCss","IxDatePickerStyle0","DatePicker","dropdownButtonRef","makeRef","yearContainerRef","firstMonthRef","isDayFocus","monthChangedFromFocus","DAYS_IN_WEEK","calendar","DateTime","now","toISO","watchFromPropHandler","newValue","currFromDate","fromFormat","format","undefined","_a","isValid","selectedYear","year","selectedMonth","month","watchToPropHandler","currToDate","onLocaleChange","setTranslations","getCurrentDate","_from","_b","toFormat","_to","_c","_d","range","from","to","handleKeyUp","event","_focusedDay","focusedDay","getDaysInCurrentMonth","changeToAdjacentMonth","utc","daysInMonth","getDateTimeNow","fromISO","today","onDayBlur","onDayFocus","componentWillLoad","startYear","endYear","tempMonth","tempYear","componentWillRender","calculateCalendar","componentDidRender","dayElem","hostElement","shadowRoot","querySelector","focus","dayNames","rotateWeekDayNames","Info","weekdays","locale","weekStartIndex","monthNames","months","index","clone","len","length","push","splice","onDone","date","dateSelect","emit","monthStart","startOf","monthEnd","endOf","startWeek","weekNumber","endWeek","monthStartWeekDayIndex","weekday","monthEndWeekDayIndex","monthStartWeekDayName","findIndex","d","monthEndWeekDayName","correctLastWeek","weeksInWeekYear","correctFirstWeek","currDayNumber","weekIndex","daysArr","j","dayNumbers","selectTempYear","stopPropagation","focusMonth","current","infiniteScrollYears","yearContainer","scroll","scrollTop","maxScroll","scrollHeight","atTop","atBottom","Math","round","offsetHeight","limit","first","firstElementChild","scrollTo","offsetTop","last","lastElementChild","selectMonth","dropdown","show","number","selectDay","selectedDay","target","classList","contains","fromJSDate","Date","onDateChange","then","dateChange","dateRangeChange","getDayClasses","day","todayObj","selectedDayObj","hasSame","selected","disabled","isWithinMinMaxDate","isWithinMinMaxYear","minDateYear","minDate","maxDateYear","maxDate","isBefore","isAfter","isWithinMinMaxMonth","minDateObj","maxDateObj","minDateMonth","maxDateMonth","_minDate","_maxDate","renderYears","rows","class","arrowYear","onClick","onKeyUp","tabIndex","hidden","arrowPosition","name","iconChevronRightSmall","corners","standaloneAppearance","slot","ghost","icon","iconChevronLeftSmall","variant","ref","trigger","waitForCurrent","ignoreRelatedSubmenu","placement","onScroll","map","checkPosition","iconSingleCheck","slice","week","Fragment","id","e","currentTarget","onFocus","onBlur","button","textSelectDate","i18nDone","__decorate","OnListener","layoutGridCss","IxLayoutGridStyle0","LayoutGrid","noMargin","columns","gap","rowCss","IxRowStyle0","Row"],"sources":["src/components/col/col.scss?tag=ix-col&encapsulation=shadow","src/components/col/col.tsx","src/components/date-picker/date-picker.scss?tag=ix-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx","src/components/layout-grid/layout-grid.scss?tag=ix-layout-grid&encapsulation=shadow","src/components/layout-grid/layout-grid.tsx","src/components/row/row.scss?tag=ix-row&encapsulation=shadow","src/components/row/row.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  position: relative;\n  flex-basis: 0;\n  flex-grow: 1;\n  width: 100%;\n  max-width: 100%;\n  min-height: 1px;\n\n  padding: calc(var(--ix-layout-grid-gutter) * 0.5);\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, forceUpdate, h, Host, Listen, Prop } from '@stencil/core';\nimport { Breakpoint, matchBreakpoint } from '../utils/breakpoints';\n\ntype GridBreakpoint = Breakpoint | '';\n\nexport type ColumnSize =\n  | '1'\n  | '2'\n  | '3'\n  | '4'\n  | '5'\n  | '6'\n  | '7'\n  | '8'\n  | '9'\n  | '10'\n  | '11'\n  | '12'\n  | 'auto';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-col',\n  styleUrl: 'col.scss',\n  shadow: true,\n})\nexport class Col {\n  static Breakpoints: GridBreakpoint[] = ['', 'sm', 'md', 'lg'];\n\n  /**\n   * Size of the column\n   */\n  @Prop() size?: ColumnSize;\n\n  /**\n   * Size of the column for sm screens\n   */\n  @Prop() sizeSm?: ColumnSize;\n\n  /**\n   * Size of the column for md screens\n   */\n  @Prop() sizeMd?: ColumnSize;\n\n  /**\n   * Size of the column for lg screens\n   */\n  @Prop() sizeLg?: ColumnSize;\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    forceUpdate(this);\n  }\n\n  private getSize(breakpoint: GridBreakpoint) {\n    if (breakpoint === '') {\n      return this.size;\n    }\n\n    if (breakpoint === 'sm') {\n      return this.sizeSm;\n    }\n\n    if (breakpoint === 'md') {\n      return this.sizeMd;\n    }\n\n    if (breakpoint === 'lg') {\n      return this.sizeLg;\n    }\n  }\n\n  private getColumnSize(): ColumnSize | undefined {\n    let size: ColumnSize | undefined;\n    Col.Breakpoints.forEach((breakpoint) => {\n      const isMediaQueryActive =\n        breakpoint !== '' ? matchBreakpoint(breakpoint) : true;\n\n      if (!isMediaQueryActive) {\n        return;\n      }\n\n      const currentSize = this.getSize(breakpoint);\n\n      if (currentSize) {\n        size = currentSize;\n      }\n    });\n\n    return size;\n  }\n\n  private getColumnSizeStyling() {\n    const size = this.getColumnSize();\n\n    if (!size) {\n      return;\n    }\n\n    if (size === 'auto') {\n      return {\n        flex: '0 0 auto',\n        width: 'auto',\n        'max-width': 'auto',\n      };\n    }\n\n    const colSize = `calc(calc(${size} / var(--ix-layout-grid-columns)) * 100%)`;\n\n    return {\n      flex: `0 0 ${colSize}`,\n      width: `${colSize}`,\n      'max-width': `${colSize}`,\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        style={{\n          ...this.getColumnSizeStyling(),\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  width: 21rem;\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n\n  .disabled-item {\n    pointer-events: none;\n    background-color: var(--theme-datepicker-day--background--disabled);\n    color: var(--theme-datepicker-day--color--disabled);\n    cursor: default;\n  }\n\n  .selector {\n    flex-basis: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: $tiny-space $default-space;\n\n    .dropdown {\n      color: var(--theme-menu-item--color);\n      font-size: 14px;\n      line-height: 20px;\n    }\n\n    .fontSize {\n      font-size: 16px;\n    }\n\n    .capitalize {\n      text-transform: capitalize;\n    }\n\n    .month-dropdown-item {\n      margin-left: 4px;\n      margin-right: 4px;\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n      }\n    }\n\n    .arrowYear {\n      display: flex;\n      position: relative;\n      padding: $medium-space $x-large-space;\n      align-items: center;\n      cursor: pointer;\n\n      &:hover {\n        background-color: var(--theme-select-list-item--background--hover);\n      }\n\n      &.selected {\n        background-color: var(--theme-select-list-item--background--selected);\n      }\n\n      .arrowPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 6px);\n      }\n\n      .checkPosition {\n        position: absolute;\n        left: calc(($x-large-space / 2) - 6px);\n        top: calc(50% - 8px);\n      }\n\n      .monthMargin {\n        margin-left: 10px;\n      }\n    }\n  }\n\n  .wrapper {\n    display: flex;\n\n    .overflow {\n      overflow-y: scroll;\n      max-height: 250px;\n    }\n  }\n\n  .grid {\n    display: grid;\n    grid-template-columns: 24px repeat(7, 40px);\n    grid-template-rows: repeat(7, 40px);\n\n    align-items: center;\n    justify-items: center;\n    justify-content: center;\n    color: var(--theme-datepicker-today--color);\n\n    .calendar-item {\n      position: relative;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      background-color: var(--theme-datepicker-day--background);\n      border: 1px solid var(--theme-datepicker-day--background);\n      width: 40px;\n      height: 40px;\n      cursor: pointer;\n\n      &:first-child {\n        width: 24px;\n      }\n\n      &:focus-visible {\n        outline: 1px solid var(--theme-color-focus-bdr);\n        outline-offset: var(--theme-btn--focus--outline-offset);\n\n        background-color: var(--theme-datepicker-day--background--selected);\n        border: inset 1px solid var(--theme-datepicker-day--border-color--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        font-size: 14px;\n        line-height: 20px;\n        letter-spacing: 0;\n      }\n\n      &.today {\n        border: 1px solid var(--theme-datepicker-today--border-color);\n\n        &:hover {\n          background-color: var(--theme-datepicker-day--background--hover);\n        }\n\n        &:active {\n          background-color: var(--theme-datepicker-day--background--active);\n        }\n\n        &.selected {\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                --theme-datepicker-day--background--selected-hover\n            );\n          }\n\n          &:active {\n            background-color: var(\n                --theme-datepicker-day--background--selected-active\n            );\n          }\n\n          &.disabled {\n            pointer-events: none;\n            background-color: var(\n                --theme-datepicker-day--background--selected-disabled\n            );\n            border: 1px solid var(--theme-datepicker-day--background--selected-disabled);\n            color: var(--theme-datepicker-day--color--selected-disabled);\n          }\n        }\n\n        &.range {\n          background-color: var(--theme-datepicker-day--background--range);\n          color: var(--theme-datepicker-day--color--range);\n          border: 1px solid var(--theme-datepicker-today--border-color--range);\n          box-shadow: inset 0 0 0 1px white;\n\n          &:hover {\n            background-color: var(\n                --theme-datepicker-day--background--range-hover\n            );\n            border: 1px solid var(--theme-datepicker-today--border-color--range-hover);\n          }\n\n          &:active {\n            background-color: var(\n                --theme-datepicker-day--background--range-active\n            );\n            border: 1px solid var(--theme-datepicker-today--border-color--range-active);\n          }\n\n          &.disabled {\n            background-color: var(\n                --theme-datepicker-day--background--range-disabled\n            );\n            color: var(--theme-datepicker-day--color--range-disabled);\n            border: 1px solid var(--theme-datepicker-today--border-color--range-disabled);\n          }\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(--theme-datepicker-day--background--disabled);\n          color: var(--theme-datepicker-day--color--disabled);\n          cursor: default;\n        }\n      }\n\n      &:hover {\n        background-color: var(--theme-datepicker-day--background--hover);\n      }\n\n      &:active {\n        background-color: var(--theme-datepicker-day--background--active);\n      }\n\n      &.selected {\n        background-color: var(--theme-datepicker-day--background--selected);\n        color: var(--theme-datepicker-day--color--selected);\n        border: 1px solid var(--theme-datepicker-day--background--selected);\n\n        &:hover {\n          background-color: var(\n              --theme-datepicker-day--background--selected-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n              --theme-datepicker-day--background--selected-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n              --theme-datepicker-day--background--selected-disabled\n          );\n          color: var(--theme-datepicker-day--color--selected-disabled);\n        }\n      }\n\n      &.range {\n        background-color: var(--theme-datepicker-day--background--range);\n        color: var(--theme-datepicker-day--color--range);\n\n        &:hover {\n          background-color: var(\n              --theme-datepicker-day--background--range-hover\n          );\n        }\n\n        &:active {\n          background-color: var(\n              --theme-datepicker-day--background--range-active\n          );\n        }\n\n        &.disabled {\n          pointer-events: none;\n          background-color: var(\n              --theme-datepicker-day--background--range-disabled\n          );\n          color: var(--theme-datepicker-day--color--range-disabled);\n        }\n      }\n\n      &.disabled {\n        pointer-events: none;\n        background-color: var(--theme-datepicker-day--background--disabled);\n        color: var(--theme-datepicker-day--color--disabled);\n      }\n\n      &.week-day {\n        color: var(--theme-datepicker-weekday--color);\n        font-size: 12px;\n        line-height: 20px;\n        border: none;\n        background: none;\n        cursor: initial;\n\n        .overflow {\n          @include ellipsis;\n        }\n      }\n\n      &.empty-day {\n        border: none;\n        background: none;\n        cursor: initial;\n      }\n\n      &.week-number {\n        font-size: 10px;\n        line-height: 14px;\n        color: var(--theme-datepicker-weekday--color);\n        border: none;\n        background: none;\n        cursor: initial;\n        width: 1.5rem;\n      }\n    }\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n    margin-top: $default-space;\n  }\n\n  .hidden {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nimport { DateTime, Info } from 'luxon';\nimport { OnListener } from '../utils/listener';\nimport { IxDatePickerComponent } from './date-picker-component';\nimport { makeRef } from '../utils/make-ref';\nimport {\n  iconChevronLeftSmall,\n  iconChevronRightSmall,\n  iconSingleCheck,\n} from '@siemens/ix-icons/icons';\n\nexport type DateChangeEvent = {\n  from: string;\n  to: string;\n};\n\ninterface CalendarWeek {\n  weekNumber: number;\n  dayNumbers: (number | undefined)[];\n}\n\n@Component({\n  tag: 'ix-date-picker',\n  styleUrl: 'date-picker.scss',\n  shadow: true,\n})\nexport class DatePicker implements IxDatePickerComponent {\n  @Element() hostElement!: HTMLIxDatePickerElement;\n\n  /**\n   * Date format string.\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * If true a date-range can be selected (from/to).\n   */\n  @Prop() range: boolean = true;\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: DateTimeCardCorners = 'rounded';\n\n  /**\n   * The selected starting date. If the date-picker-rework is not in range mode this is the selected date.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() from: string | undefined;\n\n  @Watch('from')\n  watchFromPropHandler(newValue: string) {\n    this.currFromDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currFromDate?.isValid) {\n      this.selectedYear = this.currFromDate.year;\n      this.selectedMonth = this.currFromDate.month - 1;\n    }\n  }\n\n  /**\n   * The selected end date. If the the date-picker-rework is not in range mode this property has no impact.\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() to: string | undefined;\n\n  @Watch('to')\n  watchToPropHandler(newValue: string) {\n    this.currToDate = newValue\n      ? DateTime.fromFormat(newValue, this.format)\n      : undefined;\n\n    if (this.currToDate?.isValid) {\n      this.selectedYear = this.currToDate.year;\n      this.selectedMonth = this.currToDate.month - 1;\n    }\n  }\n\n  /**\n   * The earliest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() minDate = '';\n\n  /**\n   * The latest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   *\n   * @since 1.1.0\n   */\n  @Prop() maxDate = '';\n\n  /**\n   * Text of the button that confirms date selection.\n   *\n   * @since 1.1.0\n   * @deprecated since 2.1.0. Use `i18nDone`\n   */\n  @Prop() textSelectDate = '';\n\n  /**\n   * Text of date select button\n   *\n   * @since 2.1.0\n   */\n  @Prop({ attribute: 'i18n-done' }) i18nDone = 'Done';\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   *\n   * @since 2.1.0\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * Locale identifier (e.g. 'en' or 'de').\n   *\n   * @since 2.1.0\n   */\n  @Prop() locale?: string;\n\n  @Watch('locale')\n  onLocaleChange() {\n    this.setTranslations();\n  }\n\n  /**\n   * @deprecated Not supported since 2.0.0.\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n   * This combination can be configured over the delimiter\n   *\n   * @since 1.1.0\n   * @deprecated Not used anymore see `this.dateChange`\n   */\n  @Prop() eventDelimiter = ' - ';\n\n  /** @internal */\n  @Prop() standaloneAppearance = true;\n\n  /** @internal */\n  @Prop() today = DateTime.now().toISO();\n\n  /**\n   * Triggers if the date selection changes.\n   * Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string`\n   *\n   * @since 2.1.0\n   */\n  @Event() dateChange!: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Triggers if the date selection changes.\n   * Only triggered if date-picker-rework is in range mode.\n   *\n   * @since 2.1.0\n   */\n  @Event() dateRangeChange!: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @since 1.1.0\n   */\n  @Event() dateSelect!: EventEmitter<DateChangeEvent>;\n\n  /**\n   * Date selection confirmed via button action\n   *\n   * @deprecated NOT getting dispatched after 2.0.0. Use `dateSelect`.\n   */\n  @Event() done!: EventEmitter<string>;\n\n  /**\n   * Get the currently selected date-range.\n   */\n  @Method()\n  async getCurrentDate() {\n    const _from = this.currFromDate?.isValid\n      ? this.currFromDate?.toFormat(this.format)\n      : undefined;\n    const _to = this.currToDate?.isValid\n      ? this.currToDate?.toFormat(this.format)\n      : undefined;\n\n    if (this.range) {\n      return {\n        from: _from,\n        to: _to,\n      };\n    }\n\n    return {\n      from: _from,\n      to: undefined,\n    };\n  }\n\n  @State() currFromDate?: DateTime;\n  @State() currToDate?: DateTime;\n\n  @State() selectedYear = 0;\n  @State() tempYear = 0;\n  @State() startYear = 0;\n  @State() endYear = 0;\n  @State() selectedMonth = 0;\n  @State() tempMonth = 0;\n\n  private readonly dropdownButtonRef = makeRef<HTMLElement>();\n  private readonly yearContainerRef = makeRef<HTMLElement>();\n  private readonly firstMonthRef = makeRef<HTMLElement>();\n\n  @State() dayNames!: string[];\n  @State() monthNames!: string[];\n  @State() focusedDay: number = 1;\n\n  private isDayFocus = false;\n  private monthChangedFromFocus = false;\n  private readonly DAYS_IN_WEEK = 7;\n  private calendar: CalendarWeek[] = [];\n\n  @OnListener<DatePicker>('keydown')\n  handleKeyUp(event: KeyboardEvent) {\n    if (!this.isDayFocus) {\n      return;\n    }\n\n    let _focusedDay = this.focusedDay;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        _focusedDay--;\n        break;\n      case 'ArrowRight':\n        _focusedDay++;\n        break;\n      case 'ArrowUp':\n        _focusedDay = _focusedDay - 7;\n        break;\n      case 'ArrowDown':\n        _focusedDay = _focusedDay + 7;\n        break;\n      default:\n        return;\n    }\n\n    if (_focusedDay > this.getDaysInCurrentMonth()) {\n      _focusedDay = _focusedDay - this.getDaysInCurrentMonth();\n      this.changeToAdjacentMonth(1);\n      this.monthChangedFromFocus = true;\n    } else if (_focusedDay < 1) {\n      this.changeToAdjacentMonth(-1);\n      _focusedDay = _focusedDay + this.getDaysInCurrentMonth();\n      this.monthChangedFromFocus = true;\n    }\n\n    this.focusedDay = _focusedDay;\n  }\n\n  private getDaysInCurrentMonth(): number {\n    return (\n      DateTime.utc(this.selectedYear, this.selectedMonth + 1).daysInMonth || 0\n    );\n  }\n\n  private getDateTimeNow() {\n    return DateTime.fromISO(this.today);\n  }\n\n  onDayBlur() {\n    this.isDayFocus = false;\n  }\n\n  onDayFocus() {\n    this.isDayFocus = true;\n  }\n\n  componentWillLoad() {\n    this.setTranslations();\n\n    this.currFromDate = this.from\n      ? DateTime.fromFormat(this.from, this.format)\n      : undefined;\n    this.currToDate = this.to\n      ? DateTime.fromFormat(this.to, this.format)\n      : undefined;\n\n    const year = this.currFromDate?.year ?? this.getDateTimeNow().year;\n    this.startYear = year - 5;\n    this.endYear = year + 5;\n\n    this.selectedMonth =\n      (this.currFromDate?.month ?? this.getDateTimeNow().month) - 1;\n    this.selectedYear = year;\n    this.tempMonth = this.selectedMonth;\n    this.tempYear = this.selectedYear;\n  }\n\n  componentWillRender() {\n    this.calculateCalendar();\n  }\n\n  componentDidRender() {\n    if (!this.monthChangedFromFocus && !this.isDayFocus) {\n      return;\n    }\n\n    const dayElem = this.hostElement.shadowRoot!.querySelector(\n      `[id=day-cell-${this.focusedDay}]`\n    ) as HTMLElement;\n    dayElem.focus();\n  }\n\n  private setTranslations() {\n    this.dayNames = this.rotateWeekDayNames(\n      Info.weekdays('long', {\n        locale: this.locale,\n      }),\n      this.weekStartIndex\n    );\n\n    this.monthNames = Info.months('long', {\n      locale: this.locale,\n    });\n  }\n\n  /**\n   * Rotate the WeekdayNames array.\n   * Based on the position that should be the new 0-index.\n   */\n  private rotateWeekDayNames(weekdays: string[], index: number): string[] {\n    const clone = [...weekdays];\n\n    if (index === 0) {\n      return clone;\n    }\n\n    index = -index;\n    const len = weekdays.length;\n\n    clone.push(...clone.splice(0, ((-index % len) + len) % len));\n    return clone;\n  }\n\n  private async onDone() {\n    const date = await this.getCurrentDate();\n    // TODO (IX-1870): refactor event signatures to match internal logic with undefined values\n    this.dateSelect.emit(date);\n  }\n\n  private calculateCalendar() {\n    const calendar: CalendarWeek[] = [];\n    const month = DateTime.utc(this.selectedYear, this.selectedMonth + 1);\n    const monthStart = month.startOf('month');\n    const monthEnd = month.endOf('month');\n    let startWeek = monthStart.weekNumber;\n    let endWeek = monthEnd.weekNumber;\n    let monthStartWeekDayIndex = monthStart.weekday - 1;\n    let monthEndWeekDayIndex = monthEnd.weekday - 1;\n\n    if (this.weekStartIndex !== 0) {\n      // Find the positions where to start/stop counting the day-numbers based on which day the week starts\n      const weekdays = Info.weekdays();\n      const monthStartWeekDayName = weekdays[monthStart.weekday];\n\n      monthStartWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthStartWeekDayName\n      );\n      const monthEndWeekDayName = weekdays[monthEnd.weekday];\n      monthEndWeekDayIndex = this.dayNames.findIndex(\n        (d) => d === monthEndWeekDayName\n      );\n    }\n\n    let correctLastWeek = false;\n    if (endWeek === 1) {\n      endWeek = monthEnd.weeksInWeekYear + 1;\n      correctLastWeek = true;\n    }\n\n    let correctFirstWeek = false;\n    if (startWeek === monthStart.weeksInWeekYear) {\n      startWeek = 1;\n      endWeek++;\n\n      correctFirstWeek = true;\n    }\n\n    let currDayNumber = 1;\n    for (\n      let weekIndex = startWeek;\n      weekIndex <= endWeek && currDayNumber <= 31;\n      weekIndex++\n    ) {\n      const daysArr: (number | undefined)[] = [];\n\n      for (let j = 0; j < this.DAYS_IN_WEEK && currDayNumber <= 31; j++) {\n        // Display empty cells until the calender starts/has ended\n        if (\n          (weekIndex === startWeek && j < monthStartWeekDayIndex) ||\n          (weekIndex === endWeek && j > monthEndWeekDayIndex)\n        ) {\n          daysArr.push(undefined);\n        } else {\n          daysArr.push(currDayNumber++);\n        }\n      }\n\n      if (correctFirstWeek || correctLastWeek) {\n        if (weekIndex === 1) {\n          calendar.push({\n            weekNumber: monthStart.weeksInWeekYear,\n            dayNumbers: daysArr,\n          });\n        } else if (weekIndex === monthEnd.weekNumber) {\n          calendar.push({\n            weekNumber: 1,\n            dayNumbers: daysArr,\n          });\n        } else {\n          calendar.push({\n            weekNumber: weekIndex - 1,\n            dayNumbers: daysArr,\n          });\n        }\n        continue;\n      }\n\n      calendar.push({\n        weekNumber: weekIndex,\n        dayNumbers: daysArr,\n      });\n    }\n\n    this.calendar = calendar;\n  }\n\n  private selectTempYear(event: MouseEvent, year: number) {\n    event?.stopPropagation();\n    this.tempYear = year;\n  }\n\n  private focusMonth() {\n    this.firstMonthRef.current?.focus();\n  }\n\n  private infiniteScrollYears() {\n    const yearContainer = this.yearContainerRef.current;\n\n    if (!yearContainer) {\n      return;\n    }\n\n    const scroll = yearContainer.scrollTop;\n    const maxScroll = yearContainer.scrollHeight;\n    const atTop = scroll === 0;\n    const atBottom =\n      Math.round(scroll + yearContainer.offsetHeight) >= maxScroll;\n    const limit = 200;\n\n    if (this.endYear - this.startYear > limit) return;\n\n    if (atTop) {\n      const first = yearContainer.firstElementChild as HTMLElement;\n      this.startYear -= 5;\n      yearContainer.scrollTo(0, first.offsetTop);\n\n      return;\n    }\n\n    if (atBottom) {\n      const last = yearContainer.lastElementChild as HTMLElement;\n      this.endYear += 5;\n      yearContainer.scrollTo(0, last.offsetTop);\n    }\n  }\n\n  private selectMonth(month: number) {\n    this.selectedMonth = month;\n    this.selectedYear = this.tempYear;\n    this.tempMonth = month;\n\n    const dropdown = this.hostElement.shadowRoot!.querySelector('ix-dropdown');\n    if (dropdown) {\n      dropdown.show = false;\n    }\n  }\n\n  private changeToAdjacentMonth(number: -1 | 1) {\n    if (this.selectedMonth + number < 0) {\n      this.selectedYear--;\n      this.selectedMonth = 11;\n    } else if (this.selectedMonth + number > 11) {\n      this.selectedYear++;\n      this.selectedMonth = 0;\n    } else {\n      this.selectedMonth += number;\n    }\n  }\n\n  private selectDay(selectedDay: number, target: Element) {\n    if (target.classList.contains('disabled')) {\n      return;\n    }\n\n    const date = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, selectedDay)\n    );\n\n    if (!this.range || this.currFromDate === undefined) {\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Reset the range selection\n    if (this.currToDate !== undefined) {\n      this.currFromDate = date;\n      this.currToDate = undefined;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Swap from/to if the second date is before the current date\n    if (date < this.currFromDate) {\n      this.currToDate = this.currFromDate;\n      this.currFromDate = date;\n      this.onDateChange();\n\n      return;\n    }\n\n    // Set the range normally\n    this.currToDate = date;\n    this.onDateChange();\n  }\n\n  private onDateChange() {\n    this.getCurrentDate().then((date) => {\n      // TODO (IX-1870): refactor event signatures to match internal logic with undefined values\n      this.dateChange.emit(date);\n      if (this.range) {\n        // TODO (IX-1870): refactor event signatures to match internal logic with undefined values\n        this.dateRangeChange.emit(date);\n      }\n    });\n  }\n\n  private getDayClasses(day: number): any {\n    const todayObj = this.getDateTimeNow();\n    const selectedDayObj = DateTime.fromJSDate(\n      new Date(this.selectedYear, this.selectedMonth, day)\n    );\n\n    return {\n      'calendar-item': true,\n      'empty-day': day === undefined,\n      today: todayObj.hasSame(selectedDayObj, 'day'),\n      selected:\n        this.currFromDate?.hasSame(selectedDayObj, 'day') ||\n        this.currToDate?.hasSame(selectedDayObj, 'day'),\n      range:\n        this.currFromDate &&\n        selectedDayObj.startOf('day') > this.currFromDate.startOf('day') &&\n        this.currToDate !== undefined &&\n        selectedDayObj.startOf('day') < this.currToDate?.startOf('day'),\n      disabled: !this.isWithinMinMaxDate(selectedDayObj),\n    };\n  }\n\n  private isWithinMinMaxYear(year: number): boolean {\n    const minDateYear = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format).year\n      : undefined;\n    const maxDateYear = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format).year\n      : undefined;\n    const isBefore = minDateYear ? year < minDateYear : false;\n    const isAfter = maxDateYear ? year > maxDateYear : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxMonth(month: number): boolean {\n    const minDateObj = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const maxDateObj = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const minDateMonth = minDateObj?.month;\n    const maxDateMonth = maxDateObj?.month;\n    const isBefore = minDateMonth\n      ? this.tempYear === minDateObj.year && month < minDateMonth\n      : false;\n    const isAfter = maxDateMonth\n      ? this.tempYear === maxDateObj.year && month > maxDateMonth\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private isWithinMinMaxDate(date: DateTime): boolean {\n    const _minDate = this.minDate\n      ? DateTime.fromFormat(this.minDate, this.format)\n      : undefined;\n    const _maxDate = this.maxDate\n      ? DateTime.fromFormat(this.maxDate, this.format)\n      : undefined;\n    const isBefore = _minDate\n      ? date.startOf('day') < _minDate.startOf('day')\n      : false;\n    const isAfter = _maxDate\n      ? date.startOf('day') > _maxDate.startOf('day')\n      : false;\n\n    return !isBefore && !isAfter;\n  }\n\n  private renderYears(): any[] {\n    const rows = [];\n\n    for (let year = this.startYear; year <= this.endYear; year++) {\n      rows.push(\n        <div\n          key={year}\n          class={{\n            arrowYear: true,\n            'month-dropdown-item': true,\n            'disabled-item': !this.isWithinMinMaxYear(year),\n          }}\n          onClick={(event) => this.selectTempYear(event, year)}\n          onKeyUp={(event) => {\n            if (event.key === 'Enter') {\n              this.tempYear = year;\n              this.focusMonth();\n            }\n          }}\n          tabIndex={0}\n        >\n          <ix-icon\n            class={{\n              hidden: this.tempYear !== year,\n              arrowPosition: true,\n            }}\n            name={iconChevronRightSmall}\n            size=\"12\"\n          ></ix-icon>\n          <div style={{ 'min-width': 'max-content' }}>{`${year}`}</div>\n        </div>\n      );\n    }\n\n    return rows;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-date-time-card\n          corners={this.corners}\n          standaloneAppearance={this.standaloneAppearance}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(-1)}\n              ghost\n              icon={iconChevronLeftSmall}\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n            <div class=\"selector\">\n              <ix-button\n                ghost\n                ref={this.dropdownButtonRef}\n                data-testid=\"year-month-button\"\n              >\n                <span class=\"fontSize capitalize\">\n                  {this.monthNames[this.selectedMonth]} {this.selectedYear}\n                </span>\n              </ix-button>\n              <ix-dropdown\n                data-testid=\"year-month-dropdown\"\n                class=\"dropdown\"\n                trigger={this.dropdownButtonRef.waitForCurrent()}\n                ignoreRelatedSubmenu\n                placement=\"bottom-start\"\n              >\n                <div class=\"wrapper\">\n                  <div\n                    data-testid=\"year-container\"\n                    class=\"overflow\"\n                    onScroll={() => this.infiniteScrollYears()}\n                    ref={this.yearContainerRef}\n                  >\n                    {this.renderYears()}\n                  </div>\n                  <div class=\"overflow\" data-testid=\"month-container\">\n                    {this.monthNames.map((month, index) => (\n                      <div\n                        key={month}\n                        ref={(ref) => {\n                          if (month === this.monthNames[0]) {\n                            this.firstMonthRef(ref);\n                          }\n                        }}\n                        class={{\n                          arrowYear: true,\n                          'month-dropdown-item': true,\n                          selected:\n                            this.tempYear === this.selectedYear &&\n                            this.tempMonth === index,\n                          'disabled-item': !this.isWithinMinMaxMonth(index),\n                        }}\n                        onClick={() => this.selectMonth(index)}\n                        onKeyUp={(event) =>\n                          event.key === 'Enter' && this.selectMonth(index)\n                        }\n                        tabIndex={0}\n                      >\n                        <ix-icon\n                          class={{\n                            hidden:\n                              this.tempYear !== this.selectedYear ||\n                              this.tempMonth !== index,\n                            checkPosition: true,\n                          }}\n                          name={iconSingleCheck}\n                          size=\"16\"\n                        ></ix-icon>\n                        <div>\n                          <span class=\"capitalize monthMargin\">{`${month} ${this.tempYear}`}</span>\n                        </div>\n                      </div>\n                    ))}\n                  </div>\n                </div>\n              </ix-dropdown>\n            </div>\n            <ix-icon-button\n              onClick={() => this.changeToAdjacentMonth(1)}\n              ghost\n              icon={iconChevronRightSmall}\n              variant=\"primary\"\n              class=\"arrows\"\n            ></ix-icon-button>\n          </div>\n          <div class=\"grid\">\n            <div class=\"calendar-item week-day\"></div>\n            {this.dayNames.map((name) => (\n              <div key={name} class=\"calendar-item week-day\">\n                <div class=\"overflow\">{name.slice(0, 3)}</div>\n              </div>\n            ))}\n            {this.calendar.map((week) => {\n              return (\n                <Fragment>\n                  <div class=\"calendar-item week-number\">{week.weekNumber}</div>\n                  {week.dayNumbers.map((day) => {\n                    return day ? (\n                      <div\n                        key={day}\n                        id={`day-cell-${day}`}\n                        date-calender-day\n                        class={this.getDayClasses(day)}\n                        onClick={(e) => {\n                          const target = e.currentTarget as HTMLElement;\n                          this.selectDay(day, target);\n                        }}\n                        onKeyUp={(e) => {\n                          const target = e.currentTarget as HTMLElement;\n                          if (e.key === 'Enter') {\n                            this.selectDay(day, target);\n                          }\n                        }}\n                        tabIndex={day === this.focusedDay ? 0 : -1}\n                        onFocus={() => this.onDayFocus()}\n                        onBlur={() => this.onDayBlur()}\n                      >\n                        {day}\n                      </div>\n                    ) : (\n                      <div></div>\n                    );\n                  })}\n                </Fragment>\n              );\n            })}\n          </div>\n          <div\n            class={{\n              button: true,\n              hidden: !this.range || !this.standaloneAppearance,\n            }}\n          >\n            <ix-button onClick={() => this.onDone()}>\n              {this.textSelectDate || this.i18nDone}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n:host {\n  --ix-layout-grid-gutter: 24px;\n\n  display: block;\n  flex: 1 1 0%;\n  width: 100%;\n\n  padding-left: calc(var(--ix-layout-grid-gutter) * 0.5);\n  padding-right: calc(var(--ix-layout-grid-gutter) * 0.5);\n}\n\n:host(.no-margin) {\n  padding-left: 0;\n  padding-right: 0;\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-layout-grid',\n  styleUrl: 'layout-grid.scss',\n  shadow: true,\n})\nexport class LayoutGrid {\n  /**\n   * The grid will not have any horizontal padding\n   */\n  @Prop() noMargin = false;\n\n  /**\n   * Grid gap\n   */\n  @Prop() gap: '8' | '12' | '16' | '24' = '24';\n\n  /**\n   * Overwrite the default number of columns. Choose between 2 and 12 columns.\n   */\n  @Prop() columns = 12;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'no-margin': this.noMargin,\n        }}\n        style={{\n          '--ix-layout-grid-columns': `${this.columns}`,\n          '--ix-layout-grid-gutter': `${this.gap}px`,\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n:host(:not(:first-of-type)) {\n  margin-block-start: var(--ix-layout-grid-row-margin, 0);\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-row',\n  styleUrl: 'row.scss',\n  shadow: true,\n})\nexport class Row {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uRAAA,MAAMA,EAAS,s4BACf,MAAAC,EAAeD,E,MCoCFE,EAAG,M,+GAwBd,QAAAC,GACEC,EAAYC,K,CAGN,OAAAC,CAAQC,GACd,GAAIA,IAAe,GAAI,CACrB,OAAOF,KAAKG,I,CAGd,GAAID,IAAe,KAAM,CACvB,OAAOF,KAAKI,M,CAGd,GAAIF,IAAe,KAAM,CACvB,OAAOF,KAAKK,M,CAGd,GAAIH,IAAe,KAAM,CACvB,OAAOF,KAAKM,M,EAIR,aAAAC,GACN,IAAIJ,EACJN,EAAIW,YAAYC,SAASP,IACvB,MAAMQ,EACJR,IAAe,GAAKS,EAAgBT,GAAc,KAEpD,IAAKQ,EAAoB,CACvB,M,CAGF,MAAME,EAAcZ,KAAKC,QAAQC,GAEjC,GAAIU,EAAa,CACfT,EAAOS,C,KAIX,OAAOT,C,CAGD,oBAAAU,GACN,MAAMV,EAAOH,KAAKO,gBAElB,IAAKJ,EAAM,CACT,M,CAGF,GAAIA,IAAS,OAAQ,CACnB,MAAO,CACLW,KAAM,WACNC,MAAO,OACP,YAAa,O,CAIjB,MAAMC,EAAU,aAAab,6CAE7B,MAAO,CACLW,KAAM,OAAOE,IACbD,MAAO,GAAGC,IACV,YAAa,GAAGA,I,CAIpB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAKC,OAAAC,OAAA,GACAvB,KAAKa,yBAGVK,EAAA,QAAAE,IAAA,6C,GAhGCvB,EAAAW,YAAgC,CAAC,GAAI,KAAM,KAAM,M,UCtC1D,MAAMgB,EAAgB,wpOACtB,MAAAC,EAAeD,E,iXCgDFE,EAAU,M,mLAmMJ1B,KAAA2B,kBAAoBC,IACpB5B,KAAA6B,iBAAmBD,IACnB5B,KAAA8B,cAAgBF,IAMzB5B,KAAA+B,WAAa,MACb/B,KAAAgC,sBAAwB,MACfhC,KAAAiC,aAAe,EACxBjC,KAAAkC,SAA2B,G,YAvMV,a,WAKA,K,aAKc,U,mDAgDrB,G,aAQA,G,oBAQO,G,cAOoB,O,oBAQpB,E,sCAiBK,K,oBASL,M,0BAGM,K,WAGfC,EAASC,MAAMC,Q,wEA4DP,E,cACJ,E,eACC,E,aACF,E,mBACM,E,eACJ,E,kEAQS,C,CA7K9B,oBAAAC,CAAqBC,G,MACnBvC,KAAKwC,aAAeD,EAChBJ,EAASM,WAAWF,EAAUvC,KAAK0C,QACnCC,UAEJ,IAAIC,EAAA5C,KAAKwC,gBAAY,MAAAI,SAAA,SAAAA,EAAEC,QAAS,CAC9B7C,KAAK8C,aAAe9C,KAAKwC,aAAaO,KACtC/C,KAAKgD,cAAgBhD,KAAKwC,aAAaS,MAAQ,C,EAanD,kBAAAC,CAAmBX,G,MACjBvC,KAAKmD,WAAaZ,EACdJ,EAASM,WAAWF,EAAUvC,KAAK0C,QACnCC,UAEJ,IAAIC,EAAA5C,KAAKmD,cAAU,MAAAP,SAAA,SAAAA,EAAEC,QAAS,CAC5B7C,KAAK8C,aAAe9C,KAAKmD,WAAWJ,KACpC/C,KAAKgD,cAAgBhD,KAAKmD,WAAWF,MAAQ,C,EAmDjD,cAAAG,GACEpD,KAAKqD,iB,CAyDP,oBAAMC,G,YACJ,MAAMC,IAAQX,EAAA5C,KAAKwC,gBAAY,MAAAI,SAAA,SAAAA,EAAEC,UAC7BW,EAAAxD,KAAKwC,gBAAY,MAAAgB,SAAA,SAAAA,EAAEC,SAASzD,KAAK0C,QACjCC,UACJ,MAAMe,IAAMC,EAAA3D,KAAKmD,cAAU,MAAAQ,SAAA,SAAAA,EAAEd,UACzBe,EAAA5D,KAAKmD,cAAU,MAAAS,SAAA,SAAAA,EAAEH,SAASzD,KAAK0C,QAC/BC,UAEJ,GAAI3C,KAAK6D,MAAO,CACd,MAAO,CACLC,KAAMP,EACNQ,GAAIL,E,CAIR,MAAO,CACLI,KAAMP,EACNQ,GAAIpB,U,CA4BR,WAAAqB,CAAYC,GACV,IAAKjE,KAAK+B,WAAY,CACpB,M,CAGF,IAAImC,EAAclE,KAAKmE,WAEvB,OAAQF,EAAM7C,KACZ,IAAK,YACH8C,IACA,MACF,IAAK,aACHA,IACA,MACF,IAAK,UACHA,EAAcA,EAAc,EAC5B,MACF,IAAK,YACHA,EAAcA,EAAc,EAC5B,MACF,QACE,OAGJ,GAAIA,EAAclE,KAAKoE,wBAAyB,CAC9CF,EAAcA,EAAclE,KAAKoE,wBACjCpE,KAAKqE,sBAAsB,GAC3BrE,KAAKgC,sBAAwB,I,MACxB,GAAIkC,EAAc,EAAG,CAC1BlE,KAAKqE,uBAAuB,GAC5BH,EAAcA,EAAclE,KAAKoE,wBACjCpE,KAAKgC,sBAAwB,I,CAG/BhC,KAAKmE,WAAaD,C,CAGZ,qBAAAE,GACN,OACEjC,EAASmC,IAAItE,KAAK8C,aAAc9C,KAAKgD,cAAgB,GAAGuB,aAAe,C,CAInE,cAAAC,GACN,OAAOrC,EAASsC,QAAQzE,KAAK0E,M,CAG/B,SAAAC,GACE3E,KAAK+B,WAAa,K,CAGpB,UAAA6C,GACE5E,KAAK+B,WAAa,I,CAGpB,iBAAA8C,G,YACE7E,KAAKqD,kBAELrD,KAAKwC,aAAexC,KAAK8D,KACrB3B,EAASM,WAAWzC,KAAK8D,KAAM9D,KAAK0C,QACpCC,UACJ3C,KAAKmD,WAAanD,KAAK+D,GACnB5B,EAASM,WAAWzC,KAAK+D,GAAI/D,KAAK0C,QAClCC,UAEJ,MAAMI,GAAOS,GAAAZ,EAAA5C,KAAKwC,gBAAY,MAAAI,SAAA,SAAAA,EAAEG,QAAI,MAAAS,SAAA,EAAAA,EAAIxD,KAAKwE,iBAAiBzB,KAC9D/C,KAAK8E,UAAY/B,EAAO,EACxB/C,KAAK+E,QAAUhC,EAAO,EAEtB/C,KAAKgD,gBACFY,GAAAD,EAAA3D,KAAKwC,gBAAY,MAAAmB,SAAA,SAAAA,EAAEV,SAAK,MAAAW,SAAA,EAAAA,EAAI5D,KAAKwE,iBAAiBvB,OAAS,EAC9DjD,KAAK8C,aAAeC,EACpB/C,KAAKgF,UAAYhF,KAAKgD,cACtBhD,KAAKiF,SAAWjF,KAAK8C,Y,CAGvB,mBAAAoC,GACElF,KAAKmF,mB,CAGP,kBAAAC,GACE,IAAKpF,KAAKgC,wBAA0BhC,KAAK+B,WAAY,CACnD,M,CAGF,MAAMsD,EAAUrF,KAAKsF,YAAYC,WAAYC,cAC3C,gBAAgBxF,KAAKmE,eAEvBkB,EAAQI,O,CAGF,eAAApC,GACNrD,KAAK0F,SAAW1F,KAAK2F,mBACnBC,EAAKC,SAAS,OAAQ,CACpBC,OAAQ9F,KAAK8F,SAEf9F,KAAK+F,gBAGP/F,KAAKgG,WAAaJ,EAAKK,OAAO,OAAQ,CACpCH,OAAQ9F,KAAK8F,Q,CAQT,kBAAAH,CAAmBE,EAAoBK,GAC7C,MAAMC,EAAQ,IAAIN,GAElB,GAAIK,IAAU,EAAG,CACf,OAAOC,C,CAGTD,GAASA,EACT,MAAME,EAAMP,EAASQ,OAErBF,EAAMG,QAAQH,EAAMI,OAAO,IAAML,EAAQE,EAAOA,GAAOA,IACvD,OAAOD,C,CAGD,YAAMK,GACZ,MAAMC,QAAazG,KAAKsD,iBAExBtD,KAAK0G,WAAWC,KAAKF,E,CAGf,iBAAAtB,GACN,MAAMjD,EAA2B,GACjC,MAAMe,EAAQd,EAASmC,IAAItE,KAAK8C,aAAc9C,KAAKgD,cAAgB,GACnE,MAAM4D,EAAa3D,EAAM4D,QAAQ,SACjC,MAAMC,EAAW7D,EAAM8D,MAAM,SAC7B,IAAIC,EAAYJ,EAAWK,WAC3B,IAAIC,EAAUJ,EAASG,WACvB,IAAIE,EAAyBP,EAAWQ,QAAU,EAClD,IAAIC,EAAuBP,EAASM,QAAU,EAE9C,GAAIpH,KAAK+F,iBAAmB,EAAG,CAE7B,MAAMF,EAAWD,EAAKC,WACtB,MAAMyB,EAAwBzB,EAASe,EAAWQ,SAElDD,EAAyBnH,KAAK0F,SAAS6B,WACpCC,GAAMA,IAAMF,IAEf,MAAMG,EAAsB5B,EAASiB,EAASM,SAC9CC,EAAuBrH,KAAK0F,SAAS6B,WAClCC,GAAMA,IAAMC,G,CAIjB,IAAIC,EAAkB,MACtB,GAAIR,IAAY,EAAG,CACjBA,EAAUJ,EAASa,gBAAkB,EACrCD,EAAkB,I,CAGpB,IAAIE,EAAmB,MACvB,GAAIZ,IAAcJ,EAAWe,gBAAiB,CAC5CX,EAAY,EACZE,IAEAU,EAAmB,I,CAGrB,IAAIC,EAAgB,EACpB,IACE,IAAIC,EAAYd,EAChBc,GAAaZ,GAAWW,GAAiB,GACzCC,IACA,CACA,MAAMC,EAAkC,GAExC,IAAK,IAAIC,EAAI,EAAGA,EAAIhI,KAAKiC,cAAgB4F,GAAiB,GAAIG,IAAK,CAEjE,GACGF,IAAcd,GAAagB,EAAIb,GAC/BW,IAAcZ,GAAWc,EAAIX,EAC9B,CACAU,EAAQzB,KAAK3D,U,KACR,CACLoF,EAAQzB,KAAKuB,I,EAIjB,GAAID,GAAoBF,EAAiB,CACvC,GAAII,IAAc,EAAG,CACnB5F,EAASoE,KAAK,CACZW,WAAYL,EAAWe,gBACvBM,WAAYF,G,MAET,GAAID,IAAchB,EAASG,WAAY,CAC5C/E,EAASoE,KAAK,CACZW,WAAY,EACZgB,WAAYF,G,KAET,CACL7F,EAASoE,KAAK,CACZW,WAAYa,EAAY,EACxBG,WAAYF,G,CAGhB,Q,CAGF7F,EAASoE,KAAK,CACZW,WAAYa,EACZG,WAAYF,G,CAIhB/H,KAAKkC,SAAWA,C,CAGV,cAAAgG,CAAejE,EAAmBlB,GACxCkB,IAAK,MAALA,SAAK,SAALA,EAAOkE,kBACPnI,KAAKiF,SAAWlC,C,CAGV,UAAAqF,G,OACNxF,EAAA5C,KAAK8B,cAAcuG,WAAO,MAAAzF,SAAA,SAAAA,EAAE6C,O,CAGtB,mBAAA6C,GACN,MAAMC,EAAgBvI,KAAK6B,iBAAiBwG,QAE5C,IAAKE,EAAe,CAClB,M,CAGF,MAAMC,EAASD,EAAcE,UAC7B,MAAMC,EAAYH,EAAcI,aAChC,MAAMC,EAAQJ,IAAW,EACzB,MAAMK,EACJC,KAAKC,MAAMP,EAASD,EAAcS,eAAiBN,EACrD,MAAMO,EAAQ,IAEd,GAAIjJ,KAAK+E,QAAU/E,KAAK8E,UAAYmE,EAAO,OAE3C,GAAIL,EAAO,CACT,MAAMM,EAAQX,EAAcY,kBAC5BnJ,KAAK8E,WAAa,EAClByD,EAAca,SAAS,EAAGF,EAAMG,WAEhC,M,CAGF,GAAIR,EAAU,CACZ,MAAMS,EAAOf,EAAcgB,iBAC3BvJ,KAAK+E,SAAW,EAChBwD,EAAca,SAAS,EAAGE,EAAKD,U,EAI3B,WAAAG,CAAYvG,GAClBjD,KAAKgD,cAAgBC,EACrBjD,KAAK8C,aAAe9C,KAAKiF,SACzBjF,KAAKgF,UAAY/B,EAEjB,MAAMwG,EAAWzJ,KAAKsF,YAAYC,WAAYC,cAAc,eAC5D,GAAIiE,EAAU,CACZA,EAASC,KAAO,K,EAIZ,qBAAArF,CAAsBsF,GAC5B,GAAI3J,KAAKgD,cAAgB2G,EAAS,EAAG,CACnC3J,KAAK8C,eACL9C,KAAKgD,cAAgB,E,MAChB,GAAIhD,KAAKgD,cAAgB2G,EAAS,GAAI,CAC3C3J,KAAK8C,eACL9C,KAAKgD,cAAgB,C,KAChB,CACLhD,KAAKgD,eAAiB2G,C,EAIlB,SAAAC,CAAUC,EAAqBC,GACrC,GAAIA,EAAOC,UAAUC,SAAS,YAAa,CACzC,M,CAGF,MAAMvD,EAAOtE,EAAS8H,WACpB,IAAIC,KAAKlK,KAAK8C,aAAc9C,KAAKgD,cAAe6G,IAGlD,IAAK7J,KAAK6D,OAAS7D,KAAKwC,eAAiBG,UAAW,CAClD3C,KAAKwC,aAAeiE,EACpBzG,KAAKmK,eAEL,M,CAIF,GAAInK,KAAKmD,aAAeR,UAAW,CACjC3C,KAAKwC,aAAeiE,EACpBzG,KAAKmD,WAAaR,UAClB3C,KAAKmK,eAEL,M,CAIF,GAAI1D,EAAOzG,KAAKwC,aAAc,CAC5BxC,KAAKmD,WAAanD,KAAKwC,aACvBxC,KAAKwC,aAAeiE,EACpBzG,KAAKmK,eAEL,M,CAIFnK,KAAKmD,WAAasD,EAClBzG,KAAKmK,c,CAGC,YAAAA,GACNnK,KAAKsD,iBAAiB8G,MAAM3D,IAE1BzG,KAAKqK,WAAW1D,KAAKF,GACrB,GAAIzG,KAAK6D,MAAO,CAEd7D,KAAKsK,gBAAgB3D,KAAKF,E,KAKxB,aAAA8D,CAAcC,G,UACpB,MAAMC,EAAWzK,KAAKwE,iBACtB,MAAMkG,EAAiBvI,EAAS8H,WAC9B,IAAIC,KAAKlK,KAAK8C,aAAc9C,KAAKgD,cAAewH,IAGlD,MAAO,CACL,gBAAiB,KACjB,YAAaA,IAAQ7H,UACrB+B,MAAO+F,EAASE,QAAQD,EAAgB,OACxCE,WACEhI,EAAA5C,KAAKwC,gBAAY,MAAAI,SAAA,SAAAA,EAAE+H,QAAQD,EAAgB,WAC3ClH,EAAAxD,KAAKmD,cAAU,MAAAK,SAAA,SAAAA,EAAEmH,QAAQD,EAAgB,QAC3C7G,MACE7D,KAAKwC,cACLkI,EAAe7D,QAAQ,OAAS7G,KAAKwC,aAAaqE,QAAQ,QAC1D7G,KAAKmD,aAAeR,WACpB+H,EAAe7D,QAAQ,SAASlD,EAAA3D,KAAKmD,cAAU,MAAAQ,SAAA,SAAAA,EAAEkD,QAAQ,QAC3DgE,UAAW7K,KAAK8K,mBAAmBJ,G,CAI/B,kBAAAK,CAAmBhI,GACzB,MAAMiI,EAAchL,KAAKiL,QACrB9I,EAASM,WAAWzC,KAAKiL,QAASjL,KAAK0C,QAAQK,KAC/CJ,UACJ,MAAMuI,EAAclL,KAAKmL,QACrBhJ,EAASM,WAAWzC,KAAKmL,QAASnL,KAAK0C,QAAQK,KAC/CJ,UACJ,MAAMyI,EAAWJ,EAAcjI,EAAOiI,EAAc,MACpD,MAAMK,EAAUH,EAAcnI,EAAOmI,EAAc,MAEnD,OAAQE,IAAaC,C,CAGf,mBAAAC,CAAoBrI,GAC1B,MAAMsI,EAAavL,KAAKiL,QACpB9I,EAASM,WAAWzC,KAAKiL,QAASjL,KAAK0C,QACvCC,UACJ,MAAM6I,EAAaxL,KAAKmL,QACpBhJ,EAASM,WAAWzC,KAAKmL,QAASnL,KAAK0C,QACvCC,UACJ,MAAM8I,EAAeF,IAAU,MAAVA,SAAU,SAAVA,EAAYtI,MACjC,MAAMyI,EAAeF,IAAU,MAAVA,SAAU,SAAVA,EAAYvI,MACjC,MAAMmI,EAAWK,EACbzL,KAAKiF,WAAasG,EAAWxI,MAAQE,EAAQwI,EAC7C,MACJ,MAAMJ,EAAUK,EACZ1L,KAAKiF,WAAauG,EAAWzI,MAAQE,EAAQyI,EAC7C,MAEJ,OAAQN,IAAaC,C,CAGf,kBAAAP,CAAmBrE,GACzB,MAAMkF,EAAW3L,KAAKiL,QAClB9I,EAASM,WAAWzC,KAAKiL,QAASjL,KAAK0C,QACvCC,UACJ,MAAMiJ,EAAW5L,KAAKmL,QAClBhJ,EAASM,WAAWzC,KAAKmL,QAASnL,KAAK0C,QACvCC,UACJ,MAAMyI,EAAWO,EACblF,EAAKI,QAAQ,OAAS8E,EAAS9E,QAAQ,OACvC,MACJ,MAAMwE,EAAUO,EACZnF,EAAKI,QAAQ,OAAS+E,EAAS/E,QAAQ,OACvC,MAEJ,OAAQuE,IAAaC,C,CAGf,WAAAQ,GACN,MAAMC,EAAO,GAEb,IAAK,IAAI/I,EAAO/C,KAAK8E,UAAW/B,GAAQ/C,KAAK+E,QAAShC,IAAQ,CAC5D+I,EAAKxF,KACHpF,EAAA,OACEE,IAAK2B,EACLgJ,MAAO,CACLC,UAAW,KACX,sBAAuB,KACvB,iBAAkBhM,KAAK+K,mBAAmBhI,IAE5CkJ,QAAUhI,GAAUjE,KAAKkI,eAAejE,EAAOlB,GAC/CmJ,QAAUjI,IACR,GAAIA,EAAM7C,MAAQ,QAAS,CACzBpB,KAAKiF,SAAWlC,EAChB/C,KAAKoI,Y,GAGT+D,SAAU,GAEVjL,EAAA,WACE6K,MAAO,CACLK,OAAQpM,KAAKiF,WAAalC,EAC1BsJ,cAAe,MAEjBC,KAAMC,EACNpM,KAAK,OAEPe,EAAA,OAAKG,MAAO,CAAE,YAAa,gBAAkB,GAAG0B,M,CAKtD,OAAO+I,C,CAGT,MAAA7K,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,qBAAAE,IAAA,2CACEoL,QAASxM,KAAKwM,QACdC,qBAAsBzM,KAAKyM,sBAE3BvL,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,SAASW,KAAK,UACvBxL,EAAA,kBAAAE,IAAA,2CACE6K,QAAS,IAAMjM,KAAKqE,uBAAuB,GAC3CsI,MAAK,KACLC,KAAMC,EACNC,QAAQ,UACRf,MAAM,WAER7K,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,YACT7K,EAAA,aAAAE,IAAA,2CACEuL,MAAK,KACLI,IAAK/M,KAAK2B,kBAAiB,cACf,qBAEZT,EAAA,QAAAE,IAAA,2CAAM2K,MAAM,uBACT/L,KAAKgG,WAAWhG,KAAKgD,eAAc,IAAGhD,KAAK8C,eAGhD5B,EAAA,eAAAE,IAAA,yDACc,sBACZ2K,MAAM,WACNiB,QAAShN,KAAK2B,kBAAkBsL,iBAChCC,qBAAoB,KACpBC,UAAU,gBAEVjM,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,WACT7K,EAAA,OAAAE,IAAA,yDACc,iBACZ2K,MAAM,WACNqB,SAAU,IAAMpN,KAAKsI,sBACrByE,IAAK/M,KAAK6B,kBAET7B,KAAK6L,eAER3K,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,WAAU,cAAa,mBAC/B/L,KAAKgG,WAAWqH,KAAI,CAACpK,EAAOiD,IAC3BhF,EAAA,OACEE,IAAK6B,EACL8J,IAAMA,IACJ,GAAI9J,IAAUjD,KAAKgG,WAAW,GAAI,CAChChG,KAAK8B,cAAciL,E,GAGvBhB,MAAO,CACLC,UAAW,KACX,sBAAuB,KACvBpB,SACE5K,KAAKiF,WAAajF,KAAK8C,cACvB9C,KAAKgF,YAAckB,EACrB,iBAAkBlG,KAAKsL,oBAAoBpF,IAE7C+F,QAAS,IAAMjM,KAAKwJ,YAAYtD,GAChCgG,QAAUjI,GACRA,EAAM7C,MAAQ,SAAWpB,KAAKwJ,YAAYtD,GAE5CiG,SAAU,GAEVjL,EAAA,WACE6K,MAAO,CACLK,OACEpM,KAAKiF,WAAajF,KAAK8C,cACvB9C,KAAKgF,YAAckB,EACrBoH,cAAe,MAEjBhB,KAAMiB,EACNpN,KAAK,OAEPe,EAAA,WACEA,EAAA,QAAM6K,MAAM,0BAA0B,GAAG9I,KAASjD,KAAKiF,oBAQrE/D,EAAA,kBAAAE,IAAA,2CACE6K,QAAS,IAAMjM,KAAKqE,sBAAsB,GAC1CsI,MAAK,KACLC,KAAML,EACNO,QAAQ,UACRf,MAAM,YAGV7K,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,QACT7K,EAAA,OAAAE,IAAA,2CAAK2K,MAAM,2BACV/L,KAAK0F,SAAS2H,KAAKf,GAClBpL,EAAA,OAAKE,IAAKkL,EAAMP,MAAM,0BACpB7K,EAAA,OAAK6K,MAAM,YAAYO,EAAKkB,MAAM,EAAG,OAGxCxN,KAAKkC,SAASmL,KAAKI,GAEhBvM,EAACwM,EAAQ,KACPxM,EAAA,OAAK6K,MAAM,6BAA6B0B,EAAKxG,YAC5CwG,EAAKxF,WAAWoF,KAAK7C,GACbA,EACLtJ,EAAA,OACEE,IAAKoJ,EACLmD,GAAI,YAAYnD,IAAK,yBAErBuB,MAAO/L,KAAKuK,cAAcC,GAC1ByB,QAAU2B,IACR,MAAM9D,EAAS8D,EAAEC,cACjB7N,KAAK4J,UAAUY,EAAKV,EAAO,EAE7BoC,QAAU0B,IACR,MAAM9D,EAAS8D,EAAEC,cACjB,GAAID,EAAExM,MAAQ,QAAS,CACrBpB,KAAK4J,UAAUY,EAAKV,E,GAGxBqC,SAAU3B,IAAQxK,KAAKmE,WAAa,GAAK,EACzC2J,QAAS,IAAM9N,KAAK4E,aACpBmJ,OAAQ,IAAM/N,KAAK2E,aAElB6F,GAGHtJ,EAAA,kBAOZA,EAAA,OAAAE,IAAA,2CACE2K,MAAO,CACLiC,OAAQ,KACR5B,QAASpM,KAAK6D,QAAU7D,KAAKyM,uBAG/BvL,EAAA,aAAAE,IAAA,2CAAW6K,QAAS,IAAMjM,KAAKwG,UAC5BxG,KAAKiO,gBAAkBjO,KAAKkO,Y,oJAhkBzCC,EAAA,CADCC,EAAuB,Y,0CCjQ1B,MAAMC,EAAgB,yOACtB,MAAAC,EAAeD,E,MCkBFE,EAAU,M,uCAIF,M,SAKqB,K,aAKtB,E,CAElB,MAAAtN,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACH2K,MAAO,CACL,YAAa/L,KAAKwO,UAEpBnN,MAAO,CACL,2BAA4B,GAAGrB,KAAKyO,UACpC,0BAA2B,GAAGzO,KAAK0O,UAGrCxN,EAAA,QAAAE,IAAA,6C,aC9CR,MAAMuN,EAAS,wHACf,MAAAC,EAAeD,E,MCkBFE,EAAG,M,yBACd,MAAA5N,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C"}

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

@@ -1,2 +0,0 @@
-export{a as ix_menu_settings}from"./p-484aa96b.js";import"./p-5806df2b.js";
-//# sourceMappingURL=p-a61ed462.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["workflowStepsCss","IxWorkflowStepsStyle0","WorkflowSteps","getSteps","Array","from","this","hostElement","querySelectorAll","updateSteps","steps","forEach","element","index","vertical","clickable","selected","selectedIndex","length","position","onStepSelectionChanged","event","eventTarget","detail","clickIndex","findIndex","step","clientEvent","stepSelected","emit","defaultPrevented","componentWillLoad","componentDidLoad","observer","createMutationObserver","mutations","mutation","type","observe","childList","disconnectedCallback","disconnect","componentDidRender","render","h","Host","key","class"],"sources":["src/components/workflow-steps/workflow-steps.scss?tag=ix-workflow-steps&encapsulation=shadow","src/components/workflow-steps/workflow-steps.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: block;\n  position: relative;\n  width: fit-content;\n  height: fit-content;\n  min-width: 2rem;\n\n  .steps {\n    display: flex;\n    height: 100%;\n\n    &.vertical {\n      flex-direction: column;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n@Component({\n  tag: 'ix-workflow-steps',\n  styleUrl: 'workflow-steps.scss',\n  shadow: true,\n})\nexport class WorkflowSteps {\n  @Element() hostElement!: HTMLIxWorkflowStepsElement;\n\n  /**\n   * Select orientation\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() clickable: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() selectedIndex: number = 0;\n\n  /**\n   * On step selected event\n   */\n  @Event() stepSelected: EventEmitter<number>;\n\n  private getSteps() {\n    return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));\n  }\n\n  updateSteps() {\n    let steps = this.getSteps();\n    steps.forEach((element, index) => {\n      element.vertical = this.vertical;\n      element.clickable = this.clickable;\n      element.selected = this.selectedIndex === index;\n\n      if (steps.length === 1) {\n        element.position = 'single';\n        return;\n      }\n\n      if (index === 0) {\n        element.position = 'first';\n      } else if (index === steps.length - 1) {\n        element.position = 'last';\n      } else {\n        element.position = 'undefined';\n      }\n    });\n  }\n\n  private observer: MutationObserver;\n\n  @Listen('selectedChanged')\n  onStepSelectionChanged(event: CustomEvent<HTMLIxWorkflowStepElement>) {\n    const eventTarget = event.detail;\n\n    const steps = this.getSteps();\n    const clickIndex = steps.findIndex((step) => step === eventTarget);\n    const clientEvent = this.stepSelected.emit(clickIndex);\n\n    if (clientEvent.defaultPrevented) {\n      return;\n    }\n\n    steps.forEach((step, index) => {\n      step.selected = index === clickIndex;\n    });\n  }\n\n  componentWillLoad() {\n    this.updateSteps();\n  }\n\n  componentDidLoad() {\n    this.observer = createMutationObserver((mutations) => {\n      for (let mutation of mutations) {\n        if (mutation.type === 'childList') {\n          this.updateSteps();\n        }\n      }\n    });\n\n    this.observer.observe(this.hostElement, { childList: true });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  componentDidRender() {\n    this.updateSteps();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={{ steps: true, vertical: this.vertical }}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAmB,s9BACzB,MAAAC,EAAeD,E,MCyBFE,EAAa,M,kFAMI,M,eAKC,M,mBAKG,C,CAOxB,QAAAC,GACN,OAAOC,MAAMC,KAAKC,KAAKC,YAAYC,iBAAiB,oB,CAGtD,WAAAC,GACE,IAAIC,EAAQJ,KAAKH,WACjBO,EAAMC,SAAQ,CAACC,EAASC,KACtBD,EAAQE,SAAWR,KAAKQ,SACxBF,EAAQG,UAAYT,KAAKS,UACzBH,EAAQI,SAAWV,KAAKW,gBAAkBJ,EAE1C,GAAIH,EAAMQ,SAAW,EAAG,CACtBN,EAAQO,SAAW,SACnB,M,CAGF,GAAIN,IAAU,EAAG,CACfD,EAAQO,SAAW,O,MACd,GAAIN,IAAUH,EAAMQ,OAAS,EAAG,CACrCN,EAAQO,SAAW,M,KACd,CACLP,EAAQO,SAAW,W,KAQzB,sBAAAC,CAAuBC,GACrB,MAAMC,EAAcD,EAAME,OAE1B,MAAMb,EAAQJ,KAAKH,WACnB,MAAMqB,EAAad,EAAMe,WAAWC,GAASA,IAASJ,IACtD,MAAMK,EAAcrB,KAAKsB,aAAaC,KAAKL,GAE3C,GAAIG,EAAYG,iBAAkB,CAChC,M,CAGFpB,EAAMC,SAAQ,CAACe,EAAMb,KACnBa,EAAKV,SAAWH,IAAUW,CAAU,G,CAIxC,iBAAAO,GACEzB,KAAKG,a,CAGP,gBAAAuB,GACE1B,KAAK2B,SAAWC,GAAwBC,IACtC,IAAK,IAAIC,KAAYD,EAAW,CAC9B,GAAIC,EAASC,OAAS,YAAa,CACjC/B,KAAKG,a,MAKXH,KAAK2B,SAASK,QAAQhC,KAAKC,YAAa,CAAEgC,UAAW,M,CAGvD,oBAAAC,GACE,GAAIlC,KAAK2B,SAAU,CACjB3B,KAAK2B,SAASQ,Y,EAIlB,kBAAAC,GACEpC,KAAKG,a,CAGP,MAAAkC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,CAAErC,MAAO,KAAMI,SAAUR,KAAKQ,WACxC8B,EAAA,QAAAE,IAAA,8C"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["inputGroupCss","IxInputGroupStyle0","InputGroup","inputElement","this","hostElement","querySelector","componentWillLoad","valid","validity","addEventListener","onValidInput","onInvalidInput","startSlotChanged","_a","form","observer","MutationObserver","slotChanged","endSlotChanged","observe","subtree","childList","attributes","characterData","componentDidRender","prepareInputElement","style","width","inputPaddingRight","paddingRight","inputPaddingLeft","paddingLeft","console","warn","disabled","slot","shadowRoot","setTimeout","startPadding","getChildrenWidth","isInputInvalid","classList","contains","formWasValidated","_b","noValidate","left","backgroundPosition","slotElement","endElements","getSlottedElements","length","forEach","element","getBoundingClientRect","render","h","Host","key","class","name"],"sources":["src/components/input-group/input-group.scss?tag=ix-input-group&encapsulation=shadow","src/components/input-group/input-group.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/shadow-dom/host-disabled';\n\n:host {\n  @include ix-component;\n\n  position: relative;\n  display: flex;\n  width: 100%;\n  flex-wrap: wrap;\n  align-items: stretch;\n\n  .group {\n    display: flex;\n    position: absolute;\n    align-items: center;\n    height: 100%;\n  }\n\n  .group-start {\n    left: 0px;\n    height: 2rem;\n    margin-left: 0.5rem;\n    color: var(--theme-color-soft-text);\n  }\n\n  .group-end {\n    right: 0px;\n    height: 2rem;\n    margin-right: 0.5rem;\n    color: var(--theme-color-soft-text);\n  }\n\n  ::slotted(*) {\n    display: flex;\n  }\n}\n\n@include host-disabled {\n  .group-start,\n  .group-end {\n    ::slotted(*) {\n      opacity: 0.4 !important;\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 { Component, Element, h, Host, State } from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n  tag: 'ix-input-group',\n  styleUrl: 'input-group.scss',\n  shadow: true,\n})\nexport class InputGroup {\n  @Element() hostElement!: HTMLIxInputGroupElement;\n\n  @State() disabled = false;\n\n  @State() inputPaddingLeft = 0;\n  @State() inputPaddingRight = 0;\n\n  private get inputElement() {\n    return this.hostElement.querySelector('input') as HTMLInputElement;\n  }\n\n  private observer: MutationObserver;\n\n  componentWillLoad() {\n    const { valid } = this.inputElement.validity;\n    this.inputElement.addEventListener('valid', () => {\n      this.onValidInput();\n    });\n    this.inputElement.addEventListener('invalid', () => {\n      this.onInvalidInput();\n    });\n    this.inputElement.addEventListener('input', () => {\n      this.startSlotChanged();\n    });\n\n    this.inputElement.form?.addEventListener('submit', () => {\n      this.startSlotChanged();\n    });\n\n    valid ? this.onValidInput() : this.onInvalidInput();\n\n    this.observer = new MutationObserver(() => {\n      this.slotChanged();\n      this.startSlotChanged();\n      this.endSlotChanged();\n    });\n\n    this.observer.observe(this.hostElement, {\n      subtree: true,\n      childList: true,\n      attributes: true,\n      characterData: true,\n    });\n  }\n\n  componentDidRender() {\n    this.prepareInputElement();\n  }\n\n  private onValidInput() {\n    this.startSlotChanged();\n  }\n\n  private onInvalidInput() {\n    this.startSlotChanged();\n  }\n\n  private prepareInputElement() {\n    if (this.inputElement) {\n      this.inputElement.style.width = '100%';\n\n      if (this.inputPaddingRight !== 0) {\n        this.inputElement.style.paddingRight = this.inputPaddingRight + 'px';\n      } else {\n        this.inputElement.style.paddingRight = '0.5rem';\n      }\n\n      if (this.inputPaddingLeft !== 0) {\n        this.inputElement.style.paddingLeft = this.inputPaddingLeft + 'px';\n      } else {\n        this.inputElement.style.paddingLeft = '0.5rem';\n      }\n    } else {\n      console.warn(\n        'You used the ix-input-group without an input tag, e.g. <input class=\"form-control\" />'\n      );\n    }\n  }\n\n  private slotChanged() {\n    this.disabled = this.inputElement?.disabled;\n  }\n\n  private startSlotChanged() {\n    const slot = this.hostElement.shadowRoot.querySelector(\n      'slot[name=\"input-start\"]'\n    );\n\n    setTimeout(() => {\n      const startPadding = this.getChildrenWidth(slot);\n\n      if (startPadding !== 0) {\n        this.inputPaddingLeft = 11 + startPadding;\n      } else {\n        this.inputPaddingLeft = 0;\n      }\n\n      if (!this.inputElement) {\n        return;\n      }\n\n      const isInputInvalid =\n        !this.inputElement.validity.valid ||\n        this.inputElement.classList.contains('is-invalid');\n\n      const formWasValidated =\n        this.inputElement.form?.classList.contains('was-validated') ||\n        this.inputElement.form?.noValidate === false;\n\n      if (formWasValidated && isInputInvalid) {\n        const left = this.inputPaddingLeft !== 0 ? this.inputPaddingLeft : 7;\n        this.inputElement.style.backgroundPosition = `left ${left}px center`;\n        this.inputPaddingLeft += 26;\n      }\n    });\n  }\n\n  private endSlotChanged() {\n    const slot = this.hostElement.shadowRoot.querySelector(\n      'slot[name=\"input-end\"]'\n    );\n\n    setTimeout(() => {\n      this.inputPaddingRight = 15 + this.getChildrenWidth(slot);\n    });\n  }\n\n  private getChildrenWidth(slotElement: Element) {\n    if (!slotElement) {\n      return 0;\n    }\n\n    const endElements = getSlottedElements<HTMLElement>(slotElement);\n    if (endElements.length === 0) {\n      return 0;\n    }\n\n    let width = 0;\n\n    endElements.forEach((element) => {\n      width += element.getBoundingClientRect().width;\n    });\n\n    return width;\n  }\n\n  render() {\n    return (\n      <Host class={{ disabled: this.disabled }}>\n        <div class=\"group group-start\">\n          <slot name=\"input-start\"></slot>\n        </div>\n        <slot></slot>\n        <div class=\"group group-end\">\n          <slot name=\"input-end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

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

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

@@ -1 +0,0 @@
-{"version":3,"names":["workflowStepCss","IxWorkflowStepStyle0","WorkflowStep","selectedHandler","selectedStyle","this","selected","status","iconName","iconColor","disabled","watchPropHandler","componentWillLoad","customIconSlot","hostElement","querySelector","onStepClick","clickable","selectedChanged","emit","render","icons","h","Fragment","color","name","class","size","Host","key","vertical","onClick","tabIndex","step","line","position"],"sources":["src/components/workflow-step/workflow-step.scss?tag=ix-workflow-step&encapsulation=shadow","src/components/workflow-step/workflow-step.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host(:not(.host-vertical)) {\n  width: 12rem;\n  height: 4rem;\n  min-width: 2rem;\n  min-height: 4rem;\n  max-width: 12rem;\n}\n\n:host(.host-vertical) {\n  width: 100%;\n  height: 4rem;\n  min-width: 4rem;\n  min-height: 2rem;\n  max-height: 12rem;\n}\n\n:host {\n  @include ix-component;\n  display: inline-block;\n  position: relative;\n\n  .step {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background-color: var(--theme-workflow-step--background);\n    border-radius: var(--theme-workflow--border-radius);\n    padding: 1.125rem 0 $small-space 0;\n\n    .wrapper {\n      display: flex;\n      width: 100%;\n      align-items: center;\n      justify-content: center;\n      position: relative;\n\n      .line {\n        width: 100%;\n        height: 0.125rem;\n        background-color: var(--theme-workflow-step-icon-default--color);\n\n        &.first,\n        &.last {\n          width: 50%;\n          margin: 0 0 0 auto;\n        }\n\n        &.last {\n          margin: 0 auto 0 0;\n        }\n\n        &.single {\n          width: 0;\n        }\n\n        &.selected {\n          background-color: var(\n              --theme-workflow-step-icon-default--color--selected\n          );\n        }\n\n        &.done {\n          background-color: var(--theme-workflow-step-icon-done--color);\n\n          &.selected {\n            background-color: var(\n                --theme-workflow-step-icon-done--color--selected\n            );\n          }\n        }\n\n        &.warning {\n          background-color: var(--theme-color-warning);\n        }\n\n        &.success {\n          background-color: var(--theme-color-success);\n        }\n\n        &.error {\n          background-color: var(--theme-color-alarm);\n        }\n      }\n\n      .iconWrapper {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        position: absolute;\n\n        .absolute {\n          position: absolute;\n        }\n      }\n    }\n\n    .text {\n      margin-top: $default-space;\n      width: 100%;\n      padding: 0 $small-space;\n\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      text-align: center;\n    }\n\n    &.vertical {\n      flex-direction: row;\n      padding: 0;\n      height: 100%;\n\n      .wrapper {\n        width: auto;\n        padding-left: 1.125rem;\n        height: 100%;\n\n        .line {\n          width: 0.125rem;\n          height: 100%;\n\n          &.first,\n          &.last {\n            height: 50%;\n            margin: auto 0 0 0;\n          }\n\n          &.last {\n            margin: 0 0 auto 0;\n          }\n\n          &.single {\n            width: 0;\n          }\n        }\n      }\n\n      .text {\n        margin: 0 $default-space;\n        padding: 0;\n        width: auto;\n      }\n    }\n\n    &.clickable {\n      &:hover {\n        background-color: var(--theme-workflow-step--background--hover);\n      }\n\n      &:active {\n        background-color: var(--theme-workflow-step--background--active);\n      }\n    }\n\n    &:focus-visible {\n      outline: 1px solid var(--focus--border-color);\n      border-radius: 0;\n    }\n\n    &.selected {\n      background-color: var(--theme-workflow-step--background--selected);\n    }\n\n    &.disabled {\n      background-color: var(--theme-workflow-step--background--disabled);\n\n      .line {\n        background-color: var(\n          --theme-workflow-step-icon-default--color--disabled\n        ) !important;\n      }\n\n      .text {\n        color: var(--theme-workflow-step--color--disabled);\n      }\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-workflow-step',\n  styleUrl: 'workflow-step.scss',\n  shadow: true,\n})\nexport class WorkflowStep {\n  @Element() hostElement: HTMLIxWorkflowStepElement;\n\n  /**\n   * Select orientation\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * Set disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Set status\n   */\n  @Prop() status: 'open' | 'success' | 'done' | 'warning' | 'error' = 'open';\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() clickable: boolean = false;\n\n  /**\n   * Set selected\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * Activate navigation click\n   *\n   * @internal\n   */\n  @Prop() position: 'first' | 'last' | 'single' | 'undefined' = 'undefined';\n\n  @State() iconName: 'circle' | 'circle-dot' | 'success' | 'warning' | 'error' =\n    'circle';\n\n  @State() iconColor: string = 'workflow-step-icon-default--color';\n\n  /**\n   * @internal\n   */\n  @Event() selectedChanged: EventEmitter<HTMLIxWorkflowStepElement>;\n\n  private customIconSlot: boolean;\n\n  @Watch('selected')\n  selectedHandler() {\n    const selectedStyle = this.selected ? '--selected' : '';\n\n    if (this.status === 'open') {\n      this.iconName = this.selected ? 'circle-dot' : 'circle';\n      this.iconColor = `workflow-step-icon-default--color${selectedStyle}`;\n    }\n\n    if (this.status === 'done' && !this.disabled) {\n      this.iconColor = `workflow-step-icon-done--color${selectedStyle}`;\n    }\n  }\n\n  @Watch('disabled')\n  @Watch('status')\n  watchPropHandler() {\n    switch (this.status) {\n      case 'open':\n        this.iconName = 'circle';\n        this.iconColor = 'workflow-step-icon-default--color';\n        break;\n      case 'success':\n        this.iconName = 'success';\n        this.iconColor = 'color-success';\n        break;\n      case 'done':\n        this.iconName = 'success';\n        this.iconColor = 'workflow-step-icon-done--color';\n        break;\n      case 'warning':\n        this.iconName = 'warning';\n        this.iconColor = 'color-warning';\n        break;\n      case 'error':\n        this.iconName = 'error';\n        this.iconColor = 'color-alarm';\n        break;\n\n      default:\n        this.iconName = 'circle';\n        break;\n    }\n\n    if (this.disabled) {\n      this.iconColor = 'workflow-step-icon-success--color--disabled';\n    }\n  }\n\n  componentWillLoad() {\n    this.watchPropHandler();\n    this.selectedHandler();\n\n    this.customIconSlot = !!this.hostElement.querySelector(\n      '[slot=\"custom-icon\"]'\n    );\n  }\n\n  onStepClick() {\n    if (!this.disabled && this.clickable) {\n      this.selectedChanged.emit(this.hostElement);\n    }\n  }\n\n  render() {\n    const icons = !this.customIconSlot ? (\n      <Fragment>\n        <ix-icon\n          color=\"color-1\"\n          name={\n            this.iconName === 'warning' ? 'triangle-filled' : 'circle-filled'\n          }\n          class=\"absolute\"\n          size=\"24\"\n        ></ix-icon>\n        <ix-icon\n          color={this.iconColor}\n          name={this.iconName}\n          class=\"absolute\"\n          size=\"24\"\n        ></ix-icon>\n      </Fragment>\n    ) : null;\n\n    return (\n      <Host\n        class={{ 'host-vertical': this.vertical }}\n        onClick={() => this.onStepClick()}\n      >\n        <div\n          tabIndex={0}\n          class={{\n            step: true,\n            selected: this.selected,\n            vertical: this.vertical,\n            disabled: this.disabled,\n            clickable: this.clickable && !this.disabled,\n          }}\n        >\n          <div class=\"wrapper\">\n            <div\n              class={{\n                line: true,\n                selected: this.selected,\n                [this.status]: true,\n                [this.position]: true,\n              }}\n            ></div>\n            <div class=\"iconWrapper\">\n              {icons}\n              <slot name=\"custom-icon\"></slot>\n            </div>\n          </div>\n          <div class=\"text\">\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uEAAA,MAAMA,EAAkB,8/GACxB,MAAAC,EAAeD,E,MC0BFE,EAAY,M,wFAMK,M,cAKA,M,YAKwC,O,eAKvC,M,cAKD,M,cAOkC,Y,cAG5D,S,eAE2B,mC,CAU7B,eAAAC,GACE,MAAMC,EAAgBC,KAAKC,SAAW,aAAe,GAErD,GAAID,KAAKE,SAAW,OAAQ,CAC1BF,KAAKG,SAAWH,KAAKC,SAAW,aAAe,SAC/CD,KAAKI,UAAY,oCAAoCL,G,CAGvD,GAAIC,KAAKE,SAAW,SAAWF,KAAKK,SAAU,CAC5CL,KAAKI,UAAY,iCAAiCL,G,EAMtD,gBAAAO,GACE,OAAQN,KAAKE,QACX,IAAK,OACHF,KAAKG,SAAW,SAChBH,KAAKI,UAAY,oCACjB,MACF,IAAK,UACHJ,KAAKG,SAAW,UAChBH,KAAKI,UAAY,gBACjB,MACF,IAAK,OACHJ,KAAKG,SAAW,UAChBH,KAAKI,UAAY,iCACjB,MACF,IAAK,UACHJ,KAAKG,SAAW,UAChBH,KAAKI,UAAY,gBACjB,MACF,IAAK,QACHJ,KAAKG,SAAW,QAChBH,KAAKI,UAAY,cACjB,MAEF,QACEJ,KAAKG,SAAW,SAChB,MAGJ,GAAIH,KAAKK,SAAU,CACjBL,KAAKI,UAAY,6C,EAIrB,iBAAAG,GACEP,KAAKM,mBACLN,KAAKF,kBAELE,KAAKQ,iBAAmBR,KAAKS,YAAYC,cACvC,uB,CAIJ,WAAAC,GACE,IAAKX,KAAKK,UAAYL,KAAKY,UAAW,CACpCZ,KAAKa,gBAAgBC,KAAKd,KAAKS,Y,EAInC,MAAAM,GACE,MAAMC,GAAShB,KAAKQ,eAClBS,EAACC,EAAQ,KACPD,EAAA,WACEE,MAAM,UACNC,KACEpB,KAAKG,WAAa,UAAY,kBAAoB,gBAEpDkB,MAAM,WACNC,KAAK,OAEPL,EAAA,WACEE,MAAOnB,KAAKI,UACZgB,KAAMpB,KAAKG,SACXkB,MAAM,WACNC,KAAK,QAGP,KAEJ,OACEL,EAACM,EAAI,CAAAC,IAAA,2CACHH,MAAO,CAAE,gBAAiBrB,KAAKyB,UAC/BC,QAAS,IAAM1B,KAAKW,eAEpBM,EAAA,OAAAO,IAAA,2CACEG,SAAU,EACVN,MAAO,CACLO,KAAM,KACN3B,SAAUD,KAAKC,SACfwB,SAAUzB,KAAKyB,SACfpB,SAAUL,KAAKK,SACfO,UAAWZ,KAAKY,YAAcZ,KAAKK,WAGrCY,EAAA,OAAAO,IAAA,2CAAKH,MAAM,WACTJ,EAAA,OAAAO,IAAA,2CACEH,MAAO,CACLQ,KAAM,KACN5B,SAAUD,KAAKC,SACf,CAACD,KAAKE,QAAS,KACf,CAACF,KAAK8B,UAAW,QAGrBb,EAAA,OAAAO,IAAA,2CAAKH,MAAM,eACRL,EACDC,EAAA,QAAAO,IAAA,2CAAMJ,KAAK,kBAGfH,EAAA,OAAAO,IAAA,2CAAKH,MAAM,QACTJ,EAAA,QAAAO,IAAA,+C"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["iconButtonCss","IxIconButtonStyle0","IconButton","componentDidLoad","this","type","submitButton","document","createElement","style","display","tabIndex","hostElement","appendChild","submitButtonElement","dispatchFormEvents","click","getIconSizeClass","size","render","baseButtonProps","ariaAttributes","a11yLabel","getFallbackLabelFromIconName","icon","variant","outline","ghost","iconOnly","iconOval","oval","selected","disabled","loading","iconColor","_a","color","iconSize","onClick","extraClasses","h","Host","key","class","Object","assign","BaseIconButton","spinnerCss","IxSpinnerStyle0","Spinner","primary","hideTrack"],"sources":["src/components/icon-button/icon-button.scss?tag=ix-icon-button&encapsulation=shadow","src/components/icon-button/icon-button.tsx","src/components/spinner/spinner.scss?tag=ix-spinner&encapsulation=shadow","src/components/spinner/spinner.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 './icon-button-mixin.scss';\n\n@include base-icon-button;\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 } from '@stencil/core';\nimport { BaseButtonProps } from '../button/base-button';\nimport { ButtonVariant } from '../button/button';\nimport { BaseIconButton } from '../icon-button/base-icon-button';\nimport { getFallbackLabelFromIconName } from '../utils/a11y';\n\nexport type IconButtonVariant = ButtonVariant;\n\n@Component({\n  tag: 'ix-icon-button',\n  styleUrl: 'icon-button.scss',\n  shadow: true,\n})\nexport class IconButton {\n  @Element() hostElement: HTMLIxIconButtonElement;\n\n  /**\n   * Accessibility label for the icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 2.1.0\n   */\n  @Prop({ attribute: 'a11y-label' }) a11yLabel: string;\n\n  /**\n   * Variant of button\n   * @since 2.3.0 - variant danger\n   */\n  @Prop() variant: IconButtonVariant = 'secondary';\n\n  /**\n   * Button outline\n   */\n  @Prop() outline: boolean;\n\n  /**\n   * Button invisible\n   */\n  @Prop() ghost: boolean;\n\n  /**\n   * Button in oval shape\n   */\n  @Prop() oval: boolean;\n\n  /**\n   * Icon name\n   */\n  @Prop() icon: string;\n\n  /**\n   * Size of icon in button\n   *\n   * @deprecated Only size 32 will be removed in 3.0.0\n   */\n  @Prop() size: '32' | '24' | '16' | '12' = '24';\n\n  /**\n   * Color of icon in  button\n   *\n   * @deprecated since 2.1.0 use `icon-color`\n   */\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  @Prop() color: string;\n\n  /**\n   * Color of icon in  button\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Disabled\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Type of the button\n   */\n  @Prop() type: 'button' | 'submit' = 'button';\n\n  /**\n   * Loading button\n   *\n   * @since 2.0.0\n   */\n  @Prop() loading = false;\n\n  /**\n   * Temp. workaround until stencil issue is fixed (https://github.com/ionic-team/stencil/issues/2284)\n   */\n  submitButtonElement: HTMLButtonElement;\n\n  componentDidLoad() {\n    if (this.type === 'submit') {\n      const submitButton = document.createElement('button');\n      submitButton.style.display = 'none';\n      submitButton.type = 'submit';\n      submitButton.tabIndex = -1;\n      this.hostElement.appendChild(submitButton);\n\n      this.submitButtonElement = submitButton;\n    }\n  }\n\n  dispatchFormEvents() {\n    if (this.type === 'submit' && this.submitButtonElement) {\n      this.submitButtonElement.click();\n    }\n  }\n\n  private getIconSizeClass() {\n    return {\n      'btn-icon-12': this.size === '12',\n      'btn-icon-16': this.size === '16',\n      'btn-icon-32': this.size === '32' || this.size === '24' || !this.size,\n    };\n  }\n\n  render() {\n    const baseButtonProps: BaseButtonProps = {\n      ariaAttributes: {\n        'aria-label': this.a11yLabel\n          ? this.a11yLabel\n          : getFallbackLabelFromIconName(this.icon),\n      },\n      variant: this.variant,\n      outline: this.outline,\n      ghost: this.ghost,\n      iconOnly: true,\n      iconOval: this.oval,\n      selected: false,\n      disabled: this.disabled || this.loading,\n      icon: this.icon,\n      iconColor: this.iconColor ?? this.color,\n      iconSize: this.size,\n      loading: this.loading,\n      onClick: () => this.dispatchFormEvents(),\n      type: this.type,\n      extraClasses: this.getIconSizeClass(),\n    };\n\n    return (\n      <Host\n        class={{\n          ...this.getIconSizeClass(),\n          disabled: this.disabled || this.loading,\n        }}\n      >\n        <BaseIconButton {...baseButtonProps}></BaseIconButton>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n\n@mixin ix-spinner($size-name: 'medium', $size: 2rem, $track-size: 4px) {\n  :host {\n    @include ix-component;\n    display: block;\n    position: relative;\n  }\n\n  .#{$size-name} {\n    width: $size;\n    height: $size;\n    min-width: $size;\n    min-height: $size;\n    max-width: $size;\n    max-height: $size;\n    border-radius: 100%;\n    position: relative;\n    animation: rotate 2s linear infinite;\n\n    @keyframes rotate {\n      100% {\n        transform: rotate(360deg);\n      }\n    }\n\n    @keyframes clipMask {\n      0% {\n        clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n      }\n      12.5% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n      }\n      25% {\n        clip-path: polygon(\n          50% 50%,\n          0 0,\n          100% 0,\n          100% 100%,\n          100% 100%,\n          100% 100%\n        );\n      }\n      37.5% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n      }\n      50% {\n        clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n      }\n      62.5% {\n        clip-path: polygon(50% 50%, 100% 0, 100% 0, 100% 100%, 0 100%, 0 0);\n      }\n      75% {\n        clip-path: polygon(\n          50% 50%,\n          100% 100%,\n          100% 100%,\n          100% 100%,\n          0 100%,\n          0 0\n        );\n      }\n      87.5% {\n        clip-path: polygon(50% 50%, 0 100%, 0 100%, 0 100%, 0 100%, 0 0);\n      }\n      100% {\n        clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n      }\n    }\n  }\n\n  .#{$size-name}::after {\n    content: '';\n    box-sizing: border-box;\n    position: absolute;\n    inset: 8.33%;\n    border-radius: 100%;\n    border: $track-size solid\n      var(--ix-button-color, var(--theme-color-soft-text));\n    animation: clipMask 3s linear infinite;\n  }\n\n  .#{$size-name}:not(.hide-track)::before {\n    content: '';\n    box-sizing: border-box;\n    position: absolute;\n    inset: 8.33%;\n    border-radius: 100%;\n    border: $track-size solid var(--theme-color-ghost--hover);\n  }\n\n  .primary::after {\n    border-color: var(--theme-color-dynamic);\n  }\n\n  .primary::before {\n    border-color: var(--theme-color-ghost--hover);\n  }\n}\n\n@include ix-spinner($size-name: 'xx-small', $size: 0.75rem, $track-size: 1px);\n@include ix-spinner($size-name: 'x-small', $size: 1.25rem, $track-size: 2px);\n@include ix-spinner($size-name: 'small', $size: 1.5rem, $track-size: 2px);\n@include ix-spinner($size-name: 'medium', $size: 2rem, $track-size: 2px);\n@include ix-spinner($size-name: 'large', $size: 6rem, $track-size: 4px);\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 } from '@stencil/core';\n\n@Component({\n  tag: 'ix-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Element() hostElement!: HTMLIxSpinnerElement;\n\n  /**\n   * Variant of spinner\n   */\n  @Prop() variant: 'primary' | 'secondary' = 'secondary';\n\n  /**\n   * Size of spinner\n   */\n  @Prop() size: 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' =\n    'medium';\n\n  /**\n   * @internal\n   */\n  @Prop() hideTrack = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            primary: this.variant === 'primary',\n            [this.size]: true,\n            'hide-track': this.hideTrack,\n          }}\n        ></div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yJAAA,MAAMA,EAAgB,07tBACtB,MAAAC,EAAeD,E,MCqBFE,EAAU,M,+DAegB,Y,8FA2BK,K,4DAkBvB,M,UAKiB,S,aAOlB,K,CAOlB,gBAAAC,GACE,GAAIC,KAAKC,OAAS,SAAU,CAC1B,MAAMC,EAAeC,SAASC,cAAc,UAC5CF,EAAaG,MAAMC,QAAU,OAC7BJ,EAAaD,KAAO,SACpBC,EAAaK,UAAY,EACzBP,KAAKQ,YAAYC,YAAYP,GAE7BF,KAAKU,oBAAsBR,C,EAI/B,kBAAAS,GACE,GAAIX,KAAKC,OAAS,UAAYD,KAAKU,oBAAqB,CACtDV,KAAKU,oBAAoBE,O,EAIrB,gBAAAC,GACN,MAAO,CACL,cAAeb,KAAKc,OAAS,KAC7B,cAAed,KAAKc,OAAS,KAC7B,cAAed,KAAKc,OAAS,MAAQd,KAAKc,OAAS,OAASd,KAAKc,K,CAIrE,MAAAC,G,MACE,MAAMC,EAAmC,CACvCC,eAAgB,CACd,aAAcjB,KAAKkB,UACflB,KAAKkB,UACLC,EAA6BnB,KAAKoB,OAExCC,QAASrB,KAAKqB,QACdC,QAAStB,KAAKsB,QACdC,MAAOvB,KAAKuB,MACZC,SAAU,KACVC,SAAUzB,KAAK0B,KACfC,SAAU,MACVC,SAAU5B,KAAK4B,UAAY5B,KAAK6B,QAChCT,KAAMpB,KAAKoB,KACXU,WAAWC,EAAA/B,KAAK8B,aAAS,MAAAC,SAAA,EAAAA,EAAI/B,KAAKgC,MAClCC,SAAUjC,KAAKc,KACfe,QAAS7B,KAAK6B,QACdK,QAAS,IAAMlC,KAAKW,qBACpBV,KAAMD,KAAKC,KACXkC,aAAcnC,KAAKa,oBAGrB,OACEuB,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GACAzC,KAAKa,oBAAkB,CAC1Be,SAAU5B,KAAK4B,UAAY5B,KAAK6B,WAGlCO,EAACM,EAAcF,OAAAC,OAAA,CAAAH,IAAA,4CAAKtB,I,8CC7J5B,MAAM2B,EAAa,+qbACnB,MAAAC,EAAeD,E,MCeFE,EAAO,M,sCAMyB,Y,UAMzC,S,eAKkB,K,CAEpB,MAAA9B,GACE,OACEqB,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACLO,QAAS9C,KAAKqB,UAAY,UAC1B,CAACrB,KAAKc,MAAO,KACb,aAAcd,KAAK+C,a"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["groupContextMenuCss","IxGroupContextMenuStyle0","GroupContextMenu","getTrigger","this","hostElement","configureDropdown","dropdownElement","triggerElement","positioningStrategy","trigger","onSlotChange","slot","shadowRoot","querySelector","elements","getSlottedElements","showContextMenu","length","find","elm","tagName","render","h","Host","key","class","hide","size","ghost","icon","onSlotchange","groupItemCss","IxGroupItemStyle0","GroupItem","clickListen","selectedChanged","emit","selected","suppressSelection","tabindex","focusable","name","text","title","secondaryText"],"sources":["src/components/group/group-context-menu.scss?tag=ix-group-context-menu&encapsulation=shadow","src/components/group/group-context-menu.tsx","src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=shadow","src/components/group-item/group-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n:host {\n  display: block;\n  position: relative;\n\n  height: 2rem;\n  width: 2rem;\n\n  margin-block-start: 0.3125rem;\n  margin-inline-end: 0.3125rem;\n  margin-inline-start: auto;\n\n  .hide {\n    visibility: collapse;\n  }\n\n  ::slotted(ix-dropdown) {\n    cursor: default;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, State } from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n  tag: 'ix-group-context-menu',\n  styleUrl: './group-context-menu.scss',\n  shadow: true,\n})\nexport class GroupContextMenu {\n  @Element() hostElement!: HTMLIxGroupContextMenuElement;\n\n  @State() showContextMenu = false;\n\n  private getTrigger() {\n    return this.hostElement;\n  }\n\n  private configureDropdown(\n    dropdownElement: HTMLIxDropdownElement,\n    triggerElement: HTMLElement\n  ) {\n    dropdownElement.positioningStrategy = 'fixed';\n    dropdownElement.trigger = triggerElement;\n  }\n\n  private onSlotChange() {\n    const slot = this.hostElement.shadowRoot.querySelector('slot');\n    if (!slot) {\n      return;\n    }\n    const elements = getSlottedElements(slot);\n    this.showContextMenu = elements.length !== 0;\n\n    const dropdownElement = elements.find(\n      (elm: Element) => elm.tagName === 'IX-DROPDOWN'\n    );\n\n    const triggerElement = this.getTrigger();\n\n    if (!triggerElement) {\n      return;\n    }\n\n    if (!dropdownElement) {\n      return;\n    }\n\n    this.configureDropdown(dropdownElement, triggerElement);\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-icon-button\n          class={{ hide: !this.showContextMenu }}\n          size=\"24\"\n          ghost={true}\n          icon={'context-menu'}\n        ></ix-icon-button>\n        <slot onSlotchange={() => this.onSlotChange()}></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/shadow-dom/hover';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n$focusBorderWidth: 1px;\n\n:host {\n  @include ix-component;\n  display: flex;\n  min-height: 2.25rem;\n  height: 2.25rem;\n\n  > button {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    align-items: center;\n    justify-content: flex-start;\n    position: relative;\n    outline: none;\n    background-color: var(--theme-group-item--background);\n    border: 1px solid transparent;\n    color: var(--theme-color-std-text);\n    cursor: pointer;\n\n    padding-left: 2.5rem;\n\n    &:focus-visible {\n      border: $focusBorderWidth solid var(--theme-color-focus-bdr);\n    }\n  }\n\n  ix-icon {\n    margin-right: $tiny-space;\n    margin-top: -0.125rem;\n  }\n\n  .group-entry-selection-indicator {\n    position: absolute;\n    left: -#{$focusBorderWidth};\n    height: calc(100% + #{$focusBorderWidth * 2});\n    width: $tiny-space;\n  }\n\n  .group-entry-text {\n    @include text-default;\n    @include ellipsis();\n  }\n\n  .group-entry-text-secondary {\n    &,\n    span {\n      @include text-default;\n      @include ellipsis;\n    }\n\n    display: flex;\n    justify-content: flex-end;\n    flex-grow: 1;\n    white-space: nowrap;\n    color: var(--theme-color-soft-text);\n  }\n}\n\n:host(.selected) {\n  border-top-width: 0.062rem !important;\n  background-color: var(--theme-color-ghost--selected);\n\n  .group-entry-selection-indicator {\n    background-color: var(--theme-group-item-indicator--background--selected);\n  }\n}\n\n:host(:hover) {\n  background-color: var(--theme-color-ghost--selected-hover);\n  border-color: var(--theme-group-item--border-color--hover);\n}\n\n:host(.selected:hover) {\n  background-color: var(--theme-color-ghost--selected-hover);\n}\n\n:host(:active) {\n  background-color: var(--theme-color-ghost--selected-active);\n  border-color: var(--theme-group-item--border-color--active);\n}\n\n:host(.selected:active) {\n  background-color: var(--theme-color-ghost--selected-active);\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  Listen,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-group-item',\n  styleUrl: 'group-item.scss',\n  shadow: true,\n})\nexport class GroupItem {\n  @Element() hostElement!: HTMLIxGroupItemElement;\n\n  /**\n   * Group item icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Group item text\n   */\n  @Prop() text?: string;\n\n  /**\n   * Group item secondary text\n   */\n  @Prop() secondaryText?: string;\n\n  /**\n   * Supress the selection of the group\n   */\n  @Prop() suppressSelection = false;\n\n  /**\n   * Show selected state\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * The elements tabindex attribute will get set accordingly.\n   * If true tabindex will be 0, -1 otherwise.\n   */\n  @Prop() focusable = true;\n\n  /**\n   * Selection changed\n   */\n  @Event() selectedChanged!: EventEmitter<HTMLIxGroupItemElement>;\n\n  /**\n   * Index\n   */\n  @Prop() index?: number;\n\n  @Listen('click', { passive: true })\n  clickListen() {\n    this.selectedChanged.emit(this.hostElement);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected && !this.suppressSelection,\n        }}\n      >\n        <button tabindex={this.focusable ? 0 : -1}>\n          <div class=\"group-entry-selection-indicator\"></div>\n          {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n          {this.text ? (\n            <span class=\"group-entry-text\">\n              <span title={this.text}>{this.text}</span>\n            </span>\n          ) : null}\n          {this.secondaryText ? (\n            <span class=\"group-entry-text-secondary\">\n              <span title={this.secondaryText}>{this.secondaryText}</span>\n            </span>\n          ) : null}\n          <slot></slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAsB,8NAC5B,MAAAC,EAAeD,E,MCgBFE,EAAgB,M,8CAGA,K,CAEnB,UAAAC,GACN,OAAOC,KAAKC,W,CAGN,iBAAAC,CACNC,EACAC,GAEAD,EAAgBE,oBAAsB,QACtCF,EAAgBG,QAAUF,C,CAGpB,YAAAG,GACN,MAAMC,EAAOR,KAAKC,YAAYQ,WAAWC,cAAc,QACvD,IAAKF,EAAM,CACT,M,CAEF,MAAMG,EAAWC,EAAmBJ,GACpCR,KAAKa,gBAAkBF,EAASG,SAAW,EAE3C,MAAMX,EAAkBQ,EAASI,MAC9BC,GAAiBA,EAAIC,UAAY,gBAGpC,MAAMb,EAAiBJ,KAAKD,aAE5B,IAAKK,EAAgB,CACnB,M,CAGF,IAAKD,EAAiB,CACpB,M,CAGFH,KAAKE,kBAAkBC,EAAiBC,E,CAG1C,MAAAc,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,kBAAAE,IAAA,2CACEC,MAAO,CAAEC,MAAOvB,KAAKa,iBACrBW,KAAK,KACLC,MAAO,KACPC,KAAM,iBAERP,EAAA,QAAAE,IAAA,2CAAMM,aAAc,IAAM3B,KAAKO,iB,8CCpEvC,MAAMqB,EAAe,kqFACrB,MAAAC,EAAeD,E,MCwBFE,EAAS,M,sKAqBQ,M,cAKA,M,eAMR,K,qBAapB,WAAAC,GACE/B,KAAKgC,gBAAgBC,KAAKjC,KAAKC,Y,CAGjC,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLY,SAAUlC,KAAKkC,WAAalC,KAAKmC,oBAGnChB,EAAA,UAAAE,IAAA,2CAAQe,SAAUpC,KAAKqC,UAAY,GAAK,GACtClB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oCACVtB,KAAK0B,KAAOP,EAAA,WAASK,KAAK,KAAKc,KAAMtC,KAAK0B,OAAmB,KAC7D1B,KAAKuC,KACJpB,EAAA,QAAMG,MAAM,oBACVH,EAAA,QAAMqB,MAAOxC,KAAKuC,MAAOvC,KAAKuC,OAE9B,KACHvC,KAAKyC,cACJtB,EAAA,QAAMG,MAAM,8BACVH,EAAA,QAAMqB,MAAOxC,KAAKyC,eAAgBzC,KAAKyC,gBAEvC,KACJtB,EAAA,QAAAE,IAAA,8C"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as o,h as t,H as r,g as a}from"./p-5806df2b.js";import{e as i,f as n}from"./p-fe158b99.js";import{H as d}from"./p-f97a15c4.js";import{m as l}from"./p-ce563a48.js";import{m as s,a as b,b as c,I as p,c as h,o as m,S as u,g as v}from"./p-451551d1.js";import"./p-5fe87e71.js";import"./p-360b158e.js";import"./p-71206084.js";const f="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);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{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);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea~.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}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}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);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{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);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea~.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}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:inline-block;position:relative;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 .input-wrapper{display:flex;position:relative;align-items:center;width:100%;height:100%}:host input{width:100%;height:100%}:host .start-container,:host .end-container{display:flex;position:absolute;align-items:center;justify-content:center;z-index:1}:host .start-container{left:0}:host .end-container{right:0}:host .start-container ::slotted(*){margin-left:0.5rem}:host .start-container ::slotted(ix-icon.size-24),:host .start-container ::slotted(ix-icon-button.btn-icon-16){margin-left:0.25rem}:host .start-container ::slotted(ix-icon-button.btn-icon-32){margin-left:0}:host .end-container ::slotted(*){margin-right:0.5rem}:host .end-container ::slotted(ix-icon.size-24),:host .end-container ::slotted(ix-icon-button.btn-icon-16){margin-right:0.25rem}:host .end-container ::slotted(ix-icon-button.btn-icon-32){margin-right:0}:host .bottom-text{margin-top:0.25rem;margin-bottom:0.25rem}:host(.disabled){pointer-events:none}:host(.disabled) input,:host(.disabled) textarea{pointer-events:none}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input{background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--invalid--active) !important}:host .password-eye{margin-left:0.125rem;color:red}:host .password-eye.eye-hidden{display:none}";const x=f;var g=undefined&&undefined.__decorate||function(e,o,t,r){var a=arguments.length,i=a<3?o:r===null?r=Object.getOwnPropertyDescriptor(o,t):r,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(e,o,t,r);else for(var d=e.length-1;d>=0;d--)if(n=e[d])i=(a<3?n(i):a>3?n(o,t,i):n(o,t))||i;return a>3&&i&&Object.defineProperty(o,t,i),i};let y=0;const k=class{constructor(t){e(this,t);this.valueChange=o(this,"valueChange",7);this.validityStateChange=o(this,"validityStateChange",7);this.ixBlur=o(this,"ixBlur",7);if(t.$hostElement$["s-ei"]){this.formInternals=t.$hostElement$["s-ei"]}else{this.formInternals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.formInternals}this.inputRef=l();this.slotEndRef=l();this.slotStartRef=l();this.inputId=`input-${y++}`;this.type="text";this.name=undefined;this.placeholder=undefined;this.value="";this.required=false;this.disabled=false;this.readonly=false;this.helperText=undefined;this.infoText=undefined;this.showTextAsTooltip=undefined;this.validText=undefined;this.warningText=undefined;this.label=undefined;this.invalidText=undefined;this.pattern=undefined;this.maxLength=undefined;this.minLength=undefined;this.allowedCharactersPattern=undefined;this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false;this.isInvalidByRequired=false;this.inputType="text"}updateClassMappings(e){s(this,e)}updateInputType(){this.inputType=this.type}componentWillLoad(){this.updateFormInternalValue(this.value);this.inputType=this.type}componentDidRender(){this.updatePaddings()}updatePaddings(){b(this.slotStartRef.current,this.slotEndRef.current,this.inputRef.current)}updateFormInternalValue(e){this.formInternals.setFormValue(e);this.value=e}async getAssociatedFormElement(){return this.formInternals.form}hasValidValue(){return Promise.resolve(!!this.value)}getNativeInputElement(){return this.inputRef.waitForCurrent()}async focusInput(){return(await this.getNativeInputElement()).focus()}render(){var e;const o=v(this);return t(r,{key:"f625dc7d2ed058f53940ccda73db408a3d7017a5",class:{disabled:this.disabled,readonly:this.readonly}},t("ix-field-wrapper",{key:"c018215d637253e021247473c35701ff94d3f028",htmlForLabel:this.inputId,required:this.required,label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,warningText:this.warningText,validText:this.validText,showTextAsTooltip:this.showTextAsTooltip,isInvalid:this.isInvalid,isValid:this.isValid,isInfo:this.isInfo,isWarning:this.isWarning,controlRef:this.inputRef},t("div",{key:"cc9ee3d23a14d0e10351f294fae72aeec82fbf64",class:"input-wrapper"},t(c,{key:"f32e50c55492dc1423b91f05209c1e9914b50f28",slotStartRef:this.slotStartRef,onSlotChange:()=>this.updatePaddings()}),t(p,{key:"ca17d2fee580dbe2e8d176018d0e55565bef5f33",id:this.inputId,readonly:this.readonly,disabled:this.disabled,maxLength:this.maxLength,minLength:this.minLength,pattern:this.pattern,type:this.inputType,isInvalid:this.isInvalid,required:this.required,value:this.value,placeholder:this.placeholder,inputRef:this.inputRef,onKeyPress:e=>h(this,e),valueChange:e=>this.valueChange.emit(e),updateFormInternalValue:e=>this.updateFormInternalValue(e),onBlur:()=>m(this,this.inputRef.current),ariaAttributes:o}),t(u,{key:"5664747770d85defa36d460b4aa3e497a802bca2",slotEndRef:this.slotEndRef,onSlotChange:()=>this.updatePaddings()},t("ix-icon-button",{key:"f680b65ba0355746be49646d25a2074cc4a9caac",color:"color-weak-text",class:{"password-eye":true,"eye-hidden":this.type!=="password"},ghost:true,icon:this.inputType==="password"?i:n,onClick:()=>{if(this.inputType==="password"){this.inputType="text";return}this.inputType="password"}}))),!!this.maxLength&&this.maxLength>0&&t("ix-typography",{key:"baa09803b87cd3efce3cce29cb735b5d0a290832",class:"bottom-text",slot:"bottom-right",color:"soft"},(e=this.value)===null||e===void 0?void 0:e.length,"/",this.maxLength)))}static get formAssociated(){return true}get hostElement(){return a(this)}static get watchers(){return{type:["updateInputType"]}}};g([d()],k.prototype,"updateClassMappings",null);k.style=x;export{k as ix_input};
-//# sourceMappingURL=p-c07557b0.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["inputCss","IxInputStyle0","inputIds","Input","this","inputRef","makeRef","slotEndRef","slotStartRef","inputId","updateClassMappings","result","mapValidationResult","updateInputType","inputType","type","componentWillLoad","updateFormInternalValue","value","componentDidRender","updatePaddings","adjustPaddingForStartAndEnd","current","formInternals","setFormValue","getAssociatedFormElement","form","hasValidValue","Promise","resolve","getNativeInputElement","waitForCurrent","focusInput","focus","render","inputAria","getAriaAttributesForInput","h","Host","key","class","disabled","readonly","htmlForLabel","required","label","helperText","invalidText","infoText","warningText","validText","showTextAsTooltip","isInvalid","isValid","isInfo","isWarning","controlRef","SlotStart","onSlotChange","InputElement","id","maxLength","minLength","pattern","placeholder","onKeyPress","event","checkAllowedKeys","valueChange","emit","onBlur","onInputBlur","ariaAttributes","SlotEnd","color","ghost","icon","iconEye","iconEyeCancelled","onClick","slot","_a","length","__decorate","HookValidationLifecycle"],"sources":["src/components/input/input.scss?tag=ix-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'components/form/input';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/validation/form-component';\n@import './input.mixins.scss';\n\n@include input-field;\n\n:host {\n  .password-eye {\n    margin-left: 0.125rem;\n    color: red;\n\n    &.eye-hidden {\n      display: none;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconEye, iconEyeCancelled } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport {\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n  adjustPaddingForStartAndEnd,\n  checkAllowedKeys,\n  getAriaAttributesForInput,\n  mapValidationResult,\n  onInputBlur,\n} from './input.util';\n\nlet inputIds = 0;\n\n/**\n * @since 2.6.0\n * @form-ready 2.6.0\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-input',\n  styleUrl: 'input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Input implements IxInputFieldComponent<string> {\n  @Element() hostElement!: HTMLIxInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * The type of the text field. Possible values are 'text', 'email', or 'password'.\n   */\n  @Prop() type: 'text' | 'email' | 'password' | 'tel' | 'url' = 'text';\n\n  /**\n   * The name of the text field.\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * The placeholder text for the text field.\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * Specifies whether the text field is required.\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Specifies whether the text field is disabled.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Specifies whether the text field is readonly.\n   */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /**\n   * The helper text for the text field.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * The info text for the text field.\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Specifies whether to show the text as a tooltip.\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * The valid text for the text field.\n   */\n  @Prop() validText?: string;\n\n  /**\n   * The warning text for the text field.\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * The label for the text field.\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The error text for the text field.\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * The pattern for the text field.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * The maximum length of the text field.\n   */\n  @Prop() maxLength?: number;\n\n  /**\n   * The minimum length of the text field.\n   */\n  @Prop() minLength?: number;\n\n  /**\n   * The allowed characters pattern for the text field.\n   */\n  @Prop() allowedCharactersPattern?: string;\n\n  /**\n   * Event emitted when the value of the text field changes.\n   */\n  @Event() valueChange!: EventEmitter<string>;\n\n  /**\n   * Event emitted when the validity state of the text field changes.\n   */\n  @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n  /**\n   * Event emitted when the text field loses focus.\n   */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() isInvalidByRequired = false;\n\n  @State() inputType = 'text';\n\n  private readonly inputRef = makeRef<HTMLInputElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n\n  private readonly inputId = `input-${inputIds++}`;\n\n  @HookValidationLifecycle()\n  updateClassMappings(result: ValidationResults) {\n    mapValidationResult(this, result);\n  }\n\n  @Watch('type')\n  updateInputType() {\n    this.inputType = this.type;\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue(this.value);\n    this.inputType = this.type;\n  }\n\n  componentDidRender() {\n    this.updatePaddings();\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputRef.current\n    );\n  }\n\n  updateFormInternalValue(value: string) {\n    this.formInternals.setFormValue(value);\n    this.value = value;\n  }\n\n  /** @internal */\n  @Method()\n  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return this.formInternals.form;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /**\n   * Returns the native input element used in the text field.\n   */\n  @Method()\n  getNativeInputElement() {\n    return this.inputRef.waitForCurrent();\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  render() {\n    const inputAria: A11yAttributes = getAriaAttributesForInput(this);\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          htmlForLabel={this.inputId}\n          required={this.required}\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          controlRef={this.inputRef}\n        >\n          <div class=\"input-wrapper\">\n            <SlotStart\n              slotStartRef={this.slotStartRef}\n              onSlotChange={() => this.updatePaddings()}\n            ></SlotStart>\n            <InputElement\n              id={this.inputId}\n              readonly={this.readonly}\n              disabled={this.disabled}\n              maxLength={this.maxLength}\n              minLength={this.minLength}\n              pattern={this.pattern}\n              type={this.inputType}\n              isInvalid={this.isInvalid}\n              required={this.required}\n              value={this.value}\n              placeholder={this.placeholder}\n              inputRef={this.inputRef}\n              onKeyPress={(event) => checkAllowedKeys(this, event)}\n              valueChange={(value) => this.valueChange.emit(value)}\n              updateFormInternalValue={(value) =>\n                this.updateFormInternalValue(value)\n              }\n              onBlur={() => onInputBlur(this, this.inputRef.current)}\n              ariaAttributes={inputAria}\n            ></InputElement>\n            <SlotEnd\n              slotEndRef={this.slotEndRef}\n              onSlotChange={() => this.updatePaddings()}\n            >\n              <ix-icon-button\n                color=\"color-weak-text\"\n                class={{\n                  'password-eye': true,\n                  'eye-hidden': this.type !== 'password',\n                }}\n                ghost\n                icon={\n                  this.inputType === 'password' ? iconEye : iconEyeCancelled\n                }\n                onClick={() => {\n                  if (this.inputType === 'password') {\n                    this.inputType = 'text';\n                    return;\n                  }\n\n                  this.inputType = 'password';\n                }}\n              ></ix-icon-button>\n            </SlotEnd>\n          </div>\n          {!!this.maxLength && this.maxLength > 0 && (\n            <ix-typography class=\"bottom-text\" slot=\"bottom-right\" color=\"soft\">\n              {this.value?.length}/{this.maxLength}\n            </ix-typography>\n          )}\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gVAAA,MAAMA,EAAW,027BACjB,MAAAC,EAAeD,E,2WCsCf,IAAIE,EAAW,E,MAcFC,EAAK,M,sUAqHCC,KAAAC,SAAWC,IACXF,KAAAG,WAAaD,IACbF,KAAAI,aAAeF,IAEfF,KAAAK,QAAU,SAASP,M,UAlH0B,O,0DAeN,G,cAKX,M,cAKA,M,cAKA,M,uTAwExB,M,aACF,M,YACD,M,eACG,M,yBACU,M,eAEV,M,CASrB,mBAAAQ,CAAoBC,GAClBC,EAAoBR,KAAMO,E,CAI5B,eAAAE,GACET,KAAKU,UAAYV,KAAKW,I,CAGxB,iBAAAC,GACEZ,KAAKa,wBAAwBb,KAAKc,OAClCd,KAAKU,UAAYV,KAAKW,I,CAGxB,kBAAAI,GACEf,KAAKgB,gB,CAGC,cAAAA,GACNC,EACEjB,KAAKI,aAAac,QAClBlB,KAAKG,WAAWe,QAChBlB,KAAKC,SAASiB,Q,CAIlB,uBAAAL,CAAwBC,GACtBd,KAAKmB,cAAcC,aAAaN,GAChCd,KAAKc,MAAQA,C,CAKf,8BAAMO,GACJ,OAAOrB,KAAKmB,cAAcG,I,CAK5B,aAAAC,GACE,OAAOC,QAAQC,UAAUzB,KAAKc,M,CAOhC,qBAAAY,GACE,OAAO1B,KAAKC,SAAS0B,gB,CAOvB,gBAAMC,GACJ,aAAc5B,KAAK0B,yBAAyBG,O,CAG9C,MAAAC,G,MACE,MAAMC,EAA4BC,EAA0BhC,MAC5D,OACEiC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,SAAUrC,KAAKqC,SACfC,SAAUtC,KAAKsC,WAGjBL,EAAA,oBAAAE,IAAA,2CACEI,aAAcvC,KAAKK,QACnBmC,SAAUxC,KAAKwC,SACfC,MAAOzC,KAAKyC,MACZC,WAAY1C,KAAK0C,WACjBC,YAAa3C,KAAK2C,YAClBC,SAAU5C,KAAK4C,SACfC,YAAa7C,KAAK6C,YAClBC,UAAW9C,KAAK8C,UAChBC,kBAAmB/C,KAAK+C,kBACxBC,UAAWhD,KAAKgD,UAChBC,QAASjD,KAAKiD,QACdC,OAAQlD,KAAKkD,OACbC,UAAWnD,KAAKmD,UAChBC,WAAYpD,KAAKC,UAEjBgC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iBACTH,EAACoB,EAAS,CAAAlB,IAAA,2CACR/B,aAAcJ,KAAKI,aACnBkD,aAAc,IAAMtD,KAAKgB,mBAE3BiB,EAACsB,EAAY,CAAApB,IAAA,2CACXqB,GAAIxD,KAAKK,QACTiC,SAAUtC,KAAKsC,SACfD,SAAUrC,KAAKqC,SACfoB,UAAWzD,KAAKyD,UAChBC,UAAW1D,KAAK0D,UAChBC,QAAS3D,KAAK2D,QACdhD,KAAMX,KAAKU,UACXsC,UAAWhD,KAAKgD,UAChBR,SAAUxC,KAAKwC,SACf1B,MAAOd,KAAKc,MACZ8C,YAAa5D,KAAK4D,YAClB3D,SAAUD,KAAKC,SACf4D,WAAaC,GAAUC,EAAiB/D,KAAM8D,GAC9CE,YAAclD,GAAUd,KAAKgE,YAAYC,KAAKnD,GAC9CD,wBAA0BC,GACxBd,KAAKa,wBAAwBC,GAE/BoD,OAAQ,IAAMC,EAAYnE,KAAMA,KAAKC,SAASiB,SAC9CkD,eAAgBrC,IAElBE,EAACoC,EAAO,CAAAlC,IAAA,2CACNhC,WAAYH,KAAKG,WACjBmD,aAAc,IAAMtD,KAAKgB,kBAEzBiB,EAAA,kBAAAE,IAAA,2CACEmC,MAAM,kBACNlC,MAAO,CACL,eAAgB,KAChB,aAAcpC,KAAKW,OAAS,YAE9B4D,MAAK,KACLC,KACExE,KAAKU,YAAc,WAAa+D,EAAUC,EAE5CC,QAAS,KACP,GAAI3E,KAAKU,YAAc,WAAY,CACjCV,KAAKU,UAAY,OACjB,M,CAGFV,KAAKU,UAAY,UAAU,QAKhCV,KAAKyD,WAAazD,KAAKyD,UAAY,GACpCxB,EAAA,iBAAAE,IAAA,2CAAeC,MAAM,cAAcwC,KAAK,eAAeN,MAAM,SAC1DO,EAAA7E,KAAKc,SAAK,MAAA+D,SAAA,S,EAAEC,OAAM,IAAG9E,KAAKyD,Y,mIAzIvCsB,EAAA,CADCC,K"}

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

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as e,H as i,g as n}from"./p-5806df2b.js";import{m as o}from"./p-ce563a48.js";const r=":host{display:contents}";const c=r;const a=class{constructor(e){t(this,e);this.itemClick=s(this,"itemClick",7);this.wrapperRef=o();this.icon=undefined;this.label=undefined}async getDropdownItemElement(){return this.wrapperRef.waitForCurrent()}render(){return e(i,{key:"91330ca8eb90a2151566a65cf83aaf463560d57a"},e("ix-dropdown-item",{key:"0114cf4320b766553382065909db69156b83015f",ref:this.wrapperRef,suppressChecked:true,icon:this.icon,label:this.label,onItemClick:t=>{t.preventDefault();t.stopPropagation()},onClick:t=>this.itemClick.emit(t)}))}get hostElement(){return n(this)}};a.style=c;export{a as ix_split_button_item};
-//# sourceMappingURL=p-c236cf18.entry.js.map

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

@@ -1,2 +0,0 @@
-import"./p-46a6cd9d.js";import{b as t}from"./p-38d9d569.js";async function o(o){const c=document.createElement("ix-application-switch-modal");c.config=o;const i=await t({content:c,size:"840",closeOnBackdropClick:true});const a=i.htmlElement.querySelector("ix-application-switch-modal");return t=>{a.config=t}}export{o as s};
-//# sourceMappingURL=p-c3ca17fc.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["async","showAppSwitch","config","modal","document","createElement","result","showModal","content","size","closeOnBackdropClick","appSwitchElement","htmlElement","querySelector","updateAppSwitchConfig"],"sources":["src/components/utils/app-switch/index.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { AppSwitchConfiguration } from '../application-layout/context';\nimport { showModal } from '../modal';\n\nexport async function showAppSwitch(config: AppSwitchConfiguration) {\n  const modal = document.createElement('ix-application-switch-modal');\n  modal.config = config;\n  const result = await showModal({\n    content: modal,\n    size: '840',\n    closeOnBackdropClick: true,\n  });\n\n  const appSwitchElement = result.htmlElement.querySelector(\n    'ix-application-switch-modal'\n  );\n\n  return (updateAppSwitchConfig: AppSwitchConfiguration) => {\n    appSwitchElement.config = updateAppSwitchConfig;\n  };\n}\n"],"mappings":"4DAYOA,eAAeC,EAAcC,GAClC,MAAMC,EAAQC,SAASC,cAAc,+BACrCF,EAAMD,OAASA,EACf,MAAMI,QAAeC,EAAU,CAC7BC,QAASL,EACTM,KAAM,MACNC,qBAAsB,OAGxB,MAAMC,EAAmBL,EAAOM,YAAYC,cAC1C,+BAGF,OAAQC,IACNH,EAAiBT,OAASY,CAAqB,CAEnD,Q"}