@siemens/ix 2.4.1 → 2.6.0

package/dist/cjs/ix-playground-internal.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"ix-playground-internal.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,oHAAoH,CAAC;AAC3I,mCAAe,aAAa;;MCkBf,kBAAkB;;;;IAC7B,MAAM;QACJ,OAAOA,QAACC,UAAI,sDAAQ,CAAC;KACtB;;;;;;","names":["h","Host"],"sources":["src/components/playground/playground.scss?tag=ix-playground-internal&encapsulation=scoped","src/components/playground/playground.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\n:host {\n  display: block;\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n  padding: 0rem 0rem 0rem 0rem;\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 * LICENxSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n/** @internal */\n@Component({\n  tag: 'ix-playground-internal',\n  styleUrl: 'playground.scss',\n  // shadow: true,\n  // Set scoped=true and shadow=false to test global styles like checkbox etc\n  scoped: true,\n})\nexport class PlaygroundInternal {\n  render() {\n    return <Host></Host>;\n  }\n}\n"],"version":3}

package/dist/cjs/ix-tooltip.cjs.entry.js

@@ -1,297 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-529f21c1.js');
-const floatingUi_dom_esm = require('./floating-ui.dom.esm-94b4d17c.js');
-const listener = require('./listener-bc3e7c0c.js');
-
-class OverlayController {
-    constructor() {
-        this.overlays = new Set();
-    }
-    connected(instance) {
-        this.overlays.add(instance);
-    }
-    disconnected(instance) {
-        this.overlays.delete(instance);
-    }
-    present(instance) {
-        if (instance.willPresent && !instance.willPresent()) {
-            return;
-        }
-        this.dismissOthers(instance);
-        instance.present();
-    }
-    dismiss(instance) {
-        if (instance.willDismiss && !instance.willDismiss()) {
-            return;
-        }
-        instance.dismiss();
-    }
-    dismissOthers(instance) {
-        this.overlays.forEach((overlay) => {
-            if (overlay !== instance) {
-                this.dismiss(overlay);
-            }
-        });
-    }
-}
-
-/*
- * SPDX-FileCopyrightText: 2024 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-class TooltipController extends OverlayController {
-}
-const tooltipController = new TooltipController();
-
-const tooltipCss = ":host{display:inline-block;position:fixed;left:0px;top:0px;z-index:var(--theme-z-index-tooltip);max-width:18.25rem;opacity:0;visibility:collapse !important;overflow-wrap:break-word;border-radius:0.25rem;background-color:var(--theme-tootlip--background);padding:0.375rem 0.75rem 0.375rem 0.875rem;box-shadow:var(--theme-shadow-4)}:host .tooltip-title{display:flex;align-items:center}:host .tooltip-title ::slotted(ix-icon){margin-right:0.35rem}:host(.visible){opacity:1;visibility:visible !important}:host(.visible) .arrow,:host(.visible) .arrow::before{position:absolute;width:12px;height:12px;background:inherit}:host(.visible) .arrow{visibility:hidden}:host(.visible) .arrow::before{visibility:visible;content:\"\";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}";
-const IxTooltipStyle0 = tooltipCss;
-
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-const numberToPixel = (value) => (value != null ? `${value}px` : '');
-const Tooltip = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.for = undefined;
-        this.titleContent = undefined;
-        this.interactive = false;
-        this.placement = 'top';
-        this.showDelay = 0;
-        this.hideDelay = 50;
-        this.animationFrame = false;
-        this.visible = false;
-    }
-    get arrowElement() {
-        return this.hostElement.shadowRoot.querySelector('.arrow');
-    }
-    destroyAutoUpdate() {
-        if (this.disposeAutoUpdate !== undefined) {
-            this.disposeAutoUpdate();
-        }
-    }
-    /** @internal */
-    async showTooltip(anchorElement) {
-        clearTimeout(this.hideTooltipTimeout);
-        await this.applyTooltipPosition(anchorElement);
-        this.showTooltipTimeout = setTimeout(() => {
-            tooltipController.present(this);
-            // Need to compute and apply tooltip position after initial render,
-            // because arrow has no valid bounding rect before that
-            this.applyTooltipPosition(anchorElement);
-        }, this.showDelay);
-    }
-    /** @internal */
-    async hideTooltip() {
-        clearTimeout(this.showTooltipTimeout);
-        let hideDelay = 50;
-        if (this.interactive && this.hideDelay === hideDelay) {
-            hideDelay = 150;
-        }
-        this.hideTooltipTimeout = setTimeout(() => {
-            tooltipController.dismiss(this);
-        }, hideDelay);
-        this.destroyAutoUpdate();
-    }
-    computeArrowPosition({ placement, middlewareData, }) {
-        let { x, y } = middlewareData.arrow;
-        if (placement.startsWith('top')) {
-            return {
-                left: numberToPixel(x),
-                top: numberToPixel(y),
-            };
-        }
-        if (placement.startsWith('right')) {
-            return {
-                left: numberToPixel(-6),
-                top: numberToPixel(y),
-            };
-        }
-        if (placement.startsWith('bottom')) {
-            return {
-                left: numberToPixel(x),
-                top: numberToPixel(-6),
-            };
-        }
-        if (placement.startsWith('left')) {
-            return {
-                right: numberToPixel(-6),
-                top: numberToPixel(y),
-            };
-        }
-    }
-    async computeTooltipPosition(target) {
-        return floatingUi_dom_esm.computePosition(target, this.hostElement, {
-            strategy: 'fixed',
-            placement: this.placement,
-            middleware: [
-                floatingUi_dom_esm.shift(),
-                floatingUi_dom_esm.offset(12),
-                floatingUi_dom_esm.arrow({
-                    element: this.arrowElement,
-                }),
-                floatingUi_dom_esm.flip({
-                    fallbackStrategy: 'initialPlacement',
-                    padding: 10,
-                }),
-            ],
-        });
-    }
-    applyTooltipArrowPosition(computeResponse) {
-        const arrowPosition = this.computeArrowPosition(computeResponse);
-        Object.assign(this.arrowElement.style, arrowPosition);
-    }
-    async applyTooltipPosition(target) {
-        if (!target) {
-            return;
-        }
-        return new Promise((resolve) => {
-            this.destroyAutoUpdate();
-            this.disposeAutoUpdate = floatingUi_dom_esm.autoUpdate(target, this.hostElement, async () => {
-                setTimeout(async () => {
-                    const computeResponse = await this.computeTooltipPosition(target);
-                    if (computeResponse.middlewareData.arrow) {
-                        this.applyTooltipArrowPosition(computeResponse);
-                    }
-                    const { x, y } = computeResponse;
-                    Object.assign(this.hostElement.style, {
-                        left: x !== null ? `${x}px` : '',
-                        top: y !== null ? `${y}px` : '',
-                    });
-                    resolve(computeResponse);
-                });
-            }, {
-                ancestorResize: true,
-                ancestorScroll: true,
-                elementResize: true,
-                animationFrame: this.animationFrame,
-            });
-        });
-    }
-    clearHideTimeout() {
-        if (this.interactive) {
-            clearTimeout(this.hideTooltipTimeout);
-        }
-    }
-    async queryAnchorElements() {
-        if (typeof this.for === 'string') {
-            return Promise.resolve(Array.from(document.querySelectorAll(this.for)));
-        }
-        if (this.for instanceof HTMLElement) {
-            return Promise.resolve([this.for]);
-        }
-        if (this.for instanceof Promise) {
-            const element = await this.for;
-            return [element];
-        }
-    }
-    async registerTriggerListener() {
-        const triggerElementList = await this.queryAnchorElements();
-        if (this.disposeListener) {
-            this.disposeListener();
-        }
-        if (!triggerElementList) {
-            return;
-        }
-        triggerElementList.forEach((element) => {
-            const onMouseEnter = () => {
-                this.showTooltip(element);
-            };
-            const onMouseLeave = () => {
-                this.hideTooltip();
-            };
-            const onFocusIn = () => {
-                if (this.showTooltipTimeout !== undefined) {
-                    clearTimeout(this.showTooltipTimeout);
-                }
-                onMouseEnter();
-            };
-            const onFocusOut = () => {
-                this.hideTooltip();
-            };
-            element.addEventListener('mouseenter', onMouseEnter);
-            element.addEventListener('mouseleave', onMouseLeave);
-            element.addEventListener('focusin', onFocusIn);
-            element.addEventListener('focusout', onFocusOut);
-            this.disposeListener = () => {
-                element.removeEventListener('mouseenter', onMouseEnter);
-                element.removeEventListener('mouseleave', onMouseLeave);
-                element.removeEventListener('focusin', onFocusIn);
-                element.removeEventListener('focusout', onFocusOut);
-            };
-        });
-    }
-    registerTooltipListener() {
-        const { hostElement } = this;
-        hostElement.addEventListener('mouseenter', () => this.clearHideTimeout());
-        hostElement.addEventListener('focusin', () => this.clearHideTimeout());
-        hostElement.addEventListener('mouseleave', () => this.hideTooltip());
-        hostElement.addEventListener('focusout', () => this.hideTooltip());
-    }
-    async onKeydown(event) {
-        if (event.code === 'Escape') {
-            this.hideTooltip();
-        }
-    }
-    componentWillLoad() {
-        this.registerTriggerListener();
-    }
-    componentDidLoad() {
-        this.observer = new MutationObserver(() => {
-            this.registerTriggerListener();
-        });
-        this.observer.observe(document.body, {
-            attributes: true,
-            attributeFilter: ['data-ix-tooltip'],
-            childList: true,
-            subtree: true,
-        });
-        this.registerTooltipListener();
-    }
-    connectedCallback() {
-        tooltipController.connected(this);
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
-        this.destroyAutoUpdate();
-        tooltipController.disconnected(this);
-    }
-    isPresent() {
-        return this.visible;
-    }
-    present() {
-        this.visible = true;
-    }
-    dismiss() {
-        this.visible = false;
-    }
-    render() {
-        return (index.h(index.Host, { key: '5d57bd50e4b54e59eef7e0ec463cf9cadba6ddc4', class: {
-                visible: this.visible,
-            }, role: "tooltip" }, index.h("div", { key: '004a422b325b2c26639e479f3bc6a832277c38db', class: 'tooltip-title' }, index.h("slot", { key: 'dfb6ebe4022d3835b11d7237438358e8dd27191d', name: "title-icon" }), index.h("ix-typography", { key: 'e4230c3e9c28f53d217e8653fd972749af995dde', variant: "default-title" }, this.titleContent, index.h("slot", { key: 'bfd75a3ae808f03a552271a9f10c896de28072e2', name: "title-content" }))), index.h("div", { key: 'b8c20ae1bb16343dca997ecb2ef744d8b18b6ede', class: 'tooltip-content' }, index.h("slot", { key: 'cb15413ddd0b35a6ceb5dd95beebc855131fb998' })), index.h("div", { key: '91e9df64725d3ce40f280640374f0e95f89cf67b', class: "arrow" })));
-    }
-    get hostElement() { return index.getElement(this); }
-};
-__decorate([
-    listener.OnListener('keydown', (self) => self.visible)
-], Tooltip.prototype, "onKeydown", null);
-Tooltip.style = IxTooltipStyle0;
-
-exports.ix_tooltip = Tooltip;
-
-//# sourceMappingURL=ix-tooltip.cjs.entry.js.map

