npm - @siemens/ix - Versions diffs - 1.5.0 → 1.6.0 - Mend

@siemens/ix 1.5.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (588) hide show

package/dist/siemens-ix/p-dbcec49e.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["menuCss","Menu","this","domObserver","MutationObserver","onDomChange","bind","isVisible","elm","style","display","_b","_a","parentElement","onWindowResize","visibleMenuItems","getMaxTabCount","handleNodeMutation","node","HTMLElement","matches","menu","contains","appendAbout","appendSettings","mutations","forEach","mutationRecord","addedNodes","removedNodes","popoverArea","hostElement","querySelector","overlayContainer","invisibleContainer","menuItems","Array","from","querySelectorAll","filter","menuBottomItems","homeTab","moreItemsDropdown","isMoreItemsDropdownEmpty","length","moreItemsDropdownItems","activeMoreTabContainer","activeMoreTab","aboutPopoverContainer","aboutPopover","document","aboutTab","about","settings","isSettingsEmpty","avatarItem","tabsContainer","showTab","index","componentDidLoad","addEventListener","showSettings","show","classList","add","_c","showAbout","_d","observe","attributes","childList","subtree","componentWillLoad","menuController","register","layout","hostContext","isBasicNavigationLayout","hideHeader","screenMode","onChange","on","mode","componentWillRender","appendTabs","componentDidRender","appendFragments","appendAvatar","appendAboutNewsPopover","isMoreTabEmpty","countMoreNotifications","getMoreNotificationsCount","resetActiveTab","activeTab","isMenuItemActive","item","active","appendChild","resetOverlay","remove","avatar","marginBottom","getAboutPopoverVerticalPosition","heightArrow","offsetArrow","rectAbout","getBoundingClientRect","offset","window","innerHeight","bottom","height","convertToRemString","showMore","aboutItemLabel","activeTabLabel","toggleAbout","body","moreTabs","count","tab","getAvailableHeight","heightBurgerMenu","heightHome","heightAvatar","heightBottomTab","availableHeight","clientHeight","enableMapExpand","heightTab","visibleCount","Math","floor","menuItemCount","maxVisibleMenuItems","min","async","skipAllOverlayAnimations","undefined","mapExpand","skipOverlayAnimationFor","element","animateClass","setTimeout","expand","expanded","expandChange","emit","toggleMenu","showMoreButton","getCollapseText","i18nCollapse","i18nExpand","getCollapseIcon","isMenuItemClicked","event","path","composedPath","id","tagName","some","render","h","Host","class","onClick","tabIcon","innerText","title","notifications","i18nMore","trigger","positioningStrategy","placement","map","e","disabled","dispatchEvent","CustomEvent","enableSettings","toggleSettings","i18nSettings","name","i18nLegal","enableToggleTheme","themeSwitcher","toggleMode","i18nToggleTheme","mapExpandChange","opacity","menuAboutCss","MenuAbout","aboutItems","el","setTab","label","i","forceUpdate","updateLabels","labels","watchActiveTabLabel","value","getSelectedTabIndex","selectedItem","find","indexOf","getTabItems","animate__animated","animate__fadeInLeft","animate__fadeOutLeft","ghost","size","icon","close","selected","menuAboutItemCss","MenuAboutItem","menuAboutNewsCss","MenuAboutNews","color","viewBox","xmlns","points","closePopover","i18nShowMore","menuAvatarCss","DefaultAvatar","props","initials","width","fill","d","MenuAvatar","avatarElementId","top","image","src","mainAxis","i18nLogout","logoutClick","menuAvatarItemCss","MenuAvatarItem","itemClick","menuItemCss","MenuItem","connectedCallback","observer","createMutationObserver","characterData","disconnectedCallback","disconnect","home","menuSettingsCss","settingsItems","menuSettingsItemCss","MenuSettingsItem"],"sources":["./src/components/menu/menu.scss?tag=ix-menu","./src/components/menu/menu.tsx","./src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=scoped","./src/components/menu-about/menu-about.tsx","./src/components/menu-about-item/menu-about-item.css?tag=ix-menu-about-item&encapsulation=scoped","./src/components/menu-about-item/menu-about-item.tsx","./src/components/menu-about-news/menu-about-news.scss?tag=ix-menu-about-news&encapsulation=scoped","./src/components/menu-about-news/menu-about-news.tsx","./src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=scoped","./src/components/menu-avatar/menu-avatar.tsx","./src/components/menu-avatar-item/menu-avatar-item.css?tag=ix-menu-avatar-item&encapsulation=scoped","./src/components/menu-avatar-item/menu-avatar-item.tsx","./src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=shadow","./src/components/menu-item/menu-item.tsx","./src/components/menu-settings/menu-settings.scss?tag=ix-menu-settings&encapsulation=scoped","./src/components/menu-settings/menu-settings.tsx","./src/components/menu-settings-item/menu-settings-item.css?tag=ix-menu-settings-item&encapsulation=scoped","./src/components/menu-settings-item/menu-settings-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n\nix-menu {\n display: flex;\n flex-direction: row;\n position: absolute;\n height: 100%;\n min-height: 22.75rem;\n z-index: var(--theme-z-index-sticky);\n width: auto;\n\n .menu {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 3.25rem;\n height: 100%;\n padding-block-end: 1rem;\n overflow: hidden;\n\n &.expanded {\n box-shadow: var(--theme-navigation--box-shadow);\n }\n\n background-color: var(--theme-nav--background);\n transition: width var(--animate-duration);\n\n .burger-menu {\n margin: 0.75rem 0 1rem 0.35rem;\n }\n }\n\n .menu-overlay {\n display: block;\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: all $medium-time ease-out;\n }\n\n .menu-overlay-invisible {\n display: none;\n }\n\n .menu.expanded {\n width: 16rem;\n }\n\n .menu-overlay.expanded {\n width: calc(100vw - 16rem);\n left: 16rem;\n }\n\n #avatar-tab-placeholder {\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\nix-menu.mode-mobile {\n .menu:not(.expanded) {\n width: 0;\n }\n\n .menu {\n padding-top: 2rem;\n }\n\n .menu .burger-menu {\n display: none;\n }\n\n .menu-overlay {\n left: 0px;\n width: calc(100vw);\n }\n}\n\n// Remove text-decoration if a tag is used inside ix-menu\na[href]:has(> ix-menu-item) {\n text-decoration: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { hostContext, isBasicNavigationLayout } from '../utils/screen/context';\nimport { Mode } from '../utils/screen/mode';\nimport { screenMode } from '../utils/screen/service';\nimport { themeSwitcher } from '../utils/theme-switcher';\n\n@Component({\n tag: 'ix-menu',\n styleUrl: 'menu.scss',\n scoped: false,\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 @Prop() maxVisibleMenuItems = 9;\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 */\n @Prop() i18nMore = 'More…';\n\n /**\n * Expand menu\n */\n @Prop({ mutable: true, reflect: true }) expand = false;\n\n /**\n * Menu expanded\n */\n @Event() expandChange: EventEmitter<boolean>;\n\n /**\n * Map Sidebar expanded\n */\n @Event() mapExpandChange: EventEmitter<boolean>;\n @State() showMoreItems = false;\n @State() visibleMenuItems = 0;\n @State() countMoreNotifications = 0;\n @State() mapExpand = true;\n @State() activeTab: HTMLIxMenuItemElement;\n @State() isMoreTabEmpty = false;\n @State() mode: Mode = 'desktop';\n\n private readonly domObserver = new MutationObserver(\n this.onDomChange.bind(this)\n );\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.visibleMenuItems = this.getMaxTabCount();\n }\n\n private handleNodeMutation(node: Node) {\n if (!(node instanceof HTMLElement)) {\n return;\n }\n\n if (node.matches('.tab')) {\n this.onWindowResize();\n }\n\n if (node.matches('ix-menu-about') && this.menu.contains(node)) {\n this.appendAbout();\n }\n\n if (node.matches('ix-menu-settings') && this.menu.contains(node)) {\n this.appendSettings();\n }\n }\n\n private onDomChange(mutations: MutationRecord[]) {\n mutations.forEach((mutationRecord) => {\n mutationRecord.addedNodes.forEach(this.handleNodeMutation.bind(this));\n mutationRecord.removedNodes.forEach(this.handleNodeMutation.bind(this));\n });\n }\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.querySelector('#popover-area');\n }\n\n get overlayContainer() {\n return this.hostElement.querySelector('.menu-overlay');\n }\n\n get invisibleContainer() {\n return this.hostElement.querySelector('.menu-overlay-invisible');\n }\n\n get menu() {\n return this.hostElement.querySelector('.menu');\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(this.isVisible);\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(this.isVisible);\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.querySelector('.internal-tab ix-dropdown');\n }\n\n get isMoreItemsDropdownEmpty(): boolean {\n return (\n this.hostElement.querySelectorAll('.internal-tab ix-dropdown .appended')\n .length === 0\n );\n }\n\n get moreItemsDropdownItems() {\n return this.hostElement.querySelectorAll(\n '.internal-tab ix-dropdown ix-menu-item'\n );\n }\n\n get activeMoreTabContainer() {\n return this.hostElement.querySelector('.active-more-tab');\n }\n\n get activeMoreTab() {\n return this.hostElement.querySelector('.active-more-tab ix-menu-item');\n }\n\n get aboutPopoverContainer(): HTMLElement {\n return this.hostElement.querySelector('.about-news');\n }\n\n get aboutPopover(): HTMLIxMenuAboutNewsElement {\n return document.querySelector('ix-menu-about-news');\n }\n\n get aboutTab(): HTMLElement {\n return this.hostElement.querySelector('#aboutAndLegal');\n }\n\n get about(): HTMLIxMenuAboutElement {\n return this.hostElement.querySelector('ix-menu-about');\n }\n\n get settings(): HTMLIxMenuSettingsElement {\n return this.hostElement.querySelector('ix-menu-settings');\n }\n\n get isSettingsEmpty(): boolean {\n return (\n Array.from(this.hostElement.querySelectorAll('ix-menu-settings-item'))\n .length === 0\n );\n }\n\n get avatarItem(): HTMLIxMenuAvatarElement {\n return this.hostElement.querySelector('ix-menu-avatar');\n }\n\n get tabsContainer(): HTMLDivElement {\n return this.hostElement.querySelector('#menu-tabs');\n }\n\n private showTab(index: number) {\n return index + 1 <= this.visibleMenuItems;\n }\n\n componentDidLoad() {\n this.settings?.addEventListener('close', () => {\n this.showSettings = false;\n this.settings.show = this.showSettings;\n });\n\n this.settings?.addEventListener('animationend', () => {\n if (!this.showSettings) {\n this.settings.classList.add('d-none');\n this.overlayContainer.classList.add('d-none');\n }\n });\n\n this.about?.addEventListener('close', () => {\n this.showAbout = false;\n this.about.show = this.showAbout;\n });\n\n this.about?.addEventListener('animationend', () => {\n if (!this.showAbout) {\n this.about.classList.add('d-none');\n this.overlayContainer.classList.add('d-none');\n }\n });\n\n this.overlayContainer.classList.add('d-none');\n\n this.onWindowResize();\n\n this.domObserver.observe(this.hostElement, {\n attributes: false,\n childList: true,\n subtree: true,\n });\n }\n\n componentWillLoad() {\n menuController.register(this.hostElement);\n const layout = hostContext('ix-basic-navigation', this.hostElement);\n if (isBasicNavigationLayout(layout) && layout.hideHeader === false) {\n screenMode.onChange.on((mode) => (this.mode = mode));\n this.mode = screenMode.mode;\n }\n }\n\n componentWillRender() {\n this.appendTabs();\n }\n\n componentDidRender() {\n this.visibleMenuItems = this.getMaxTabCount();\n this.appendFragments();\n }\n\n private appendFragments() {\n this.appendAvatar();\n this.appendAbout();\n this.appendSettings();\n this.appendAboutNewsPopover();\n\n // This lead to none infinite-loops and other bugs.\n this.isMoreTabEmpty = this.isMoreItemsDropdownEmpty;\n\n this.countMoreNotifications = this.getMoreNotificationsCount();\n }\n\n private resetActiveTab() {\n this.activeTab = null;\n }\n\n private isMenuItemActive(item: HTMLIxMenuItemElement) {\n return item.active || item.classList.contains('active');\n }\n\n private appendTabs() {\n this.activeTab = null;\n\n if (this.homeTab) {\n this.hostElement.querySelector('.tabs-top').appendChild(this.homeTab);\n this.homeTab.addEventListener('click', this.resetOverlay.bind(this));\n }\n\n this.menuItems.forEach((item: HTMLIxMenuItemElement, index) => {\n if (this.showTab(index)) {\n item.classList.remove('d-none');\n } else {\n item.classList.add('d-none');\n\n if (this.isMenuItemActive(item)) {\n this.activeTab = item;\n }\n }\n\n // TODO: Find better solution to handle home tab\n this.homeTab?.classList.remove('d-none');\n\n item.addEventListener('click', this.resetOverlay.bind(this));\n });\n }\n\n private appendAvatar() {\n const avatar = this.avatarItem;\n if (avatar) {\n avatar.style.marginBottom = '1rem';\n this.hostElement\n .querySelector('#avatar-tab-placeholder')\n ?.appendChild(avatar);\n }\n }\n\n private getAboutPopoverVerticalPosition() {\n const heightArrow = 12;\n const offsetArrow = 6;\n const rectAbout = this.aboutTab.getBoundingClientRect();\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.aboutPopover) {\n return;\n }\n\n this.aboutPopover.style.bottom = this.getAboutPopoverVerticalPosition();\n\n if (!this.popoverArea?.contains(this.aboutPopover)) {\n const showMore = () => {\n if (this.aboutPopover?.aboutItemLabel) {\n this.about.activeTabLabel = this.aboutPopover.aboutItemLabel;\n this.toggleAbout(true);\n }\n };\n\n this.aboutPopover.addEventListener('showMore', showMore.bind(this));\n document.body.appendChild(this.aboutPopover);\n }\n }\n\n private appendSettings() {\n if (this.settings) {\n this.overlayContainer.appendChild(this.settings);\n }\n }\n\n private appendAbout() {\n if (this.about) {\n this.overlayContainer.appendChild(this.about);\n }\n }\n\n private getMoreNotificationsCount(): number {\n const moreTabs = this.moreItemsDropdown?.querySelectorAll('.appended');\n let count = 0;\n moreTabs?.forEach((tab) => {\n if (tab['notifications']) {\n count += tab['notifications'];\n }\n });\n\n return count;\n }\n\n private getAvailableHeight() {\n const heightBurgerMenu = 60;\n const heightHome = 72;\n const heightAvatar = 56;\n const heightBottomTab = 36;\n\n let availableHeight = this.hostElement.clientHeight;\n\n availableHeight -= heightBurgerMenu;\n\n if (this.avatarItem) {\n availableHeight -= heightAvatar;\n }\n\n if (this.homeTab) {\n availableHeight -= heightHome;\n }\n\n if (this.showAbout) {\n availableHeight -= heightBottomTab;\n }\n\n if (this.showSettings) {\n availableHeight -= heightBottomTab;\n }\n\n if (this.menuBottomItems.length) {\n availableHeight -= this.menuBottomItems.length * heightBottomTab;\n }\n\n if (this.enableMapExpand) {\n availableHeight -= heightBottomTab;\n }\n\n // Subtract height of imprint and theme toggle tabs\n availableHeight -= 2 * heightBottomTab;\n\n // Subtract bottom margin of bottom tabs\n availableHeight -= 16;\n\n return availableHeight;\n }\n\n private getMaxTabCount() {\n const heightTab = 48;\n const availableHeight = this.getAvailableHeight();\n const visibleCount = Math.floor(availableHeight / heightTab);\n const menuItemCount = this.menuItems.length;\n\n if (menuItemCount === 1) {\n return 1;\n }\n\n if (menuItemCount < this.maxVisibleMenuItems) {\n if (visibleCount > menuItemCount) {\n return menuItemCount;\n }\n\n return Math.min(visibleCount - 2, menuItemCount);\n }\n\n if (menuItemCount === this.maxVisibleMenuItems) {\n if (visibleCount < this.maxVisibleMenuItems) {\n return visibleCount - 2;\n }\n\n if (visibleCount === this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 2;\n }\n\n return Math.min(visibleCount, this.maxVisibleMenuItems);\n }\n\n if (visibleCount === this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 2;\n }\n if (visibleCount >= this.maxVisibleMenuItems) {\n return this.maxVisibleMenuItems - 1;\n }\n\n return Math.min(visibleCount - 2, this.maxVisibleMenuItems);\n }\n\n /**\n * Toggle map sidebar expand\n * @param show\n */\n @Method()\n async toggleMapExpand(show?: boolean) {\n this.skipAllOverlayAnimations();\n\n if (show !== undefined) {\n this.mapExpand = show;\n } else {\n this.mapExpand = !this.mapExpand;\n }\n }\n\n private skipAllOverlayAnimations() {\n if (this.about) {\n this.skipOverlayAnimationFor(this.about);\n }\n if (this.settings) {\n this.skipOverlayAnimationFor(this.settings);\n }\n }\n\n private skipOverlayAnimationFor(element: HTMLElement) {\n const animateClass = 'animate__animated';\n\n element?.classList.remove(animateClass);\n\n setTimeout(() => {\n element?.classList.add(animateClass);\n }, 300);\n }\n\n /**\n * Toggle menu\n * @param show\n */\n @Method()\n async toggleMenu(show?: boolean) {\n this.skipAllOverlayAnimations();\n\n if (show !== undefined) {\n this.expand = show;\n } else {\n this.expand = !this.expand;\n }\n\n if (this.aboutPopover) {\n this.aboutPopover.expanded = this.expand;\n }\n\n this.expandChange.emit(this.expand);\n }\n\n /**\n * Toggle Settings tabs\n * @param show\n */\n @Method()\n async toggleSettings(show: boolean) {\n if (this.showAbout) {\n this.skipAllOverlayAnimations();\n } else {\n this.skipOverlayAnimationFor(this.about);\n }\n\n this.about?.classList.add('d-none');\n\n this.resetOverlay();\n this.showSettings = show;\n this.settings.show = this.showSettings;\n this.settings.classList.remove('d-none');\n this.overlayContainer.classList.remove('d-none');\n }\n\n /**\n * Toggle About tabs\n * @param show\n */\n @Method()\n async toggleAbout(show: boolean) {\n if (this.showSettings) {\n this.skipAllOverlayAnimations();\n } else {\n this.skipOverlayAnimationFor(this.settings);\n }\n\n this.settings?.classList.add('d-none');\n\n this.resetOverlay();\n this.showAbout = show;\n this.about.show = this.showAbout;\n this.about.classList.remove('d-none');\n this.overlayContainer.classList.remove('d-none');\n }\n\n private resetOverlay() {\n this.showSettings = false;\n this.showAbout = false;\n\n if (this.settings) {\n this.settings.show = this.showSettings;\n }\n\n if (this.about) {\n this.about.show = this.showAbout;\n }\n\n this.toggleMenu(false);\n }\n\n private showMoreButton() {\n const menuItemCount = this.menuItems.length;\n\n if (menuItemCount === 1) {\n return false;\n }\n\n if (menuItemCount < this.maxVisibleMenuItems) {\n return this.visibleMenuItems < menuItemCount;\n }\n\n if (menuItemCount > this.maxVisibleMenuItems) {\n return this.visibleMenuItems < this.maxVisibleMenuItems;\n }\n\n return this.visibleMenuItems <= this.maxVisibleMenuItems - 2;\n }\n\n private getCollapseText() {\n return this.mapExpand ? this.i18nCollapse : this.i18nExpand;\n }\n\n private getCollapseIcon() {\n return this.mapExpand ? 'double-chevron-left' : 'double-chevron-right';\n }\n\n private isMenuItemClicked(event: MouseEvent) {\n const path = event.composedPath();\n const menuItems = (path as HTMLElement[])\n .filter((element) => element.id !== 'ix-menu-more-tab')\n .filter((element) => {\n return element.tagName === 'IX-MENU-ITEM';\n });\n\n return menuItems.some((menu) => this.tabsContainer.contains(menu));\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expand,\n [`mode-${this.mode}`]: true,\n }}\n >\n <div\n class={{\n menu: true,\n expanded: this.expand,\n }}\n onClick={() => {\n this.resetActiveTab();\n }}\n >\n <ix-burger-menu\n onClick={async () => this.toggleMenu()}\n expanded={this.expand}\n class={{\n 'burger-menu': true,\n }}\n ></ix-burger-menu>\n <div id=\"avatar-tab-placeholder\"></div>\n <div\n id=\"menu-tabs\"\n style={{\n display: 'contents',\n }}\n onClick={(event) => {\n if (this.isMenuItemClicked(event)) {\n this.resetOverlay();\n }\n }}\n >\n <div class=\"tabs-top\"></div>\n <slot></slot>\n <div class=\"active-more-tab\">\n {this.activeTab ? (\n <ix-menu-item\n class=\"internal-tab\"\n active={true}\n tabIcon={this.activeTab.tabIcon}\n >\n {this.activeTab.innerText}\n </ix-menu-item>\n ) : null}\n </div>\n <ix-menu-item\n id=\"ix-menu-more-tab\"\n tabIcon=\"more-menu\"\n class={{\n 'internal-tab': true,\n }}\n style={{\n display: this.showMoreButton() ? 'block' : 'none',\n }}\n title=\"Show more\"\n notifications={this.countMoreNotifications}\n >\n {this.i18nMore}\n <ix-dropdown\n trigger={'ix-menu-more-tab'}\n positioningStrategy={'fixed'}\n placement={'right-start'}\n >\n {this.menuItems\n .filter(\n (elm: HTMLIxMenuItemElement, index) =>\n !this.showTab(index) &&\n !this.isMenuItemActive(elm) &&\n this.isVisible(elm)\n )\n .map((e: HTMLIxMenuItemElement) => {\n return (\n <ix-menu-item\n tabIcon={e.tabIcon}\n active={e.active}\n disabled={e.disabled}\n class=\"internal-tab appended\"\n onClick={() => {\n this.resetOverlay();\n e.dispatchEvent(new CustomEvent('click'));\n }}\n >\n {e.innerText}\n </ix-menu-item>\n );\n })}\n </ix-dropdown>\n </ix-menu-item>\n </div>\n <div class=\"bottom-tab-divider\"></div>\n {this.enableSettings && !this.isSettingsEmpty ? (\n <ix-menu-item\n id=\"settings\"\n class={{\n 'internal-tab': true,\n 'bottom-tab': true,\n active: this.showSettings,\n }}\n tabIcon=\"cogwheel\"\n onClick={async () => this.toggleSettings(!this.showSettings)}\n >\n {this.i18nSettings}\n </ix-menu-item>\n ) : null}\n <slot name=\"bottom\"></slot>\n <div id=\"popover-area\"></div>\n {this.about ? (\n <ix-menu-item\n id=\"aboutAndLegal\"\n class={{\n 'internal-tab': true,\n 'bottom-tab': true,\n active: this.showAbout,\n }}\n tabIcon=\"info\"\n onClick={async () => this.toggleAbout(!this.showAbout)}\n >\n {this.i18nLegal}\n </ix-menu-item>\n ) : null}\n {this.enableToggleTheme ? (\n <ix-menu-item\n id=\"toggleTheme\"\n onClick={() => themeSwitcher.toggleMode()}\n class=\"internal-tab bottom-tab\"\n tabIcon=\"bulb\"\n >\n {this.i18nToggleTheme}\n </ix-menu-item>\n ) : null}\n {this.enableMapExpand ? (\n <ix-menu-item\n id=\"menu-collapse\"\n onClick={() => this.mapExpandChange.emit(this.mapExpand)}\n class=\"internal-tab bottom-tab\"\n tabIcon={`${this.getCollapseIcon()}`}\n >\n {this.getCollapseText()}\n </ix-menu-item>\n ) : null}\n </div>\n <div\n class={{\n 'menu-overlay': true,\n expanded: this.expand,\n 'd-block': this.showAbout || this.showSettings,\n }}\n style={{\n opacity: this.showAbout || this.showSettings ? '1' : '0',\n }}\n ></div>\n <div class=\"menu-overlay-invisible\"></div>\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 'fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 0;\n }\n }\n\n .about-tabs {\n margin-bottom: $large-space;\n }\n\n ix-menu-about-item {\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 forceUpdate,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n scoped: true,\n})\nexport class MenuAbout {\n /**\n * Active tab\n */\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n * Label of first tab\n */\n @Prop() label = 'About & legal information';\n\n /**\n * Internal\n */\n @Prop() show = false;\n\n @Element() el!: HTMLIxMenuAboutElement;\n\n /**\n * About and Legal closed\n */\n @Event() close: EventEmitter<MouseEvent>;\n\n @State() labels: string[] = [];\n\n get aboutItems(): HTMLIxMenuAboutItemElement[] {\n return Array.from(this.el.querySelectorAll('ix-menu-about-item'));\n }\n\n private setTab(label: string) {\n this.activeTabLabel = label;\n this.aboutItems.forEach((i) => {\n i.style.display = 'none';\n if (i.label === this.activeTabLabel) {\n i.style.display = 'block';\n }\n });\n }\n\n componentWillLoad() {\n if (this.aboutItems.length) {\n this.setTab(this.activeTabLabel || this.aboutItems[0].label);\n }\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n componentWillRender() {\n this.updateLabels();\n }\n\n private updateLabels() {\n this.labels = this.aboutItems.map((i) => i.label);\n }\n\n @Watch('activeTabLabel')\n watchActiveTabLabel(value: string) {\n // Wait a DOM render cycle to get changed labels\n setTimeout(() => this.setTab(value));\n }\n\n private getSelectedTabIndex(label: string) {\n const selectedItem = this.aboutItems.find((item) => item.label === label);\n return this.aboutItems.indexOf(selectedItem);\n }\n\n private getTabItems() {\n return this.aboutItems.map(({ label }) => {\n return (\n <ix-tab-item\n class={{\n active: label === this.activeTabLabel,\n }}\n onClick={() => this.setTab(label)}\n >\n {label}\n </ix-tab-item>\n );\n });\n }\n\n render() {\n return (\n <Host\n class={{\n animate__animated: true,\n animate__fadeInLeft: this.show,\n animate__fadeOutLeft: !this.show,\n }}\n >\n <div class=\"about-header\">\n <h2 class=\"text-h2\">{this.label}</h2>\n <ix-icon-button\n ghost\n size=\"24\"\n icon=\"close\"\n onClick={(e) => this.close.emit(e)}\n ></ix-icon-button>\n </div>\n <ix-tabs\n selected={this.getSelectedTabIndex(this.activeTabLabel)}\n class=\"about-tabs\"\n >\n {this.getTabItems()}\n </ix-tabs>\n <div class=\"about-items\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-item',\n styleUrl: 'menu-about-item.css',\n scoped: true,\n})\nexport class MenuAboutItem {\n /**\n * About Item label\n */\n @Prop({ reflect: true }) label: string;\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadows';\n\n:host {\n --margin: 0.5rem;\n\n $left: 3.4rem;\n display: block;\n position: fixed;\n width: 20rem;\n height: auto;\n background-color: var(--theme-color-1);\n border: var(--theme-weak-bdr-1);\n border-radius: $default-border-radius;\n padding: 1rem;\n left: $left;\n z-index: 10000;\n transition: left var(--animate-duration);\n\n margin-left: var(--margin) !important;\n\n @include box-shadow(4);\n\n &.expanded {\n left: calc(#{$left} + 12.7rem);\n }\n\n &.show {\n display: none;\n }\n\n .banner-container {\n position: absolute;\n top: 0.0625rem;\n left: $default-space;\n\n svg {\n position: absolute;\n height: 3.625rem;\n width: 3rem;\n\n polygon {\n fill: var(--theme-color-primary);\n }\n }\n\n ix-icon {\n margin: $small-space;\n position: absolute;\n z-index: 1;\n }\n }\n\n .cui-popover-news-header {\n margin-bottom: 2rem;\n margin-left: 4rem;\n margin-top: -$tiny-space;\n }\n\n .popover-body {\n color: var(--theme-color-std-text);\n }\n\n .cui-popover-news-footer {\n display: flex;\n justify-content: flex-end;\n margin-top: 1rem;\n }\n\n ix-icon-button {\n top: $small-space;\n right: $small-space;\n position: absolute;\n }\n\n #arrow {\n position: absolute;\n width: 0.5rem;\n height: 0.5rem;\n background-color: var(--theme-color-1);\n border-left: var(--theme-weak-bdr-1);\n border-bottom: var(--theme-weak-bdr-1);\n transform: translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg);\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, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-news',\n styleUrl: 'menu-about-news.scss',\n scoped: true,\n})\nexport class MenuAboutNews {\n /**\n * Show about news\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Title of the about news\n */\n @Prop() label: string;\n\n /**\n *\n */\n @Prop() i18nShowMore = 'Show more';\n\n /**\n * Subtitle of the about news\n */\n @Prop() aboutItemLabel: string;\n\n /**\n * Bottom offset\n */\n @Prop() offsetBottom = 0;\n\n /**\n * Show More button is pressed\n */\n @Event() showMore: EventEmitter<MouseEvent>;\n\n /**\n * Popover closed\n */\n @Event() closePopover: EventEmitter<void>;\n\n /**\n * Internal\n */\n @Prop() expanded = false;\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n show: !this.show,\n }}\n >\n <div class=\"banner-container\">\n <ix-icon\n color=\"color-inv-contrast-text\"\n name=\"shout\"\n size=\"32\"\n ></ix-icon>\n <svg viewBox=\"0 0 48 56\" xmlns=\"http://www.w3.org/2000/svg\">\n <polygon points=\"0 0 48 0 48 56 24 48 0 56\" />\n </svg>\n </div>\n\n <div class=\"cui-popover-news-header\">\n <span class=\"text-l-title\">{this.label}</span>\n </div>\n\n <ix-icon-button\n size=\"24\"\n icon=\"close-small\"\n ghost\n onClick={() => {\n this.show = false;\n this.closePopover.emit();\n }}\n ></ix-icon-button>\n <slot></slot>\n {this.aboutItemLabel ? (\n <div class=\"cui-popover-news-footer\">\n <button\n class=\"btn btn-primary\"\n onClick={(e) => {\n this.show = false;\n this.showMore.emit(e);\n }}\n >\n {this.i18nShowMore}\n </button>\n </div>\n ) : null}\n <div id=\"arrow\"></div>\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/text-truncation';\n@import 'mixins/hover';\n\n:host {\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n\n .avatar {\n display: flex;\n align-items: center;\n height: 2.5rem;\n max-height: 2.5rem;\n padding-left: 0.25rem;\n margin-left: 0.41rem;\n margin-right: 0.35rem;\n transition: 0.15s;\n\n > .avatar-image {\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n }\n\n > .avatar-initials {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 2rem;\n width: 2rem;\n min-height: 2rem;\n min-width: 2rem;\n border-radius: 100px;\n background-color: var(--theme-color-component-3);\n }\n\n #avatar-path-background {\n fill: var(--theme-avatar--background);\n }\n\n #avatar-path-person {\n fill: var(--theme-color-4);\n }\n\n .avatar-name {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n white-space: nowrap;\n margin-left: $default-space;\n line-height: 1.14;\n\n .text-default-single {\n @include ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include active {\n background-color: var(--theme-avatar-btn--background--active);\n color: var(--theme-avatar-btn--color--active);\n }\n }\n}\n","/*\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\nfunction DefaultAvatar(props: { initials?: string }) {\n const { initials } = props;\n\n if (initials) {\n return <div class={'avatar-initials'}>{initials}</div>;\n }\n\n return (\n <svg\n class={'avatar-image'}\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"32\"\n height=\"32\"\n viewBox=\"0 0 32 32\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n id=\"avatar-path-background\"\n d=\"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n 16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z\"\n />\n <path\n id=\"avatar-path-person\"\n d=\"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n 6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n 9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n 6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z\"\n />\n </g>\n </svg>\n );\n}\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-avatar',\n styleUrl: 'menu-avatar.scss',\n scoped: true,\n})\nexport class MenuAvatar {\n @Element() hostElement: HTMLIxMenuAvatarElement;\n\n /**\n * First line of text\n */\n @Prop() top: string;\n\n /**\n * Second line of text\n */\n @Prop() bottom: string;\n\n /**\n * Display a avatar image\n *\n * @since 1.4.0\n */\n @Prop() image: string;\n\n /**\n * Display the initials of the user. Will be overwritten by image\n *\n * @since 1.4.0\n */\n @Prop() initials: string;\n\n /**\n * Use for translation\n */\n @Prop() i18nLogout = 'Logout';\n\n /**\n * Logout click\n */\n @Event() logoutClick: EventEmitter;\n\n private avatarElementId = 'ix-menu-avatar-id';\n\n render() {\n return (\n <Host>\n <li\n class=\"nav-item top-item avatar no-hover\"\n title={this.top}\n id={this.avatarElementId}\n >\n {this.image ? (\n <img src={this.image} class=\"avatar-image\"></img>\n ) : (\n <DefaultAvatar initials={this.initials} />\n )}\n <div class=\"avatar-name\">\n <span class=\"text-default-single\" title={this.top}>\n {this.top}\n </span>\n <span class=\"text-default-single\" title={this.bottom}>\n {this.bottom}\n </span>\n </div>\n </li>\n <ix-dropdown\n trigger={this.avatarElementId}\n placement={'right-start'}\n offset={{\n mainAxis: 6,\n }}\n >\n <slot></slot>\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon=\"log-out\"\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n </ix-dropdown>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-avatar-item',\n styleUrl: 'menu-avatar-item.css',\n scoped: true,\n})\nexport class MenuAvatarItem {\n /**\n * Avatar dropdown icon\n */\n @Prop() icon: string;\n\n /**\n * Avatar dropdown label\n */\n @Prop() label: string;\n\n /**\n * Avatar dropdown item clicked\n */\n @Event() itemClick: EventEmitter<MouseEvent>;\n\n @Element() hostElement: HTMLIxMenuAvatarItemElement;\n\n render() {\n return (\n <ix-dropdown-item\n icon={this.icon}\n label={this.label}\n onClick={(e) => this.itemClick.emit(e)}\n ></ix-dropdown-item>\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/hover';\n@import 'mixins/text-truncation';\n\n:host {\n position: relative;\n display: block;\n cursor: pointer;\n\n height: 3rem;\n min-height: 3rem;\n max-height: 3rem;\n\n .tab {\n display: flex;\n position: relative;\n align-items: center;\n height: 3rem;\n z-index: 500;\n padding-left: 0.875rem;\n\n @include ghost-hover-pressed;\n }\n\n i.glyph {\n color: var(--theme-nav-item-primary-icon--color);\n position: relative;\n }\n\n .tab:focus-visible {\n outline: none;\n }\n\n &:focus-visible {\n outline: none;\n }\n\n .tab:not(:last-child) {\n margin-bottom: $small-space;\n }\n\n .notification {\n display: inline-flex;\n position: absolute;\n top: 0.25rem;\n left: 1.75rem;\n\n .pill {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n height: 0.5rem;\n min-width: 1rem;\n position: relative;\n border-radius: 6.25rem;\n background-color: var(--theme-color-primary);\n border-radius: 6.25rem;\n font-size: 0.75rem;\n font-weight: bold;\n line-height: 1;\n font-family: Siemens Sans, Arial, sans-serif;\n color: var(--theme-color-primary--contrast);\n padding: $tiny-space;\n }\n }\n\n .tab-text {\n @include ellipsis;\n color: var(--theme-nav-item-primary--color);\n margin: 0 1.25rem;\n user-select: none;\n }\n}\n\n:host(.active),\n:host(.selected) {\n .tab {\n background-color: var(--theme-nav-item-primary--background--selected);\n }\n\n .tab::before {\n content: '';\n background-color: var(--theme-nav-item-primary--border-color--selected);\n height: 3rem;\n width: 0.25rem;\n left: 0;\n position: absolute;\n }\n\n .tab > .glyph {\n color: var(--theme-nav-item-primary-icon--color--selected);\n }\n}\n\n:host(.disabled) {\n color: var(--theme-color-weak-text);\n pointer-events: none;\n cursor: default;\n\n .tab > .glyph {\n color: var(--theme-color-weak-text);\n }\n\n .tab-text {\n color: var(--theme-color-weak-text);\n }\n}\n\n:host(.home-tab),\n:host([slot='home']) {\n margin-bottom: 1.5rem;\n}\n\n:host(.bottom-tab),\n:host([slot='bottom']) {\n $bottom-height: 2.25rem;\n\n min-height: $bottom-height;\n height: $bottom-height;\n max-height: $bottom-height;\n\n .tab {\n height: $bottom-height;\n }\n\n .tab::before {\n height: $bottom-height;\n background-color: transparent;\n }\n\n &.active,\n &.selected {\n &:hover {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n\n &:active {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n }\n}\n\n:host(.bottom-tab.active),\n:host(.bottom-tab.selected),\n:host(.active[slot='bottom']),\n:host(.selected[slot='bottom']) {\n .tab {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n@Component({\n tag: 'ix-menu-item',\n styleUrl: 'menu-item.scss',\n shadow: true,\n})\nexport class MenuItem {\n /**\n * Move the Tab to a top position.\n */\n @Prop() home = false;\n\n /**\n * Caution: this is no longer working. Please use slot=\"bottom\" instead.\n *\n * Place tab on bottom\n *\n * @deprecated Will be removed in 2.0.0. Replaced by slot based implementation\n */\n @Prop() bottom = false;\n\n /**\n * Icon name from @siemens/ix-icons\n */\n @Prop() tabIcon = 'document';\n\n /**\n * Show notification count on tab\n */\n @Prop() notifications: number;\n\n /**\n * State to display active\n */\n @Prop() active: boolean;\n\n /**\n * Disable tab and remove event handlers\n */\n @Prop() disabled: boolean;\n\n @Element() hostElement: HTMLIxMenuItemElement;\n\n @State() title: string;\n\n private observer: MutationObserver;\n\n componentWillRender() {\n this.title = this.hostElement.innerText;\n }\n\n connectedCallback() {\n this.observer = createMutationObserver(() => {\n this.title = this.hostElement.innerText;\n });\n\n this.observer.observe(this.hostElement, {\n subtree: true,\n childList: true,\n characterData: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n 'home-tab': this.home,\n 'bottom-tab': this.bottom,\n active: this.active,\n }}\n >\n <li class=\"tab\" title={this.title}>\n <ix-icon name={this.tabIcon}></ix-icon>\n <div class=\"notification\">\n {this.notifications ? (\n <div class=\"pill\">{this.notifications}</div>\n ) : null}\n </div>\n <span class=\"tab-text text-default\">\n <slot></slot>\n </span>\n </li>\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 'fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .settings-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 0;\n }\n }\n\n .settings-tabs {\n margin-bottom: $large-space;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-settings',\n styleUrl: 'menu-settings.scss',\n scoped: true,\n})\nexport class MenuAbout {\n /**\n * active tab\n */\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /**\n * Label\n */\n @Prop() label = 'Settings';\n\n /**\n * Internal\n */\n @Prop() show = false;\n\n @Element() el!: HTMLIxMenuSettingsElement;\n\n /**\n * Popover closed\n */\n @Event() close: EventEmitter<MouseEvent>;\n\n get settingsItems(): HTMLIxMenuSettingsItemElement[] {\n return Array.from(this.el.querySelectorAll('ix-menu-settings-item'));\n }\n\n private setTab(label: string) {\n this.activeTabLabel = label;\n this.settingsItems.forEach((i) => {\n i.style.display = 'none';\n\n if (i.label === this.activeTabLabel) {\n i.style.display = 'block';\n }\n });\n }\n\n componentWillLoad() {\n if (this.settingsItems.length) {\n this.setTab(this.activeTabLabel || this.settingsItems[0].label);\n }\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n @Watch('activeTabLabel')\n watchActiveTabLabel(value: string) {\n this.setTab(value);\n }\n\n private getTabItems() {\n return this.settingsItems.map(({ label }) => {\n return (\n <ix-tab-item\n class={{\n active: label === this.activeTabLabel,\n }}\n onClick={() => this.setTab(label)}\n >\n {label}\n </ix-tab-item>\n );\n });\n }\n\n render() {\n return (\n <Host\n class={{\n animate__animated: true,\n animate__fadeInLeft: this.show,\n animate__fadeOutLeft: !this.show,\n }}\n >\n <div class=\"settings-header\">\n <h2 class=\"text-h2\">{this.label}</h2>\n <ix-icon-button\n ghost\n size=\"24\"\n icon=\"close\"\n onClick={(e) => this.close.emit(e)}\n ></ix-icon-button>\n </div>\n <ix-tabs>{this.getTabItems()}</ix-tabs>\n <slot></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\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, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-settings-item',\n styleUrl: 'menu-settings-item.css',\n scoped: true,\n})\nexport class MenuSettingsItem {\n /**\n * Label\n */\n @Prop() label: string;\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/{p-dae58ef8.entry.js → p-dc98d3f4.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as s,c as e,h as o,F as t,H as r,g as i}from"./p-57a5d3d0.js";import{c as l}from"./p-c0454c9a.js";const w=".sc-ix-workflow-step-h .step.sc-ix-workflow-step{display:flex;flex-direction:column;align-items:center;background-color:var(--theme-workflow-step--background);border-radius:var(--theme-workflow--border-radius);width:auto;padding:1.125rem 0 0.5rem 0;height:4rem;width:12.75rem}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{display:flex;width:100%;align-items:center;justify-content:center;position:relative}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:100%;height:0.125rem;background-color:var(--theme-workflow-step-icon-default--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{width:50%;margin:0 0 0 auto}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 auto 0 0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.single.sc-ix-workflow-step{width:0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.warning.sc-ix-workflow-step{background-color:var(--theme-color-warning)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.success.sc-ix-workflow-step{background-color:var(--theme-color-success)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.error.sc-ix-workflow-step{background-color:var(--theme-color-alarm)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step{display:flex;align-items:center;justify-content:center;position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step .absolute.sc-ix-workflow-step{position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:1rem;width:auto;padding:0 0.5rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step{flex-direction:row;padding:0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{width:auto;padding-left:1.125rem;height:4rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:0.125rem;height:100%}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{height:50%;margin:auto 0 0 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 0 auto 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.single.sc-ix-workflow-step{width:0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:0;margin-left:1rem;padding:0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:hover{background-color:var(--theme-workflow-step--background--hover)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:active{background-color:var(--theme-workflow-step--background--active)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:focus-visible{outline:1px solid var(--focus--border-color);border-radius:0}.sc-ix-workflow-step-h .step.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--selected)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--disabled)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .line.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--disabled) !important}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .text.sc-ix-workflow-step{color:var(--theme-workflow-step--color--disabled)}";const c=class{constructor(o){s(this,o);this.selectedChanged=e(this,"selectedChanged",7);this.vertical=false;this.disabled=false;this.status="open";this.clickable=false;this.selected=false;this.position="undefined";this.iconName="circle";this.iconColor="workflow-step-icon-default--color"}select(){if(!this.clickable)return;if(this.disabled)return;this.selected=true;this.selectedHandler()}selectedHandler(){const s=this.selected?"--selected":"";if(this.status==="open"){this.iconName=this.selected?"circle-dot":"circle";this.iconColor=`workflow-step-icon-default--color${s}`}if(this.status==="done"&&!this.disabled){this.iconColor=`workflow-step-icon-done--color${s}`}}watchPropHandler(){switch(this.status){case"open":this.iconName="circle";this.iconColor="workflow-step-icon-default--color";break;case"success":this.iconName="success";this.iconColor="color-success";break;case"done":this.iconName="success";this.iconColor="workflow-step-icon-done--color";break;case"warning":this.iconName="warning";this.iconColor="color-warning";break;case"error":this.iconName="error";this.iconColor="color-alarm";break;default:this.iconName="circle";break}if(this.disabled){this.iconColor="workflow-step-icon-success--color--disabled"}}componentDidLoad(){this.watchPropHandler();this.selectedHandler();this.customIconSlot=!!this.hostElement.querySelector('[slot="custom-icon"]')}clickFunction(){if(!this.disabled&&this.clickable){this.selectedChanged.emit(this.hostElement)}}render(){const s=!this.customIconSlot?o(t,null,o("ix-icon",{color:"color-1",name:this.iconName==="warning"?"triangle-filled":"circle-filled",class:"absolute",size:"24"}),o("ix-icon",{color:this.iconColor,name:this.iconName,class:"absolute",size:"24"})):"";return o(r,null,o("div",{tabIndex:0,onClick:()=>this.select(),class:{step:true,selected:this.selected,vertical:this.vertical,disabled:this.disabled}},o("div",{class:"wrapper"},o("div",{class:{line:true,selected:this.selected,[this.status]:true,[this.position]:true}}),o("div",{class:"iconWrapper"},s,o("slot",{name:"custom-icon"}))),o("div",{class:"text"},o("slot",null))))}get hostElement(){return i(this)}static get watchers(){return{selected:["selectedHandler"],status:["watchPropHandler"]}}};c.style=w;const p=".sc-ix-workflow-steps-h .steps.sc-ix-workflow-steps{display:flex}.sc-ix-workflow-steps-h .steps.vertical.sc-ix-workflow-steps{display:block}";const a=class{constructor(o){s(this,o);this.stepSelected=e(this,"stepSelected",7);this.vertical=false;this.linear=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}get stepsContent(){return this.hostElement.querySelector(".steps")}updateSteps(){let s=this.getSteps();s.forEach(((e,o)=>{e.vertical=this.vertical;e.clickable=this.clickable;e.selected=this.selectedIndex===o;if(s.length===1){e.position="single";return}if(o===0){e.position="first"}else if(o===s.length-1){e.position="last"}else{e.position="undefined"}}))}componentDidLoad(){this.stepsContent.addEventListener("selectedChanged",(s=>{const e=this.getSteps();e.forEach((e=>{if(e!==s.target){e.selected=false}}))}));const s=this.hostElement.querySelector(".steps");this.observer=l((s=>{for(let e of s){if(e.type==="childList"){this.updateSteps()}}}));this.observer.observe(s,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentDidRender(){this.updateSteps()}render(){return o(r,null,o("div",{class:{steps:true,vertical:this.vertical}},o("slot",null)))}get hostElement(){return i(this)}};a.style=p;export{c as ix_workflow_step,a as ix_workflow_steps};
-//# sourceMappingURL=p-dae58ef8.entry.js.map
+import{r as s,c as e,h as o,F as t,H as r,g as i}from"./p-1c64b073.js";import{c as l}from"./p-c0454c9a.js";const w=".sc-ix-workflow-step-h .step.sc-ix-workflow-step{display:flex;flex-direction:column;align-items:center;background-color:var(--theme-workflow-step--background);border-radius:var(--theme-workflow--border-radius);width:auto;padding:1.125rem 0 0.5rem 0;height:4rem;width:12.75rem}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{display:flex;width:100%;align-items:center;justify-content:center;position:relative}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:100%;height:0.125rem;background-color:var(--theme-workflow-step-icon-default--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{width:50%;margin:0 0 0 auto}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 auto 0 0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.single.sc-ix-workflow-step{width:0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.warning.sc-ix-workflow-step{background-color:var(--theme-color-warning)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.success.sc-ix-workflow-step{background-color:var(--theme-color-success)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.error.sc-ix-workflow-step{background-color:var(--theme-color-alarm)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step{display:flex;align-items:center;justify-content:center;position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step .absolute.sc-ix-workflow-step{position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:1rem;width:auto;padding:0 0.5rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step{flex-direction:row;padding:0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{width:auto;padding-left:1.125rem;height:4rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:0.125rem;height:100%}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{height:50%;margin:auto 0 0 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 0 auto 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.single.sc-ix-workflow-step{width:0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:0;margin-left:1rem;padding:0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:hover{background-color:var(--theme-workflow-step--background--hover)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:active{background-color:var(--theme-workflow-step--background--active)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:focus-visible{outline:1px solid var(--focus--border-color);border-radius:0}.sc-ix-workflow-step-h .step.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--selected)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--disabled)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .line.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--disabled) !important}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .text.sc-ix-workflow-step{color:var(--theme-workflow-step--color--disabled)}";const c=class{constructor(o){s(this,o);this.selectedChanged=e(this,"selectedChanged",7);this.vertical=false;this.disabled=false;this.status="open";this.clickable=false;this.selected=false;this.position="undefined";this.iconName="circle";this.iconColor="workflow-step-icon-default--color"}select(){if(!this.clickable)return;if(this.disabled)return;this.selected=true;this.selectedHandler()}selectedHandler(){const s=this.selected?"--selected":"";if(this.status==="open"){this.iconName=this.selected?"circle-dot":"circle";this.iconColor=`workflow-step-icon-default--color${s}`}if(this.status==="done"&&!this.disabled){this.iconColor=`workflow-step-icon-done--color${s}`}}watchPropHandler(){switch(this.status){case"open":this.iconName="circle";this.iconColor="workflow-step-icon-default--color";break;case"success":this.iconName="success";this.iconColor="color-success";break;case"done":this.iconName="success";this.iconColor="workflow-step-icon-done--color";break;case"warning":this.iconName="warning";this.iconColor="color-warning";break;case"error":this.iconName="error";this.iconColor="color-alarm";break;default:this.iconName="circle";break}if(this.disabled){this.iconColor="workflow-step-icon-success--color--disabled"}}componentDidLoad(){this.watchPropHandler();this.selectedHandler();this.customIconSlot=!!this.hostElement.querySelector('[slot="custom-icon"]')}clickFunction(){if(!this.disabled&&this.clickable){this.selectedChanged.emit(this.hostElement)}}render(){const s=!this.customIconSlot?o(t,null,o("ix-icon",{color:"color-1",name:this.iconName==="warning"?"triangle-filled":"circle-filled",class:"absolute",size:"24"}),o("ix-icon",{color:this.iconColor,name:this.iconName,class:"absolute",size:"24"})):"";return o(r,null,o("div",{tabIndex:0,onClick:()=>this.select(),class:{step:true,selected:this.selected,vertical:this.vertical,disabled:this.disabled}},o("div",{class:"wrapper"},o("div",{class:{line:true,selected:this.selected,[this.status]:true,[this.position]:true}}),o("div",{class:"iconWrapper"},s,o("slot",{name:"custom-icon"}))),o("div",{class:"text"},o("slot",null))))}get hostElement(){return i(this)}static get watchers(){return{selected:["selectedHandler"],status:["watchPropHandler"]}}};c.style=w;const p=".sc-ix-workflow-steps-h .steps.sc-ix-workflow-steps{display:flex}.sc-ix-workflow-steps-h .steps.vertical.sc-ix-workflow-steps{display:block}";const a=class{constructor(o){s(this,o);this.stepSelected=e(this,"stepSelected",7);this.vertical=false;this.linear=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}get stepsContent(){return this.hostElement.querySelector(".steps")}updateSteps(){let s=this.getSteps();s.forEach(((e,o)=>{e.vertical=this.vertical;e.clickable=this.clickable;e.selected=this.selectedIndex===o;if(s.length===1){e.position="single";return}if(o===0){e.position="first"}else if(o===s.length-1){e.position="last"}else{e.position="undefined"}}))}componentDidLoad(){this.stepsContent.addEventListener("selectedChanged",(s=>{const e=this.getSteps();e.forEach((e=>{if(e!==s.target){e.selected=false}}))}));const s=this.hostElement.querySelector(".steps");this.observer=l((s=>{for(let e of s){if(e.type==="childList"){this.updateSteps()}}}));this.observer.observe(s,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentDidRender(){this.updateSteps()}render(){return o(r,null,o("div",{class:{steps:true,vertical:this.vertical}},o("slot",null)))}get hostElement(){return i(this)}};a.style=p;export{c as ix_workflow_step,a as ix_workflow_steps};
+//# sourceMappingURL=p-dc98d3f4.entry.js.map

package/dist/siemens-ix/{p-63663ccd.entry.js → p-df138b2a.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r,h as e,H as d,g as a}from"./p-57a5d3d0.js";const t=".card.sc-ix-date-time-card{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset}.card.individual.sc-ix-date-time-card{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0px rgba(0, 0, 0, 0.1);border:1px solid var(--theme-menu--border-color);border-radius:4px}.card.left.sc-ix-date-time-card{border-radius:4px 0 0 4px;height:100%}.card.right.sc-ix-date-time-card{border-radius:0 4px 4px 0;height:100%}.card.sc-ix-date-time-card .header.sc-ix-date-time-card{padding:1rem}.card.sc-ix-date-time-card .separator.sc-ix-date-time-card{border:1px solid var(--theme-datepicker-separator--background);width:100%}.card.sc-ix-date-time-card .content.sc-ix-date-time-card{height:100%;padding:0px 1rem 1rem 1rem}";const i=class{constructor(e){r(this,e);this.individual=true;this.corners="rounded"}cardClasses(){return{card:true,individual:this.individual,left:this.corners==="left",right:this.corners==="right"}}render(){return e(d,null,e("div",{class:this.cardClasses()},e("div",{class:"header"},e("slot",{name:"header"})),e("div",{class:"separator"}),e("div",{class:"content"},e("slot",null))))}get hostElement(){return a(this)}};i.style=t;export{i as ix_date_time_card};
-//# sourceMappingURL=p-63663ccd.entry.js.map
+import{r,h as e,H as a,g as d}from"./p-1c64b073.js";const t=".card.sc-ix-date-time-card{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset}.card.individual.sc-ix-date-time-card{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0px rgba(0, 0, 0, 0.1);border:1px solid var(--theme-menu--border-color);border-radius:4px}.card.left.sc-ix-date-time-card{border-radius:4px 0 0 4px;height:100%}.card.right.sc-ix-date-time-card{border-radius:0 4px 4px 0;height:100%}.card.sc-ix-date-time-card .header.sc-ix-date-time-card{padding:1rem}.card.sc-ix-date-time-card .separator.sc-ix-date-time-card{border:1px solid var(--theme-datepicker-separator--background);width:100%}.card.sc-ix-date-time-card .content.sc-ix-date-time-card{height:100%;padding:0px 1rem 1rem 1rem}";const i=class{constructor(e){r(this,e);this.individual=true;this.corners="rounded"}cardClasses(){return{card:true,individual:this.individual,left:this.corners==="left",right:this.corners==="right"}}render(){return e(a,null,e("div",{class:this.cardClasses()},e("div",{class:"header"},e("slot",{name:"header"})),e("div",{class:"separator"}),e("div",{class:"content"},e("slot",null))))}get hostElement(){return d(this)}};i.style=t;export{i as ix_date_time_card};
+//# sourceMappingURL=p-df138b2a.entry.js.map

package/dist/siemens-ix/p-ea55afa3.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as o,H as r}from"./p-1c64b073.js";import{g as t}from"./p-5b39e04e.js";const n=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:150ms;padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-btn-primary--background--selected)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover) !important;background-color:var(--theme-btn-primary--background--hover) !important;color:var(--theme-btn-primary--color--hover) !important}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-btn-primary--background--selected-hover);color:var(--theme-btn-primary--color--selected-hover)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active) !important;background-color:var(--theme-btn-primary--background--active) !important;color:var(--theme-btn-primary--color--active) !important}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-btn-primary--background--selected-active);color:var(--theme-btn-primary--color--selected-active)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-btn-outline-primary--background--selected)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover) !important;background-color:var(--theme-btn-outline-primary--background--hover) !important;color:var(--theme-btn-outline-primary--color--hover) !important}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-btn-outline-primary--background--selected-hover);color:var(--theme-btn-outline-primary--color--selected-hover)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active) !important;background-color:var(--theme-btn-outline-primary--background--active) !important;color:var(--theme-btn-outline-primary--color--active) !important}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-btn-outline-primary--background--selected-active);color:var(--theme-btn-outline-primary--color--selected-active)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-btn-invisible-primary--background--selected)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover) !important;color:var(--theme-btn-invisible-primary--color--hover) !important}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-btn-invisible-primary--background--selected-hover);color:var(--theme-btn-invisible-primary--color--selected-hover)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active) !important;color:var(--theme-btn-invisible-primary--color--active) !important}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--selected-active);color:var(--theme-btn-invisible-primary--color--selected-active)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-btn-secondary--background--selected)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover) !important;background-color:var(--theme-btn-secondary--background--hover) !important;color:var(--theme-btn-secondary--color--hover) !important}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-btn-secondary--background--selected-hover);color:var(--theme-btn-secondary--color--selected-hover)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active) !important;background-color:var(--theme-btn-secondary--background--active) !important;color:var(--theme-btn-secondary--color--active) !important}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-secondary--background--selected-active);color:var(--theme-btn-secondary--color--selected-active)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-btn-outline-secondary--background--selected)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover) !important;background-color:var(--theme-btn-outline-secondary--background--hover) !important;color:var(--theme-btn-outline-secondary--color--hover) !important}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-btn-outline-secondary--background--selected-hover);color:var(--theme-btn-outline-secondary--color--selected-hover)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active) !important;background-color:var(--theme-btn-outline-secondary--background--active) !important;color:var(--theme-btn-outline-secondary--color--active) !important}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-outline-secondary--background--selected-active);color:var(--theme-btn-outline-secondary--color--selected-active)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-btn-invisible-secondary--background--selected)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover) !important;color:var(--theme-btn-invisible-secondary--color--hover) !important}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-btn-invisible-secondary--background--selected-hover);color:var(--theme-btn-invisible-secondary--color--selected-hover)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active) !important;color:var(--theme-btn-invisible-secondary--color--active) !important}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--selected-active);color:var(--theme-btn-invisible-secondary--color--selected-active)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-block;vertical-align:middle}:host.disabled{pointer-events:none}:host .icon-button{padding:0;overflow:hidden}:host button:not(:disabled){cursor:pointer}";const i=class{constructor(o){e(this,o);this.variant="Secondary";this.outline=undefined;this.invisible=undefined;this.ghost=undefined;this.oval=undefined;this.icon=undefined;this.size="24";this.color=undefined;this.selected=false;this.disabled=false;this.type="button"}getIconSizeClass(){return{"btn-icon-12":this.size==="12","btn-icon-16":this.size==="16","btn-icon-32":this.size==="32"\|\|this.size==="24"\|\|!this.size}}getIconButtonClasses(){return Object.assign(Object.assign(Object.assign({},t(this.variant,this.outline,this.ghost\|\|this.invisible,true,this.oval,this.selected,this.disabled)),{"icon-button":true}),this.getIconSizeClass())}render(){return o(r,{class:Object.assign(Object.assign({},this.getIconSizeClass()),{disabled:this.disabled})},o("button",{class:this.getIconButtonClasses(),type:this.type},o("ix-icon",{size:this.size,name:this.icon,color:this.color}),o("div",{style:{display:"none"}},o("slot",null))))}};i.style=n;export{i as ix_icon_button};
2	+ //# sourceMappingURL=p-ea55afa3.entry.js.map

