@siemens/ix 2.1.1-beta.0 → 2.1.2-beta.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 (72) hide show
  1. package/components/dropdown.js +5 -3
  2. package/components/dropdown.js.map +1 -1
  3. package/components/ix-blind.js +7 -7
  4. package/components/ix-blind.js.map +1 -1
  5. package/components/ix-modal-footer.js +1 -1
  6. package/components/ix-modal-footer.js.map +1 -1
  7. package/components/ix-modal.js +1 -1
  8. package/components/ix-modal.js.map +1 -1
  9. package/components/menu-avatar-item.js +1 -1
  10. package/components/menu-avatar-item.js.map +1 -1
  11. package/components/modal-content.js +1 -1
  12. package/components/modal-content.js.map +1 -1
  13. package/components/modal-header.js +1 -1
  14. package/components/modal-header.js.map +1 -1
  15. package/dist/cjs/ix-avatar_2.cjs.entry.js +1 -1
  16. package/dist/cjs/ix-avatar_2.cjs.entry.js.map +1 -1
  17. package/dist/cjs/ix-blind.cjs.entry.js +7 -7
  18. package/dist/cjs/ix-blind.cjs.entry.js.map +1 -1
  19. package/dist/cjs/ix-dropdown.cjs.entry.js +5 -3
  20. package/dist/cjs/ix-dropdown.cjs.entry.js.map +1 -1
  21. package/dist/cjs/ix-modal-content_2.cjs.entry.js +2 -2
  22. package/dist/cjs/ix-modal-content_2.cjs.entry.js.map +1 -1
  23. package/dist/cjs/ix-modal-footer.cjs.entry.js +1 -1
  24. package/dist/cjs/ix-modal-footer.cjs.entry.js.map +1 -1
  25. package/dist/cjs/ix-modal.cjs.entry.js +1 -1
  26. package/dist/cjs/ix-modal.cjs.entry.js.map +1 -1
  27. package/dist/collection/components/blind/blind.css +0 -1
  28. package/dist/collection/components/blind/blind.js +6 -6
  29. package/dist/collection/components/blind/blind.js.map +1 -1
  30. package/dist/collection/components/dropdown/dropdown.js +5 -3
  31. package/dist/collection/components/dropdown/dropdown.js.map +1 -1
  32. package/dist/collection/components/menu-avatar-item/menu-avatar-item.css +3 -1
  33. package/dist/collection/components/modal/modal.css +5 -4
  34. package/dist/collection/components/modal-content/modal-content.css +1 -1
  35. package/dist/collection/components/modal-footer/modal-footer.css +1 -2
  36. package/dist/collection/components/modal-header/modal-header.css +2 -2
  37. package/dist/collection/tests/blind/blind.e2e.js +4 -0
  38. package/dist/collection/tests/blind/blind.e2e.js.map +1 -1
  39. package/dist/esm/ix-avatar_2.entry.js +1 -1
  40. package/dist/esm/ix-avatar_2.entry.js.map +1 -1
  41. package/dist/esm/ix-blind.entry.js +7 -7
  42. package/dist/esm/ix-blind.entry.js.map +1 -1
  43. package/dist/esm/ix-dropdown.entry.js +5 -3
  44. package/dist/esm/ix-dropdown.entry.js.map +1 -1
  45. package/dist/esm/ix-modal-content_2.entry.js +2 -2
  46. package/dist/esm/ix-modal-content_2.entry.js.map +1 -1
  47. package/dist/esm/ix-modal-footer.entry.js +1 -1
  48. package/dist/esm/ix-modal-footer.entry.js.map +1 -1
  49. package/dist/esm/ix-modal.entry.js +1 -1
  50. package/dist/esm/ix-modal.entry.js.map +1 -1
  51. package/dist/siemens-ix/p-04ba3c79.entry.js +2 -0
  52. package/dist/siemens-ix/p-04ba3c79.entry.js.map +1 -0
  53. package/dist/siemens-ix/p-16d529ee.entry.js +2 -0
  54. package/dist/siemens-ix/p-16d529ee.entry.js.map +1 -0
  55. package/dist/siemens-ix/{p-1aa9c005.entry.js → p-4ca6beed.entry.js} +2 -2
  56. package/dist/siemens-ix/{p-1aa9c005.entry.js.map → p-4ca6beed.entry.js.map} +1 -1
  57. package/dist/siemens-ix/p-b6c75dc3.entry.js +2 -0
  58. package/dist/siemens-ix/p-b6c75dc3.entry.js.map +1 -0
  59. package/dist/siemens-ix/p-c98d8ec2.entry.js +2 -0
  60. package/dist/siemens-ix/p-c98d8ec2.entry.js.map +1 -0
  61. package/dist/siemens-ix/{p-22a792da.entry.js → p-e23cd82e.entry.js} +2 -2
  62. package/dist/siemens-ix/{p-22a792da.entry.js.map → p-e23cd82e.entry.js.map} +1 -1
  63. package/dist/siemens-ix/siemens-ix.esm.js +1 -1
  64. package/package.json +1 -1
  65. package/dist/siemens-ix/p-5dd97d39.entry.js +0 -2
  66. package/dist/siemens-ix/p-5dd97d39.entry.js.map +0 -1
  67. package/dist/siemens-ix/p-5f74fc83.entry.js +0 -2
  68. package/dist/siemens-ix/p-5f74fc83.entry.js.map +0 -1
  69. package/dist/siemens-ix/p-b4e3a4fd.entry.js +0 -2
  70. package/dist/siemens-ix/p-b4e3a4fd.entry.js.map +0 -1
  71. package/dist/siemens-ix/p-d6e7e5da.entry.js +0 -2
  72. package/dist/siemens-ix/p-d6e7e5da.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"names":["hasDropdownItemWrapperImplemented","item","getDropdownItemElement","undefined","DropdownController","constructor","this","dropdowns","Map","submenuIds","isWindowListenerActive","connected","dropdown","addOverlayListeners","set","getId","discoverAllSubmenus","discoverSubmenus","disconnected","delete","forEach","discoverSubmenu","present","isPresent","willPresent","getAssignedSubmenuIds","dismissChildren","uid","childIds","id","dismiss","get","willDismiss","dismissAll","ignoreBehaviorForIds","includes","closeBehavior","dismissOthers","path","buildComposedPath","Set","has","pathIncludesTrigger","eventTargets","eventTarget","HTMLElement","hasAttribute","pathIncludesDropdown","find","element","tagName","add","ruleKey","Object","keys","key","window","addEventListener","event","hasTrigger","composedPath","hasDropdown","addDisposableEventListener","eventType","callback","removeEventListener","dropdownController","dropdownCss","IxDropdownStyle0","sequenceId","Dropdown","autoUpdateCleanup","localUId","assignedSubmenu","connectedCallback","cacheSubmenuId","stopImmediatePropagation","preventDefault","detail","indexOf","push","disconnectedCallback","_a","disposeListener","call","show","defaultPrevented","showChanged","emit","dropdownItems","Array","from","hostElement","querySelectorAll","slotElement","shadowRoot","querySelector","addEventListenersFor","toggleController","triggerElement","_b","setAttribute","dispatchEvent","CustomEvent","bubbles","composed","cancelable","registerListener","resolveElement","el","findElement","checkForSubmenuAnchor","dropdownItem","isSubMenu","style","zIndex","Promise","resolve","selector","document","observer","MutationObserver","disconnect","observe","body","childList","subtree","changedShow","newShow","anchorElement","anchor","trigger","applyDropdownPosition","changedTrigger","newTriggerValue","isAnchorSubmenu","closest","dropdownRef","isSubmenu","positionConfig","strategy","positioningStrategy","middleware","suppressAutomaticPlacement","flip","fallbackStrategy","placement","inline","shift","offset","autoUpdate","async","computeResponse","computePosition","assign","top","left","transform","Math","round","x","y","overwriteDropdownStyle","overwriteStyle","triggerRef","ancestorResize","ancestorScroll","elementResize","componentDidLoad","componentDidRender","isTriggerElement","onDropdownClick","target","updatePosition","render","h","Host","ref","class","overflow","margin","minWidth","position","role","onClick","display","header"],"sources":["src/components/dropdown/dropdown-controller.ts","src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { IxComponent } from '../utils/internal';\nexport type CloseBehavior = 'inside' | 'outside' | 'both' | boolean;\n\nexport interface DropdownInterface extends IxComponent {\n closeBehavior: CloseBehavior;\n discoverAllSubmenus: boolean;\n\n getAssignedSubmenuIds(): string[];\n getId(): string;\n\n discoverSubmenu(): void;\n\n isPresent(): boolean;\n\n willPresent?(): boolean;\n willDismiss?(): boolean;\n\n present(): void;\n dismiss(): void;\n}\n\nexport function hasDropdownItemWrapperImplemented(\n item: unknown\n): item is DropdownItemWrapper {\n return (\n item &&\n (item as DropdownItemWrapper).getDropdownItemElement !== undefined &&\n typeof (item as DropdownItemWrapper).getDropdownItemElement === 'function'\n );\n}\n\nexport interface DropdownItemWrapper {\n getDropdownItemElement(): Promise<HTMLIxDropdownItemElement>;\n}\n\ntype SubmenuIds = Record<string, string[]>;\n\nclass DropdownController {\n private dropdowns: Map<string, DropdownInterface> = new Map<\n string,\n DropdownInterface\n >();\n private submenuIds: SubmenuIds = {};\n\n private isWindowListenerActive = false;\n\n connected(dropdown: DropdownInterface) {\n if (!this.isWindowListenerActive) {\n this.addOverlayListeners();\n }\n this.dropdowns.set(dropdown.getId(), dropdown);\n\n if (dropdown.discoverAllSubmenus) {\n this.discoverSubmenus();\n }\n }\n\n disconnected(dropdown: DropdownInterface) {\n this.dropdowns.delete(dropdown.getId());\n }\n\n discoverSubmenus() {\n this.dropdowns.forEach((dropdown) => {\n dropdown.discoverSubmenu();\n });\n }\n\n present(dropdown: DropdownInterface) {\n if (!dropdown.isPresent() && dropdown.willPresent()) {\n this.submenuIds[dropdown.getId()] = dropdown.getAssignedSubmenuIds();\n dropdown.present();\n }\n }\n\n dismissChildren(uid: string) {\n const childIds = this.submenuIds[uid] || [];\n for (const id of childIds) {\n this.dismiss(this.dropdowns.get(id));\n }\n }\n\n dismiss(dropdown: DropdownInterface) {\n if (dropdown.isPresent() && dropdown.willDismiss()) {\n this.dismissChildren(dropdown.getId());\n dropdown.dismiss();\n delete this.submenuIds[dropdown.getId()];\n }\n }\n\n dismissAll(ignoreBehaviorForIds: string[] = []) {\n this.dropdowns.forEach((dropdown) => {\n if (\n !ignoreBehaviorForIds.includes(dropdown.getId()) &&\n (dropdown.closeBehavior === 'inside' ||\n dropdown.closeBehavior === false)\n ) {\n return;\n }\n\n this.dismiss(dropdown);\n });\n }\n\n dismissOthers(uid: string) {\n let path = this.buildComposedPath(uid, new Set<string>());\n\n this.dropdowns.forEach((dropdown) => {\n if (\n dropdown.closeBehavior !== 'inside' &&\n dropdown.closeBehavior !== false &&\n !path.has(dropdown.getId())\n ) {\n this.dismiss(dropdown);\n }\n });\n }\n\n pathIncludesTrigger(eventTargets: EventTarget[]) {\n for (let eventTarget of eventTargets) {\n if (eventTarget instanceof HTMLElement) {\n if (eventTarget.hasAttribute('data-ix-dropdown-trigger')) {\n return true;\n }\n }\n }\n\n return false;\n }\n\n private pathIncludesDropdown(eventTargets: EventTarget[]) {\n return !!eventTargets.find(\n (element: HTMLElement) => element.tagName === 'IX-DROPDOWN'\n );\n }\n\n private buildComposedPath(id: string, path: Set<string>): Set<string> {\n if (this.submenuIds[id]) {\n path.add(id);\n }\n\n for (const ruleKey of Object.keys(this.submenuIds)) {\n if (this.submenuIds[ruleKey].includes(id)) {\n this.buildComposedPath(ruleKey, path).forEach((key) => path.add(key));\n }\n }\n\n return path;\n }\n\n private addOverlayListeners() {\n this.isWindowListenerActive = true;\n\n window.addEventListener('click', (event: PointerEvent) => {\n const hasTrigger = this.pathIncludesTrigger(event.composedPath());\n const hasDropdown = this.pathIncludesDropdown(event.composedPath());\n\n if (!hasTrigger && !hasDropdown) {\n this.dismissAll();\n }\n });\n\n window.addEventListener('keydown', (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.dismissAll([...this.dropdowns.keys()]);\n }\n });\n }\n}\n\nexport const addDisposableEventListener = (\n element: Element | Window | Document,\n eventType: string,\n callback: EventListenerOrEventListenerObject\n) => {\n element.addEventListener(eventType, callback);\n\n return () => {\n element.removeEventListener(eventType, callback);\n };\n};\n\nexport const addDisposableEventListenerAsArray = (\n listener: {\n element: Element | Window | Document;\n eventType: string;\n callback: EventListenerOrEventListenerObject;\n }[]\n) => {\n const disposables = listener.map(({ callback, element, eventType }) =>\n addDisposableEventListener(element, eventType, callback)\n );\n\n return () => disposables.forEach((dispose) => dispose());\n};\n\nexport const dropdownController = new DropdownController();\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\n@import 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n background-color: var(--theme-color-2);\n border-radius: var(--theme-default-border-radius);\n @include ix-component;\n min-width: 0px;\n z-index: var(--theme-z-index-dropdown);\n box-shadow: var(--theme-shadow-4);\n\n padding: 0.25rem 0px;\n\n .dropdown-header {\n display: flex;\n align-items: center;\n height: $large-control-height;\n color: var(--theme-menu-header--color);\n padding: 0 $default-space;\n }\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n\n:host(:not(.show)) {\n display: 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 autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport {\n addDisposableEventListener,\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Suppress the automatic placement of the dropdown.\n *\n * @since 2.0.0\n */\n @Prop() suppressAutomaticPlacement = false;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement | Promise<HTMLElement>;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n */\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * @internal\n * If initialisation of this dropdown is expected to be defered submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n */\n @Prop() discoverAllSubmenus = false;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n connectedCallback(): void {\n dropdownController.connected(this);\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n this.disposeListener?.();\n dropdownController.disconnected(this);\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private disposeListener?: Function;\n\n private addEventListenersFor() {\n this.disposeListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n this.disposeListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: PointerEvent) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /** @internal */\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: false,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private async registerListener(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n const el = await this.findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element: Element) {\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private findElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ): Promise<Element> {\n if (element instanceof Promise) {\n return element;\n }\n\n if (typeof element === 'object') {\n return Promise.resolve(element);\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n // await this.checkForSubmenuAnchor();\n }\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: string | HTMLElement | Promise<HTMLElement>) {\n this.registerListener(newTriggerValue);\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n if (dropdownController.pathIncludesTrigger(event.composedPath())) {\n event.preventDefault();\n\n if (this.isTriggerElement(event.target as HTMLElement)) {\n return;\n }\n }\n\n if (this.closeBehavior === 'inside' || this.closeBehavior === 'both') {\n dropdownController.dismissAll([this.getId()]);\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"names":["hasDropdownItemWrapperImplemented","item","getDropdownItemElement","undefined","DropdownController","constructor","this","dropdowns","Map","submenuIds","isWindowListenerActive","connected","dropdown","addOverlayListeners","set","getId","discoverAllSubmenus","discoverSubmenus","disconnected","delete","forEach","discoverSubmenu","present","isPresent","willPresent","getAssignedSubmenuIds","dismissChildren","uid","childIds","id","dismiss","get","willDismiss","dismissAll","ignoreBehaviorForIds","includes","closeBehavior","dismissOthers","path","buildComposedPath","Set","has","pathIncludesTrigger","eventTargets","eventTarget","HTMLElement","hasAttribute","pathIncludesDropdown","find","element","tagName","add","ruleKey","Object","keys","key","window","addEventListener","event","hasTrigger","composedPath","hasDropdown","addDisposableEventListener","eventType","callback","removeEventListener","dropdownController","dropdownCss","IxDropdownStyle0","sequenceId","Dropdown","autoUpdateCleanup","localUId","assignedSubmenu","connectedCallback","cacheSubmenuId","stopImmediatePropagation","preventDefault","detail","indexOf","push","disconnectedCallback","_a","disposeListener","call","show","defaultPrevented","showChanged","emit","dropdownItems","Array","from","hostElement","querySelectorAll","slotElement","shadowRoot","querySelector","addEventListenersFor","toggleController","triggerElement","_b","setAttribute","dispatchEvent","CustomEvent","bubbles","composed","cancelable","registerListener","resolveElement","el","findElement","checkForSubmenuAnchor","dropdownItem","isSubMenu","style","zIndex","Promise","resolve","selector","document","observer","MutationObserver","disconnect","observe","body","childList","subtree","changedShow","newShow","anchorElement","anchor","trigger","applyDropdownPosition","changedTrigger","newTriggerValue","isAnchorSubmenu","closest","dropdownRef","isSubmenu","positionConfig","strategy","positioningStrategy","middleware","suppressAutomaticPlacement","flip","fallbackStrategy","placement","inline","shift","offset","autoUpdate","async","computeResponse","computePosition","assign","top","left","transform","Math","round","x","y","overwriteDropdownStyle","overwriteStyle","triggerRef","ancestorResize","ancestorScroll","elementResize","componentDidLoad","componentDidRender","isTriggerElement","onDropdownClick","target","updatePosition","render","h","Host","ref","class","overflow","margin","minWidth","position","role","onClick","display","header"],"sources":["src/components/dropdown/dropdown-controller.ts","src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { IxComponent } from '../utils/internal';\nexport type CloseBehavior = 'inside' | 'outside' | 'both' | boolean;\n\nexport interface DropdownInterface extends IxComponent {\n closeBehavior: CloseBehavior;\n discoverAllSubmenus: boolean;\n\n getAssignedSubmenuIds(): string[];\n getId(): string;\n\n discoverSubmenu(): void;\n\n isPresent(): boolean;\n\n willPresent?(): boolean;\n willDismiss?(): boolean;\n\n present(): void;\n dismiss(): void;\n}\n\nexport function hasDropdownItemWrapperImplemented(\n item: unknown\n): item is DropdownItemWrapper {\n return (\n item &&\n (item as DropdownItemWrapper).getDropdownItemElement !== undefined &&\n typeof (item as DropdownItemWrapper).getDropdownItemElement === 'function'\n );\n}\n\nexport interface DropdownItemWrapper {\n getDropdownItemElement(): Promise<HTMLIxDropdownItemElement>;\n}\n\ntype SubmenuIds = Record<string, string[]>;\n\nclass DropdownController {\n private dropdowns: Map<string, DropdownInterface> = new Map<\n string,\n DropdownInterface\n >();\n private submenuIds: SubmenuIds = {};\n\n private isWindowListenerActive = false;\n\n connected(dropdown: DropdownInterface) {\n if (!this.isWindowListenerActive) {\n this.addOverlayListeners();\n }\n this.dropdowns.set(dropdown.getId(), dropdown);\n\n if (dropdown.discoverAllSubmenus) {\n this.discoverSubmenus();\n }\n }\n\n disconnected(dropdown: DropdownInterface) {\n this.dropdowns.delete(dropdown.getId());\n }\n\n discoverSubmenus() {\n this.dropdowns.forEach((dropdown) => {\n dropdown.discoverSubmenu();\n });\n }\n\n present(dropdown: DropdownInterface) {\n if (!dropdown.isPresent() && dropdown.willPresent()) {\n this.submenuIds[dropdown.getId()] = dropdown.getAssignedSubmenuIds();\n dropdown.present();\n }\n }\n\n dismissChildren(uid: string) {\n const childIds = this.submenuIds[uid] || [];\n for (const id of childIds) {\n this.dismiss(this.dropdowns.get(id));\n }\n }\n\n dismiss(dropdown: DropdownInterface) {\n if (dropdown.isPresent() && dropdown.willDismiss()) {\n this.dismissChildren(dropdown.getId());\n dropdown.dismiss();\n delete this.submenuIds[dropdown.getId()];\n }\n }\n\n dismissAll(ignoreBehaviorForIds: string[] = []) {\n this.dropdowns.forEach((dropdown) => {\n if (\n !ignoreBehaviorForIds.includes(dropdown.getId()) &&\n (dropdown.closeBehavior === 'inside' ||\n dropdown.closeBehavior === false)\n ) {\n return;\n }\n\n this.dismiss(dropdown);\n });\n }\n\n dismissOthers(uid: string) {\n let path = this.buildComposedPath(uid, new Set<string>());\n\n this.dropdowns.forEach((dropdown) => {\n if (\n dropdown.closeBehavior !== 'inside' &&\n dropdown.closeBehavior !== false &&\n !path.has(dropdown.getId())\n ) {\n this.dismiss(dropdown);\n }\n });\n }\n\n pathIncludesTrigger(eventTargets: EventTarget[]) {\n for (let eventTarget of eventTargets) {\n if (eventTarget instanceof HTMLElement) {\n if (eventTarget.hasAttribute('data-ix-dropdown-trigger')) {\n return true;\n }\n }\n }\n\n return false;\n }\n\n private pathIncludesDropdown(eventTargets: EventTarget[]) {\n return !!eventTargets.find(\n (element: HTMLElement) => element.tagName === 'IX-DROPDOWN'\n );\n }\n\n private buildComposedPath(id: string, path: Set<string>): Set<string> {\n if (this.submenuIds[id]) {\n path.add(id);\n }\n\n for (const ruleKey of Object.keys(this.submenuIds)) {\n if (this.submenuIds[ruleKey].includes(id)) {\n this.buildComposedPath(ruleKey, path).forEach((key) => path.add(key));\n }\n }\n\n return path;\n }\n\n private addOverlayListeners() {\n this.isWindowListenerActive = true;\n\n window.addEventListener('click', (event: PointerEvent) => {\n const hasTrigger = this.pathIncludesTrigger(event.composedPath());\n const hasDropdown = this.pathIncludesDropdown(event.composedPath());\n\n if (!hasTrigger && !hasDropdown) {\n this.dismissAll();\n }\n });\n\n window.addEventListener('keydown', (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.dismissAll([...this.dropdowns.keys()]);\n }\n });\n }\n}\n\nexport const addDisposableEventListener = (\n element: Element | Window | Document,\n eventType: string,\n callback: EventListenerOrEventListenerObject\n) => {\n element.addEventListener(eventType, callback);\n\n return () => {\n element.removeEventListener(eventType, callback);\n };\n};\n\nexport const addDisposableEventListenerAsArray = (\n listener: {\n element: Element | Window | Document;\n eventType: string;\n callback: EventListenerOrEventListenerObject;\n }[]\n) => {\n const disposables = listener.map(({ callback, element, eventType }) =>\n addDisposableEventListener(element, eventType, callback)\n );\n\n return () => disposables.forEach((dispose) => dispose());\n};\n\nexport const dropdownController = new DropdownController();\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\n@import 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n background-color: var(--theme-color-2);\n border-radius: var(--theme-default-border-radius);\n @include ix-component;\n min-width: 0px;\n z-index: var(--theme-z-index-dropdown);\n box-shadow: var(--theme-shadow-4);\n\n padding: 0.25rem 0px;\n\n .dropdown-header {\n display: flex;\n align-items: center;\n height: $large-control-height;\n color: var(--theme-menu-header--color);\n padding: 0 $default-space;\n }\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n\n:host(:not(.show)) {\n display: 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 autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport {\n addDisposableEventListener,\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Suppress the automatic placement of the dropdown.\n *\n * @since 2.0.0\n */\n @Prop() suppressAutomaticPlacement = false;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement | Promise<HTMLElement>;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n */\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * @internal\n * If initialisation of this dropdown is expected to be defered submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n */\n @Prop() discoverAllSubmenus = false;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n connectedCallback(): void {\n dropdownController.connected(this);\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n this.disposeListener?.();\n dropdownController.disconnected(this);\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private disposeListener?: Function;\n\n private addEventListenersFor() {\n this.disposeListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n this.disposeListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: PointerEvent) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /** @internal */\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: false,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private async registerListener(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n const el = await this.findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element: Element) {\n if (!element) {\n return null;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private findElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ): Promise<Element> {\n if (element instanceof Promise) {\n return element;\n }\n\n if (typeof element === 'object') {\n return Promise.resolve(element);\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: string | HTMLElement | Promise<HTMLElement>) {\n this.registerListener(newTriggerValue);\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n if (dropdownController.pathIncludesTrigger(event.composedPath())) {\n event.preventDefault();\n\n if (this.isTriggerElement(event.target as HTMLElement)) {\n return;\n }\n }\n\n if (this.closeBehavior === 'inside' || this.closeBehavior === 'both') {\n dropdownController.dismissAll([this.getId()]);\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{r as e,c as i,h as o,F as t,H as d,g as l}from"./p-ea80cb61.js";import{a}from"./p-810b5232.js";import{a as r}from"./p-4f8ac3bf.js";const n=":host{display:flex;flex-direction:column;border-radius:var(--theme-blind--border-radius);overflow:hidden}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .blind-header-wrapper{display:block;position:relative;width:100%;min-height:3rem;height:3rem;overflow:hidden}:host .blind-header-content{display:flex;position:relative;align-items:center;justify-content:flex-start;width:100%;height:100%;pointer-events:none;padding-left:0.5rem}:host .blind-header-title{display:flex;position:relative;align-items:center;flex-grow:1;flex-shrink:0;margin-right:1rem}:host .blind-header{all:unset;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;position:absolute;top:0px;left:0px;pointer-events:all;padding-left:2.5rem;min-height:3rem;height:3rem;width:calc(100% - 2 * var(--theme-blind--border-thickness));border:solid var(--theme-blind--border-thickness) transparent;border-radius:var(--theme-blind--border-radius) var(--theme-blind--border-radius) 0 0;cursor:pointer}:host .blind-header:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr);outline:none}:host .blind-header-title-icon,:host .collapse-icon{margin-right:0.5rem}:host .blind-header-title-row{display:flex;flex-grow:1}:host .blind-header-title-col{flex-grow:1;flex-basis:0;display:inline-flex;align-items:center;min-width:0}:host .blind-header-title-col:not(:first-of-type){justify-content:flex-end}:host ix-typography{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .blind-header-title-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline-end:0.5rem}:host .blind-header-title-sublabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline:0.5rem}:host .blind-header-title{display:flex;align-items:center;flex-grow:1;height:100%;min-width:0}:host .blind-header-labels{display:inline-flex;flex-grow:1;min-width:0}:host .blind-content{display:block;padding:1rem;transition-property:padding;transition-duration:150ms;transition-timing-function:ease-in}:host .blind-content.hide{max-height:0;padding-top:0px;padding-bottom:0px}:host .header-actions{pointer-events:all}:host(.blind-alarm){background-color:var(--theme-blind-base--background)}:host(.blind-alarm) .blind-header{background-color:var(--theme-color-alarm)}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-alarm--hover)}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-alarm--active)}:host(.blind-alarm) .blind-header-title-label,:host(.blind-alarm) .blind-header-title-sublabel{color:var(--theme-color-alarm--contrast)}:host(.blind-critical){background-color:var(--theme-blind-base--background)}:host(.blind-critical) .blind-header{background-color:var(--theme-color-critical)}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-critical--hover)}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-critical) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-critical--active)}:host(.blind-critical) .blind-header-title-label,:host(.blind-critical) .blind-header-title-sublabel{color:var(--theme-color-critical--contrast)}:host(.blind-info){background-color:var(--theme-blind-base--background)}:host(.blind-info) .blind-header{background-color:var(--theme-color-info)}:host(.blind-info) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-info) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-info--hover)}:host(.blind-info) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-info) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-info) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-info--active)}:host(.blind-info) .blind-header-title-label,:host(.blind-info) .blind-header-title-sublabel{color:var(--theme-color-info--contrast)}:host(.blind-insight){background-color:var(--theme-blind-base--background)}:host(.blind-insight) .blind-header{background-color:var(--theme-color-insight)}:host(.blind-insight) .blind-header:not(.disabled):not(:disabled).hover,:host(.blind-insight) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host(.blind-insight) .blind-header:not(.disabled):not(:disabled).active,:host(.blind-insight) .blind-header:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host(.blind-insight) .blind-header-title-label{color:var(--theme-color-std-text)}:host(.blind-insight) .blind-header-title-sublabel{color:var(--theme-color-soft-text)}:host(.blind-neutral){background-color:var(--theme-blind-base--background)}:host(.blind-neutral) .blind-header{background-color:var(--theme-color-neutral)}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-neutral--hover)}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-neutral--active)}:host(.blind-neutral) .blind-header-title-label,:host(.blind-neutral) .blind-header-title-sublabel{color:var(--theme-color-neutral--contrast)}:host(.blind-notification){background-color:var(--theme-blind-base--background)}:host(.blind-notification) .blind-header{background-color:var(--theme-color-notification)}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-notification--hover)}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-notification) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-notification--active)}:host(.blind-notification) .blind-header-title-label,:host(.blind-notification) .blind-header-title-sublabel{color:var(--theme-color-notification--contrast)}:host(.blind-success){background-color:var(--theme-blind-base--background)}:host(.blind-success) .blind-header{background-color:var(--theme-color-success)}:host(.blind-success) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-success) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-success--hover)}:host(.blind-success) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-success) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-success) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-success--active)}:host(.blind-success) .blind-header-title-label,:host(.blind-success) .blind-header-title-sublabel{color:var(--theme-color-success--contrast)}:host(.blind-warning){background-color:var(--theme-blind-base--background)}:host(.blind-warning) .blind-header{background-color:var(--theme-color-warning)}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-warning--hover)}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-warning) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-warning--active)}:host(.blind-warning) .blind-header-title-label,:host(.blind-warning) .blind-header-title-sublabel{color:var(--theme-color-warning--contrast)}:host(.blind-primary){background-color:var(--theme-blind-base--background)}:host(.blind-primary) .blind-header{background-color:var(--theme-color-primary)}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-primary--hover)}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-primary) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-primary--active)}:host(.blind-primary) .blind-header-title-label,:host(.blind-primary) .blind-header-title-sublabel{color:var(--theme-color-primary--contrast)}:host(.blind-outline){border:solid var(--theme-blind--border-thickness) var(--theme-blind-base--border-color);border-color:var(--theme-color-soft-bdr)}:host(.blind-outline) .blind-header{background-color:var(--theme-color-ghost)}:host(.blind-outline) .blind-header:not(.disabled):not(:disabled).hover,:host(.blind-outline) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host(.blind-outline) .blind-header:not(.disabled):not(:disabled).active,:host(.blind-outline) .blind-header:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host(.blind-outline) .blind-header-title-label{color:var(--theme-color-std-text)}:host(.blind-outline) .blind-header-title-sublabel{color:var(--theme-color-soft-text)}";const s=n;let b=0;const h=class{constructor(o){e(this,o);this.collapsedChange=i(this,"collapsedChange",7);this.blindId=++b;this.collapsed=false;this.label=undefined;this.sublabel=undefined;this.icon=undefined;this.variant="insight"}onHeaderClick(){this.collapsed=!this.collapsed;this.collapsedChange.emit(this.collapsed)}componentDidLoad(){this.animateCollapse(this.collapsed)}get content(){return this.hostElement.shadowRoot.querySelector(".blind-content")}animation(e){this.animateCollapse(e)}animateCollapse(e){if(e){this.rotateChevronRight()}else{this.rotateChevronDown()}}rotateChevronDown(){a({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:90});a({targets:this.content,duration:150,easing:"easeInOutSine",opacity:1})}rotateChevronRight(){a({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:0});a({targets:this.content,duration:150,easing:"easeInOutSine",opacity:0})}render(){return o(d,{key:"fa737e290302d9121790574a4a88738a0be492a6",class:{[`blind-${this.variant}`]:true}},o("div",{key:"a30152172426864588f8482a8f94f437948c74a4",class:"blind-header-wrapper"},o("button",{key:"2d4c31d29ae45a44cb4da28d4671eec4e4293ffe",class:{"blind-header":true,[`blind-${this.variant}`]:true,closed:this.collapsed},type:"button","aria-labelledby":`ix-blind-header-title-${this.blindId}`,"aria-controls":`ix-blind-content-section-${this.blindId}`,"aria-expanded":r(!this.collapsed),onClick:()=>this.onHeaderClick()},o("slot",{key:"6b43c8e46273edbe85478df6417d0e4814bb96d8",name:"custom-header"})),o("div",{key:"a8365629f6a68d360959bd5d12cbb56989c1584a",class:"blind-header-content"},o("ix-icon",{key:"3f326906e7318a857ca360c3cdbc1e05d7f10d3d",class:"collapse-icon",name:"chevron-right-small",color:this.variant==="insight"||this.variant==="outline"?"color-primary":`color-${this.variant}--contrast`,ref:e=>this.chevronRef=e}),o("div",{key:"3fd27a4637f4ce37a0d430b2c7b0a0f12fa12539",class:"blind-header-title",id:`ix-blind-header-title-${this.blindId}`},this.label!==undefined?o(t,null,this.icon&&o("ix-icon",{class:"blind-header-title-icon",name:this.icon,color:this.variant==="insight"||this.variant==="outline"?"color-std-text":`color-${this.variant}--contrast`}),o("div",{class:"blind-header-title-row"},o("div",{class:"blind-header-title-col"},o("ix-typography",{title:this.label,format:"label-lg",bold:true},o("div",{class:"blind-header-title-label",title:this.label},this.label))),this.sublabel&&o("div",{class:"blind-header-title-col"},o("ix-typography",{title:this.sublabel},o("div",{class:"blind-header-title-sublabel"},this.sublabel)))),o("div",{class:"header-actions"},o("slot",{name:"header-actions"}))):null))),o("section",{key:"8702342c9b1a0c7bf81e753cdc9b88b76addacb3",id:`ix-blind-content-section-${this.blindId}`,"aria-labelledby":`ix-blind-header-title-${this.blindId}`},o("div",{key:"a362c9a6be61160391054fa0cbcb558c0e275a7f",class:{"blind-content":true,hide:this.collapsed}},!this.collapsed?o("slot",null):null)))}get hostElement(){return l(this)}static get watchers(){return{collapsed:["animation"]}}};h.style=s;export{h as ix_blind};
2
+ //# sourceMappingURL=p-b6c75dc3.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["blindCss","IxBlindStyle0","sequentialInstanceId","Blind","constructor","hostRef","this","blindId","onHeaderClick","collapsed","collapsedChange","emit","componentDidLoad","animateCollapse","content","hostElement","shadowRoot","querySelector","animation","isCollapsed","rotateChevronRight","rotateChevronDown","anime","targets","chevronRef","duration","easing","rotateZ","opacity","render","h","Host","key","class","variant","closed","type","a11yBoolean","onClick","name","color","ref","id","label","undefined","Fragment","icon","title","format","bold","sublabel","hide"],"sources":["src/components/blind/blind.scss?tag=ix-blind&encapsulation=shadow","src/components/blind/blind.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 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n@mixin blind($variant: 'insight') {\n :host(.blind-#{$variant}) {\n @if $variant == 'outline' {\n border: solid\n var(--theme-blind--border-thickness)\n var(--theme-blind-base--border-color);\n }\n\n .blind-header {\n @if $variant == 'outline' {\n background-color: var(--theme-color-ghost);\n } @else {\n background-color: var(--theme-color-#{$variant});\n }\n\n @if $variant == 'insight' or $variant == 'outline' {\n @include ghost-hover-pressed;\n } @else {\n @include hover {\n background-color: var(--theme-color-#{$variant}--hover);\n }\n\n @include active {\n background-color: var(--theme-color-#{$variant}--active);\n }\n }\n }\n\n @if $variant == 'insight' or $variant == 'outline' {\n .blind-header-title-label {\n color: var(--theme-color-std-text);\n }\n .blind-header-title-sublabel {\n color: var(--theme-color-soft-text);\n }\n } @else {\n .blind-header-title-label,\n .blind-header-title-sublabel {\n color: var(--theme-color-#{$variant}--contrast);\n }\n }\n\n @if $variant == 'outline' {\n border-color: var(--theme-color-soft-bdr);\n } @else {\n background-color: var(--theme-blind-base--background);\n }\n }\n}\n\n:host {\n @include ix-component;\n display: flex;\n flex-direction: column;\n border-radius: var(--theme-blind--border-radius);\n overflow: hidden;\n\n .blind-header-wrapper {\n display: block;\n position: relative;\n width: 100%;\n min-height: 3rem;\n height: 3rem;\n overflow: hidden;\n }\n\n .blind-header-content {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-start;\n\n width: 100%;\n height: 100%;\n\n pointer-events: none;\n padding-left: 0.5rem;\n }\n\n .blind-header-title {\n display: flex;\n position: relative;\n align-items: center;\n flex-grow: 1;\n flex-shrink: 0;\n margin-right: 1rem;\n }\n\n .blind-header {\n all: unset;\n @include ellipsis;\n\n display: block;\n position: absolute;\n\n top: 0px;\n left: 0px;\n\n pointer-events: all;\n\n padding-left: 2.5rem;\n min-height: 3rem;\n height: 3rem;\n width: calc(100% - 2 * var(--theme-blind--border-thickness));\n border: solid var(--theme-blind--border-thickness) transparent;\n border-radius: var(--theme-blind--border-radius)\n var(--theme-blind--border-radius) 0 0;\n cursor: pointer;\n\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n outline: none;\n }\n }\n\n .blind-header-title-icon,\n .collapse-icon {\n margin-right: $small-space;\n }\n\n .blind-header-title-row {\n display: flex;\n flex-grow: 1;\n }\n\n .blind-header-title-col {\n flex-grow: 1;\n flex-basis: 0;\n display: inline-flex;\n align-items: center;\n min-width: 0;\n }\n\n .blind-header-title-col:not(:first-of-type) {\n justify-content: flex-end;\n }\n ix-typography {\n flex-grow: 1;\n @include ellipsis;\n }\n\n .blind-header-title-label {\n @include ellipsis;\n padding-inline-end: 0.5rem;\n }\n\n .blind-header-title-sublabel {\n @include ellipsis;\n padding-inline: 0.5rem;\n }\n\n .blind-header-title {\n display: flex;\n align-items: center;\n flex-grow: 1;\n height: 100%;\n min-width: 0;\n }\n\n .blind-header-labels {\n display: inline-flex;\n flex-grow: 1;\n min-width: 0;\n }\n\n .blind-content {\n display: block;\n padding: 1rem;\n transition-property: padding;\n transition-duration: $default-time;\n transition-timing-function: ease-in;\n\n &.hide {\n max-height: 0;\n padding-top: 0px;\n padding-bottom: 0px;\n }\n }\n\n .header-actions {\n pointer-events: all;\n }\n}\n\n$blind-variants: (\n alarm,\n critical,\n info,\n insight,\n neutral,\n notification,\n success,\n warning,\n primary,\n outline\n);\n\n@each $variant in $blind-variants {\n @include blind($variant);\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { CardVariant } from '../card/card';\nimport { a11yBoolean } from '../utils/a11y';\n\nexport type BlindVariant = CardVariant | 'outline';\n\nlet sequentialInstanceId = 0;\n\n@Component({\n tag: 'ix-blind',\n styleUrl: 'blind.scss',\n shadow: true,\n})\nexport class Blind {\n /**\n * Collapsed state\n */\n @Prop({ mutable: true, reflect: true }) collapsed = false;\n\n /**\n * Label of blind\n */\n @Prop() label: string;\n\n /**\n * Secondary label inside blind header\n * @since 2.0.0\n */\n @Prop() sublabel: string;\n\n /**\n * Optional icon to be displayed next to the header label\n * @since 1.5.0\n */\n @Prop() icon: string;\n\n /**\n * Blind variant\n * @since 2.0.0\n */\n @Prop() variant: BlindVariant = 'insight';\n\n /**\n * Collapsed state changed\n */\n @Event() collapsedChange: EventEmitter<boolean>;\n\n @Element() hostElement!: HTMLIxBlindElement;\n\n private chevronRef: HTMLElement;\n private blindId = ++sequentialInstanceId;\n\n constructor() {}\n\n private onHeaderClick() {\n this.collapsed = !this.collapsed;\n this.collapsedChange.emit(this.collapsed);\n }\n\n componentDidLoad() {\n this.animateCollapse(this.collapsed);\n }\n\n get content() {\n return this.hostElement.shadowRoot.querySelector('.blind-content');\n }\n\n @Watch('collapsed')\n animation(isCollapsed: boolean) {\n this.animateCollapse(isCollapsed);\n }\n\n private animateCollapse(isCollapsed: boolean) {\n if (isCollapsed) {\n this.rotateChevronRight();\n } else {\n this.rotateChevronDown();\n }\n }\n\n private rotateChevronDown() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 90,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 1,\n });\n }\n\n private rotateChevronRight() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 0,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 0,\n });\n }\n\n render() {\n return (\n <Host\n class={{\n [`blind-${this.variant}`]: true,\n }}\n >\n <div class={'blind-header-wrapper'}>\n <button\n class={{\n 'blind-header': true,\n [`blind-${this.variant}`]: true,\n closed: this.collapsed,\n }}\n type=\"button\"\n aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n aria-controls={`ix-blind-content-section-${this.blindId}`}\n aria-expanded={a11yBoolean(!this.collapsed)}\n onClick={() => this.onHeaderClick()}\n >\n <slot name=\"custom-header\"></slot>\n </button>\n\n <div class={'blind-header-content'}>\n <ix-icon\n class=\"collapse-icon\"\n name={'chevron-right-small'}\n color={\n this.variant === 'insight' || this.variant === 'outline'\n ? 'color-primary'\n : `color-${this.variant}--contrast`\n }\n ref={(ref) => (this.chevronRef = ref)}\n ></ix-icon>\n <div\n class=\"blind-header-title\"\n id={`ix-blind-header-title-${this.blindId}`}\n >\n {this.label !== undefined ? (\n <Fragment>\n {this.icon && (\n <ix-icon\n class=\"blind-header-title-icon\"\n name={this.icon}\n color={\n this.variant === 'insight' || this.variant === 'outline'\n ? 'color-std-text'\n : `color-${this.variant}--contrast`\n }\n ></ix-icon>\n )}\n <div class={'blind-header-title-row'}>\n <div class=\"blind-header-title-col\">\n <ix-typography title={this.label} format=\"label-lg\" bold>\n <div\n class=\"blind-header-title-label\"\n title={this.label}\n >\n {this.label}\n </div>\n </ix-typography>\n </div>\n\n {this.sublabel && (\n <div class=\"blind-header-title-col\">\n <ix-typography title={this.sublabel}>\n <div class=\"blind-header-title-sublabel\">\n {this.sublabel}\n </div>\n </ix-typography>\n </div>\n )}\n </div>\n <div class=\"header-actions\">\n <slot name=\"header-actions\"></slot>\n </div>\n </Fragment>\n ) : null}\n </div>\n </div>\n </div>\n <section\n id={`ix-blind-content-section-${this.blindId}`}\n aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n >\n <div\n class={{\n 'blind-content': true,\n hide: this.collapsed,\n }}\n >\n {!this.collapsed ? <slot></slot> : null}\n </div>\n </section>\n </Host>\n );\n }\n}\n"],"mappings":"0IAAA,MAAMA,EAAW,kvUACjB,MAAAC,EAAeD,ECyBf,IAAIE,EAAuB,E,MAOdC,EAAK,MAuChB,WAAAC,CAAAC,G,2DAFQC,KAAAC,UAAYL,E,eAjCgC,M,8EAuBpB,S,CAcxB,aAAAM,GACNF,KAAKG,WAAaH,KAAKG,UACvBH,KAAKI,gBAAgBC,KAAKL,KAAKG,U,CAGjC,gBAAAG,GACEN,KAAKO,gBAAgBP,KAAKG,U,CAG5B,WAAIK,GACF,OAAOR,KAAKS,YAAYC,WAAWC,cAAc,iB,CAInD,SAAAC,CAAUC,GACRb,KAAKO,gBAAgBM,E,CAGf,eAAAN,CAAgBM,GACtB,GAAIA,EAAa,CACfb,KAAKc,oB,KACA,CACLd,KAAKe,mB,EAID,iBAAAA,GACNC,EAAM,CACJC,QAASjB,KAAKkB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,KAEXL,EAAM,CACJC,QAASjB,KAAKQ,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIL,kBAAAR,GACNE,EAAM,CACJC,QAASjB,KAAKkB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,IAEXL,EAAM,CACJC,QAASjB,KAAKQ,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIb,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,SAAS3B,KAAK4B,WAAY,OAG7BJ,EAAA,OAAAE,IAAA,2CAAKC,MAAO,wBACVH,EAAA,UAAAE,IAAA,2CACEC,MAAO,CACL,eAAgB,KAChB,CAAC,SAAS3B,KAAK4B,WAAY,KAC3BC,OAAQ7B,KAAKG,WAEf2B,KAAK,SAAQ,kBACI,yBAAyB9B,KAAKC,UAAS,gBACzC,4BAA4BD,KAAKC,UAAS,gBAC1C8B,GAAa/B,KAAKG,WACjC6B,QAAS,IAAMhC,KAAKE,iBAEpBsB,EAAA,QAAAE,IAAA,2CAAMO,KAAK,mBAGbT,EAAA,OAAAE,IAAA,2CAAKC,MAAO,wBACVH,EAAA,WAAAE,IAAA,2CACEC,MAAM,gBACNM,KAAM,sBACNC,MACElC,KAAK4B,UAAY,WAAa5B,KAAK4B,UAAY,UAC3C,gBACA,SAAS5B,KAAK4B,oBAEpBO,IAAMA,GAASnC,KAAKkB,WAAaiB,IAEnCX,EAAA,OAAAE,IAAA,2CACEC,MAAM,qBACNS,GAAI,yBAAyBpC,KAAKC,WAEjCD,KAAKqC,QAAUC,UACdd,EAACe,EAAQ,KACNvC,KAAKwC,MACJhB,EAAA,WACEG,MAAM,0BACNM,KAAMjC,KAAKwC,KACXN,MACElC,KAAK4B,UAAY,WAAa5B,KAAK4B,UAAY,UAC3C,iBACA,SAAS5B,KAAK4B,sBAIxBJ,EAAA,OAAKG,MAAO,0BACVH,EAAA,OAAKG,MAAM,0BACTH,EAAA,iBAAeiB,MAAOzC,KAAKqC,MAAOK,OAAO,WAAWC,KAAI,MACtDnB,EAAA,OACEG,MAAM,2BACNc,MAAOzC,KAAKqC,OAEXrC,KAAKqC,SAKXrC,KAAK4C,UACJpB,EAAA,OAAKG,MAAM,0BACTH,EAAA,iBAAeiB,MAAOzC,KAAK4C,UACzBpB,EAAA,OAAKG,MAAM,+BACR3B,KAAK4C,aAMhBpB,EAAA,OAAKG,MAAM,kBACTH,EAAA,QAAMS,KAAK,qBAGb,QAIVT,EAAA,WAAAE,IAAA,2CACEU,GAAI,4BAA4BpC,KAAKC,UAAS,kBAC7B,yBAAyBD,KAAKC,WAE/CuB,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,gBAAiB,KACjBkB,KAAM7C,KAAKG,aAGXH,KAAKG,UAAYqB,EAAA,aAAgB,O"}
@@ -0,0 +1,2 @@
1
+ import{r,h as e,H as o}from"./p-ea80cb61.js";const t=":host{display:flex;padding:0.5rem;justify-content:flex-end;align-items:center;gap:0.5rem;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const a=t;const s=class{constructor(e){r(this,e)}render(){return e(o,{key:"62e35b423b00c0ad75954e735188dce705f7ff3e"},e("slot",{key:"29a2a22875ae6197dab3c056329125dcefe70032"}))}};s.style=a;export{s as ix_modal_footer};
2
+ //# sourceMappingURL=p-c98d8ec2.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["modalFooterCss","IxModalFooterStyle0","ModalFooter","render","h","Host","key"],"sources":["src/components/modal-footer/modal-footer.scss?tag=ix-modal-footer&encapsulation=shadow","src/components/modal-footer/modal-footer.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: flex;\n padding: 0.5rem;\n justify-content: flex-end;\n align-items: center;\n gap: 0.5rem;\n align-self: stretch;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n tag: 'ix-modal-footer',\n styleUrl: 'modal-footer.scss',\n shadow: true,\n})\nexport class ModalFooter {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"6CAAA,MAAMA,EAAiB,2sBACvB,MAAAC,EAAeD,E,MCkBFE,EAAW,M,yBACtB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C"}
@@ -1,2 +1,2 @@
1
- import{r as t,a as e,h as i,F as r,H as a,g as o,c as s}from"./p-ea80cb61.js";import{B as n}from"./p-004cade9.js";import{c as l,h as d}from"./p-712e0ee0.js";import{m as h}from"./p-64c3fa3d.js";const c=":host{display:flex;position:relative;width:-moz-fit-content;width:fit-content}:host .avatar{display:flex;align-items:center}:host .avatar>.avatar-image{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}:host .avatar>.avatar-initials{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-color-component-3);color:var(--theme-color-std-text)}:host .avatar #avatar-path-background{fill:var(--theme-avatar--background)}:host .avatar #avatar-path-person{fill:var(--theme-color-4)}:host .user-info{display:flex;flex-direction:row;position:relative;height:2.5rem;padding:1rem;width:12.75rem;min-width:12.75rem;max-width:12.75rem;gap:1rem}:host .user-info .avatar{width:2rem;pointer-events:none}:host .user-info .user{display:flex;position:relative;flex-direction:column;justify-content:center;max-width:10rem;width:100%;overflow:hidden}:host .user-info .username{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .user-info .extra{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host(.avatar-button) button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem;padding:0px;border-radius:100px !important}:host(.avatar-button) .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host(.avatar-button) .btn-invisible-primary,:host(.avatar-button) .btn-invisible-primary.focus,:host(.avatar-button) .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host(.avatar-button) .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)}:host(.avatar-button) .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.avatar-button) li{transform:scale(0.8)}";const b=c;function v(t){const{initials:e}=t;if(e){return i("div",{class:"avatar-initials"},e)}return i("svg",{class:"avatar-image",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32"},i("g",{fill:"none","fill-rule":"evenodd"},i("path",{id:"avatar-path-background",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"}),i("path",{id:"avatar-path-person",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"})))}function m(t){return i("li",{class:"avatar"},t.image?i("img",{src:t.image,class:"avatar-image"}):i(v,{initials:t.initials}))}function u(t){return i(r,null,i("div",{class:"user-info",onClick:t=>t.preventDefault()},i(m,{image:t.image,initials:t.initials}),i("div",{class:"user"},i("div",{class:"username"},t.userName),t.extra&&i("ix-typography",{class:"extra",color:"soft"},t.extra))))}const p=class{constructor(e){t(this,e);this.image=undefined;this.initials=undefined;this.username=undefined;this.extra=undefined;this.isClosestApplicationHeader=false;this.hasSlottedElements=false}componentWillLoad(){const t=l("ix-application-header",this.hostElement);this.isClosestApplicationHeader=t!==null}slottedChanged(){this.hasSlottedElements=d(this.slotElement)}resolveAvatarTrigger(){return new Promise((t=>{e((()=>t(this.hostElement.shadowRoot.querySelector("button"))))}))}render(){if(this.isClosestApplicationHeader){return i(a,{slot:"ix-application-header-avatar",class:"avatar-button"},i(n,{disabled:false,ghost:true,iconOval:false,icon:undefined,iconOnly:false,loading:false,outline:false,selected:false,type:"button",variant:"primary"},i(m,{image:this.image,initials:this.initials})),i("ix-dropdown",{trigger:this.resolveAvatarTrigger(),class:"avatar-dropdown"},this.username&&i(r,null,i(u,{extra:this.extra,image:this.image,initials:this.initials,userName:this.username}),this.hasSlottedElements&&i("ix-divider",null)),i("slot",{onSlotchange:()=>this.slottedChanged(),ref:t=>this.slotElement=t})))}return i(a,null,i(m,{image:this.image,initials:this.initials}))}get hostElement(){return o(this)}};p.style=b;const f=":host{display:block}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const g=f;const w=class{constructor(e){t(this,e);this.itemClick=s(this,"itemClick",7);this.dropdownItemRef=h();this.icon=undefined;this.label=undefined}async getDropdownItemElement(){return this.dropdownItemRef.waitForCurrent()}render(){return i("ix-dropdown-item",{key:"c6f72909f3511d9434e4bf0cddac029b4db47b11",ref:this.dropdownItemRef,icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return o(this)}};w.style=g;export{p as ix_avatar,w as ix_menu_avatar_item};
2
- //# sourceMappingURL=p-22a792da.entry.js.map
1
+ import{r as t,a as e,h as i,F as r,H as a,g as o,c as s}from"./p-ea80cb61.js";import{B as n}from"./p-004cade9.js";import{c as l,h as d}from"./p-712e0ee0.js";import{m as h}from"./p-64c3fa3d.js";const c=":host{display:flex;position:relative;width:-moz-fit-content;width:fit-content}:host .avatar{display:flex;align-items:center}:host .avatar>.avatar-image{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}:host .avatar>.avatar-initials{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-color-component-3);color:var(--theme-color-std-text)}:host .avatar #avatar-path-background{fill:var(--theme-avatar--background)}:host .avatar #avatar-path-person{fill:var(--theme-color-4)}:host .user-info{display:flex;flex-direction:row;position:relative;height:2.5rem;padding:1rem;width:12.75rem;min-width:12.75rem;max-width:12.75rem;gap:1rem}:host .user-info .avatar{width:2rem;pointer-events:none}:host .user-info .user{display:flex;position:relative;flex-direction:column;justify-content:center;max-width:10rem;width:100%;overflow:hidden}:host .user-info .username{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .user-info .extra{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host(.avatar-button) button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem;padding:0px;border-radius:100px !important}:host(.avatar-button) .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host(.avatar-button) .btn-invisible-primary,:host(.avatar-button) .btn-invisible-primary.focus,:host(.avatar-button) .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host(.avatar-button) .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)}:host(.avatar-button) .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.avatar-button) li{transform:scale(0.8)}";const b=c;function v(t){const{initials:e}=t;if(e){return i("div",{class:"avatar-initials"},e)}return i("svg",{class:"avatar-image",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32"},i("g",{fill:"none","fill-rule":"evenodd"},i("path",{id:"avatar-path-background",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"}),i("path",{id:"avatar-path-person",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"})))}function m(t){return i("li",{class:"avatar"},t.image?i("img",{src:t.image,class:"avatar-image"}):i(v,{initials:t.initials}))}function u(t){return i(r,null,i("div",{class:"user-info",onClick:t=>t.preventDefault()},i(m,{image:t.image,initials:t.initials}),i("div",{class:"user"},i("div",{class:"username"},t.userName),t.extra&&i("ix-typography",{class:"extra",color:"soft"},t.extra))))}const p=class{constructor(e){t(this,e);this.image=undefined;this.initials=undefined;this.username=undefined;this.extra=undefined;this.isClosestApplicationHeader=false;this.hasSlottedElements=false}componentWillLoad(){const t=l("ix-application-header",this.hostElement);this.isClosestApplicationHeader=t!==null}slottedChanged(){this.hasSlottedElements=d(this.slotElement)}resolveAvatarTrigger(){return new Promise((t=>{e((()=>t(this.hostElement.shadowRoot.querySelector("button"))))}))}render(){if(this.isClosestApplicationHeader){return i(a,{slot:"ix-application-header-avatar",class:"avatar-button"},i(n,{disabled:false,ghost:true,iconOval:false,icon:undefined,iconOnly:false,loading:false,outline:false,selected:false,type:"button",variant:"primary"},i(m,{image:this.image,initials:this.initials})),i("ix-dropdown",{trigger:this.resolveAvatarTrigger(),class:"avatar-dropdown"},this.username&&i(r,null,i(u,{extra:this.extra,image:this.image,initials:this.initials,userName:this.username}),this.hasSlottedElements&&i("ix-divider",null)),i("slot",{onSlotchange:()=>this.slottedChanged(),ref:t=>this.slotElement=t})))}return i(a,null,i(m,{image:this.image,initials:this.initials}))}get hostElement(){return o(this)}};p.style=b;const f=":host{display:block;color:var(--theme-color-std-text)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const g=f;const w=class{constructor(e){t(this,e);this.itemClick=s(this,"itemClick",7);this.dropdownItemRef=h();this.icon=undefined;this.label=undefined}async getDropdownItemElement(){return this.dropdownItemRef.waitForCurrent()}render(){return i("ix-dropdown-item",{key:"c6f72909f3511d9434e4bf0cddac029b4db47b11",ref:this.dropdownItemRef,icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return o(this)}};w.style=g;export{p as ix_avatar,w as ix_menu_avatar_item};
2
+ //# sourceMappingURL=p-e23cd82e.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["avatarCss","IxAvatarStyle0","DefaultAvatar","props","initials","h","class","xmlns","width","height","viewBox","fill","id","d","AvatarImage","image","src","UserInfo","Fragment","onClick","event","preventDefault","userName","extra","color","Avatar","componentWillLoad","closest","closestElement","this","hostElement","isClosestApplicationHeader","slottedChanged","hasSlottedElements","slotElement","resolveAvatarTrigger","Promise","resolve","readTask","shadowRoot","querySelector","render","Host","slot","BaseButton","disabled","ghost","iconOval","icon","undefined","iconOnly","loading","outline","selected","type","variant","trigger","username","onSlotchange","ref","menuAvatarItemCss","IxMenuAvatarItemStyle0","MenuAvatarItem","dropdownItemRef","makeRef","getDropdownItemElement","waitForCurrent","key","label","e","itemClick","emit"],"sources":["src/components/avatar/avatar.scss?tag=ix-avatar&encapsulation=shadow","src/components/avatar/avatar.tsx","src/components/menu-avatar-item/menu-avatar-item.scss?tag=ix-menu-avatar-item&encapsulation=shadow","src/components/menu-avatar-item/menu-avatar-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/text-truncation';\n@import 'mixins/hover';\n@import './../button/button-mixin';\n\n:host {\n display: flex;\n position: relative;\n width: fit-content;\n\n .avatar {\n display: flex;\n align-items: center;\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 color: var(--theme-color-std-text);\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}\n\n:host {\n .user-info {\n display: flex;\n flex-direction: row;\n position: relative;\n height: 2.5rem;\n padding: 1rem;\n width: 12.75rem;\n min-width: 12.75rem;\n max-width: 12.75rem;\n\n gap: 1rem;\n\n .avatar {\n width: 2rem;\n pointer-events: none;\n }\n\n .user {\n display: flex;\n position: relative;\n flex-direction: column;\n justify-content: center;\n max-width: 10rem;\n width: 100%;\n overflow: hidden;\n }\n\n .username {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .extra {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n}\n\n:host(.avatar-button) {\n button {\n @include btn-base;\n padding: 0px;\n\n border-radius: 100px !important;\n }\n\n @include btn-base-variant('invisible-primary', false);\n\n li {\n transform: scale(0.8);\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n} from '@stencil/core';\nimport { BaseButton } from '../button/base-button';\nimport { closestElement, hasSlottedElements } from '../utils/shadow-dom';\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\nfunction AvatarImage(props: { image: string; initials: string }) {\n return (\n <li class=\"avatar\">\n {props.image ? (\n <img src={props.image} class=\"avatar-image\"></img>\n ) : (\n <DefaultAvatar initials={props.initials} />\n )}\n </li>\n );\n}\n\nfunction UserInfo(props: {\n image: string;\n initials: string;\n userName: string;\n extra: string;\n}) {\n return (\n <Fragment>\n <div class=\"user-info\" onClick={(event) => event.preventDefault()}>\n <AvatarImage image={props.image} initials={props.initials} />\n <div class=\"user\">\n <div class=\"username\">{props.userName}</div>\n {props.extra && (\n <ix-typography class=\"extra\" color={'soft'}>\n {props.extra}\n </ix-typography>\n )}\n </div>\n </div>\n </Fragment>\n );\n}\n\n/**\n * @since 2.0.0\n */\n@Component({\n tag: 'ix-avatar',\n styleUrl: 'avatar.scss',\n shadow: true,\n})\nexport class Avatar {\n @Element() hostElement: HTMLIxAvatarElement;\n\n /**\n * Display an avatar image\n *\n */\n @Prop() image: string;\n\n /**\n * Display the initials of the user. Will be overwritten by image\n *\n */\n @Prop() initials: string;\n\n /**\n * If set an info card displaying the username will be placed inside the dropdown.\n * Note: Only working if avatar is part of the ix-application-header\n *\n * @since 2.1.0\n */\n @Prop() username: string;\n\n /**\n * Optional description text that will be displayed underneath the username.\n * Note: Only working if avatar is part of the ix-application-header\n *\n * @since 2.1.0\n */\n @Prop() extra: string;\n\n @State() isClosestApplicationHeader = false;\n @State() hasSlottedElements = false;\n\n private slotElement: HTMLSlotElement;\n\n componentWillLoad() {\n const closest = closestElement('ix-application-header', this.hostElement);\n this.isClosestApplicationHeader = closest !== null;\n }\n\n private slottedChanged() {\n this.hasSlottedElements = hasSlottedElements(this.slotElement);\n }\n\n private resolveAvatarTrigger() {\n return new Promise<HTMLElement>((resolve) => {\n readTask(() =>\n resolve(this.hostElement.shadowRoot.querySelector('button'))\n );\n });\n }\n\n render() {\n if (this.isClosestApplicationHeader) {\n return (\n <Host slot=\"ix-application-header-avatar\" class={'avatar-button'}>\n <BaseButton\n disabled={false}\n ghost={true}\n iconOval={false}\n icon={undefined}\n iconOnly={false}\n loading={false}\n outline={false}\n selected={false}\n type=\"button\"\n variant=\"primary\"\n >\n <AvatarImage image={this.image} initials={this.initials} />\n </BaseButton>\n <ix-dropdown\n trigger={this.resolveAvatarTrigger()}\n class=\"avatar-dropdown\"\n >\n {this.username && (\n <Fragment>\n <UserInfo\n extra={this.extra}\n image={this.image}\n initials={this.initials}\n userName={this.username}\n />\n {this.hasSlottedElements && <ix-divider></ix-divider>}\n </Fragment>\n )}\n <slot\n onSlotchange={() => this.slottedChanged()}\n ref={(ref: HTMLSlotElement) => (this.slotElement = ref)}\n ></slot>\n </ix-dropdown>\n </Host>\n );\n }\n\n return (\n <Host>\n <AvatarImage image={this.image} initials={this.initials} />\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: 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 Method,\n Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport { makeRef } from '../utils/make-ref';\n\n@Component({\n tag: 'ix-menu-avatar-item',\n styleUrl: 'menu-avatar-item.scss',\n shadow: true,\n})\nexport class MenuAvatarItem implements DropdownItemWrapper {\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 private dropdownItemRef = makeRef<HTMLIxDropdownItemElement>();\n\n /** @internal */\n @Method()\n async getDropdownItemElement() {\n return this.dropdownItemRef.waitForCurrent();\n }\n\n render() {\n return (\n <ix-dropdown-item\n ref={this.dropdownItemRef}\n icon={this.icon}\n label={this.label}\n onClick={(e) => this.itemClick.emit(e)}\n ></ix-dropdown-item>\n );\n }\n}\n"],"mappings":"iMAAA,MAAMA,EAAY,g9GAClB,MAAAC,EAAeD,ECqBf,SAASE,EAAcC,GACrB,MAAMC,SAAEA,GAAaD,EAErB,GAAIC,EAAU,CACZ,OAAOC,EAAA,OAAKC,MAAO,mBAAoBF,E,CAGzC,OACEC,EAAA,OACEC,MAAO,eACPC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aAERL,EAAA,KAAGM,KAAK,OAAM,YAAW,WACvBN,EAAA,QACEO,GAAG,yBACHC,EAAE,qIAGJR,EAAA,QACEO,GAAG,qBACHC,EAAE,+TAQZ,CAEA,SAASC,EAAYX,GACnB,OACEE,EAAA,MAAIC,MAAM,UACPH,EAAMY,MACLV,EAAA,OAAKW,IAAKb,EAAMY,MAAOT,MAAM,iBAE7BD,EAACH,EAAa,CAACE,SAAUD,EAAMC,WAIvC,CAEA,SAASa,EAASd,GAMhB,OACEE,EAACa,EAAQ,KACPb,EAAA,OAAKC,MAAM,YAAYa,QAAUC,GAAUA,EAAMC,kBAC/ChB,EAACS,EAAW,CAACC,MAAOZ,EAAMY,MAAOX,SAAUD,EAAMC,WACjDC,EAAA,OAAKC,MAAM,QACTD,EAAA,OAAKC,MAAM,YAAYH,EAAMmB,UAC5BnB,EAAMoB,OACLlB,EAAA,iBAAeC,MAAM,QAAQkB,MAAO,QACjCrB,EAAMoB,SAOrB,C,MAUaE,EAAM,M,mJA+BqB,M,wBACR,K,CAI9B,iBAAAC,GACE,MAAMC,EAAUC,EAAe,wBAAyBC,KAAKC,aAC7DD,KAAKE,2BAA6BJ,IAAY,I,CAGxC,cAAAK,GACNH,KAAKI,mBAAqBA,EAAmBJ,KAAKK,Y,CAG5C,oBAAAC,GACN,OAAO,IAAIC,SAAsBC,IAC/BC,GAAS,IACPD,EAAQR,KAAKC,YAAYS,WAAWC,cAAc,YACnD,G,CAIL,MAAAC,GACE,GAAIZ,KAAKE,2BAA4B,CACnC,OACE1B,EAACqC,EAAI,CAACC,KAAK,+BAA+BrC,MAAO,iBAC/CD,EAACuC,EAAU,CACTC,SAAU,MACVC,MAAO,KACPC,SAAU,MACVC,KAAMC,UACNC,SAAU,MACVC,QAAS,MACTC,QAAS,MACTC,SAAU,MACVC,KAAK,SACLC,QAAQ,WAERlD,EAACS,EAAW,CAACC,MAAOc,KAAKd,MAAOX,SAAUyB,KAAKzB,YAEjDC,EAAA,eACEmD,QAAS3B,KAAKM,uBACd7B,MAAM,mBAELuB,KAAK4B,UACJpD,EAACa,EAAQ,KACPb,EAACY,EAAQ,CACPM,MAAOM,KAAKN,MACZR,MAAOc,KAAKd,MACZX,SAAUyB,KAAKzB,SACfkB,SAAUO,KAAK4B,WAEhB5B,KAAKI,oBAAsB5B,EAAA,oBAGhCA,EAAA,QACEqD,aAAc,IAAM7B,KAAKG,iBACzB2B,IAAMA,GAA0B9B,KAAKK,YAAcyB,K,CAO7D,OACEtD,EAACqC,EAAI,KACHrC,EAACS,EAAW,CAACC,MAAOc,KAAKd,MAAOX,SAAUyB,KAAKzB,W,8CCnMvD,MAAMwD,EAAoB,mnBAC1B,MAAAC,EAAeD,E,MCyBFE,EAAc,M,8DAkBjBjC,KAAAkC,gBAAkBC,I,yCAI1B,4BAAMC,GACJ,OAAOpC,KAAKkC,gBAAgBG,gB,CAG9B,MAAAzB,GACE,OACEpC,EAAA,oBAAA8D,IAAA,2CACER,IAAK9B,KAAKkC,gBACVf,KAAMnB,KAAKmB,KACXoB,MAAOvC,KAAKuC,MACZjD,QAAUkD,GAAMxC,KAAKyC,UAAUC,KAAKF,I"}
1
+ {"version":3,"names":["avatarCss","IxAvatarStyle0","DefaultAvatar","props","initials","h","class","xmlns","width","height","viewBox","fill","id","d","AvatarImage","image","src","UserInfo","Fragment","onClick","event","preventDefault","userName","extra","color","Avatar","componentWillLoad","closest","closestElement","this","hostElement","isClosestApplicationHeader","slottedChanged","hasSlottedElements","slotElement","resolveAvatarTrigger","Promise","resolve","readTask","shadowRoot","querySelector","render","Host","slot","BaseButton","disabled","ghost","iconOval","icon","undefined","iconOnly","loading","outline","selected","type","variant","trigger","username","onSlotchange","ref","menuAvatarItemCss","IxMenuAvatarItemStyle0","MenuAvatarItem","dropdownItemRef","makeRef","getDropdownItemElement","waitForCurrent","key","label","e","itemClick","emit"],"sources":["src/components/avatar/avatar.scss?tag=ix-avatar&encapsulation=shadow","src/components/avatar/avatar.tsx","src/components/menu-avatar-item/menu-avatar-item.scss?tag=ix-menu-avatar-item&encapsulation=shadow","src/components/menu-avatar-item/menu-avatar-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/text-truncation';\n@import 'mixins/hover';\n@import './../button/button-mixin';\n\n:host {\n display: flex;\n position: relative;\n width: fit-content;\n\n .avatar {\n display: flex;\n align-items: center;\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 color: var(--theme-color-std-text);\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}\n\n:host {\n .user-info {\n display: flex;\n flex-direction: row;\n position: relative;\n height: 2.5rem;\n padding: 1rem;\n width: 12.75rem;\n min-width: 12.75rem;\n max-width: 12.75rem;\n\n gap: 1rem;\n\n .avatar {\n width: 2rem;\n pointer-events: none;\n }\n\n .user {\n display: flex;\n position: relative;\n flex-direction: column;\n justify-content: center;\n max-width: 10rem;\n width: 100%;\n overflow: hidden;\n }\n\n .username {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .extra {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n}\n\n:host(.avatar-button) {\n button {\n @include btn-base;\n padding: 0px;\n\n border-radius: 100px !important;\n }\n\n @include btn-base-variant('invisible-primary', false);\n\n li {\n transform: scale(0.8);\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Fragment,\n h,\n Host,\n Prop,\n readTask,\n State,\n} from '@stencil/core';\nimport { BaseButton } from '../button/base-button';\nimport { closestElement, hasSlottedElements } from '../utils/shadow-dom';\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\nfunction AvatarImage(props: { image: string; initials: string }) {\n return (\n <li class=\"avatar\">\n {props.image ? (\n <img src={props.image} class=\"avatar-image\"></img>\n ) : (\n <DefaultAvatar initials={props.initials} />\n )}\n </li>\n );\n}\n\nfunction UserInfo(props: {\n image: string;\n initials: string;\n userName: string;\n extra: string;\n}) {\n return (\n <Fragment>\n <div class=\"user-info\" onClick={(event) => event.preventDefault()}>\n <AvatarImage image={props.image} initials={props.initials} />\n <div class=\"user\">\n <div class=\"username\">{props.userName}</div>\n {props.extra && (\n <ix-typography class=\"extra\" color={'soft'}>\n {props.extra}\n </ix-typography>\n )}\n </div>\n </div>\n </Fragment>\n );\n}\n\n/**\n * @since 2.0.0\n */\n@Component({\n tag: 'ix-avatar',\n styleUrl: 'avatar.scss',\n shadow: true,\n})\nexport class Avatar {\n @Element() hostElement: HTMLIxAvatarElement;\n\n /**\n * Display an avatar image\n *\n */\n @Prop() image: string;\n\n /**\n * Display the initials of the user. Will be overwritten by image\n *\n */\n @Prop() initials: string;\n\n /**\n * If set an info card displaying the username will be placed inside the dropdown.\n * Note: Only working if avatar is part of the ix-application-header\n *\n * @since 2.1.0\n */\n @Prop() username: string;\n\n /**\n * Optional description text that will be displayed underneath the username.\n * Note: Only working if avatar is part of the ix-application-header\n *\n * @since 2.1.0\n */\n @Prop() extra: string;\n\n @State() isClosestApplicationHeader = false;\n @State() hasSlottedElements = false;\n\n private slotElement: HTMLSlotElement;\n\n componentWillLoad() {\n const closest = closestElement('ix-application-header', this.hostElement);\n this.isClosestApplicationHeader = closest !== null;\n }\n\n private slottedChanged() {\n this.hasSlottedElements = hasSlottedElements(this.slotElement);\n }\n\n private resolveAvatarTrigger() {\n return new Promise<HTMLElement>((resolve) => {\n readTask(() =>\n resolve(this.hostElement.shadowRoot.querySelector('button'))\n );\n });\n }\n\n render() {\n if (this.isClosestApplicationHeader) {\n return (\n <Host slot=\"ix-application-header-avatar\" class={'avatar-button'}>\n <BaseButton\n disabled={false}\n ghost={true}\n iconOval={false}\n icon={undefined}\n iconOnly={false}\n loading={false}\n outline={false}\n selected={false}\n type=\"button\"\n variant=\"primary\"\n >\n <AvatarImage image={this.image} initials={this.initials} />\n </BaseButton>\n <ix-dropdown\n trigger={this.resolveAvatarTrigger()}\n class=\"avatar-dropdown\"\n >\n {this.username && (\n <Fragment>\n <UserInfo\n extra={this.extra}\n image={this.image}\n initials={this.initials}\n userName={this.username}\n />\n {this.hasSlottedElements && <ix-divider></ix-divider>}\n </Fragment>\n )}\n <slot\n onSlotchange={() => this.slottedChanged()}\n ref={(ref: HTMLSlotElement) => (this.slotElement = ref)}\n ></slot>\n </ix-dropdown>\n </Host>\n );\n }\n\n return (\n <Host>\n <AvatarImage image={this.image} initials={this.initials} />\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: block;\n color: var(--theme-color-std-text);\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 Method,\n Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport { makeRef } from '../utils/make-ref';\n\n@Component({\n tag: 'ix-menu-avatar-item',\n styleUrl: 'menu-avatar-item.scss',\n shadow: true,\n})\nexport class MenuAvatarItem implements DropdownItemWrapper {\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 private dropdownItemRef = makeRef<HTMLIxDropdownItemElement>();\n\n /** @internal */\n @Method()\n async getDropdownItemElement() {\n return this.dropdownItemRef.waitForCurrent();\n }\n\n render() {\n return (\n <ix-dropdown-item\n ref={this.dropdownItemRef}\n icon={this.icon}\n label={this.label}\n onClick={(e) => this.itemClick.emit(e)}\n ></ix-dropdown-item>\n );\n }\n}\n"],"mappings":"iMAAA,MAAMA,EAAY,g9GAClB,MAAAC,EAAeD,ECqBf,SAASE,EAAcC,GACrB,MAAMC,SAAEA,GAAaD,EAErB,GAAIC,EAAU,CACZ,OAAOC,EAAA,OAAKC,MAAO,mBAAoBF,E,CAGzC,OACEC,EAAA,OACEC,MAAO,eACPC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aAERL,EAAA,KAAGM,KAAK,OAAM,YAAW,WACvBN,EAAA,QACEO,GAAG,yBACHC,EAAE,qIAGJR,EAAA,QACEO,GAAG,qBACHC,EAAE,+TAQZ,CAEA,SAASC,EAAYX,GACnB,OACEE,EAAA,MAAIC,MAAM,UACPH,EAAMY,MACLV,EAAA,OAAKW,IAAKb,EAAMY,MAAOT,MAAM,iBAE7BD,EAACH,EAAa,CAACE,SAAUD,EAAMC,WAIvC,CAEA,SAASa,EAASd,GAMhB,OACEE,EAACa,EAAQ,KACPb,EAAA,OAAKC,MAAM,YAAYa,QAAUC,GAAUA,EAAMC,kBAC/ChB,EAACS,EAAW,CAACC,MAAOZ,EAAMY,MAAOX,SAAUD,EAAMC,WACjDC,EAAA,OAAKC,MAAM,QACTD,EAAA,OAAKC,MAAM,YAAYH,EAAMmB,UAC5BnB,EAAMoB,OACLlB,EAAA,iBAAeC,MAAM,QAAQkB,MAAO,QACjCrB,EAAMoB,SAOrB,C,MAUaE,EAAM,M,mJA+BqB,M,wBACR,K,CAI9B,iBAAAC,GACE,MAAMC,EAAUC,EAAe,wBAAyBC,KAAKC,aAC7DD,KAAKE,2BAA6BJ,IAAY,I,CAGxC,cAAAK,GACNH,KAAKI,mBAAqBA,EAAmBJ,KAAKK,Y,CAG5C,oBAAAC,GACN,OAAO,IAAIC,SAAsBC,IAC/BC,GAAS,IACPD,EAAQR,KAAKC,YAAYS,WAAWC,cAAc,YACnD,G,CAIL,MAAAC,GACE,GAAIZ,KAAKE,2BAA4B,CACnC,OACE1B,EAACqC,EAAI,CAACC,KAAK,+BAA+BrC,MAAO,iBAC/CD,EAACuC,EAAU,CACTC,SAAU,MACVC,MAAO,KACPC,SAAU,MACVC,KAAMC,UACNC,SAAU,MACVC,QAAS,MACTC,QAAS,MACTC,SAAU,MACVC,KAAK,SACLC,QAAQ,WAERlD,EAACS,EAAW,CAACC,MAAOc,KAAKd,MAAOX,SAAUyB,KAAKzB,YAEjDC,EAAA,eACEmD,QAAS3B,KAAKM,uBACd7B,MAAM,mBAELuB,KAAK4B,UACJpD,EAACa,EAAQ,KACPb,EAACY,EAAQ,CACPM,MAAOM,KAAKN,MACZR,MAAOc,KAAKd,MACZX,SAAUyB,KAAKzB,SACfkB,SAAUO,KAAK4B,WAEhB5B,KAAKI,oBAAsB5B,EAAA,oBAGhCA,EAAA,QACEqD,aAAc,IAAM7B,KAAKG,iBACzB2B,IAAMA,GAA0B9B,KAAKK,YAAcyB,K,CAO7D,OACEtD,EAACqC,EAAI,KACHrC,EAACS,EAAW,CAACC,MAAOc,KAAKd,MAAOX,SAAUyB,KAAKzB,W,8CCnMvD,MAAMwD,EAAoB,qpBAC1B,MAAAC,EAAeD,E,MCyBFE,EAAc,M,8DAkBjBjC,KAAAkC,gBAAkBC,I,yCAI1B,4BAAMC,GACJ,OAAOpC,KAAKkC,gBAAgBG,gB,CAG9B,MAAAzB,GACE,OACEpC,EAAA,oBAAA8D,IAAA,2CACER,IAAK9B,KAAKkC,gBACVf,KAAMnB,KAAKmB,KACXoB,MAAOvC,KAAKuC,MACZjD,QAAUkD,GAAMxC,KAAKyC,UAAUC,KAAKF,I"}
@@ -1,2 +1,2 @@
1
- import{p as e,b as a}from"./p-ea80cb61.js";export{s as setNonce}from"./p-ea80cb61.js";import{g as t}from"./p-737b08c6.js";const i=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};i().then((async e=>{await t();return a(JSON.parse('[["p-d445b333",[[1,"ix-datetime-picker",{"range":[4],"showHour":[4,"show-hour"],"showMinutes":[4,"show-minutes"],"showSeconds":[4,"show-seconds"],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"dateFormat":[1,"date-format"],"timeFormat":[1,"time-format"],"from":[1],"to":[1],"time":[1],"showTimeReference":[8,"show-time-reference"],"timeReference":[1,"time-reference"],"textSelectDate":[1,"text-select-date"],"i18nDone":[1,"i18n-done"],"weekStartIndex":[2,"week-start-index"],"locale":[1],"eventDelimiter":[1,"event-delimiter"]}]]],["p-e345d0d2",[[1,"ix-date-dropdown",{"format":[1],"range":[4],"from":[1],"to":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"dateRangeId":[1,"date-range-id"],"customRangeAllowed":[4,"custom-range-allowed"],"dateRangeOptions":[16],"i18nCustomItem":[1,"i18n-custom-item"],"i18nDone":[1,"i18n-done"],"i18nNoRange":[1,"i18n-no-range"],"today":[1],"selectedDateRangeId":[32],"currentRangeValue":[32],"triggerRef":[32],"getDateRange":[64]},null,{"dateRangeId":["onDateRangeIdChange"],"to":["onDateRangeIdChange"],"from":["onDateRangeIdChange"],"dateRangeOptions":["onDateRangeOptionsChange"]}]]],["p-a643ad05",[[1,"ix-pagination",{"advanced":[4],"itemCount":[2,"item-count"],"showItemCount":[4,"show-item-count"],"count":[2],"selectedPage":[1026,"selected-page"],"i18nPage":[1,"i-1-8n-page"],"i18nOf":[1,"i-1-8n-of"],"i18nItems":[1,"i-1-8n-items"]}]]],["p-f6691728",[[1,"ix-menu-avatar",{"top":[1],"bottom":[1],"image":[1],"initials":[1],"i18nLogout":[1,"i-1-8n-logout"],"showLogoutButton":[4,"show-logout-button"],"showContextMenu":[32]}]]],["p-f8169051",[[1,"ix-card-list",{"label":[1],"collapse":[1028],"listStyle":[1,"list-style"],"maxVisibleCards":[2,"max-visible-cards"],"showAllCount":[2,"show-all-count"],"suppressOverflowHandling":[4,"suppress-overflow-handling"],"i18nShowAll":[1,"i-1-8n-show-all"],"i18nMoreCards":[1,"i-1-8n-more-cards"],"hasOverflowingElements":[32],"numberOfOverflowingElements":[32],"numberOfAllChildElements":[32],"leftScrollDistance":[32],"rightScrollDistance":[32]},[[9,"resize","detectOverflow"]]]]],["p-b62e2edf",[[1,"ix-map-navigation",{"applicationName":[1,"application-name"],"navigationTitle":[1,"navigation-title"],"hideContextMenu":[4,"hide-context-menu"],"isSidebarOpen":[32],"hasContentHeader":[32],"toggleSidebar":[64],"openOverlay":[64],"closeOverlay":[64]}]]],["p-f5af5a9f",[[1,"ix-application-switch-modal",{"config":[16]}]]],["p-4c29feb5",[[1,"ix-basic-navigation",{"applicationName":[1,"application-name"],"hideHeader":[4,"hide-header"],"forceBreakpoint":[1,"force-breakpoint"],"breakpoints":[16],"breakpoint":[32]},null,{"hideHeader":["onHideHeaderChange"],"breakpoints":["onBreakpointsChange"]}]]],["p-cfc7a9ac",[[1,"ix-menu-category",{"label":[1],"icon":[1],"notifications":[2],"menuExpand":[32],"showItems":[32],"showDropdown":[32],"nestedItems":[32]}]]],["p-d59b3f31",[[1,"ix-push-card",{"icon":[1],"notification":[1],"heading":[1],"subheading":[1],"variant":[1],"collapse":[4]}]]],["p-26355e12",[[1,"ix-breadcrumb",{"visibleItemCount":[2,"visible-item-count"],"nextItems":[16],"ghost":[4],"ariaLabelPreviousButton":[1,"aria-label-previous-button"],"previousButtonRef":[32],"nextButtonRef":[32],"items":[32],"isPreviousDropdownExpanded":[32]},null,{"nextItems":["onNextItemsChange"]}]]],["p-6cd2b4d4",[[1,"ix-category-filter",{"disabled":[4],"readonly":[4],"filterState":[16],"placeholder":[1],"categories":[16],"nonSelectableCategories":[16],"suggestions":[16],"icon":[1],"hideIcon":[4,"hide-icon"],"repeatCategories":[4,"repeat-categories"],"tmpDisableScrollIntoView":[4,"tmp-disable-scroll-into-view"],"labelCategories":[1,"label-categories"],"i18nPlainText":[1,"i-1-8n-plain-text"],"showDropdown":[32],"textInput":[32],"hasFocus":[32],"categoryLogicalOperator":[32],"inputValue":[32],"category":[32],"filterTokens":[32]},null,{"filterState":["watchFilterState"]}]]],["p-73d5ea4a",[[1,"ix-dropdown-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[4],"label":[1],"icon":[1],"closeBehavior":[8,"close-behavior"],"placement":[1],"dropdownAnchor":[32]}]]],["p-782b33d3",[[1,"ix-group",{"suppressHeaderSelection":[4,"suppress-header-selection"],"header":[1],"subHeader":[1,"sub-header"],"collapsed":[1540],"selected":[1540],"index":[1538],"expandOnHeaderClick":[4,"expand-on-header-click"],"itemSelected":[32],"dropdownTriggerRef":[32],"slotSize":[32],"footerVisible":[32]}]]],["p-6a8d50c3",[[1,"ix-menu",{"showSettings":[1028,"show-settings"],"showAbout":[1028,"show-about"],"enableToggleTheme":[4,"enable-toggle-theme"],"enableSettings":[4,"enable-settings"],"enableMapExpand":[4,"enable-map-expand"],"applicationName":[1,"application-name"],"applicationDescription":[1,"application-description"],"maxVisibleMenuItems":[2,"max-visible-menu-items"],"i18nExpandSidebar":[1,"i-1-8n-expand-sidebar"],"expand":[1540],"pinned":[4],"i18nLegal":[1,"i-1-8n-legal"],"i18nSettings":[1,"i-1-8n-settings"],"i18nToggleTheme":[1,"i-1-8n-toggle-theme"],"i18nExpand":[1,"i-1-8n-expand"],"i18nCollapse":[1,"i-1-8n-collapse"],"showPinned":[32],"mapExpand":[32],"activeTab":[32],"breakpoint":[32],"itemsScrollShadowTop":[32],"itemsScrollShadowBottom":[32],"applicationLayoutContext":[32],"toggleMapExpand":[64],"toggleMenu":[64],"toggleSettings":[64],"toggleAbout":[64]},[[9,"resize","handleOverflowIndicator"],[0,"close","onOverlayClose"]],{"pinned":["pinnedChange"]}]]],["p-fcbe42c4",[[1,"ix-menu-about",{"activeTabLabel":[1025,"active-tab-label"],"label":[1],"show":[4],"items":[32]},null,{"activeTabLabel":["updateTab"]}]]],["p-58f51cce",[[1,"ix-menu-about-news",{"show":[1540],"label":[1],"i18nShowMore":[1,"i-1-8n-show-more"],"aboutItemLabel":[1,"about-item-label"],"offsetBottom":[2,"offset-bottom"],"expanded":[4]}]]],["p-3c6e6130",[[1,"ix-menu-settings",{"activeTabLabel":[1025,"active-tab-label"],"label":[1],"show":[4],"items":[32]},null,{"activeTabLabel":["updateTab"]}]]],["p-d464b60e",[[1,"ix-split-button",{"variant":[1],"outline":[4],"ghost":[4],"label":[1],"icon":[1],"splitIcon":[1,"split-icon"],"disabled":[4],"placement":[1],"toggle":[32]}]]],["p-37d299a4",[[1,"ix-action-card",{"variant":[1],"icon":[1],"heading":[1],"subheading":[1],"selected":[4]}]]],["p-064a1a47",[[1,"ix-content-header",{"variant":[1],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"hasBackButton":[4,"has-back-button"]}]]],["p-988d23ac",[[1,"ix-empty-state",{"layout":[1],"icon":[1],"header":[1],"subHeader":[1,"sub-header"],"action":[1]}]]],["p-8493da96",[[0,"ix-modal-example"]]],["p-1e5e042b",[[1,"ix-pane",{"heading":[1],"variant":[1],"hideOnCollapse":[4,"hide-on-collapse"],"size":[1],"borderless":[4],"expanded":[1028],"composition":[1025],"icon":[1],"ignoreLayoutSettings":[4,"ignore-layout-settings"],"isMobile":[1028,"is-mobile"],"expandIcon":[32],"showContent":[32],"minimizeIcon":[32],"floating":[32],"parentWidthPx":[32],"parentHeightPx":[32]},null,{"isMobile":["onMobileChange"],"composition":["onPositionChange"],"hideOnCollapse":["onHideOnCollapseChange"],"variant":["onVariantChange"],"borderless":["onBorderlessChange"],"expanded":["onExpandedChange"],"parentHeightPx":["onParentSizeChange"],"parentWidthPx":["onParentSizeChange"],"size":["onSizeChange"]}]]],["p-f5a108d5",[[1,"ix-toast-container",{"containerId":[1,"container-id"],"containerClass":[1,"container-class"],"position":[1],"showToast":[64]},null,{"position":["onPositionChange"]}]]],["p-535ee46b",[[1,"ix-chip",{"variant":[513],"active":[4],"closable":[4],"icon":[1],"background":[1],"color":[1],"chipColor":[1,"chip-color"],"outline":[4]}]]],["p-ca53ecd8",[[1,"ix-drawer",{"show":[1028],"closeOnClickOutside":[4,"close-on-click-outside"],"fullHeight":[4,"full-height"],"minWidth":[2,"min-width"],"maxWidth":[2,"max-width"],"width":[8],"toggleDrawer":[64]},null,{"show":["onShowChanged"]}]]],["p-f10824af",[[1,"ix-expanding-search",{"icon":[1],"placeholder":[1],"value":[1025],"fullWidth":[4,"full-width"],"isFieldChanged":[32],"expanded":[32],"hasFocus":[32]}]]],["p-92fc6ba1",[[1,"ix-flip-tile",{"state":[1],"height":[8],"width":[8],"index":[32],"isFlipAnimationActive":[32]}]]],["p-34ccbe57",[[1,"ix-message-bar",{"type":[1],"dismissible":[4],"icon":[32],"color":[32]}]]],["p-0e0e5f67",[[1,"ix-slider",{"step":[2],"min":[2],"max":[2],"value":[2],"marker":[16],"trace":[4],"traceReference":[2,"trace-reference"],"disabled":[4],"error":[8],"rangeInput":[32],"rangeMin":[32],"rangeMax":[32],"rangeTraceReference":[32],"showTooltip":[32]},null,{"showTooltip":["onShowTooltipChange"],"value":["updateRangeVariables"],"max":["updateRangeVariables"],"min":["updateRangeVariables"],"traceReference":["updateRangeVariables"]}]]],["p-ddf93bce",[[1,"ix-upload",{"accept":[1],"multiple":[4],"multiline":[4],"disabled":[4],"state":[1],"selectFileText":[1,"select-file-text"],"loadingText":[1,"loading-text"],"uploadFailedText":[1,"upload-failed-text"],"uploadSuccessText":[1,"upload-success-text"],"i18nUploadFile":[1,"i-1-8n-upload-file"],"i18nUploadDisabled":[1,"i-1-8n-upload-disabled"],"isFileOver":[32],"setFilesToUpload":[64]}]]],["p-5f74fc83",[[1,"ix-blind",{"collapsed":[1540],"label":[1],"sublabel":[1],"icon":[1],"variant":[1]},null,{"collapsed":["animation"]}]]],["p-14d2576e",[[1,"ix-dropdown-header",{"label":[1]}]]],["p-8be3bc6d",[[1,"ix-icon-toggle-button",{"variant":[1],"outline":[4],"ghost":[4],"icon":[1],"pressed":[4],"size":[1],"disabled":[516],"loading":[4]},null,{"variant":["onVariantChange"],"ghost":["onGhostChange"],"outline":["onOutlineChange"]}]]],["p-fe760d17",[[1,"ix-modal-loading"]]],["p-232bee46",[[1,"ix-split-button-item",{"icon":[1],"label":[1],"getDropdownItemElement":[64]}]]],["p-5d3975c8",[[1,"ix-toggle-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[516],"loading":[4],"icon":[1],"pressed":[4]},null,{"variant":["onVariantChange"],"ghost":["onGhostChange"],"outline":["onOutlineChange"]}]]],["p-c0bf9382",[[1,"ix-tree",{"root":[1],"model":[16],"renderItem":[16],"context":[1040]},null,{"model":["modelChange"]}]]],["p-2462fc76",[[1,"ix-application",{"theme":[1],"themeSystemAppearance":[4,"theme-system-appearance"],"forceBreakpoint":[1,"force-breakpoint"],"breakpoints":[16],"appSwitchConfig":[16],"breakpoint":[32],"applicationSidebarSlotted":[32]},null,{"breakpoints":["onBreakpointsChange"],"theme":["changeTheme"],"themeSystemAppearance":["changeTheme"],"appSwitchConfig":["onApplicationSidebarChange"],"applicationSidebarSlotted":["onApplicationSidebarChange"]}]]],["p-5ca2ef74",[[1,"ix-application-sidebar",{"visible":[32]},[[8,"application-sidebar-toggle","listenToggleEvent"]]]]],["p-d277e7e2",[[1,"ix-content",{"isContentHeaderSlotted":[32]}]]],["p-2cdd0028",[[1,"ix-css-grid",{"templates":[16],"currentTemplate":[32]}]]],["p-3c0425f3",[[1,"ix-css-grid-item",{"itemName":[1,"item-name"]}]]],["p-e1b790d3",[[1,"ix-dropdown-quick-actions"]]],["p-81b570f5",[[1,"ix-event-list",{"itemHeight":[8,"item-height"],"compact":[4],"animated":[4],"chevron":[4]},null,{"chevron":["watchChevron"]}]]],["p-4dad31fa",[[1,"ix-event-list-item",{"color":[1],"itemColor":[1,"item-color"],"selected":[4],"disabled":[4],"chevron":[4]},[[1,"click","handleItemClick"]]]]],["p-eb6ea42d",[[1,"ix-flip-tile-content",{"contentVisible":[4,"content-visible"]}]]],["p-db47293b",[[1,"ix-form-field",{"label":[1]}]]],["p-8b51637c",[[1,"ix-input-group",{"inputPaddingLeft":[32],"inputPaddingRight":[32]}]]],["p-42f7289e",[[1,"ix-key-value",{"icon":[1],"label":[1],"labelPosition":[1,"label-position"],"value":[1]}]]],["p-572455df",[[1,"ix-key-value-list",{"striped":[4]}]]],["p-47919d43",[[1,"ix-kpi",{"label":[1],"value":[8],"unit":[1],"state":[1],"orientation":[1]}]]],["p-50f12507",[[1,"ix-link-button",{"disabled":[4],"url":[1],"target":[1]}]]],["p-196d2cef",[[1,"ix-menu-about-item",{"label":[513]},null,{"label":["watchLabel"]}]]],["p-78e332f4",[[1,"ix-menu-settings-item",{"label":[513]},null,{"label":["watchLabel"]}]]],["p-b4e3a4fd",[[1,"ix-modal",{"size":[1],"animation":[4],"backdrop":[4],"closeOnBackdropClick":[4,"close-on-backdrop-click"],"beforeDismiss":[16],"centered":[4],"keyboard":[4],"closeOnEscape":[4,"close-on-escape"],"modalVisible":[32],"showModal":[64],"dismissModal":[64],"closeModal":[64]}]]],["p-5dd97d39",[[1,"ix-modal-footer"]]],["p-75943110",[[1,"ix-pane-layout",{"layout":[1],"variant":[1],"borderless":[4],"isMobile":[32],"paneElements":[32]},[[0,"slotChanged","onSlotChanged"],[0,"hideOnCollapseChanged","onCollapsibleChanged"],[0,"variantChanged","onVariantChanged"]],{"paneElements":["onPaneElementsChange"],"variant":["onVariableChange"],"borderless":["onBorderChange"],"layout":["onLayoutChange"],"isMobile":["onMobileChange"]}]]],["p-9ceabb5f",[[1,"ix-pill",{"variant":[513],"outline":[4],"icon":[1],"background":[1],"color":[1],"pillColor":[1,"pill-color"],"alignLeft":[4,"align-left"]}]]],["p-975cb736",[[2,"ix-playground-internal"]]],["p-3ead4fed",[[1,"ix-tile",{"size":[1],"hasHeaderSlot":[32],"hasFooterSlot":[32]}]]],["p-ab282d03",[[1,"ix-toggle",{"checked":[1540],"disabled":[4],"indeterminate":[1540],"textOn":[1,"text-on"],"textOff":[1,"text-off"],"textIndeterminate":[1,"text-indeterminate"],"hideText":[4,"hide-text"]}]]],["p-f1e94d25",[[1,"ix-validation-tooltip",{"message":[1],"placement":[1],"suppressAutomaticPlacement":[4,"suppress-automatic-placement"],"isInputValid":[32],"tooltipPosition":[32],"arrowPosition":[32]},null,{"isInputValid":["validationChanged"]}]]],["p-31bfd5ff",[[1,"ix-workflow-step",{"vertical":[4],"disabled":[4],"status":[1],"clickable":[4],"selected":[4],"position":[1],"iconName":[32],"iconColor":[32]},null,{"selected":["selectedHandler"],"disabled":["watchPropHandler"],"status":["watchPropHandler"]}]]],["p-da9f8709",[[1,"ix-workflow-steps",{"vertical":[4],"clickable":[4],"selectedIndex":[2,"selected-index"]},[[0,"selectedChanged","onStepSelectionChanged"]]]]],["p-ca8407f5",[[1,"ix-dropdown-item",{"label":[1],"icon":[1],"hover":[4],"disabled":[4],"checked":[4],"isSubMenu":[4,"is-sub-menu"],"suppressChecked":[4,"suppress-checked"],"emitItemClick":[64],"getDropdownItemElement":[64]}]]],["p-1aa9c005",[[1,"ix-dropdown",{"suppressAutomaticPlacement":[4,"suppress-automatic-placement"],"show":[1540],"trigger":[1],"anchor":[1],"closeBehavior":[8,"close-behavior"],"placement":[1],"positioningStrategy":[1,"positioning-strategy"],"header":[1],"offset":[16],"overwriteDropdownStyle":[16],"discoverAllSubmenus":[4,"discover-all-submenus"],"discoverSubmenu":[64],"updatePosition":[64]},[[0,"ix-assign-sub-menu","cacheSubmenuId"]],{"show":["changedShow"],"trigger":["changedTrigger"]}]]],["p-a3431d63",[[1,"ix-icon-button",{"a11yLabel":[1,"a11y-label"],"variant":[1],"outline":[4],"ghost":[4],"oval":[4],"icon":[1],"size":[1],"color":[1],"iconColor":[1,"icon-color"],"disabled":[4],"type":[1],"loading":[4]}],[1,"ix-spinner",{"variant":[1],"size":[1],"hideTrack":[4,"hide-track"]}]]],["p-353e2dd5",[[1,"ix-select",{"selectedIndices":[1025,"selected-indices"],"value":[1025],"allowClear":[4,"allow-clear"],"mode":[1],"editable":[4],"disabled":[4],"readonly":[4],"i18nPlaceholder":[1,"i-1-8n-placeholder"],"i18nPlaceholderEditable":[1,"i-1-8n-placeholder-editable"],"i18nSelectListHeader":[1,"i-1-8n-select-list-header"],"i18nNoMatches":[1,"i-1-8n-no-matches"],"hideListHeader":[4,"hide-list-header"],"dropdownShow":[32],"selectedLabels":[32],"dropdownWrapperRef":[32],"dropdownAnchor":[32],"isDropdownEmpty":[32],"hasFocus":[32],"navigationItem":[32],"inputFilterText":[32],"inputValue":[32]},[[0,"itemClick","onItemClicked"],[0,"ix-select-item:labelChange","onLabelChange"]],{"selectedIndices":["watchSelectedIndices"],"value":["watchValue"]}]]],["p-e1d7c7fa",[[1,"ix-time-picker",{"format":[1],"corners":[1],"standaloneAppearance":[4,"standalone-appearance"],"individual":[4],"showHour":[4,"show-hour"],"showMinutes":[4,"show-minutes"],"showSeconds":[4,"show-seconds"],"time":[1],"showTimeReference":[1028,"show-time-reference"],"timeReference":[1,"time-reference"],"textSelectTime":[1,"text-select-time"],"textTime":[1,"text-time"],"_time":[32],"_timeRef":[32],"_formattedTime":[32],"getCurrentTime":[64]},null,{"time":["watchTimePropHandler"],"_time":["formatTime","onInternalTimeChange"]}]]],["p-27118d3b",[[1,"ix-map-navigation-overlay",{"name":[1],"icon":[1],"color":[1],"iconColor":[1,"icon-color"]}]]],["p-f56686c9",[[1,"ix-toast",{"type":[1],"toastTitle":[1,"toast-title"],"autoCloseDelay":[2,"auto-close-delay"],"autoClose":[4,"auto-close"],"icon":[1],"iconColor":[1,"icon-color"],"progress":[32],"touched":[32]}]]],["p-8b1add8f",[[1,"ix-breadcrumb-item",{"label":[1],"icon":[1],"ghost":[4],"visible":[4],"showChevron":[4,"show-chevron"],"isDropdownTrigger":[4,"is-dropdown-trigger"],"a11y":[32]}]]],["p-3214478e",[[1,"ix-tooltip",{"for":[1],"titleContent":[1,"title-content"],"interactive":[4],"placement":[1],"animationFrame":[4,"animation-frame"],"visible":[32],"showTooltip":[64],"hideTooltip":[64]}]]],["p-f2ee640a",[[1,"ix-tree-item",{"text":[1],"hasChildren":[4,"has-children"],"context":[16]}]]],["p-22a792da",[[1,"ix-avatar",{"image":[1],"initials":[1],"username":[1],"extra":[1],"isClosestApplicationHeader":[32],"hasSlottedElements":[32]}],[1,"ix-menu-avatar-item",{"icon":[1],"label":[1],"getDropdownItemElement":[64]}]]],["p-40335e7c",[[1,"ix-application-header",{"name":[1],"breakpoint":[32],"menuExpanded":[32],"suppressResponsive":[32],"hasSlottedElements":[32],"applicationLayoutContext":[32]}]]],["p-d6e7e5da",[[1,"ix-modal-header",{"hideClose":[4,"hide-close"],"icon":[1],"iconColor":[1,"icon-color"]},null,{"icon":["onIconChange"]}],[1,"ix-modal-content"]]],["p-8c01fea2",[[1,"ix-group-context-menu",{"showContextMenu":[32]}],[1,"ix-group-item",{"icon":[1],"text":[1],"secondaryText":[1,"secondary-text"],"suppressSelection":[4,"suppress-selection"],"selected":[4],"focusable":[4],"index":[2]},[[1,"click","clickListen"]]]]],["p-fdccc402",[[1,"ix-card-accordion",{"collapse":[4],"expandContent":[32]},null,{"collapse":["onInitialExpandChange"]}],[1,"ix-card-title"]]],["p-8efe88e8",[[1,"ix-menu-item",{"home":[4],"bottom":[4],"tabIcon":[1025,"tab-icon"],"icon":[1025],"notifications":[2],"active":[4],"disabled":[4],"title":[32]},null,{"icon":["onIconChange"],"tabIcon":["onTabIconChange"]}]]],["p-2deed888",[[1,"ix-divider"]]],["p-0e51828d",[[1,"ix-burger-menu",{"ixAriaLabel":[1,"ix-aria-label"],"expanded":[516],"pinned":[4]}]]],["p-4bb08459",[[1,"ix-tab-item",{"selected":[4],"disabled":[4],"small":[4],"icon":[4],"rounded":[4],"counter":[2],"layout":[1],"placement":[1]}],[1,"ix-tabs",{"small":[4],"rounded":[4],"selected":[1026],"layout":[1],"placement":[1],"totalItems":[32],"currentScrollAmount":[32],"scrollAmount":[32],"scrollActionAmount":[32]},[[9,"resize","onWindowResize"],[0,"tabClick","onTabClick"]]]]],["p-050f482a",[[1,"ix-date-time-card",{"standaloneAppearance":[8,"standalone-appearance"],"individual":[4],"corners":[1]}]]],["p-fc5fd951",[[1,"ix-select-item",{"label":[513],"value":[520],"selected":[4],"hover":[4],"onItemClick":[64]},null,{"label":["labelChange"]}],[1,"ix-filter-chip",{"disabled":[4],"readonly":[4]}]]],["p-75050430",[[1,"ix-card",{"variant":[1],"selected":[4]}],[1,"ix-card-content"]]],["p-f1635e06",[[1,"ix-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[516],"type":[1],"loading":[4],"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"]}]]],["p-06b783a7",[[1,"ix-date-picker",{"format":[1],"range":[4],"corners":[1],"from":[1],"to":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"textSelectDate":[1,"text-select-date"],"i18nDone":[1,"i18n-done"],"weekStartIndex":[2,"week-start-index"],"locale":[1],"individual":[4],"eventDelimiter":[1,"event-delimiter"],"standaloneAppearance":[4,"standalone-appearance"],"today":[1],"currFromDate":[32],"currToDate":[32],"selectedYear":[32],"tempYear":[32],"startYear":[32],"endYear":[32],"selectedMonth":[32],"tempMonth":[32],"dropdownButtonRef":[32],"yearContainerRef":[32],"dayNames":[32],"monthNames":[32],"firstMonthRef":[32],"focusedDay":[32],"focusedDayElem":[32],"getCurrentDate":[64]},null,{"from":["watchFromPropHandler"],"to":["watchToPropHandler"],"locale":["onLocaleChange"]}],[1,"ix-col",{"size":[1],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"]},[[9,"resize","onResize"]]],[1,"ix-layout-grid",{"noMargin":[4,"no-margin"],"gap":[1],"columns":[2]}],[1,"ix-row"]]],["p-3bc095f3",[[1,"ix-typography",{"variant":[1],"format":[1],"color":[1],"textColor":[1,"text-color"],"bold":[4],"textDecoration":[1,"text-decoration"]}]]]]'),e)}));
1
+ import{p as e,b as a}from"./p-ea80cb61.js";export{s as setNonce}from"./p-ea80cb61.js";import{g as t}from"./p-737b08c6.js";const i=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};i().then((async e=>{await t();return a(JSON.parse('[["p-d445b333",[[1,"ix-datetime-picker",{"range":[4],"showHour":[4,"show-hour"],"showMinutes":[4,"show-minutes"],"showSeconds":[4,"show-seconds"],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"dateFormat":[1,"date-format"],"timeFormat":[1,"time-format"],"from":[1],"to":[1],"time":[1],"showTimeReference":[8,"show-time-reference"],"timeReference":[1,"time-reference"],"textSelectDate":[1,"text-select-date"],"i18nDone":[1,"i18n-done"],"weekStartIndex":[2,"week-start-index"],"locale":[1],"eventDelimiter":[1,"event-delimiter"]}]]],["p-e345d0d2",[[1,"ix-date-dropdown",{"format":[1],"range":[4],"from":[1],"to":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"dateRangeId":[1,"date-range-id"],"customRangeAllowed":[4,"custom-range-allowed"],"dateRangeOptions":[16],"i18nCustomItem":[1,"i18n-custom-item"],"i18nDone":[1,"i18n-done"],"i18nNoRange":[1,"i18n-no-range"],"today":[1],"selectedDateRangeId":[32],"currentRangeValue":[32],"triggerRef":[32],"getDateRange":[64]},null,{"dateRangeId":["onDateRangeIdChange"],"to":["onDateRangeIdChange"],"from":["onDateRangeIdChange"],"dateRangeOptions":["onDateRangeOptionsChange"]}]]],["p-a643ad05",[[1,"ix-pagination",{"advanced":[4],"itemCount":[2,"item-count"],"showItemCount":[4,"show-item-count"],"count":[2],"selectedPage":[1026,"selected-page"],"i18nPage":[1,"i-1-8n-page"],"i18nOf":[1,"i-1-8n-of"],"i18nItems":[1,"i-1-8n-items"]}]]],["p-f6691728",[[1,"ix-menu-avatar",{"top":[1],"bottom":[1],"image":[1],"initials":[1],"i18nLogout":[1,"i-1-8n-logout"],"showLogoutButton":[4,"show-logout-button"],"showContextMenu":[32]}]]],["p-f8169051",[[1,"ix-card-list",{"label":[1],"collapse":[1028],"listStyle":[1,"list-style"],"maxVisibleCards":[2,"max-visible-cards"],"showAllCount":[2,"show-all-count"],"suppressOverflowHandling":[4,"suppress-overflow-handling"],"i18nShowAll":[1,"i-1-8n-show-all"],"i18nMoreCards":[1,"i-1-8n-more-cards"],"hasOverflowingElements":[32],"numberOfOverflowingElements":[32],"numberOfAllChildElements":[32],"leftScrollDistance":[32],"rightScrollDistance":[32]},[[9,"resize","detectOverflow"]]]]],["p-b62e2edf",[[1,"ix-map-navigation",{"applicationName":[1,"application-name"],"navigationTitle":[1,"navigation-title"],"hideContextMenu":[4,"hide-context-menu"],"isSidebarOpen":[32],"hasContentHeader":[32],"toggleSidebar":[64],"openOverlay":[64],"closeOverlay":[64]}]]],["p-f5af5a9f",[[1,"ix-application-switch-modal",{"config":[16]}]]],["p-4c29feb5",[[1,"ix-basic-navigation",{"applicationName":[1,"application-name"],"hideHeader":[4,"hide-header"],"forceBreakpoint":[1,"force-breakpoint"],"breakpoints":[16],"breakpoint":[32]},null,{"hideHeader":["onHideHeaderChange"],"breakpoints":["onBreakpointsChange"]}]]],["p-cfc7a9ac",[[1,"ix-menu-category",{"label":[1],"icon":[1],"notifications":[2],"menuExpand":[32],"showItems":[32],"showDropdown":[32],"nestedItems":[32]}]]],["p-d59b3f31",[[1,"ix-push-card",{"icon":[1],"notification":[1],"heading":[1],"subheading":[1],"variant":[1],"collapse":[4]}]]],["p-26355e12",[[1,"ix-breadcrumb",{"visibleItemCount":[2,"visible-item-count"],"nextItems":[16],"ghost":[4],"ariaLabelPreviousButton":[1,"aria-label-previous-button"],"previousButtonRef":[32],"nextButtonRef":[32],"items":[32],"isPreviousDropdownExpanded":[32]},null,{"nextItems":["onNextItemsChange"]}]]],["p-6cd2b4d4",[[1,"ix-category-filter",{"disabled":[4],"readonly":[4],"filterState":[16],"placeholder":[1],"categories":[16],"nonSelectableCategories":[16],"suggestions":[16],"icon":[1],"hideIcon":[4,"hide-icon"],"repeatCategories":[4,"repeat-categories"],"tmpDisableScrollIntoView":[4,"tmp-disable-scroll-into-view"],"labelCategories":[1,"label-categories"],"i18nPlainText":[1,"i-1-8n-plain-text"],"showDropdown":[32],"textInput":[32],"hasFocus":[32],"categoryLogicalOperator":[32],"inputValue":[32],"category":[32],"filterTokens":[32]},null,{"filterState":["watchFilterState"]}]]],["p-73d5ea4a",[[1,"ix-dropdown-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[4],"label":[1],"icon":[1],"closeBehavior":[8,"close-behavior"],"placement":[1],"dropdownAnchor":[32]}]]],["p-782b33d3",[[1,"ix-group",{"suppressHeaderSelection":[4,"suppress-header-selection"],"header":[1],"subHeader":[1,"sub-header"],"collapsed":[1540],"selected":[1540],"index":[1538],"expandOnHeaderClick":[4,"expand-on-header-click"],"itemSelected":[32],"dropdownTriggerRef":[32],"slotSize":[32],"footerVisible":[32]}]]],["p-6a8d50c3",[[1,"ix-menu",{"showSettings":[1028,"show-settings"],"showAbout":[1028,"show-about"],"enableToggleTheme":[4,"enable-toggle-theme"],"enableSettings":[4,"enable-settings"],"enableMapExpand":[4,"enable-map-expand"],"applicationName":[1,"application-name"],"applicationDescription":[1,"application-description"],"maxVisibleMenuItems":[2,"max-visible-menu-items"],"i18nExpandSidebar":[1,"i-1-8n-expand-sidebar"],"expand":[1540],"pinned":[4],"i18nLegal":[1,"i-1-8n-legal"],"i18nSettings":[1,"i-1-8n-settings"],"i18nToggleTheme":[1,"i-1-8n-toggle-theme"],"i18nExpand":[1,"i-1-8n-expand"],"i18nCollapse":[1,"i-1-8n-collapse"],"showPinned":[32],"mapExpand":[32],"activeTab":[32],"breakpoint":[32],"itemsScrollShadowTop":[32],"itemsScrollShadowBottom":[32],"applicationLayoutContext":[32],"toggleMapExpand":[64],"toggleMenu":[64],"toggleSettings":[64],"toggleAbout":[64]},[[9,"resize","handleOverflowIndicator"],[0,"close","onOverlayClose"]],{"pinned":["pinnedChange"]}]]],["p-fcbe42c4",[[1,"ix-menu-about",{"activeTabLabel":[1025,"active-tab-label"],"label":[1],"show":[4],"items":[32]},null,{"activeTabLabel":["updateTab"]}]]],["p-58f51cce",[[1,"ix-menu-about-news",{"show":[1540],"label":[1],"i18nShowMore":[1,"i-1-8n-show-more"],"aboutItemLabel":[1,"about-item-label"],"offsetBottom":[2,"offset-bottom"],"expanded":[4]}]]],["p-3c6e6130",[[1,"ix-menu-settings",{"activeTabLabel":[1025,"active-tab-label"],"label":[1],"show":[4],"items":[32]},null,{"activeTabLabel":["updateTab"]}]]],["p-d464b60e",[[1,"ix-split-button",{"variant":[1],"outline":[4],"ghost":[4],"label":[1],"icon":[1],"splitIcon":[1,"split-icon"],"disabled":[4],"placement":[1],"toggle":[32]}]]],["p-37d299a4",[[1,"ix-action-card",{"variant":[1],"icon":[1],"heading":[1],"subheading":[1],"selected":[4]}]]],["p-064a1a47",[[1,"ix-content-header",{"variant":[1],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"hasBackButton":[4,"has-back-button"]}]]],["p-988d23ac",[[1,"ix-empty-state",{"layout":[1],"icon":[1],"header":[1],"subHeader":[1,"sub-header"],"action":[1]}]]],["p-8493da96",[[0,"ix-modal-example"]]],["p-1e5e042b",[[1,"ix-pane",{"heading":[1],"variant":[1],"hideOnCollapse":[4,"hide-on-collapse"],"size":[1],"borderless":[4],"expanded":[1028],"composition":[1025],"icon":[1],"ignoreLayoutSettings":[4,"ignore-layout-settings"],"isMobile":[1028,"is-mobile"],"expandIcon":[32],"showContent":[32],"minimizeIcon":[32],"floating":[32],"parentWidthPx":[32],"parentHeightPx":[32]},null,{"isMobile":["onMobileChange"],"composition":["onPositionChange"],"hideOnCollapse":["onHideOnCollapseChange"],"variant":["onVariantChange"],"borderless":["onBorderlessChange"],"expanded":["onExpandedChange"],"parentHeightPx":["onParentSizeChange"],"parentWidthPx":["onParentSizeChange"],"size":["onSizeChange"]}]]],["p-f5a108d5",[[1,"ix-toast-container",{"containerId":[1,"container-id"],"containerClass":[1,"container-class"],"position":[1],"showToast":[64]},null,{"position":["onPositionChange"]}]]],["p-535ee46b",[[1,"ix-chip",{"variant":[513],"active":[4],"closable":[4],"icon":[1],"background":[1],"color":[1],"chipColor":[1,"chip-color"],"outline":[4]}]]],["p-ca53ecd8",[[1,"ix-drawer",{"show":[1028],"closeOnClickOutside":[4,"close-on-click-outside"],"fullHeight":[4,"full-height"],"minWidth":[2,"min-width"],"maxWidth":[2,"max-width"],"width":[8],"toggleDrawer":[64]},null,{"show":["onShowChanged"]}]]],["p-f10824af",[[1,"ix-expanding-search",{"icon":[1],"placeholder":[1],"value":[1025],"fullWidth":[4,"full-width"],"isFieldChanged":[32],"expanded":[32],"hasFocus":[32]}]]],["p-92fc6ba1",[[1,"ix-flip-tile",{"state":[1],"height":[8],"width":[8],"index":[32],"isFlipAnimationActive":[32]}]]],["p-34ccbe57",[[1,"ix-message-bar",{"type":[1],"dismissible":[4],"icon":[32],"color":[32]}]]],["p-0e0e5f67",[[1,"ix-slider",{"step":[2],"min":[2],"max":[2],"value":[2],"marker":[16],"trace":[4],"traceReference":[2,"trace-reference"],"disabled":[4],"error":[8],"rangeInput":[32],"rangeMin":[32],"rangeMax":[32],"rangeTraceReference":[32],"showTooltip":[32]},null,{"showTooltip":["onShowTooltipChange"],"value":["updateRangeVariables"],"max":["updateRangeVariables"],"min":["updateRangeVariables"],"traceReference":["updateRangeVariables"]}]]],["p-ddf93bce",[[1,"ix-upload",{"accept":[1],"multiple":[4],"multiline":[4],"disabled":[4],"state":[1],"selectFileText":[1,"select-file-text"],"loadingText":[1,"loading-text"],"uploadFailedText":[1,"upload-failed-text"],"uploadSuccessText":[1,"upload-success-text"],"i18nUploadFile":[1,"i-1-8n-upload-file"],"i18nUploadDisabled":[1,"i-1-8n-upload-disabled"],"isFileOver":[32],"setFilesToUpload":[64]}]]],["p-b6c75dc3",[[1,"ix-blind",{"collapsed":[1540],"label":[1],"sublabel":[1],"icon":[1],"variant":[1]},null,{"collapsed":["animation"]}]]],["p-14d2576e",[[1,"ix-dropdown-header",{"label":[1]}]]],["p-8be3bc6d",[[1,"ix-icon-toggle-button",{"variant":[1],"outline":[4],"ghost":[4],"icon":[1],"pressed":[4],"size":[1],"disabled":[516],"loading":[4]},null,{"variant":["onVariantChange"],"ghost":["onGhostChange"],"outline":["onOutlineChange"]}]]],["p-fe760d17",[[1,"ix-modal-loading"]]],["p-232bee46",[[1,"ix-split-button-item",{"icon":[1],"label":[1],"getDropdownItemElement":[64]}]]],["p-5d3975c8",[[1,"ix-toggle-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[516],"loading":[4],"icon":[1],"pressed":[4]},null,{"variant":["onVariantChange"],"ghost":["onGhostChange"],"outline":["onOutlineChange"]}]]],["p-c0bf9382",[[1,"ix-tree",{"root":[1],"model":[16],"renderItem":[16],"context":[1040]},null,{"model":["modelChange"]}]]],["p-2462fc76",[[1,"ix-application",{"theme":[1],"themeSystemAppearance":[4,"theme-system-appearance"],"forceBreakpoint":[1,"force-breakpoint"],"breakpoints":[16],"appSwitchConfig":[16],"breakpoint":[32],"applicationSidebarSlotted":[32]},null,{"breakpoints":["onBreakpointsChange"],"theme":["changeTheme"],"themeSystemAppearance":["changeTheme"],"appSwitchConfig":["onApplicationSidebarChange"],"applicationSidebarSlotted":["onApplicationSidebarChange"]}]]],["p-5ca2ef74",[[1,"ix-application-sidebar",{"visible":[32]},[[8,"application-sidebar-toggle","listenToggleEvent"]]]]],["p-d277e7e2",[[1,"ix-content",{"isContentHeaderSlotted":[32]}]]],["p-2cdd0028",[[1,"ix-css-grid",{"templates":[16],"currentTemplate":[32]}]]],["p-3c0425f3",[[1,"ix-css-grid-item",{"itemName":[1,"item-name"]}]]],["p-e1b790d3",[[1,"ix-dropdown-quick-actions"]]],["p-81b570f5",[[1,"ix-event-list",{"itemHeight":[8,"item-height"],"compact":[4],"animated":[4],"chevron":[4]},null,{"chevron":["watchChevron"]}]]],["p-4dad31fa",[[1,"ix-event-list-item",{"color":[1],"itemColor":[1,"item-color"],"selected":[4],"disabled":[4],"chevron":[4]},[[1,"click","handleItemClick"]]]]],["p-eb6ea42d",[[1,"ix-flip-tile-content",{"contentVisible":[4,"content-visible"]}]]],["p-db47293b",[[1,"ix-form-field",{"label":[1]}]]],["p-8b51637c",[[1,"ix-input-group",{"inputPaddingLeft":[32],"inputPaddingRight":[32]}]]],["p-42f7289e",[[1,"ix-key-value",{"icon":[1],"label":[1],"labelPosition":[1,"label-position"],"value":[1]}]]],["p-572455df",[[1,"ix-key-value-list",{"striped":[4]}]]],["p-47919d43",[[1,"ix-kpi",{"label":[1],"value":[8],"unit":[1],"state":[1],"orientation":[1]}]]],["p-50f12507",[[1,"ix-link-button",{"disabled":[4],"url":[1],"target":[1]}]]],["p-196d2cef",[[1,"ix-menu-about-item",{"label":[513]},null,{"label":["watchLabel"]}]]],["p-78e332f4",[[1,"ix-menu-settings-item",{"label":[513]},null,{"label":["watchLabel"]}]]],["p-04ba3c79",[[1,"ix-modal",{"size":[1],"animation":[4],"backdrop":[4],"closeOnBackdropClick":[4,"close-on-backdrop-click"],"beforeDismiss":[16],"centered":[4],"keyboard":[4],"closeOnEscape":[4,"close-on-escape"],"modalVisible":[32],"showModal":[64],"dismissModal":[64],"closeModal":[64]}]]],["p-c98d8ec2",[[1,"ix-modal-footer"]]],["p-75943110",[[1,"ix-pane-layout",{"layout":[1],"variant":[1],"borderless":[4],"isMobile":[32],"paneElements":[32]},[[0,"slotChanged","onSlotChanged"],[0,"hideOnCollapseChanged","onCollapsibleChanged"],[0,"variantChanged","onVariantChanged"]],{"paneElements":["onPaneElementsChange"],"variant":["onVariableChange"],"borderless":["onBorderChange"],"layout":["onLayoutChange"],"isMobile":["onMobileChange"]}]]],["p-9ceabb5f",[[1,"ix-pill",{"variant":[513],"outline":[4],"icon":[1],"background":[1],"color":[1],"pillColor":[1,"pill-color"],"alignLeft":[4,"align-left"]}]]],["p-975cb736",[[2,"ix-playground-internal"]]],["p-3ead4fed",[[1,"ix-tile",{"size":[1],"hasHeaderSlot":[32],"hasFooterSlot":[32]}]]],["p-ab282d03",[[1,"ix-toggle",{"checked":[1540],"disabled":[4],"indeterminate":[1540],"textOn":[1,"text-on"],"textOff":[1,"text-off"],"textIndeterminate":[1,"text-indeterminate"],"hideText":[4,"hide-text"]}]]],["p-f1e94d25",[[1,"ix-validation-tooltip",{"message":[1],"placement":[1],"suppressAutomaticPlacement":[4,"suppress-automatic-placement"],"isInputValid":[32],"tooltipPosition":[32],"arrowPosition":[32]},null,{"isInputValid":["validationChanged"]}]]],["p-31bfd5ff",[[1,"ix-workflow-step",{"vertical":[4],"disabled":[4],"status":[1],"clickable":[4],"selected":[4],"position":[1],"iconName":[32],"iconColor":[32]},null,{"selected":["selectedHandler"],"disabled":["watchPropHandler"],"status":["watchPropHandler"]}]]],["p-da9f8709",[[1,"ix-workflow-steps",{"vertical":[4],"clickable":[4],"selectedIndex":[2,"selected-index"]},[[0,"selectedChanged","onStepSelectionChanged"]]]]],["p-ca8407f5",[[1,"ix-dropdown-item",{"label":[1],"icon":[1],"hover":[4],"disabled":[4],"checked":[4],"isSubMenu":[4,"is-sub-menu"],"suppressChecked":[4,"suppress-checked"],"emitItemClick":[64],"getDropdownItemElement":[64]}]]],["p-4ca6beed",[[1,"ix-dropdown",{"suppressAutomaticPlacement":[4,"suppress-automatic-placement"],"show":[1540],"trigger":[1],"anchor":[1],"closeBehavior":[8,"close-behavior"],"placement":[1],"positioningStrategy":[1,"positioning-strategy"],"header":[1],"offset":[16],"overwriteDropdownStyle":[16],"discoverAllSubmenus":[4,"discover-all-submenus"],"discoverSubmenu":[64],"updatePosition":[64]},[[0,"ix-assign-sub-menu","cacheSubmenuId"]],{"show":["changedShow"],"trigger":["changedTrigger"]}]]],["p-a3431d63",[[1,"ix-icon-button",{"a11yLabel":[1,"a11y-label"],"variant":[1],"outline":[4],"ghost":[4],"oval":[4],"icon":[1],"size":[1],"color":[1],"iconColor":[1,"icon-color"],"disabled":[4],"type":[1],"loading":[4]}],[1,"ix-spinner",{"variant":[1],"size":[1],"hideTrack":[4,"hide-track"]}]]],["p-353e2dd5",[[1,"ix-select",{"selectedIndices":[1025,"selected-indices"],"value":[1025],"allowClear":[4,"allow-clear"],"mode":[1],"editable":[4],"disabled":[4],"readonly":[4],"i18nPlaceholder":[1,"i-1-8n-placeholder"],"i18nPlaceholderEditable":[1,"i-1-8n-placeholder-editable"],"i18nSelectListHeader":[1,"i-1-8n-select-list-header"],"i18nNoMatches":[1,"i-1-8n-no-matches"],"hideListHeader":[4,"hide-list-header"],"dropdownShow":[32],"selectedLabels":[32],"dropdownWrapperRef":[32],"dropdownAnchor":[32],"isDropdownEmpty":[32],"hasFocus":[32],"navigationItem":[32],"inputFilterText":[32],"inputValue":[32]},[[0,"itemClick","onItemClicked"],[0,"ix-select-item:labelChange","onLabelChange"]],{"selectedIndices":["watchSelectedIndices"],"value":["watchValue"]}]]],["p-e1d7c7fa",[[1,"ix-time-picker",{"format":[1],"corners":[1],"standaloneAppearance":[4,"standalone-appearance"],"individual":[4],"showHour":[4,"show-hour"],"showMinutes":[4,"show-minutes"],"showSeconds":[4,"show-seconds"],"time":[1],"showTimeReference":[1028,"show-time-reference"],"timeReference":[1,"time-reference"],"textSelectTime":[1,"text-select-time"],"textTime":[1,"text-time"],"_time":[32],"_timeRef":[32],"_formattedTime":[32],"getCurrentTime":[64]},null,{"time":["watchTimePropHandler"],"_time":["formatTime","onInternalTimeChange"]}]]],["p-27118d3b",[[1,"ix-map-navigation-overlay",{"name":[1],"icon":[1],"color":[1],"iconColor":[1,"icon-color"]}]]],["p-f56686c9",[[1,"ix-toast",{"type":[1],"toastTitle":[1,"toast-title"],"autoCloseDelay":[2,"auto-close-delay"],"autoClose":[4,"auto-close"],"icon":[1],"iconColor":[1,"icon-color"],"progress":[32],"touched":[32]}]]],["p-8b1add8f",[[1,"ix-breadcrumb-item",{"label":[1],"icon":[1],"ghost":[4],"visible":[4],"showChevron":[4,"show-chevron"],"isDropdownTrigger":[4,"is-dropdown-trigger"],"a11y":[32]}]]],["p-3214478e",[[1,"ix-tooltip",{"for":[1],"titleContent":[1,"title-content"],"interactive":[4],"placement":[1],"animationFrame":[4,"animation-frame"],"visible":[32],"showTooltip":[64],"hideTooltip":[64]}]]],["p-f2ee640a",[[1,"ix-tree-item",{"text":[1],"hasChildren":[4,"has-children"],"context":[16]}]]],["p-e23cd82e",[[1,"ix-avatar",{"image":[1],"initials":[1],"username":[1],"extra":[1],"isClosestApplicationHeader":[32],"hasSlottedElements":[32]}],[1,"ix-menu-avatar-item",{"icon":[1],"label":[1],"getDropdownItemElement":[64]}]]],["p-40335e7c",[[1,"ix-application-header",{"name":[1],"breakpoint":[32],"menuExpanded":[32],"suppressResponsive":[32],"hasSlottedElements":[32],"applicationLayoutContext":[32]}]]],["p-16d529ee",[[1,"ix-modal-header",{"hideClose":[4,"hide-close"],"icon":[1],"iconColor":[1,"icon-color"]},null,{"icon":["onIconChange"]}],[1,"ix-modal-content"]]],["p-8c01fea2",[[1,"ix-group-context-menu",{"showContextMenu":[32]}],[1,"ix-group-item",{"icon":[1],"text":[1],"secondaryText":[1,"secondary-text"],"suppressSelection":[4,"suppress-selection"],"selected":[4],"focusable":[4],"index":[2]},[[1,"click","clickListen"]]]]],["p-fdccc402",[[1,"ix-card-accordion",{"collapse":[4],"expandContent":[32]},null,{"collapse":["onInitialExpandChange"]}],[1,"ix-card-title"]]],["p-8efe88e8",[[1,"ix-menu-item",{"home":[4],"bottom":[4],"tabIcon":[1025,"tab-icon"],"icon":[1025],"notifications":[2],"active":[4],"disabled":[4],"title":[32]},null,{"icon":["onIconChange"],"tabIcon":["onTabIconChange"]}]]],["p-2deed888",[[1,"ix-divider"]]],["p-0e51828d",[[1,"ix-burger-menu",{"ixAriaLabel":[1,"ix-aria-label"],"expanded":[516],"pinned":[4]}]]],["p-4bb08459",[[1,"ix-tab-item",{"selected":[4],"disabled":[4],"small":[4],"icon":[4],"rounded":[4],"counter":[2],"layout":[1],"placement":[1]}],[1,"ix-tabs",{"small":[4],"rounded":[4],"selected":[1026],"layout":[1],"placement":[1],"totalItems":[32],"currentScrollAmount":[32],"scrollAmount":[32],"scrollActionAmount":[32]},[[9,"resize","onWindowResize"],[0,"tabClick","onTabClick"]]]]],["p-050f482a",[[1,"ix-date-time-card",{"standaloneAppearance":[8,"standalone-appearance"],"individual":[4],"corners":[1]}]]],["p-fc5fd951",[[1,"ix-select-item",{"label":[513],"value":[520],"selected":[4],"hover":[4],"onItemClick":[64]},null,{"label":["labelChange"]}],[1,"ix-filter-chip",{"disabled":[4],"readonly":[4]}]]],["p-75050430",[[1,"ix-card",{"variant":[1],"selected":[4]}],[1,"ix-card-content"]]],["p-f1635e06",[[1,"ix-button",{"variant":[1],"outline":[4],"ghost":[4],"disabled":[516],"type":[1],"loading":[4],"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"]}]]],["p-06b783a7",[[1,"ix-date-picker",{"format":[1],"range":[4],"corners":[1],"from":[1],"to":[1],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"textSelectDate":[1,"text-select-date"],"i18nDone":[1,"i18n-done"],"weekStartIndex":[2,"week-start-index"],"locale":[1],"individual":[4],"eventDelimiter":[1,"event-delimiter"],"standaloneAppearance":[4,"standalone-appearance"],"today":[1],"currFromDate":[32],"currToDate":[32],"selectedYear":[32],"tempYear":[32],"startYear":[32],"endYear":[32],"selectedMonth":[32],"tempMonth":[32],"dropdownButtonRef":[32],"yearContainerRef":[32],"dayNames":[32],"monthNames":[32],"firstMonthRef":[32],"focusedDay":[32],"focusedDayElem":[32],"getCurrentDate":[64]},null,{"from":["watchFromPropHandler"],"to":["watchToPropHandler"],"locale":["onLocaleChange"]}],[1,"ix-col",{"size":[1],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"]},[[9,"resize","onResize"]]],[1,"ix-layout-grid",{"noMargin":[4,"no-margin"],"gap":[1],"columns":[2]}],[1,"ix-row"]]],["p-3bc095f3",[[1,"ix-typography",{"variant":[1],"format":[1],"color":[1],"textColor":[1,"text-color"],"bold":[4],"textDecoration":[1,"text-decoration"]}]]]]'),e)}));
2
2
  //# sourceMappingURL=siemens-ix.esm.js.map
package/package.json CHANGED
@@ -7,7 +7,7 @@
7
7
  "url": "https://github.com/siemens/ix",
8
8
  "directory": "packages/core"
9
9
  },
10
- "version": "2.1.1-beta.0",
10
+ "version": "2.1.2-beta.0",
11
11
  "license": "MIT",
12
12
  "description": "Siemens iX Web Components",
13
13
  "main": "dist/index.cjs.js",
@@ -1,2 +0,0 @@
1
- import{r,h as e,H as o}from"./p-ea80cb61.js";const t=":host{display:flex;padding:0.625rem;padding-top:1.5rem;justify-content:flex-end;align-items:center;gap:0.5rem;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const a=t;const s=class{constructor(e){r(this,e)}render(){return e(o,{key:"62e35b423b00c0ad75954e735188dce705f7ff3e"},e("slot",{key:"29a2a22875ae6197dab3c056329125dcefe70032"}))}};s.style=a;export{s as ix_modal_footer};
2
- //# sourceMappingURL=p-5dd97d39.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["modalFooterCss","IxModalFooterStyle0","ModalFooter","render","h","Host","key"],"sources":["src/components/modal-footer/modal-footer.scss?tag=ix-modal-footer&encapsulation=shadow","src/components/modal-footer/modal-footer.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: flex;\n padding: 0.625rem;\n padding-top: 1.5rem;\n justify-content: flex-end;\n align-items: center;\n gap: 0.5rem;\n align-self: stretch;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n tag: 'ix-modal-footer',\n styleUrl: 'modal-footer.scss',\n shadow: true,\n})\nexport class ModalFooter {\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"6CAAA,MAAMA,EAAiB,guBACvB,MAAAC,EAAeD,E,MCkBFE,EAAW,M,yBACtB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C"}
@@ -1,2 +0,0 @@
1
- import{r as e,c as i,h as o,F as t,H as l,g as d}from"./p-ea80cb61.js";import{a}from"./p-810b5232.js";import{a as r}from"./p-4f8ac3bf.js";const n=":host{display:flex;flex-direction:column;border-radius:var(--theme-blind--border-radius);overflow:hidden}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .blind-header-wrapper{display:block;position:relative;width:100%;min-height:3rem;height:3rem;overflow:hidden}:host .blind-header-content{display:flex;position:relative;align-items:center;justify-content:flex-start;width:100%;height:100%;z-index:1;pointer-events:none;padding-left:0.5rem}:host .blind-header-title{display:flex;position:relative;align-items:center;flex-grow:1;flex-shrink:0;margin-right:1rem}:host .blind-header{all:unset;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;position:absolute;top:0px;left:0px;pointer-events:all;padding-left:2.5rem;min-height:3rem;height:3rem;width:calc(100% - 2 * var(--theme-blind--border-thickness));border:solid var(--theme-blind--border-thickness) transparent;border-radius:var(--theme-blind--border-radius) var(--theme-blind--border-radius) 0 0;cursor:pointer}:host .blind-header:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr);outline:none}:host .blind-header-title-icon,:host .collapse-icon{margin-right:0.5rem}:host .blind-header-title-row{display:flex;flex-grow:1}:host .blind-header-title-col{flex-grow:1;flex-basis:0;display:inline-flex;align-items:center;min-width:0}:host .blind-header-title-col:not(:first-of-type){justify-content:flex-end}:host ix-typography{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .blind-header-title-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline-end:0.5rem}:host .blind-header-title-sublabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline:0.5rem}:host .blind-header-title{display:flex;align-items:center;flex-grow:1;height:100%;min-width:0}:host .blind-header-labels{display:inline-flex;flex-grow:1;min-width:0}:host .blind-content{display:block;padding:1rem;transition-property:padding;transition-duration:150ms;transition-timing-function:ease-in}:host .blind-content.hide{max-height:0;padding-top:0px;padding-bottom:0px}:host .header-actions{pointer-events:all}:host(.blind-alarm){background-color:var(--theme-blind-base--background)}:host(.blind-alarm) .blind-header{background-color:var(--theme-color-alarm)}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-alarm--hover)}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-alarm) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-alarm--active)}:host(.blind-alarm) .blind-header-title-label,:host(.blind-alarm) .blind-header-title-sublabel{color:var(--theme-color-alarm--contrast)}:host(.blind-critical){background-color:var(--theme-blind-base--background)}:host(.blind-critical) .blind-header{background-color:var(--theme-color-critical)}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-critical--hover)}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-critical) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-critical) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-critical--active)}:host(.blind-critical) .blind-header-title-label,:host(.blind-critical) .blind-header-title-sublabel{color:var(--theme-color-critical--contrast)}:host(.blind-info){background-color:var(--theme-blind-base--background)}:host(.blind-info) .blind-header{background-color:var(--theme-color-info)}:host(.blind-info) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-info) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-info--hover)}:host(.blind-info) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-info) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-info) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-info--active)}:host(.blind-info) .blind-header-title-label,:host(.blind-info) .blind-header-title-sublabel{color:var(--theme-color-info--contrast)}:host(.blind-insight){background-color:var(--theme-blind-base--background)}:host(.blind-insight) .blind-header{background-color:var(--theme-color-insight)}:host(.blind-insight) .blind-header:not(.disabled):not(:disabled).hover,:host(.blind-insight) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host(.blind-insight) .blind-header:not(.disabled):not(:disabled).active,:host(.blind-insight) .blind-header:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host(.blind-insight) .blind-header-title-label{color:var(--theme-color-std-text)}:host(.blind-insight) .blind-header-title-sublabel{color:var(--theme-color-soft-text)}:host(.blind-neutral){background-color:var(--theme-blind-base--background)}:host(.blind-neutral) .blind-header{background-color:var(--theme-color-neutral)}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-neutral--hover)}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-neutral) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-neutral--active)}:host(.blind-neutral) .blind-header-title-label,:host(.blind-neutral) .blind-header-title-sublabel{color:var(--theme-color-neutral--contrast)}:host(.blind-notification){background-color:var(--theme-blind-base--background)}:host(.blind-notification) .blind-header{background-color:var(--theme-color-notification)}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-notification--hover)}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-notification) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-notification) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-notification--active)}:host(.blind-notification) .blind-header-title-label,:host(.blind-notification) .blind-header-title-sublabel{color:var(--theme-color-notification--contrast)}:host(.blind-success){background-color:var(--theme-blind-base--background)}:host(.blind-success) .blind-header{background-color:var(--theme-color-success)}:host(.blind-success) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-success) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-success--hover)}:host(.blind-success) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-success) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-success) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-success--active)}:host(.blind-success) .blind-header-title-label,:host(.blind-success) .blind-header-title-sublabel{color:var(--theme-color-success--contrast)}:host(.blind-warning){background-color:var(--theme-blind-base--background)}:host(.blind-warning) .blind-header{background-color:var(--theme-color-warning)}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-warning--hover)}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-warning) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-warning) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-warning--active)}:host(.blind-warning) .blind-header-title-label,:host(.blind-warning) .blind-header-title-sublabel{color:var(--theme-color-warning--contrast)}:host(.blind-primary){background-color:var(--theme-blind-base--background)}:host(.blind-primary) .blind-header{background-color:var(--theme-color-primary)}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-primary--hover)}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host(.blind-primary) .blind-header:not(.disabled):not(:disabled):active,:host(.blind-primary) .blind-header:not(.disabled):not(:disabled).active{background-color:var(--theme-color-primary--active)}:host(.blind-primary) .blind-header-title-label,:host(.blind-primary) .blind-header-title-sublabel{color:var(--theme-color-primary--contrast)}:host(.blind-outline){border:solid var(--theme-blind--border-thickness) var(--theme-blind-base--border-color);border-color:var(--theme-color-soft-bdr)}:host(.blind-outline) .blind-header{background-color:var(--theme-color-ghost)}:host(.blind-outline) .blind-header:not(.disabled):not(:disabled).hover,:host(.blind-outline) .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host(.blind-outline) .blind-header:not(.disabled):not(:disabled).active,:host(.blind-outline) .blind-header:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host(.blind-outline) .blind-header-title-label{color:var(--theme-color-std-text)}:host(.blind-outline) .blind-header-title-sublabel{color:var(--theme-color-soft-text)}";const s=n;let b=0;const h=class{constructor(o){e(this,o);this.collapsedChange=i(this,"collapsedChange",7);this.blindId=++b;this.collapsed=false;this.label=undefined;this.sublabel=undefined;this.icon=undefined;this.variant="insight"}onHeaderClick(){this.collapsed=!this.collapsed;this.collapsedChange.emit(this.collapsed)}componentDidLoad(){this.animateCollapse(this.collapsed)}get content(){return this.hostElement.shadowRoot.querySelector(".blind-content")}animation(e){this.animateCollapse(e)}animateCollapse(e){if(e){this.rotateChevronRight()}else{this.rotateChevronDown()}}rotateChevronDown(){a({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:90});a({targets:this.content,duration:150,easing:"easeInOutSine",opacity:1})}rotateChevronRight(){a({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:0});a({targets:this.content,duration:150,easing:"easeInOutSine",opacity:0})}render(){return o(l,{key:"fa737e290302d9121790574a4a88738a0be492a6",class:{[`blind-${this.variant}`]:true}},o("div",{key:"a30152172426864588f8482a8f94f437948c74a4",class:"blind-header-wrapper"},o("div",{key:"8ee1a8aa21ff58cb88514fd5e428481b99e10728",class:"blind-header-content"},o("ix-icon",{key:"97117ee8008ea0b69e64f2c4a0149ce3b3897f44",class:"collapse-icon",name:"chevron-right-small",color:this.variant==="insight"||this.variant==="outline"?"color-primary":`color-${this.variant}--contrast`,ref:e=>this.chevronRef=e}),o("div",{key:"dbe488db7c5a77b5b09927698395a1f18674308a",class:"blind-header-title",id:`ix-blind-header-title-${this.blindId}`},this.label!==undefined?o(t,null,this.icon&&o("ix-icon",{class:"blind-header-title-icon",name:this.icon,color:this.variant==="insight"||this.variant==="outline"?"color-std-text":`color-${this.variant}--contrast`}),o("div",{class:"blind-header-title-row"},o("div",{class:"blind-header-title-col"},o("ix-typography",{title:this.label,format:"label-lg",bold:true},o("div",{class:"blind-header-title-label",title:this.label},this.label))),this.sublabel&&o("div",{class:"blind-header-title-col"},o("ix-typography",{title:this.sublabel},o("div",{class:"blind-header-title-sublabel"},this.sublabel)))),o("div",{class:"header-actions"},o("slot",{name:"header-actions"}))):null)),o("button",{key:"841d6430b672ee5a325803d69a86794620526cc6",class:{"blind-header":true,[`blind-${this.variant}`]:true,closed:this.collapsed},type:"button","aria-labelledby":`ix-blind-header-title-${this.blindId}`,"aria-controls":`ix-blind-content-section-${this.blindId}`,"aria-expanded":r(!this.collapsed),onClick:()=>this.onHeaderClick()},o("slot",{key:"96c40a71ba13b7b46d7b3148e2d76f6f69878eb6",name:"custom-header"}))),o("section",{key:"8702342c9b1a0c7bf81e753cdc9b88b76addacb3",id:`ix-blind-content-section-${this.blindId}`,"aria-labelledby":`ix-blind-header-title-${this.blindId}`},o("div",{key:"a362c9a6be61160391054fa0cbcb558c0e275a7f",class:{"blind-content":true,hide:this.collapsed}},!this.collapsed?o("slot",null):null)))}get hostElement(){return d(this)}static get watchers(){return{collapsed:["animation"]}}};h.style=s;export{h as ix_blind};
2
- //# sourceMappingURL=p-5f74fc83.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["blindCss","IxBlindStyle0","sequentialInstanceId","Blind","constructor","hostRef","this","blindId","onHeaderClick","collapsed","collapsedChange","emit","componentDidLoad","animateCollapse","content","hostElement","shadowRoot","querySelector","animation","isCollapsed","rotateChevronRight","rotateChevronDown","anime","targets","chevronRef","duration","easing","rotateZ","opacity","render","h","Host","key","class","variant","name","color","ref","id","label","undefined","Fragment","icon","title","format","bold","sublabel","closed","type","a11yBoolean","onClick","hide"],"sources":["src/components/blind/blind.scss?tag=ix-blind&encapsulation=shadow","src/components/blind/blind.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 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n@mixin blind($variant: 'insight') {\n :host(.blind-#{$variant}) {\n @if $variant == 'outline' {\n border: solid\n var(--theme-blind--border-thickness)\n var(--theme-blind-base--border-color);\n }\n\n .blind-header {\n @if $variant == 'outline' {\n background-color: var(--theme-color-ghost);\n } @else {\n background-color: var(--theme-color-#{$variant});\n }\n\n @if $variant == 'insight' or $variant == 'outline' {\n @include ghost-hover-pressed;\n } @else {\n @include hover {\n background-color: var(--theme-color-#{$variant}--hover);\n }\n\n @include active {\n background-color: var(--theme-color-#{$variant}--active);\n }\n }\n }\n\n @if $variant == 'insight' or $variant == 'outline' {\n .blind-header-title-label {\n color: var(--theme-color-std-text);\n }\n .blind-header-title-sublabel {\n color: var(--theme-color-soft-text);\n }\n } @else {\n .blind-header-title-label,\n .blind-header-title-sublabel {\n color: var(--theme-color-#{$variant}--contrast);\n }\n }\n\n @if $variant == 'outline' {\n border-color: var(--theme-color-soft-bdr);\n } @else {\n background-color: var(--theme-blind-base--background);\n }\n }\n}\n\n:host {\n @include ix-component;\n display: flex;\n flex-direction: column;\n border-radius: var(--theme-blind--border-radius);\n overflow: hidden;\n\n .blind-header-wrapper {\n display: block;\n position: relative;\n width: 100%;\n min-height: 3rem;\n height: 3rem;\n overflow: hidden;\n }\n\n .blind-header-content {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-start;\n\n width: 100%;\n height: 100%;\n z-index: 1;\n\n pointer-events: none;\n padding-left: 0.5rem;\n }\n\n .blind-header-title {\n display: flex;\n position: relative;\n align-items: center;\n flex-grow: 1;\n flex-shrink: 0;\n margin-right: 1rem;\n }\n\n .blind-header {\n all: unset;\n @include ellipsis;\n\n display: block;\n position: absolute;\n\n top: 0px;\n left: 0px;\n\n pointer-events: all;\n\n padding-left: 2.5rem;\n min-height: 3rem;\n height: 3rem;\n width: calc(100% - 2 * var(--theme-blind--border-thickness));\n border: solid var(--theme-blind--border-thickness) transparent;\n border-radius: var(--theme-blind--border-radius)\n var(--theme-blind--border-radius) 0 0;\n cursor: pointer;\n\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n outline: none;\n }\n }\n\n .blind-header-title-icon,\n .collapse-icon {\n margin-right: $small-space;\n }\n\n .blind-header-title-row {\n display: flex;\n flex-grow: 1;\n }\n\n .blind-header-title-col {\n flex-grow: 1;\n flex-basis: 0;\n display: inline-flex;\n align-items: center;\n min-width: 0;\n }\n\n .blind-header-title-col:not(:first-of-type) {\n justify-content: flex-end;\n }\n ix-typography {\n flex-grow: 1;\n @include ellipsis;\n }\n\n .blind-header-title-label {\n @include ellipsis;\n padding-inline-end: 0.5rem;\n }\n\n .blind-header-title-sublabel {\n @include ellipsis;\n padding-inline: 0.5rem;\n }\n\n .blind-header-title {\n display: flex;\n align-items: center;\n flex-grow: 1;\n height: 100%;\n min-width: 0;\n }\n\n .blind-header-labels {\n display: inline-flex;\n flex-grow: 1;\n min-width: 0;\n }\n\n .blind-content {\n display: block;\n padding: 1rem;\n transition-property: padding;\n transition-duration: $default-time;\n transition-timing-function: ease-in;\n\n &.hide {\n max-height: 0;\n padding-top: 0px;\n padding-bottom: 0px;\n }\n }\n\n .header-actions {\n pointer-events: all;\n }\n}\n\n$blind-variants: (\n alarm,\n critical,\n info,\n insight,\n neutral,\n notification,\n success,\n warning,\n primary,\n outline\n);\n\n@each $variant in $blind-variants {\n @include blind($variant);\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { CardVariant } from '../card/card';\nimport { a11yBoolean } from '../utils/a11y';\n\nexport type BlindVariant = CardVariant | 'outline';\n\nlet sequentialInstanceId = 0;\n\n@Component({\n tag: 'ix-blind',\n styleUrl: 'blind.scss',\n shadow: true,\n})\nexport class Blind {\n /**\n * Collapsed state\n */\n @Prop({ mutable: true, reflect: true }) collapsed = false;\n\n /**\n * Label of blind\n */\n @Prop() label: string;\n\n /**\n * Secondary label inside blind header\n * @since 2.0.0\n */\n @Prop() sublabel: string;\n\n /**\n * Optional icon to be displayed next to the header label\n * @since 1.5.0\n */\n @Prop() icon: string;\n\n /**\n * Blind variant\n * @since 2.0.0\n */\n @Prop() variant: BlindVariant = 'insight';\n\n /**\n * Collapsed state changed\n */\n @Event() collapsedChange: EventEmitter<boolean>;\n\n @Element() hostElement!: HTMLIxBlindElement;\n\n private chevronRef: HTMLElement;\n private blindId = ++sequentialInstanceId;\n\n constructor() {}\n\n private onHeaderClick() {\n this.collapsed = !this.collapsed;\n this.collapsedChange.emit(this.collapsed);\n }\n\n componentDidLoad() {\n this.animateCollapse(this.collapsed);\n }\n\n get content() {\n return this.hostElement.shadowRoot.querySelector('.blind-content');\n }\n\n @Watch('collapsed')\n animation(isCollapsed: boolean) {\n this.animateCollapse(isCollapsed);\n }\n\n private animateCollapse(isCollapsed: boolean) {\n if (isCollapsed) {\n this.rotateChevronRight();\n } else {\n this.rotateChevronDown();\n }\n }\n\n private rotateChevronDown() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 90,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 1,\n });\n }\n\n private rotateChevronRight() {\n anime({\n targets: this.chevronRef,\n duration: 150,\n easing: 'easeInOutSine',\n rotateZ: 0,\n });\n anime({\n targets: this.content,\n duration: 150,\n easing: 'easeInOutSine',\n opacity: 0,\n });\n }\n\n render() {\n return (\n <Host\n class={{\n [`blind-${this.variant}`]: true,\n }}\n >\n <div class={'blind-header-wrapper'}>\n <div class={'blind-header-content'}>\n <ix-icon\n class=\"collapse-icon\"\n name={'chevron-right-small'}\n color={\n this.variant === 'insight' || this.variant === 'outline'\n ? 'color-primary'\n : `color-${this.variant}--contrast`\n }\n ref={(ref) => (this.chevronRef = ref)}\n ></ix-icon>\n <div\n class=\"blind-header-title\"\n id={`ix-blind-header-title-${this.blindId}`}\n >\n {this.label !== undefined ? (\n <Fragment>\n {this.icon && (\n <ix-icon\n class=\"blind-header-title-icon\"\n name={this.icon}\n color={\n this.variant === 'insight' || this.variant === 'outline'\n ? 'color-std-text'\n : `color-${this.variant}--contrast`\n }\n ></ix-icon>\n )}\n <div class={'blind-header-title-row'}>\n <div class=\"blind-header-title-col\">\n <ix-typography title={this.label} format=\"label-lg\" bold>\n <div\n class=\"blind-header-title-label\"\n title={this.label}\n >\n {this.label}\n </div>\n </ix-typography>\n </div>\n\n {this.sublabel && (\n <div class=\"blind-header-title-col\">\n <ix-typography title={this.sublabel}>\n <div class=\"blind-header-title-sublabel\">\n {this.sublabel}\n </div>\n </ix-typography>\n </div>\n )}\n </div>\n <div class=\"header-actions\">\n <slot name=\"header-actions\"></slot>\n </div>\n </Fragment>\n ) : null}\n </div>\n </div>\n\n <button\n class={{\n 'blind-header': true,\n [`blind-${this.variant}`]: true,\n closed: this.collapsed,\n }}\n type=\"button\"\n aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n aria-controls={`ix-blind-content-section-${this.blindId}`}\n aria-expanded={a11yBoolean(!this.collapsed)}\n onClick={() => this.onHeaderClick()}\n >\n <slot name=\"custom-header\"></slot>\n </button>\n </div>\n <section\n id={`ix-blind-content-section-${this.blindId}`}\n aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n >\n <div\n class={{\n 'blind-content': true,\n hide: this.collapsed,\n }}\n >\n {!this.collapsed ? <slot></slot> : null}\n </div>\n </section>\n </Host>\n );\n }\n}\n"],"mappings":"0IAAA,MAAMA,EAAW,4vUACjB,MAAAC,EAAeD,ECyBf,IAAIE,EAAuB,E,MAOdC,EAAK,MAuChB,WAAAC,CAAAC,G,2DAFQC,KAAAC,UAAYL,E,eAjCgC,M,8EAuBpB,S,CAcxB,aAAAM,GACNF,KAAKG,WAAaH,KAAKG,UACvBH,KAAKI,gBAAgBC,KAAKL,KAAKG,U,CAGjC,gBAAAG,GACEN,KAAKO,gBAAgBP,KAAKG,U,CAG5B,WAAIK,GACF,OAAOR,KAAKS,YAAYC,WAAWC,cAAc,iB,CAInD,SAAAC,CAAUC,GACRb,KAAKO,gBAAgBM,E,CAGf,eAAAN,CAAgBM,GACtB,GAAIA,EAAa,CACfb,KAAKc,oB,KACA,CACLd,KAAKe,mB,EAID,iBAAAA,GACNC,EAAM,CACJC,QAASjB,KAAKkB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,KAEXL,EAAM,CACJC,QAASjB,KAAKQ,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIL,kBAAAR,GACNE,EAAM,CACJC,QAASjB,KAAKkB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,IAEXL,EAAM,CACJC,QAASjB,KAAKQ,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIb,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,SAAS3B,KAAK4B,WAAY,OAG7BJ,EAAA,OAAAE,IAAA,2CAAKC,MAAO,wBACVH,EAAA,OAAAE,IAAA,2CAAKC,MAAO,wBACVH,EAAA,WAAAE,IAAA,2CACEC,MAAM,gBACNE,KAAM,sBACNC,MACE9B,KAAK4B,UAAY,WAAa5B,KAAK4B,UAAY,UAC3C,gBACA,SAAS5B,KAAK4B,oBAEpBG,IAAMA,GAAS/B,KAAKkB,WAAaa,IAEnCP,EAAA,OAAAE,IAAA,2CACEC,MAAM,qBACNK,GAAI,yBAAyBhC,KAAKC,WAEjCD,KAAKiC,QAAUC,UACdV,EAACW,EAAQ,KACNnC,KAAKoC,MACJZ,EAAA,WACEG,MAAM,0BACNE,KAAM7B,KAAKoC,KACXN,MACE9B,KAAK4B,UAAY,WAAa5B,KAAK4B,UAAY,UAC3C,iBACA,SAAS5B,KAAK4B,sBAIxBJ,EAAA,OAAKG,MAAO,0BACVH,EAAA,OAAKG,MAAM,0BACTH,EAAA,iBAAea,MAAOrC,KAAKiC,MAAOK,OAAO,WAAWC,KAAI,MACtDf,EAAA,OACEG,MAAM,2BACNU,MAAOrC,KAAKiC,OAEXjC,KAAKiC,SAKXjC,KAAKwC,UACJhB,EAAA,OAAKG,MAAM,0BACTH,EAAA,iBAAea,MAAOrC,KAAKwC,UACzBhB,EAAA,OAAKG,MAAM,+BACR3B,KAAKwC,aAMhBhB,EAAA,OAAKG,MAAM,kBACTH,EAAA,QAAMK,KAAK,qBAGb,OAIRL,EAAA,UAAAE,IAAA,2CACEC,MAAO,CACL,eAAgB,KAChB,CAAC,SAAS3B,KAAK4B,WAAY,KAC3Ba,OAAQzC,KAAKG,WAEfuC,KAAK,SAAQ,kBACI,yBAAyB1C,KAAKC,UAAS,gBACzC,4BAA4BD,KAAKC,UAAS,gBAC1C0C,GAAa3C,KAAKG,WACjCyC,QAAS,IAAM5C,KAAKE,iBAEpBsB,EAAA,QAAAE,IAAA,2CAAMG,KAAK,oBAGfL,EAAA,WAAAE,IAAA,2CACEM,GAAI,4BAA4BhC,KAAKC,UAAS,kBAC7B,yBAAyBD,KAAKC,WAE/CuB,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,gBAAiB,KACjBkB,KAAM7C,KAAKG,aAGXH,KAAKG,UAAYqB,EAAA,aAAgB,O"}