package/dist/cjs/ix-tooltip.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"ix-tooltip.entry.cjs.js","mappings":"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","names":["computePosition","shift","offset","arrow","flip","autoUpdate","h","Host","OnListener"],"sources":["src/components/utils/overlay.ts","src/components/tooltip/tooltip-controller.ts","src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.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 */\nimport { IxComponent } from '../utils/internal';\n\nexport interface IxOverlayComponent extends IxComponent {\n  isPresent(): boolean;\n\n  willPresent?(): boolean;\n  willDismiss?(): boolean;\n\n  present(): void;\n  dismiss(): void;\n}\n\nexport class OverlayController {\n  overlays: Set<IxOverlayComponent> = new Set();\n\n  connected(instance: IxOverlayComponent): void {\n    this.overlays.add(instance);\n  }\n\n  disconnected(instance: IxOverlayComponent): void {\n    this.overlays.delete(instance);\n  }\n\n  present(instance: IxOverlayComponent): void {\n    if (instance.willPresent && !instance.willPresent()) {\n      return;\n    }\n    this.dismissOthers(instance);\n    instance.present();\n  }\n\n  dismiss(instance: IxOverlayComponent): void {\n    if (instance.willDismiss && !instance.willDismiss()) {\n      return;\n    }\n    instance.dismiss();\n  }\n\n  private dismissOthers(instance: IxOverlayComponent): void {\n    this.overlays.forEach((overlay) => {\n      if (overlay !== instance) {\n        this.dismiss(overlay);\n      }\n    });\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { OverlayController } from '../utils/overlay';\n\nclass TooltipController extends OverlayController {}\n\nexport const tooltipController = new TooltipController();\n",":host {\n  display: inline-block;\n  position: fixed;\n  left: 0px;\n  top: 0px;\n  z-index: var(--theme-z-index-tooltip);\n\n  max-width: 18.25rem;\n\n  opacity: 0;\n  visibility: collapse !important;\n  overflow-wrap: break-word;\n\n  border-radius: 0.25rem;\n  background-color: var(--theme-tootlip--background);\n  padding: 0.375rem 0.75rem 0.375rem 0.875rem;\n\n  box-shadow: var(--theme-shadow-4);\n\n  .tooltip-title {\n    display: flex;\n    align-items: center;\n\n    ::slotted(ix-icon) {\n      margin-right: 0.35rem;\n    }\n  }\n}\n\n:host(.visible) {\n  opacity: 1;\n  visibility: visible !important;\n}\n\n:host(.visible) {\n  .arrow,\n  .arrow::before {\n    position: absolute;\n    width: 12px;\n    height: 12px;\n    background: inherit;\n  }\n\n  .arrow {\n    visibility: hidden;\n  }\n\n  .arrow::before {\n    visibility: visible;\n    content: '';\n    transform: rotate(45deg);\n    background-color: var(--theme-tootlip--background);\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 */\nimport {\n  arrow,\n  autoUpdate,\n  computePosition,\n  ComputePositionReturn,\n  flip,\n  offset,\n  shift,\n} from '@floating-ui/dom';\nimport {\n  Component,\n  Element,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { OnListener } from '../utils/listener';\nimport { tooltipController } from './tooltip-controller';\nimport { IxOverlayComponent } from '../utils/overlay';\n\ntype ArrowPosition = {\n  top?: string;\n  left?: string;\n  right?: string;\n};\n\nconst numberToPixel = (value: number) => (value != null ? `${value}px` : '');\n\n/**\n * @slot title-icon - Icon of tooltip title\n * @slot title-content - Content of tooltip title\n *\n * @since 1.4.0\n */\n@Component({\n  tag: 'ix-tooltip',\n  styleUrl: 'tooltip.scss',\n  shadow: true,\n})\nexport class Tooltip implements IxOverlayComponent {\n  /**\n   * CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n   */\n  @Prop() for?: string | HTMLElement | Promise<HTMLElement>;\n\n  /**\n   * Title of the tooltip\n   */\n  @Prop() titleContent?: string;\n\n  /**\n   * Define if the user can access the tooltip via mouse.\n   */\n  @Prop() interactive = false;\n\n  /**\n   * Initial placement of the tooltip. If the placement don\"t have enough space,\n   * the tooltip will placed on another location.\n   *\n   * @since 1.5.0\n   */\n  @Prop() placement: 'top' | 'right' | 'bottom' | 'left' = 'top';\n\n  /** @internal */\n  @Prop() showDelay = 0;\n\n  /** @internal */\n  @Prop() hideDelay = 50;\n\n  /** @internal */\n  @Prop() animationFrame = false;\n\n  @State() visible = false;\n\n  @Element() hostElement!: HTMLIxTooltipElement;\n\n  private observer?: MutationObserver;\n  private hideTooltipTimeout?: NodeJS.Timeout;\n  private showTooltipTimeout?: NodeJS.Timeout;\n  private disposeAutoUpdate?: () => void;\n  private disposeListener?: () => void;\n\n  private get arrowElement(): HTMLElement {\n    return this.hostElement.shadowRoot.querySelector('.arrow');\n  }\n\n  private destroyAutoUpdate() {\n    if (this.disposeAutoUpdate !== undefined) {\n      this.disposeAutoUpdate();\n    }\n  }\n\n  /** @internal */\n  @Method()\n  async showTooltip(anchorElement: Element) {\n    clearTimeout(this.hideTooltipTimeout);\n    await this.applyTooltipPosition(anchorElement);\n\n    this.showTooltipTimeout = setTimeout(() => {\n      tooltipController.present(this);\n      // Need to compute and apply tooltip position after initial render,\n      // because arrow has no valid bounding rect before that\n      this.applyTooltipPosition(anchorElement);\n    }, this.showDelay);\n  }\n\n  /** @internal */\n  @Method()\n  async hideTooltip() {\n    clearTimeout(this.showTooltipTimeout);\n    let hideDelay = 50;\n\n    if (this.interactive && this.hideDelay === hideDelay) {\n      hideDelay = 150;\n    }\n\n    this.hideTooltipTimeout = setTimeout(() => {\n      tooltipController.dismiss(this);\n    }, hideDelay);\n    this.destroyAutoUpdate();\n  }\n\n  private computeArrowPosition({\n    placement,\n    middlewareData,\n  }: ComputePositionReturn): ArrowPosition {\n    let { x, y } = middlewareData.arrow;\n\n    if (placement.startsWith('top')) {\n      return {\n        left: numberToPixel(x),\n        top: numberToPixel(y),\n      };\n    }\n\n    if (placement.startsWith('right')) {\n      return {\n        left: numberToPixel(-6),\n        top: numberToPixel(y),\n      };\n    }\n\n    if (placement.startsWith('bottom')) {\n      return {\n        left: numberToPixel(x),\n        top: numberToPixel(-6),\n      };\n    }\n\n    if (placement.startsWith('left')) {\n      return {\n        right: numberToPixel(-6),\n        top: numberToPixel(y),\n      };\n    }\n  }\n\n  private async computeTooltipPosition(target: Element) {\n    return computePosition(target, this.hostElement, {\n      strategy: 'fixed',\n      placement: this.placement,\n      middleware: [\n        shift(),\n        offset(12),\n        arrow({\n          element: this.arrowElement,\n        }),\n        flip({\n          fallbackStrategy: 'initialPlacement',\n          padding: 10,\n        }),\n      ],\n    });\n  }\n\n  private applyTooltipArrowPosition(computeResponse: ComputePositionReturn) {\n    const arrowPosition = this.computeArrowPosition(computeResponse);\n    Object.assign(this.arrowElement.style, arrowPosition);\n  }\n\n  private async applyTooltipPosition(target: Element) {\n    if (!target) {\n      return;\n    }\n\n    return new Promise<ComputePositionReturn>((resolve) => {\n      this.destroyAutoUpdate();\n      this.disposeAutoUpdate = autoUpdate(\n        target,\n        this.hostElement,\n        async () => {\n          setTimeout(async () => {\n            const computeResponse = await this.computeTooltipPosition(target);\n\n            if (computeResponse.middlewareData.arrow) {\n              this.applyTooltipArrowPosition(computeResponse);\n            }\n\n            const { x, y } = computeResponse;\n            Object.assign(this.hostElement.style, {\n              left: x !== null ? `${x}px` : '',\n              top: y !== null ? `${y}px` : '',\n            });\n\n            resolve(computeResponse);\n          });\n        },\n        {\n          ancestorResize: true,\n          ancestorScroll: true,\n          elementResize: true,\n          animationFrame: this.animationFrame,\n        }\n      );\n    });\n  }\n\n  private clearHideTimeout() {\n    if (this.interactive) {\n      clearTimeout(this.hideTooltipTimeout);\n    }\n  }\n\n  private async queryAnchorElements(): Promise<Array<HTMLElement> | undefined> {\n    if (typeof this.for === 'string') {\n      return Promise.resolve(Array.from(document.querySelectorAll(this.for)));\n    }\n\n    if (this.for instanceof HTMLElement) {\n      return Promise.resolve([this.for]);\n    }\n\n    if (this.for instanceof Promise) {\n      const element = await this.for;\n      return [element];\n    }\n  }\n\n  private async registerTriggerListener() {\n    const triggerElementList = await this.queryAnchorElements();\n\n    if (this.disposeListener) {\n      this.disposeListener();\n    }\n\n    if (!triggerElementList) {\n      return;\n    }\n\n    triggerElementList.forEach((element) => {\n      const onMouseEnter = () => {\n        this.showTooltip(element);\n      };\n\n      const onMouseLeave = () => {\n        this.hideTooltip();\n      };\n\n      const onFocusIn = () => {\n        if (this.showTooltipTimeout !== undefined) {\n          clearTimeout(this.showTooltipTimeout);\n        }\n\n        onMouseEnter();\n      };\n\n      const onFocusOut = () => {\n        this.hideTooltip();\n      };\n\n      element.addEventListener('mouseenter', onMouseEnter);\n      element.addEventListener('mouseleave', onMouseLeave);\n      element.addEventListener('focusin', onFocusIn);\n      element.addEventListener('focusout', onFocusOut);\n\n      this.disposeListener = () => {\n        element.removeEventListener('mouseenter', onMouseEnter);\n        element.removeEventListener('mouseleave', onMouseLeave);\n        element.removeEventListener('focusin', onFocusIn);\n        element.removeEventListener('focusout', onFocusOut);\n      };\n    });\n  }\n\n  private registerTooltipListener() {\n    const { hostElement } = this;\n    hostElement.addEventListener('mouseenter', () => this.clearHideTimeout());\n    hostElement.addEventListener('focusin', () => this.clearHideTimeout());\n\n    hostElement.addEventListener('mouseleave', () => this.hideTooltip());\n    hostElement.addEventListener('focusout', () => this.hideTooltip());\n  }\n\n  @OnListener<Tooltip>('keydown', (self) => self.visible)\n  async onKeydown(event: KeyboardEvent) {\n    if (event.code === 'Escape') {\n      this.hideTooltip();\n    }\n  }\n\n  componentWillLoad() {\n    this.registerTriggerListener();\n  }\n\n  componentDidLoad() {\n    this.observer = new MutationObserver(() => {\n      this.registerTriggerListener();\n    });\n\n    this.observer.observe(document.body, {\n      attributes: true,\n      attributeFilter: ['data-ix-tooltip'],\n      childList: true,\n      subtree: true,\n    });\n\n    this.registerTooltipListener();\n  }\n\n  connectedCallback() {\n    tooltipController.connected(this);\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n    this.destroyAutoUpdate();\n    tooltipController.disconnected(this);\n  }\n\n  isPresent(): boolean {\n    return this.visible;\n  }\n\n  present(): void {\n    this.visible = true;\n  }\n\n  dismiss(): void {\n    this.visible = false;\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          visible: this.visible,\n        }}\n        role=\"tooltip\"\n      >\n        <div class={'tooltip-title'}>\n          <slot name=\"title-icon\"></slot>\n          <ix-typography variant=\"default-title\">\n            {this.titleContent}\n            <slot name=\"title-content\"></slot>\n          </ix-typography>\n        </div>\n        <div class={'tooltip-content'}>\n          <slot></slot>\n        </div>\n        <div class=\"arrow\"></div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/listener-bc3e7c0c.js

@@ -1,77 +0,0 @@
-'use strict';
-
-const index = require('./index-529f21c1.js');
-
-/*
- * SPDX-FileCopyrightText: 2023 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-const defaultOptions = {
-    target: 'window',
-    defaultEnabled: true,
-};
-function createListener(event, options = {}) {
-    const opts = Object.assign(Object.assign({}, defaultOptions), options);
-    let callback;
-    const onEvent = (event) => {
-        callback(event);
-    };
-    const resultObject = {
-        on: (onEventCallback) => {
-            callback = onEventCallback;
-        },
-        isEnabled: opts.defaultEnabled,
-        enable: (state) => {
-            resultObject.isEnabled = state;
-            if (state) {
-                addEventListener(event, onEvent);
-            }
-            else {
-                removeEventListener(event, onEvent);
-            }
-        },
-        destroy: () => {
-            resultObject.enable(false);
-        },
-    };
-    resultObject.enable(opts.defaultEnabled);
-    return resultObject;
-}
-function OnListener(event, fnExp) {
-    return (proto, methodName) => {
-        const { componentWillLoad, componentWillRender, disconnectedCallback } = proto;
-        if (fnExp) {
-            proto.componentWillRender = function () {
-                var _a;
-                const host = index.getElement(this);
-                (_a = host[`__ix__${methodName}`]) === null || _a === void 0 ? void 0 : _a.enable(fnExp(this));
-                return componentWillRender && componentWillRender.call(this);
-            };
-        }
-        proto.componentWillLoad = function () {
-            const listener = createListener(event);
-            const host = index.getElement(this);
-            const method = this[methodName];
-            host[`__ix__${methodName}`] = listener;
-            listener.on(method.bind(this));
-            return componentWillLoad && componentWillLoad.call(this);
-        };
-        proto.disconnectedCallback = function () {
-            var _a;
-            const host = index.getElement(this);
-            if (host && host[`__ix__${methodName}`]) {
-                (_a = host[`__ix__${methodName}`]) === null || _a === void 0 ? void 0 : _a.destroy();
-                host[`__ix__${methodName}`] = null;
-            }
-            return disconnectedCallback && disconnectedCallback.call(this);
-        };
-    };
-}
-
-exports.OnListener = OnListener;
-
-//# sourceMappingURL=listener-bc3e7c0c.js.map

package/dist/cjs/listener-bc3e7c0c.js.map

@@ -1 +0,0 @@
-{"file":"listener-bc3e7c0c.js","mappings":";;;;AAAA;;;;;;;;AAgBA,MAAM,cAAc,GAAoB;IACtC,MAAM,EAAE,QAAQ;IAChB,cAAc,EAAE,IAAI;CACrB,CAAC;SAEc,cAAc,CAAC,KAAa,EAAE,UAA2B,EAAE;IACzE,MAAM,IAAI,mCACL,cAAc,GACd,OAAO,CACX,CAAC;IAEF,IAAI,QAAa,CAAC;IAClB,MAAM,OAAO,GAAG,CAAC,KAAY;QAC3B,QAAQ,CAAC,KAAK,CAAC,CAAC;KACjB,CAAC;IAEF,MAAM,YAAY,GAAG;QACnB,EAAE,EAAE,CAAC,eAAoB;YACvB,QAAQ,GAAG,eAAe,CAAC;SAC5B;QAED,SAAS,EAAE,IAAI,CAAC,cAAc;QAE9B,MAAM,EAAE,CAAC,KAAc;YACrB,YAAY,CAAC,SAAS,GAAG,KAAK,CAAC;YAE/B,IAAI,KAAK,EAAE;gBACT,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;aAClC;iBAAM;gBACL,mBAAmB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;aACrC;SACF;QAED,OAAO,EAAE;YACP,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;SAC5B;KACF,CAAC;IAEF,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IACzC,OAAO,YAAY,CAAC;AACtB,CAAC;SAEe,UAAU,CAAI,KAAa,EAAE,KAA4B;IACvE,OAAO,CAAC,KAAU,EAAE,UAAkB;QACpC,MAAM,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,GACpE,KAAK,CAAC;QAER,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,mBAAmB,GAAG;;gBAC1B,MAAM,IAAI,GAAGA,gBAAU,CAAC,IAAI,CAAC,CAAC;gBAC9B,MAAA,IAAI,CAAC,SAAS,UAAU,EAAE,CAAC,0CAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;gBACjD,OAAO,mBAAmB,IAAI,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAC9D,CAAC;SACH;QAED,KAAK,CAAC,iBAAiB,GAAG;YACxB,MAAM,QAAQ,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;YACvC,MAAM,IAAI,GAAGA,gBAAU,CAAC,IAAI,CAAC,CAAC;YAC9B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;YAEhC,IAAI,CAAC,SAAS,UAAU,EAAE,CAAC,GAAG,QAAQ,CAAC;YAEvC,QAAQ,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAC/B,OAAO,iBAAiB,IAAI,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAC1D,CAAC;QAEF,KAAK,CAAC,oBAAoB,GAAG;;YAC3B,MAAM,IAAI,GAAGA,gBAAU,CAAC,IAAI,CAAC,CAAC;YAE9B,IAAI,IAAI,IAAI,IAAI,CAAC,SAAS,UAAU,EAAE,CAAC,EAAE;gBACvC,MAAA,IAAI,CAAC,SAAS,UAAU,EAAE,CAAC,0CAAE,OAAO,EAAE,CAAC;gBACvC,IAAI,CAAC,SAAS,UAAU,EAAE,CAAC,GAAG,IAAI,CAAC;aACpC;YAED,OAAO,oBAAoB,IAAI,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAChE,CAAC;KACH,CAAC;AACJ;;;;","names":["getElement"],"sources":["src/components/utils/listener.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { getElement } from '@stencil/core';\n\nexport type ListenerOptions = {\n  target?: 'window';\n  defaultEnabled?: boolean;\n};\n\nconst defaultOptions: ListenerOptions = {\n  target: 'window',\n  defaultEnabled: true,\n};\n\nexport function createListener(event: string, options: ListenerOptions = {}) {\n  const opts = {\n    ...defaultOptions,\n    ...options,\n  };\n\n  let callback: any;\n  const onEvent = (event: Event) => {\n    callback(event);\n  };\n\n  const resultObject = {\n    on: (onEventCallback: any) => {\n      callback = onEventCallback;\n    },\n\n    isEnabled: opts.defaultEnabled,\n\n    enable: (state: boolean) => {\n      resultObject.isEnabled = state;\n\n      if (state) {\n        addEventListener(event, onEvent);\n      } else {\n        removeEventListener(event, onEvent);\n      }\n    },\n\n    destroy: () => {\n      resultObject.enable(false);\n    },\n  };\n\n  resultObject.enable(opts.defaultEnabled);\n  return resultObject;\n}\n\nexport function OnListener<T>(event: string, fnExp?: (self: T) => boolean) {\n  return (proto: any, methodName: string) => {\n    const { componentWillLoad, componentWillRender, disconnectedCallback } =\n      proto;\n\n    if (fnExp) {\n      proto.componentWillRender = function () {\n        const host = getElement(this);\n        host[`__ix__${methodName}`]?.enable(fnExp(this));\n        return componentWillRender && componentWillRender.call(this);\n      };\n    }\n\n    proto.componentWillLoad = function () {\n      const listener = createListener(event);\n      const host = getElement(this);\n      const method = this[methodName];\n\n      host[`__ix__${methodName}`] = listener;\n\n      listener.on(method.bind(this));\n      return componentWillLoad && componentWillLoad.call(this);\n    };\n\n    proto.disconnectedCallback = function () {\n      const host = getElement(this);\n\n      if (host && host[`__ix__${methodName}`]) {\n        host[`__ix__${methodName}`]?.destroy();\n        host[`__ix__${methodName}`] = null;\n      }\n\n      return disconnectedCallback && disconnectedCallback.call(this);\n    };\n  };\n}\n"],"version":3}

package/dist/cjs/logical-filter-operator-5564322e.js

@@ -1,38 +0,0 @@
-'use strict';
-
-/*
- * SPDX-FileCopyrightText: 2023 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-class InputState {
-    hasCategory() {
-        return this.category !== undefined;
-    }
-    constructor(token, category) {
-        this.token = token;
-        this.category = category;
-    }
-}
-
-/*
- * SPDX-FileCopyrightText: 2023 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-// eslint-disable-next-line @stencil-community/ban-exported-const-enums
-exports.LogicalFilterOperator = void 0;
-(function (LogicalFilterOperator) {
-    LogicalFilterOperator["EQUAL"] = "Equal";
-    LogicalFilterOperator["NOT_EQUAL"] = "Not equal";
-})(exports.LogicalFilterOperator || (exports.LogicalFilterOperator = {}));
-
-exports.InputState = InputState;
-
-//# sourceMappingURL=logical-filter-operator-5564322e.js.map

package/dist/cjs/logical-filter-operator-5564322e.js.map

@@ -1 +0,0 @@
-{"file":"logical-filter-operator-5564322e.js","mappings":";;AAAA;;;;;;;;MASa,UAAU;IAId,WAAW;QAChB,OAAO,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC;KACpC;IAED,YAAY,KAAa,EAAE,QAAgB;QACzC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;KAC1B;;;ACpBH;;;;;;;;AASA;AACYA;AAAZ,WAAY,qBAAqB;IAC/B,wCAAe,CAAA;IACf,gDAAuB,CAAA;AACzB,CAAC,EAHWA,6BAAqB,KAArBA,6BAAqB;;;;","names":["LogicalFilterOperator"],"sources":["src/components/category-filter/input-state.ts","src/components/category-filter/logical-filter-operator.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport class InputState {\n  public token: string;\n  public category: string;\n\n  public hasCategory() {\n    return this.category !== undefined;\n  }\n\n  constructor(token: string, category: string) {\n    this.token = token;\n    this.category = category;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n// eslint-disable-next-line @stencil-community/ban-exported-const-enums\nexport enum LogicalFilterOperator {\n  EQUAL = 'Equal',\n  NOT_EQUAL = 'Not equal',\n}\n"],"version":3}

package/dist/cjs/make-ref-c25629b7.js

@@ -1,30 +0,0 @@
-'use strict';
-
-/*
- * SPDX-FileCopyrightText: 2024 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-function makeRef(currentChangedCallback) {
-    let resolve = null;
-    let currentPromise = new Promise((res) => (resolve = res));
-    let current = null;
-    const setRefFunction = (ref) => {
-        current = ref;
-        currentChangedCallback === null || currentChangedCallback === void 0 ? void 0 : currentChangedCallback(ref);
-        resolve();
-    };
-    setRefFunction.current = current;
-    setRefFunction.waitForCurrent = async () => {
-        await currentPromise;
-        return current;
-    };
-    return setRefFunction;
-}
-
-exports.makeRef = makeRef;
-
-//# sourceMappingURL=make-ref-c25629b7.js.map

package/dist/cjs/make-ref-c25629b7.js.map

@@ -1 +0,0 @@
-{"file":"make-ref-c25629b7.js","mappings":";;AAAA;;;;;;;;SAegB,OAAO,CACrB,sBAA6C;IAE7C,IAAI,OAAO,GAAG,IAAI,CAAC;IACnB,IAAI,cAAc,GAAG,IAAI,OAAO,CAAC,CAAC,GAAG,MAAM,OAAO,GAAG,GAAG,CAAC,CAAC,CAAC;IAC3D,IAAI,OAAO,GAAM,IAAI,CAAC;IAEtB,MAAM,cAAc,GAAG,CAAC,GAAM;QAC5B,OAAO,GAAG,GAAG,CAAC;QACd,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAG,GAAG,CAAC,CAAC;QAC9B,OAAO,EAAE,CAAC;KACX,CAAC;IAEF,cAAc,CAAC,OAAO,GAAG,OAAO,CAAC;IACjC,cAAc,CAAC,cAAc,GAAG;QAC9B,MAAM,cAAc,CAAC;QACrB,OAAO,OAAO,CAAC;KAChB,CAAC;IAEF,OAAO,cAAc,CAAC;AACxB;;;;","names":[],"sources":["src/components/utils/make-ref.ts"],"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\nexport type MakeRef<T> = {\n  (ref: T): void;\n  current: T;\n  waitForCurrent(): Promise<T>;\n};\n\nexport function makeRef<T>(\n  currentChangedCallback?: (element: T) => void\n): MakeRef<T> {\n  let resolve = null;\n  let currentPromise = new Promise((res) => (resolve = res));\n  let current: T = null;\n\n  const setRefFunction = (ref: T) => {\n    current = ref;\n    currentChangedCallback?.(ref);\n    resolve();\n  };\n\n  setRefFunction.current = current;\n  setRefFunction.waitForCurrent = async () => {\n    await currentPromise;\n    return current;\n  };\n\n  return setRefFunction;\n}\n"],"version":3}

package/dist/cjs/menu-tabs-fc-df53f176.js

@@ -1,105 +0,0 @@
-'use strict';
-
-const index = require('./index-529f21c1.js');
-
-const menuSettingsCss = ".text-xs{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a{color:var(--theme-color-primary)}:host{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .settings-header{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}:host .settings-header h2{color:var(--theme-nav-overlay-header--color);margin-bottom:1rem}:host ix-tabs{margin-bottom:1.5rem}:host .settings-tabs{margin-bottom:1.5rem}";
-const IxMenuSettingsStyle0 = menuSettingsCss;
-
-const MenuSettings = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.close = index.createEvent(this, "close", 7);
-        this.activeTabLabel = undefined;
-        this.label = 'Settings';
-        this.show = false;
-        this.items = undefined;
-    }
-    updateTab(label) {
-        setTab(this, label);
-    }
-    componentWillLoad() {
-        initialize(this);
-    }
-    componentDidLoad() {
-        index.forceUpdate(this.el);
-    }
-    render() {
-        return index.h(MenuTabs, { key: 'f2d6521b17f591cbdd009b220d85ccf1daa2f09c', context: this });
-    }
-    get el() { return index.getElement(this); }
-    static get watchers() { return {
-        "activeTabLabel": ["updateTab"]
-    }; }
-};
-MenuSettings.style = IxMenuSettingsStyle0;
-
-/*
- * SPDX-FileCopyrightText: 2023 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-function getItems(context) {
-    return Array.from(context.el.querySelectorAll(context instanceof MenuSettings
-        ? 'ix-menu-settings-item'
-        : 'ix-menu-about-item'));
-}
-function setTab(context, label) {
-    context.activeTabLabel = label;
-    context.items.forEach((i) => {
-        i.style.display = 'none';
-        if (i.label === context.activeTabLabel) {
-            i.style.display = 'block';
-        }
-    });
-}
-function initialize(context) {
-    context.items = getItems(context);
-    if (context.items.length) {
-        setTab(context, context.activeTabLabel || context.items[0].label);
-    }
-    context.items.forEach((item) => {
-        item.addEventListener('labelChange', (e) => {
-            context.items = getItems(context);
-            if (e.detail.oldLabel === context.activeTabLabel) {
-                context.activeTabLabel = e.detail.newLabel;
-            }
-        });
-    });
-}
-
-/*
- * SPDX-FileCopyrightText: 2023 Siemens AG
- *
- * SPDX-License-Identifier: MIT
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-const getTabItems = (context) => {
-    return context.items.map(({ label }) => {
-        return (index.h("ix-tab-item", { selected: label === context.activeTabLabel, onClick: () => setTab(context, label) }, label));
-    });
-};
-const MenuTabs = ({ context }) => (index.h(index.Host, { slot: context instanceof MenuSettings ? 'ix-menu-settings' : 'ix-menu-about', class: {
-        show: context.show,
-    } },
-    index.h("div", { class: context instanceof MenuSettings ? 'settings-header' : 'about-header' },
-        index.h("h2", { class: "text-h2" }, context.label),
-        index.h("ix-icon-button", { ghost: true, size: "24", icon: 'close', onClick: (e) => context.close.emit({
-                name: context instanceof MenuSettings
-                    ? 'ix-menu-settings'
-                    : 'ix-menu-about',
-                nativeEvent: e,
-            }) })),
-    index.h("ix-tabs", null, getTabItems(context)),
-    index.h("slot", null)));
-
-exports.MenuSettings = MenuSettings;
-exports.MenuTabs = MenuTabs;
-exports.initialize = initialize;
-exports.setTab = setTab;
-
-//# sourceMappingURL=menu-tabs-fc-df53f176.js.map

package/dist/cjs/menu-tabs-fc-df53f176.js.map

@@ -1 +0,0 @@
-{"file":"menu-tabs-fc-df53f176.js","mappings":"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","names":["forceUpdate","h","Host"],"sources":["src/components/menu-settings/menu-settings.scss?tag=ix-menu-settings&encapsulation=shadow","src/components/menu-settings/menu-settings.tsx","src/components/utils/menu-tabs/menu-tabs-utils.ts","src/components/utils/menu-tabs/menu-tabs-fc.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/fonts';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  background-color: var(--theme-nav-overlay--background);\n  padding: $medium-space $default-space $default-space $x-large-space;\n  flex-grow: 1;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n\n  .settings-header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    align-items: center;\n    height: $x-large-space;\n    margin-bottom: $small-space;\n\n    h2 {\n      color: var(--theme-nav-overlay-header--color);\n      margin-bottom: 1rem;\n    }\n  }\n\n  ix-tabs {\n    margin-bottom: 1.5rem;\n  }\n\n  .settings-tabs {\n    margin-bottom: $large-space;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n  CustomCloseEvent,\n  initialize,\n  setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n  tag: 'ix-menu-settings',\n  styleUrl: 'menu-settings.scss',\n  shadow: true,\n})\nexport class MenuSettings {\n  @Element() el!: HTMLIxMenuSettingsElement;\n\n  /**\n   * Active tab\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) activeTabLabel: string;\n\n  /**\n   * Label of first tab\n   */\n  @Prop() label = 'Settings';\n\n  /**\n   * Internal\n   */\n  @Prop() show = false;\n\n  /**\n   * Popover closed\n   */\n  @Event() close: EventEmitter<CustomCloseEvent>;\n\n  @State() items: HTMLIxMenuSettingsItemElement[];\n\n  @Watch('activeTabLabel')\n  updateTab(label: string) {\n    setTab(this, label);\n  }\n\n  componentWillLoad() {\n    initialize(this);\n  }\n\n  componentDidLoad() {\n    forceUpdate(this.el);\n  }\n\n  render() {\n    return <MenuTabs context={this} />;\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 { MenuAbout } from '../../menu-about/menu-about';\nimport { MenuSettings } from '../../menu-settings/menu-settings';\n\nfunction getItems(\n  context: MenuSettings | MenuAbout\n): HTMLIxMenuSettingsItemElement[] | HTMLIxMenuAboutItemElement[] {\n  return Array.from(\n    context.el.querySelectorAll(\n      context instanceof MenuSettings\n        ? 'ix-menu-settings-item'\n        : 'ix-menu-about-item'\n    )\n  );\n}\n\nexport function setTab(context: MenuSettings | MenuAbout, label: string) {\n  context.activeTabLabel = label;\n  context.items.forEach((i) => {\n    i.style.display = 'none';\n    if (i.label === context.activeTabLabel) {\n      i.style.display = 'block';\n    }\n  });\n}\n\nexport function initialize(context: MenuSettings | MenuAbout) {\n  context.items = getItems(context);\n\n  if (context.items.length) {\n    setTab(context, context.activeTabLabel || context.items[0].label);\n  }\n\n  context.items.forEach((item) => {\n    item.addEventListener('labelChange', (e: CustomEvent) => {\n      context.items = getItems(context);\n\n      if (e.detail.oldLabel === context.activeTabLabel) {\n        context.activeTabLabel = e.detail.newLabel;\n      }\n    });\n  });\n}\n\nexport interface CustomLabelChangeEvent {\n  name: string;\n  oldLabel: string;\n  newLabel: string;\n}\n\nexport interface CustomCloseEvent {\n  nativeEvent: MouseEvent;\n  name: string;\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 { FunctionalComponent, h, Host } from '@stencil/core';\nimport { setTab } from './menu-tabs-utils';\nimport { MenuAbout } from '../../menu-about/menu-about';\nimport { MenuSettings } from '../../menu-settings/menu-settings';\n\ninterface MenuTabsProps {\n  context: MenuSettings | MenuAbout;\n}\n\nconst getTabItems = (context: MenuSettings | MenuAbout) => {\n  return context.items.map(({ label }) => {\n    return (\n      <ix-tab-item\n        selected={label === context.activeTabLabel}\n        onClick={() => setTab(context, label)}\n      >\n        {label}\n      </ix-tab-item>\n    );\n  });\n};\n\nexport const MenuTabs: FunctionalComponent<MenuTabsProps> = ({ context }) => (\n  <Host\n    slot={\n      context instanceof MenuSettings ? 'ix-menu-settings' : 'ix-menu-about'\n    }\n    class={{\n      show: context.show,\n    }}\n  >\n    <div\n      class={\n        context instanceof MenuSettings ? 'settings-header' : 'about-header'\n      }\n    >\n      <h2 class=\"text-h2\">{context.label}</h2>\n      <ix-icon-button\n        ghost\n        size=\"24\"\n        icon={'close'}\n        onClick={(e) =>\n          context.close.emit({\n            name:\n              context instanceof MenuSettings\n                ? 'ix-menu-settings'\n                : 'ix-menu-about',\n            nativeEvent: e,\n          })\n        }\n      ></ix-icon-button>\n    </div>\n    <ix-tabs>{getTabItems(context)}</ix-tabs>\n    <slot></slot>\n  </Host>\n);\n"],"version":3}