package/dist/siemens-ix/p-ea55afa3.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["iconButtonCss","IconButton","getIconSizeClass","this","size","getIconButtonClasses","Object","assign","getButtonClasses","variant","outline","ghost","invisible","oval","selected","disabled","render","h","Host","class","type","name","icon","color","style","display"],"sources":["./src/components/icon-button/icon-button.scss?tag=ix-icon-button&encapsulation=shadow","./src/components/icon-button/icon-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import './components/buttons';\n\n:host {\n display: inline-block;\n vertical-align: middle;\n\n &.disabled {\n pointer-events: none;\n }\n\n .icon-button {\n padding: 0;\n overflow: hidden;\n }\n\n button:not(:disabled) {\n cursor: pointer;\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, h, Host, Prop } from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { Button, ButtonVariant } from '../button/button';\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 implements Button {\n /**\n * Variant of button\n */\n @Prop() variant: IconButtonVariant = 'Secondary';\n\n /**\n * Button outline\n */\n @Prop() outline: boolean;\n\n /**\n * Button invisible\n *\n * @deprecated Use ghost property\n */\n @Prop() invisible: 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 * Button icon\n */\n @Prop() icon: string;\n\n /**\n * Size of icon in button\n */\n @Prop() size: '32' | '24' | '16' | '12' = '24';\n\n /**\n * Color of icon in button\n */\n @Prop() color: string;\n\n /**\n * Selected state only working with outline or invisible\n */\n @Prop() selected = false;\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 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 private getIconButtonClasses() {\n return {\n ...getButtonClasses(\n this.variant,\n this.outline,\n this.ghost || this.invisible,\n true,\n this.oval,\n this.selected,\n this.disabled\n ),\n 'icon-button': true,\n ...this.getIconSizeClass(),\n };\n }\n\n render() {\n return (\n <Host class={{ ...this.getIconSizeClass(), disabled: this.disabled }}>\n <button class={this.getIconButtonClasses()} type={this.type}>\n <ix-icon size={this.size} name={this.icon} color={this.color} />\n <div style={{ display: 'none' }}>\n <slot></slot>\n </div>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"sFAAA,MAAMA,EAAgB,qvZ,MCoBTC,EAAU,M,sCAIgB,Y,uHAgCK,K,mCAUvB,M,cAKA,M,UAKiB,Q,CAE5BC,mBACN,MAAO,CACL,cAAeC,KAAKC,OAAS,KAC7B,cAAeD,KAAKC,OAAS,KAC7B,cAAeD,KAAKC,OAAS,MAAQD,KAAKC,OAAS,OAASD,KAAKC,K,CAI7DC,uBACN,OAAAC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACKC,EACDL,KAAKM,QACLN,KAAKO,QACLP,KAAKQ,OAASR,KAAKS,UACnB,KACAT,KAAKU,KACLV,KAAKW,SACLX,KAAKY,WACN,CACD,cAAe,OACZZ,KAAKD,mB,CAIZc,SACE,OACEC,EAACC,EAAI,CAACC,MAAKb,OAAAC,OAAAD,OAAAC,OAAA,GAAOJ,KAAKD,oBAAkB,CAAEa,SAAUZ,KAAKY,YACxDE,EAAA,UAAQE,MAAOhB,KAAKE,uBAAwBe,KAAMjB,KAAKiB,MACrDH,EAAA,WAASb,KAAMD,KAAKC,KAAMiB,KAAMlB,KAAKmB,KAAMC,MAAOpB,KAAKoB,QACvDN,EAAA,OAAKO,MAAO,CAAEC,QAAS,SACrBR,EAAA,e"}

package/dist/siemens-ix/{p-77c1e1e7.entry.js → p-eccc2475.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as i,c as t,h as o,H as a,g as r}from"./p-57a5d3d0.js";const c='.sc-ix-chip-h{display:inline-flex;width:-moz-fit-content;width:fit-content;position:relative;align-items:center;border-radius:100px;padding:0.5rem 0.75rem;height:2rem;max-height:2rem;cursor:pointer;margin-left:0.25rem}.sc-ix-chip-h .with-icon.sc-ix-chip{margin-right:0.25rem}.sc-ix-chip-h .hidden.sc-ix-chip{width:0px;margin-right:0px}.sc-ix-chip-h .close-button-container.sc-ix-chip{display:inline-flex;flex-grow:1;margin-left:0.75rem}.sc-ix-chip-h .close-button.sc-ix-chip{position:relative;width:1rem;height:1rem;min-width:unset;min-height:unset;margin-left:auto;margin-right:0}[variant=primary].sc-ix-chip-h{background-color:var(--theme-color-primary);color:var(--theme-chip-primary--color)}[variant=primary].sc-ix-chip-h .close-button.sc-ix-chip{color:var(--theme-chip-primary--color);pointer-events:auto}[variant=primary].sc-ix-chip-h:hover{background-color:var(--theme-chip-primary--background--hover)}[variant=primary].sc-ix-chip-h:active{background-color:var(--theme-chip-primary--background--active)}[variant=primary].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=primary].outline.sc-ix-chip-h{color:var(--theme-chip-primary-outline--color);background-color:transparent;border:solid 1px var(--theme-chip-primary-outline--border-color)}[variant=primary].outline.sc-ix-chip-h .close-button.sc-ix-chip{color:var(--theme-chip-primary-outline--color)}[variant=primary].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-primary-outline--background--hover)}[variant=primary].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-primary-outline--background--active)}[variant=alarm].sc-ix-chip-h{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=alarm].active.sc-ix-chip-h::after,[variant=alarm].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=alarm].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-alarm)}[variant=alarm].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=alarm].sc-ix-chip-h:not(.outline).active::after,[variant=alarm].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=alarm].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-alarm)}[variant=alarm].outline.sc-ix-chip-h:hover::after{display:none}[variant=alarm].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=alarm].outline.active.sc-ix-chip-h::after,[variant=alarm].outline.sc-ix-chip-h:active::after{display:none}[variant=alarm].outline.active.sc-ix-chip-h,[variant=alarm].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=alarm].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=critical].sc-ix-chip-h{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=critical].active.sc-ix-chip-h::after,[variant=critical].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=critical].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-critical)}[variant=critical].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=critical].sc-ix-chip-h:not(.outline).active::after,[variant=critical].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=critical].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-critical)}[variant=critical].outline.sc-ix-chip-h:hover::after{display:none}[variant=critical].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=critical].outline.active.sc-ix-chip-h::after,[variant=critical].outline.sc-ix-chip-h:active::after{display:none}[variant=critical].outline.active.sc-ix-chip-h,[variant=critical].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=critical].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=warning].sc-ix-chip-h{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=warning].active.sc-ix-chip-h::after,[variant=warning].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=warning].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-warning)}[variant=warning].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=warning].sc-ix-chip-h:not(.outline).active::after,[variant=warning].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=warning].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-warning)}[variant=warning].outline.sc-ix-chip-h:hover::after{display:none}[variant=warning].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=warning].outline.active.sc-ix-chip-h::after,[variant=warning].outline.sc-ix-chip-h:active::after{display:none}[variant=warning].outline.active.sc-ix-chip-h,[variant=warning].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=warning].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=info].sc-ix-chip-h{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=info].active.sc-ix-chip-h::after,[variant=info].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=info].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-info)}[variant=info].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=info].sc-ix-chip-h:not(.outline).active::after,[variant=info].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=info].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-info)}[variant=info].outline.sc-ix-chip-h:hover::after{display:none}[variant=info].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=info].outline.active.sc-ix-chip-h::after,[variant=info].outline.sc-ix-chip-h:active::after{display:none}[variant=info].outline.active.sc-ix-chip-h,[variant=info].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=info].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=neutral].sc-ix-chip-h{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=neutral].active.sc-ix-chip-h::after,[variant=neutral].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=neutral].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-neutral)}[variant=neutral].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=neutral].sc-ix-chip-h:not(.outline).active::after,[variant=neutral].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=neutral].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-neutral)}[variant=neutral].outline.sc-ix-chip-h:hover::after{display:none}[variant=neutral].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=neutral].outline.active.sc-ix-chip-h::after,[variant=neutral].outline.sc-ix-chip-h:active::after{display:none}[variant=neutral].outline.active.sc-ix-chip-h,[variant=neutral].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=neutral].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=success].sc-ix-chip-h{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=success].active.sc-ix-chip-h::after,[variant=success].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=success].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-success)}[variant=success].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=success].sc-ix-chip-h:not(.outline).active::after,[variant=success].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=success].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-success)}[variant=success].outline.sc-ix-chip-h:hover::after{display:none}[variant=success].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=success].outline.active.sc-ix-chip-h::after,[variant=success].outline.sc-ix-chip-h:active::after{display:none}[variant=success].outline.active.sc-ix-chip-h,[variant=success].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=success].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=custom].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, var(--theme-l-hover));left:0;border-radius:100px;pointer-events:none}[variant=custom].active.sc-ix-chip-h::after,[variant=custom].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, var(--theme-l-active));left:0;border-radius:100px;pointer-events:none}[variant=custom].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=custom].outline.sc-ix-chip-h{border:solid 1px transparent;background-color:transparent}[variant=custom].outline.sc-ix-chip-h:hover{background-color:rgba(0, 0, 0, var(--theme-l-hover))}[variant=custom].outline.sc-ix-chip-h:active{background-color:rgba(0, 0, 0, var(--theme-l-active))}.sc-ix-chip-h .slot-container.sc-ix-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.inactive.sc-ix-chip-h{pointer-events:none}';const e=class{constructor(o){i(this,o);this.close=t(this,"close",7);this.closeChip=t(this,"closeChip",7);this.variant="primary";this.active=true;this.closable=false;this.icon=undefined;this.background=undefined;this.color=undefined;this.outline=false}getCloseButton(){return o("div",{class:"close-button-container"},o("button",{type:"button",class:"btn btn-invisible-secondary btn-icon btn-oval close-button",onClick:i=>{this.close.emit(i);this.closeChip.emit(i);i.stopPropagation()}},this.variant==="custom"?o("i",{class:"glyph glyph-16 glyph-close-small",style:{color:this.color}}):o("ix-icon",{name:"close-small",size:"16"})))}render(){const i=this.active===false;let t={};if(this.variant==="custom"&&this.outline===false){t={color:this.color,backgroundColor:this.background}}if(this.variant==="custom"&&this.outline===true){t={color:this.color,borderColor:this.background}}return o(a,{class:{outline:this.outline,inactive:i},tabIndex:"-1",title:this.el.textContent,style:Object.assign({},t)},o("ix-icon",{class:{"with-icon":true,hidden:this.icon===undefined||this.icon===""},name:this.icon,size:"24"}),o("span",{class:"slot-container"},o("slot",null)),i===false&&this.closable?this.getCloseButton():null)}get el(){return r(this)}};e.style=c;export{e as ix_chip};
-//# sourceMappingURL=p-77c1e1e7.entry.js.map
+import{r as i,c as t,h as o,H as a,g as r}from"./p-1c64b073.js";const c='.sc-ix-chip-h{display:inline-flex;width:-moz-fit-content;width:fit-content;position:relative;align-items:center;border-radius:100px;padding:0.5rem 0.75rem;height:2rem;max-height:2rem;cursor:pointer;margin-left:0.25rem}.sc-ix-chip-h .with-icon.sc-ix-chip{margin-right:0.25rem}.sc-ix-chip-h .hidden.sc-ix-chip{width:0px;margin-right:0px}.sc-ix-chip-h .close-button-container.sc-ix-chip{display:inline-flex;flex-grow:1;margin-left:0.75rem}.sc-ix-chip-h .close-button.sc-ix-chip{position:relative;width:1rem;height:1rem;min-width:unset;min-height:unset;margin-left:auto;margin-right:0}[variant=primary].sc-ix-chip-h{background-color:var(--theme-color-primary);color:var(--theme-chip-primary--color)}[variant=primary].sc-ix-chip-h .close-button.sc-ix-chip{color:var(--theme-chip-primary--color);pointer-events:auto}[variant=primary].sc-ix-chip-h:hover{background-color:var(--theme-chip-primary--background--hover)}[variant=primary].sc-ix-chip-h:active{background-color:var(--theme-chip-primary--background--active)}[variant=primary].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=primary].outline.sc-ix-chip-h{color:var(--theme-chip-primary-outline--color);background-color:transparent;border:solid 1px var(--theme-chip-primary-outline--border-color)}[variant=primary].outline.sc-ix-chip-h .close-button.sc-ix-chip{color:var(--theme-chip-primary-outline--color)}[variant=primary].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-primary-outline--background--hover)}[variant=primary].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-primary-outline--background--active)}[variant=alarm].sc-ix-chip-h{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=alarm].active.sc-ix-chip-h::after,[variant=alarm].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=alarm].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-alarm)}[variant=alarm].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=alarm].sc-ix-chip-h:not(.outline).active::after,[variant=alarm].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=alarm].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-alarm)}[variant=alarm].outline.sc-ix-chip-h:hover::after{display:none}[variant=alarm].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=alarm].outline.active.sc-ix-chip-h::after,[variant=alarm].outline.sc-ix-chip-h:active::after{display:none}[variant=alarm].outline.active.sc-ix-chip-h,[variant=alarm].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=alarm].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=critical].sc-ix-chip-h{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=critical].active.sc-ix-chip-h::after,[variant=critical].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=critical].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-critical)}[variant=critical].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=critical].sc-ix-chip-h:not(.outline).active::after,[variant=critical].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=critical].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-critical)}[variant=critical].outline.sc-ix-chip-h:hover::after{display:none}[variant=critical].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=critical].outline.active.sc-ix-chip-h::after,[variant=critical].outline.sc-ix-chip-h:active::after{display:none}[variant=critical].outline.active.sc-ix-chip-h,[variant=critical].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=critical].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=warning].sc-ix-chip-h{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=warning].active.sc-ix-chip-h::after,[variant=warning].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=warning].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-warning)}[variant=warning].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=warning].sc-ix-chip-h:not(.outline).active::after,[variant=warning].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=warning].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-warning)}[variant=warning].outline.sc-ix-chip-h:hover::after{display:none}[variant=warning].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=warning].outline.active.sc-ix-chip-h::after,[variant=warning].outline.sc-ix-chip-h:active::after{display:none}[variant=warning].outline.active.sc-ix-chip-h,[variant=warning].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=warning].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=info].sc-ix-chip-h{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=info].active.sc-ix-chip-h::after,[variant=info].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=info].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-info)}[variant=info].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=info].sc-ix-chip-h:not(.outline).active::after,[variant=info].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=info].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-info)}[variant=info].outline.sc-ix-chip-h:hover::after{display:none}[variant=info].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=info].outline.active.sc-ix-chip-h::after,[variant=info].outline.sc-ix-chip-h:active::after{display:none}[variant=info].outline.active.sc-ix-chip-h,[variant=info].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=info].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=neutral].sc-ix-chip-h{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=neutral].active.sc-ix-chip-h::after,[variant=neutral].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=neutral].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-neutral)}[variant=neutral].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=neutral].sc-ix-chip-h:not(.outline).active::after,[variant=neutral].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=neutral].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-neutral)}[variant=neutral].outline.sc-ix-chip-h:hover::after{display:none}[variant=neutral].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=neutral].outline.active.sc-ix-chip-h::after,[variant=neutral].outline.sc-ix-chip-h:active::after{display:none}[variant=neutral].outline.active.sc-ix-chip-h,[variant=neutral].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=neutral].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=success].sc-ix-chip-h{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.05);left:0;border-radius:100px;pointer-events:none}[variant=success].active.sc-ix-chip-h::after,[variant=success].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.1);left:0;border-radius:100px;pointer-events:none}[variant=success].sc-ix-chip-h:not(.outline){background-color:var(--theme-color-success)}[variant=success].sc-ix-chip-h:not(.outline) .close-button.sc-ix-chip{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-chip-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=success].sc-ix-chip-h:not(.outline).active::after,[variant=success].sc-ix-chip-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=success].outline.sc-ix-chip-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-success)}[variant=success].outline.sc-ix-chip-h:hover::after{display:none}[variant=success].outline.sc-ix-chip-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=success].outline.active.sc-ix-chip-h::after,[variant=success].outline.sc-ix-chip-h:active::after{display:none}[variant=success].outline.active.sc-ix-chip-h,[variant=success].outline.sc-ix-chip-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=success].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=custom].sc-ix-chip-h:hover::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, var(--theme-l-hover));left:0;border-radius:100px;pointer-events:none}[variant=custom].active.sc-ix-chip-h::after,[variant=custom].sc-ix-chip-h:active::after{content:"";display:block;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, var(--theme-l-active));left:0;border-radius:100px;pointer-events:none}[variant=custom].sc-ix-chip-h:focus-visible{outline:1px solid #199fff;outline-offset:var(--theme-btn--focus--outline-offset)}[variant=custom].outline.sc-ix-chip-h{border:solid 1px transparent;background-color:transparent}[variant=custom].outline.sc-ix-chip-h:hover{background-color:rgba(0, 0, 0, var(--theme-l-hover))}[variant=custom].outline.sc-ix-chip-h:active{background-color:rgba(0, 0, 0, var(--theme-l-active))}.sc-ix-chip-h .slot-container.sc-ix-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.inactive.sc-ix-chip-h{pointer-events:none}';const e=class{constructor(o){i(this,o);this.close=t(this,"close",7);this.closeChip=t(this,"closeChip",7);this.variant="primary";this.active=true;this.closable=false;this.icon=undefined;this.background=undefined;this.color=undefined;this.outline=false}getCloseButton(){return o("div",{class:"close-button-container"},o("button",{type:"button",class:"btn btn-invisible-secondary btn-icon btn-oval close-button",onClick:i=>{this.close.emit(i);this.closeChip.emit(i);i.stopPropagation()}},this.variant==="custom"?o("i",{class:"glyph glyph-16 glyph-close-small",style:{color:this.color}}):o("ix-icon",{name:"close-small",size:"16"})))}render(){const i=this.active===false;let t={};if(this.variant==="custom"&&this.outline===false){t={color:this.color,backgroundColor:this.background}}if(this.variant==="custom"&&this.outline===true){t={color:this.color,borderColor:this.background}}return o(a,{class:{outline:this.outline,inactive:i},tabIndex:"-1",title:this.el.textContent,style:Object.assign({},t)},o("ix-icon",{class:{"with-icon":true,hidden:this.icon===undefined||this.icon===""},name:this.icon,size:"24"}),o("span",{class:"slot-container"},o("slot",null)),i===false&&this.closable?this.getCloseButton():null)}get el(){return r(this)}};e.style=c;export{e as ix_chip};
+//# sourceMappingURL=p-eccc2475.entry.js.map

package/dist/siemens-ix/{p-c4b1210b.entry.js → p-ecd1145b.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as i}from"./p-57a5d3d0.js";const o='@charset "UTF-8";ix-tab-item{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}ix-tab-item.circle{height:72px}ix-tab-item.top::after{top:0}ix-tab-item.bottom::after{bottom:0}ix-tab-item::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}ix-tab-item.stretched{flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ix-tab-item .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}ix-tab-item .text span,ix-tab-item .text span::before{pointer-events:none}ix-tab-item:hover:not(.circle){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}ix-tab-item:hover:not(.circle)::after{background-color:var(--theme-tab-indicator--background--hover)}ix-tab-item:active:not(.circle){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}ix-tab-item:active:not(.circle)::after{background-color:var(--theme-tab-indicator--background--active)}ix-tab-item:focus-visible{outline:0px solid var(--focus--border-color)}ix-tab-item:focus-visible .circle{outline:1px solid var(--focus--border-color)}ix-tab-item:focus-visible:not(.circle){outline:1px solid var(--focus--border-color)}ix-tab-item.disabled{color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}ix-tab-item.disabled::after{background-color:var(--theme-tab-indicator--background--disabled)}ix-tab-item.selected:not(.disabled){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}ix-tab-item.selected:not(.disabled)::after{background-color:var(--theme-tab-indicator--background--selected)}ix-tab-item.icon{padding:1.5rem 0.5rem}ix-tab-item.small-tab{height:32px;padding:1rem}ix-tab-item.small-tab.icon{padding:1rem 0.25rem}ix-tab-item .circle{display:flex;justify-content:center;align-items:center;height:48px;width:48px;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}ix-tab-item .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}ix-tab-item .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}ix-tab-item .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}ix-tab-item .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:16px;color:var(--theme-pill-outline--color);cursor:pointer}ix-tab-item .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}ix-tab-item .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}ix-tab-item .hidden{display:none}';const r=class{constructor(t){e(this,t);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.counter=undefined;this.layout="auto";this.placement="bottom"}tabItemClasses(e){return{selected:e.selected,disabled:e.disabled,"small-tab":e.small,icon:e.small,stretched:e.layout==="stretched",bottom:e.placement==="bottom",top:e.placement==="top",circle:e.circle}}render(){return t(i,{class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0},t("div",{class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},t("slot",null)),t("div",{class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};r.style=o;export{r as ix_tab_item};
-//# sourceMappingURL=p-c4b1210b.entry.js.map
+import{r as e,h as t,H as i}from"./p-1c64b073.js";const o='@charset "UTF-8";ix-tab-item{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}ix-tab-item.circle{height:72px}ix-tab-item.top::after{top:0}ix-tab-item.bottom::after{bottom:0}ix-tab-item::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}ix-tab-item.stretched{flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ix-tab-item .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}ix-tab-item .text span,ix-tab-item .text span::before{pointer-events:none}ix-tab-item:hover:not(.circle){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}ix-tab-item:hover:not(.circle)::after{background-color:var(--theme-tab-indicator--background--hover)}ix-tab-item:active:not(.circle){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}ix-tab-item:active:not(.circle)::after{background-color:var(--theme-tab-indicator--background--active)}ix-tab-item:focus-visible{outline:0px solid var(--focus--border-color)}ix-tab-item:focus-visible .circle{outline:1px solid var(--focus--border-color)}ix-tab-item:focus-visible:not(.circle){outline:1px solid var(--focus--border-color)}ix-tab-item.disabled{color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}ix-tab-item.disabled::after{background-color:var(--theme-tab-indicator--background--disabled)}ix-tab-item.selected:not(.disabled){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}ix-tab-item.selected:not(.disabled)::after{background-color:var(--theme-tab-indicator--background--selected)}ix-tab-item.icon{padding:1.5rem 0.5rem}ix-tab-item.small-tab{height:32px;padding:1rem}ix-tab-item.small-tab.icon{padding:1rem 0.25rem}ix-tab-item .circle{display:flex;justify-content:center;align-items:center;height:48px;width:48px;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}ix-tab-item .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}ix-tab-item .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}ix-tab-item .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}ix-tab-item .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:16px;color:var(--theme-pill-outline--color);cursor:pointer}ix-tab-item .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}ix-tab-item .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}ix-tab-item .hidden{display:none}';const r=class{constructor(t){e(this,t);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.counter=undefined;this.layout="auto";this.placement="bottom"}tabItemClasses(e){return{selected:e.selected,disabled:e.disabled,"small-tab":e.small,icon:e.small,stretched:e.layout==="stretched",bottom:e.placement==="bottom",top:e.placement==="top",circle:e.circle}}render(){return t(i,{class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0},t("div",{class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},t("slot",null)),t("div",{class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};r.style=o;export{r as ix_tab_item};
+//# sourceMappingURL=p-ecd1145b.entry.js.map