@siemens/ix 1.1.0-beta.1 → 1.1.0-beta.3

package/dist/components/ix-group.js

@@ -1,174 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$5 } from './dropdown.js';
-import { d as defineCustomElement$4 } from './group-item.js';
-import { d as defineCustomElement$3 } from './icon.js';
-import { d as defineCustomElement$2 } from './icon-button.js';
-
-const groupCss = ".sc-ix-group-h{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;max-width:19.75rem;border-color:var(--theme-group-item--border-color)}.sc-ix-group-h .group-header-context-button.sc-ix-group{display:block;position:relative;margin-top:5px;margin-right:5px;margin-left:auto}.sc-ix-group-h .group-header-context-button.sc-ix-group ix-icon-button.sc-ix-group::after{display:none}.sc-ix-group-h .group-header.sc-ix-group{height:4rem;min-height:4rem;max-height:4rem;border-radius:0.25rem;border:var(--theme-std-bdr-1);display:flex;background-color:var(--theme-group-item--background);border:1px solid var(--theme-group-item--border-color);color:var(--theme-group-header--color);cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover);border-color:var(--theme-group-item--border-color--hover)}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):active{background-color:var(--theme-group-item--background--active);border-color:var(--theme-group-item--border-color--active)}.sc-ix-group-h .group-header.sc-ix-group:not(.disabled):not(:disabled):focus-visible{border-color:var(--focus--border-color);border-radius:var(--theme-group--border-radius--focus);outline:none}.sc-ix-group-h .group-header-clickable.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}.sc-ix-group-h .group-header.expand.sc-ix-group{border-bottom-left-radius:0;border-bottom-right-radius:0}.sc-ix-group-h .group-header-selection-indicator.sc-ix-group{width:0.25rem}.sc-ix-group-h .group-header-content.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;padding:0.5rem;padding-left:0;width:100%}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-props-container.sc-ix-group{width:100%}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-title.sc-ix-group{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}.sc-ix-group-h .group-header-content.sc-ix-group .group-header-title.sc-ix-group>*.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.sc-ix-group-h .group-header-content.sc-ix-group .group-subheader.sc-ix-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}.sc-ix-group-h .expand-icon.sc-ix-group{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}.sc-ix-group-h .btn-expand-header.sc-ix-group{margin:0.5rem;-webkit-margin-end:0.25rem;margin-inline-end:0.25rem}.sc-ix-group-h .group-content.sc-ix-group{display:flex;flex-direction:column}.sc-ix-group-h .group-header.selected.sc-ix-group{border:var(--theme-primary-bdr-2);background-color:var(--theme-group-item--background--selected)}.sc-ix-group-h .group-header.selected.sc-ix-group .group-header-selection-indicator.sc-ix-group{background-color:var(--theme-color-input-focus)}.sc-ix-group-h .footer.sc-ix-group{height:auto;min-height:0}";
-
-const Group = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.selectGroup = createEvent(this, "selectGroup", 7);
-    this.selectItem = createEvent(this, "selectItem", 7);
-    this.collapsedChanged = createEvent(this, "collapsedChanged", 7);
-    /**
-     * Prevent header from being selectable
-     */
-    this.suppressHeaderSelection = false;
-    /**
-     * Whether the group is collapsed or expanded. Defaults to true.
-     */
-    this.collapsed = true;
-    /**
-     * Expand the group if the header is clicked
-     */
-    this.expandOnHeaderClick = false;
-  }
-  get dropdownItems() {
-    return Array.from(this.hostElement.querySelectorAll('ix-group-dropdown-item'));
-  }
-  get groupItems() {
-    return Array.from(this.hostElement.querySelectorAll('ix-group-item:not(.footer)'));
-  }
-  get groupContent() {
-    return this.hostElement.querySelector('.group-content');
-  }
-  get footer() {
-    return this.hostElement.querySelector('.footer');
-  }
-  async onKeyDown(event) {
-    const targetElement = event.target;
-    if (!this.hostElement.contains(targetElement)) {
-      return;
-    }
-    if (event.code === 'Enter' || event.code === 'NumpadEnter') {
-      if (targetElement.classList.contains('group-header')) {
-        if (this.suppressHeaderSelection) {
-          this.collapsed = !this.collapsed;
-        }
-        else {
-          this.selected = !this.selected;
-        }
-      }
-      else if (targetElement.matches('ix-group-item')) {
-        const groupItem = targetElement;
-        groupItem.selected = !groupItem.selected;
-      }
-    }
-  }
-  onExpandClick(event) {
-    const wasCollapsed = this.collapsed;
-    this.collapsed = !this.collapsed;
-    if (!wasCollapsed && this.index !== undefined) {
-      this.index = undefined;
-      this.setGroupSelection(true);
-    }
-    this.collapsedChanged.emit(this.collapsed);
-    event.stopPropagation();
-  }
-  onHeaderClick(event) {
-    this.setGroupSelection(!this.selected);
-    if (this.suppressHeaderSelection) {
-      this.onExpandClick(event);
-    }
-  }
-  onItemClick(index) {
-    if (index === this.index) {
-      this.index = undefined;
-      this.selectItem.emit(undefined);
-    }
-    else {
-      this.index = index;
-      this.selectItem.emit(index);
-    }
-    this.setGroupSelection(false);
-  }
-  setGroupSelection(selection) {
-    if (!this.suppressHeaderSelection) {
-      this.selected = selection;
-      this.selectGroup.emit(this.selected);
-    }
-  }
-  componentWillRender() {
-    var _a;
-    this.groupItems.forEach((item, index) => {
-      var _a;
-      item.selected = index === this.index;
-      item.index = index;
-      item.classList.remove('last');
-      if (!((_a = this.footer) === null || _a === void 0 ? void 0 : _a.children.length) &&
-        index === this.groupItems.length - 1) {
-        item.classList.add('last');
-      }
-    });
-    if (((_a = this.footer) === null || _a === void 0 ? void 0 : _a.childElementCount) > 1) {
-      this.groupContent.appendChild(this.footer);
-    }
-  }
-  componentDidLoad() {
-    this.groupContent.addEventListener('selectedChanged', (evt) => {
-      this.onItemClick(evt.detail.index);
-    });
-  }
-  render() {
-    return (h(Host, null, h("div", { class: {
-        'group-header': true,
-        expand: !this.collapsed,
-        selected: this.selected,
-      }, tabindex: "0" }, h("div", { class: "group-header-clickable", onClick: (e) => this.onHeaderClick(e) }, h("div", { class: "group-header-selection-indicator" }), h("ix-icon", { class: "btn-expand-header", name: `chevron-${this.collapsed ? 'right' : 'down'}-small`, onClick: (e) => this.onExpandClick(e) }), h("div", { class: "group-header-content" }, this.header ? (h("div", { class: "group-header-props-container" }, h("div", { class: "group-header-title" }, h("span", { title: this.header }, this.header)), h("div", { class: "group-subheader", title: this.subHeader }, this.subHeader))) : null, h("slot", { name: "header" }))), h("div", { class: { 'group-header-context-button': true, 'd-none': false } }, h("ix-icon-button", { ref: (ref) => (this.dropdownTriggerRef = ref), size: "24", ghost: true, icon: "context-menu" }), h("ix-dropdown", { trigger: this.dropdownTriggerRef }, h("slot", { name: "dropdown" })))), h("div", { class: {
-        'group-content': true,
-        'd-none': this.collapsed,
-      } }, h("slot", null)), h("div", { class: "d-none" }, h("ix-group-item", { class: "footer last", suppressSelection: true, focusable: false }, h("slot", { name: "footer" })))));
-  }
-  get hostElement() { return this; }
-  static get style() { return groupCss; }
-}, [6, "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"],
-    "dropdownTriggerRef": [32]
-  }, [[8, "keydown", "onKeyDown"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-group", "ix-dropdown", "ix-group-item", "ix-icon", "ix-icon-button"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-group":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, Group);
-      }
-      break;
-    case "ix-dropdown":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$5();
-      }
-      break;
-    case "ix-group-item":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "ix-icon-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxGroup = Group;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxGroup, defineCustomElement };

package/dist/components/ix-icon-button.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxIconButton extends Components.IxIconButton, HTMLElement {}
-export const IxIconButton: {
-  prototype: IxIconButton;
-  new (): IxIconButton;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-icon-button.js

@@ -1,6 +0,0 @@
-import { I as IconButton, d as defineCustomElement$1 } from './icon-button.js';
-
-const IxIconButton = IconButton;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxIconButton, defineCustomElement };

package/dist/components/ix-icon.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxIcon extends Components.IxIcon, HTMLElement {}
-export const IxIcon: {
-  prototype: IxIcon;
-  new (): IxIcon;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-icon.js

@@ -1,6 +0,0 @@
-import { I as Icon, d as defineCustomElement$1 } from './icon.js';
-
-const IxIcon = Icon;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxIcon, defineCustomElement };

package/dist/components/ix-input-group.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxInputGroup extends Components.IxInputGroup, HTMLElement {}
-export const IxInputGroup: {
-  prototype: IxInputGroup;
-  new (): IxInputGroup;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-input-group.js

@@ -1,53 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const inputGroupCss = ".sc-ix-input-group-h{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.sc-ix-input-group-h .group.sc-ix-input-group{display:flex;position:absolute;align-items:center;height:100%}.sc-ix-input-group-h .group-start.sc-ix-input-group{left:0px}.sc-ix-input-group-h .group-end.sc-ix-input-group{right:0px}";
-
-const InputGroup = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-  }
-  componentDidRender() {
-    let paddingRight = 15;
-    let paddingLeft = 15;
-    this.host.querySelectorAll('[slot="input-end"]').forEach((item) => {
-      item.classList.add('input-group-label');
-      paddingRight += item.getBoundingClientRect().width;
-    });
-    this.host.querySelectorAll('[slot="input-start"]').forEach((item) => {
-      item.classList.add('input-group-label');
-      paddingLeft += item.getBoundingClientRect().width;
-    });
-    const inputElement = this.host.querySelector('input.form-control');
-    if (inputElement) {
-      inputElement.style.paddingRight = paddingRight + 'px';
-      inputElement.style.paddingLeft = paddingLeft + 'px';
-    }
-    else {
-      console.warn('You used the ix-input-group without an input-tag, e.g. <input class="form-control" />');
-    }
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "group group-start" }, h("slot", { name: "input-start" })), h("slot", null), h("div", { class: "group group-end" }, h("slot", { name: "input-end" }))));
-  }
-  get host() { return this; }
-  static get style() { return inputGroupCss; }
-}, [6, "ix-input-group"]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-input-group"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-input-group":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, InputGroup);
-      }
-      break;
-  } });
-}
-
-const IxInputGroup = InputGroup;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxInputGroup, defineCustomElement };

package/dist/components/ix-kpi.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxKpi extends Components.IxKpi, HTMLElement {}
-export const IxKpi: {
-  prototype: IxKpi;
-  new (): IxKpi;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-kpi.js

@@ -1,75 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2 } from './icon.js';
-
-const kpiCss = ".sc-ix-kpi-h{display:flex;flex-grow:1;height:2.5rem;border-radius:var(--theme-kpi--border-radius);padding:0.375rem 0.25rem;min-width:0}.sc-ix-kpi-h span.sc-ix-kpi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-kpi-h .kpi-container.sc-ix-kpi{display:flex;height:100%;width:100%;-webkit-border-after:2px solid grey;border-block-end:2px solid grey}.sc-ix-kpi-h .kpi-container.alarm.sc-ix-kpi{border-block-end-color:var(--theme-color-alarm)}.sc-ix-kpi-h .kpi-container.warning.sc-ix-kpi{border-block-end-color:var(--theme-color-warning)}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-label.sc-ix-kpi{display:flex;align-items:center;color:var(--theme-kpi-display-label--color);flex-grow:1;flex-shrink:9999}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-label.sc-ix-kpi ix-icon.sc-ix-kpi{-webkit-margin-end:0.25rem;margin-inline-end:0.25rem}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-value-container.sc-ix-kpi{display:flex;align-items:flex-end}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-value.sc-ix-kpi{-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);color:var(--theme-kpi-display-value--color)}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-unit.sc-ix-kpi{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem;color:var(--theme-kpi-display-units--color)}.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-label.sc-ix-kpi,.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-unit.sc-ix-kpi{-webkit-margin-before:0.125rem;margin-block-start:0.125rem}.stacked.sc-ix-kpi-h{height:3.75rem}.stacked.sc-ix-kpi-h .kpi-container.sc-ix-kpi{justify-content:center;flex-wrap:wrap}.stacked.sc-ix-kpi-h .kpi-container.sc-ix-kpi .kpi-label.sc-ix-kpi{width:100%;justify-content:center}.sc-ix-kpi-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-kpi-h:not(.disabled):not(:disabled):hover{background-color:var(--theme-kpi-display--background--hover)}.sc-ix-kpi-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-kpi-h:not(.disabled):not(:disabled):active{background-color:var(--theme-kpi-display--background--active)}.sc-ix-kpi-h:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--focus--border-color)}";
-
-const Kpi = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    /**
-     *
-     */
-    this.state = 'neutral';
-    /**
-     *
-     */
-    this.orientation = 'horizontal';
-  }
-  getStateIcon() {
-    switch (this.state) {
-      case 'alarm':
-        return (h("ix-icon", { color: "kpi-display-icon--color", name: "alarm", size: "16" }));
-      case 'warning':
-        return (h("ix-icon", { color: "kpi-display-icon--color", name: "warning", size: "16" }));
-      default:
-        return '';
-    }
-  }
-  getTooltipText() {
-    let tooltip = `${this.label}: ${this.value}`;
-    if (this.unit) {
-      tooltip = tooltip.concat(` ${this.unit}`);
-    }
-    return tooltip;
-  }
-  render() {
-    return (h(Host, { title: this.getTooltipText(), tabindex: "1", class: {
-        stacked: this.orientation === 'vertical',
-      } }, h("div", { class: {
-        'kpi-container': true,
-        alarm: this.state === 'alarm',
-        warning: this.state === 'warning',
-      } }, h("span", { class: "kpi-label" }, this.getStateIcon(), h("span", { class: "kpi-label-text" }, this.label)), h("span", { class: "kpi-value-container" }, h("span", { class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : ''))));
-  }
-  static get style() { return kpiCss; }
-}, [2, "ix-kpi", {
-    "label": [1],
-    "value": [8],
-    "unit": [1],
-    "state": [1],
-    "orientation": [1]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-kpi", "ix-icon"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-kpi":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, Kpi);
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxKpi = Kpi;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxKpi, defineCustomElement };

package/dist/components/ix-map-navigation-overlay.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxMapNavigationOverlay extends Components.IxMapNavigationOverlay, HTMLElement {}
-export const IxMapNavigationOverlay: {
-  prototype: IxMapNavigationOverlay;
-  new (): IxMapNavigationOverlay;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-map-navigation-overlay.js

@@ -1,6 +0,0 @@
-import { M as MapNavigationOverlay, d as defineCustomElement$1 } from './map-navigation-overlay.js';
-
-const IxMapNavigationOverlay = MapNavigationOverlay;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxMapNavigationOverlay, defineCustomElement };

package/dist/components/ix-map-navigation.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxMapNavigation extends Components.IxMapNavigation, HTMLElement {}
-export const IxMapNavigation: {
-  prototype: IxMapNavigation;
-  new (): IxMapNavigation;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-map-navigation.js

@@ -1,182 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { a as anime } from './anime.es.js';
-import { d as defineCustomElement$4 } from './icon.js';
-import { d as defineCustomElement$3 } from './icon-button.js';
-import { d as defineCustomElement$2 } from './map-navigation-overlay.js';
-
-const mapNavigationCss = ".sc-ix-map-navigation-h{display:flex;position:relative;width:100%;height:100%}.sc-ix-map-navigation-h .map-nav.sc-ix-map-navigation{display:flex;margin-left:4rem;position:relative;height:100%;flex-grow:1;overflow:hidden}.sc-ix-map-navigation-h .map-nav-sidebar.sc-ix-map-navigation{display:flex;flex-direction:column;align-items:center;width:29.75rem;max-width:29.75rem;min-width:29.75rem;height:100%;left:4rem;background-color:var(--theme-color-1);-webkit-border-end:1px solid var(--theme-map-navigation-separator--background);border-inline-end:1px solid var(--theme-map-navigation-separator--background);z-index:99}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation{align-items:center;position:relative;overflow:auto;height:100%;width:100%}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation .map-nav-sidebar-static-content.sc-ix-map-navigation{-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);display:flex;justify-content:space-between;margin-top:0.437rem;margin-bottom:0.812rem;margin-left:1rem;margin-right:1rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation{display:flex;position:relative;align-items:center;height:3.5rem;min-height:3.5rem;width:100%}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation{background-color:var(--theme-map-navigation-background);display:flex;align-items:center;height:100%;width:100%;padding:0 1rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation button.sc-ix-map-navigation{margin-left:1rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation .map-nav-brand-logo.sc-ix-map-navigation{min-width:4.75rem;-webkit-margin-end:3.5rem;margin-inline-end:3.5rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation .map-nav-brand-title.sc-ix-map-navigation{-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);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-map-navigation-header--color);flex-grow:1}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation{display:flex;height:3.5rem;align-items:center;overflow:hidden;padding:0 1rem}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation:empty{height:0}.sc-ix-map-navigation-h .map-nav-title.sc-ix-map-navigation{-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);display:flex;align-items:center;flex-grow:1}.sc-ix-map-navigation-h .content.sc-ix-map-navigation{display:block;flex-grow:1;position:relative;height:100%;overflow:hidden;z-index:calc(var(--theme-z-index-sticky) - 1)}.sc-ix-map-navigation-h #overlay.sc-ix-map-navigation{width:100%;height:100%;position:absolute;top:0;z-index:calc(var(--theme-z-index-sticky) + 1)}";
-
-const MapNavigation = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.navigationToggled = createEvent(this, "navigationToggled", 7);
-    this.contextMenuClick = createEvent(this, "contextMenuClick", 7);
-    /**
-     * Hide the sidebar context menu button when set to true
-     */
-    this.hideContextMenu = true;
-    this.isSidebarOpen = true;
-  }
-  get menu() {
-    return this.hostElement.querySelector('ix-menu');
-  }
-  get menuOverlay() {
-    return this.hostElement.querySelector('ix-menu-overlay');
-  }
-  get mapNavMenu() {
-    return this.hostElement.querySelector('.map-nav-menu');
-  }
-  get sidebar() {
-    return this.hostElement.querySelector('.map-nav-sidebar');
-  }
-  get overlay() {
-    return this.hostElement.querySelector('#overlay');
-  }
-  componentDidRender() {
-    this.appendMenu();
-    // this.openOverlay('Test', document.createElement('ix-breadcrumb'), 'info', 'color-warning');
-    this.closeOverlay();
-  }
-  appendMenu() {
-    this.hostElement.querySelector('#menu-placeholder').appendChild(this.menu);
-    this.menu.addEventListener('mapExpandChange', (event) => {
-      const state = !event.detail;
-      this.toggleSidebar(state);
-      this.menu.toggleMapExpand(state);
-    });
-    this.menu.enableMapExpand = true;
-  }
-  toggleSidebar(show) {
-    if (show !== undefined) {
-      this.isSidebarOpen = show;
-    }
-    else {
-      this.isSidebarOpen = !this.isSidebarOpen;
-    }
-    if (show) {
-      this.openSidebar();
-    }
-    else {
-      this.closeSidebar();
-    }
-    this.navigationToggled.emit(this.isSidebarOpen);
-  }
-  closeSidebar() {
-    anime({
-      targets: this.sidebar,
-      duration: MapNavigation.defaultTime,
-      marginLeft: [0, '-29.75rem'],
-      opacity: [1, 0],
-      easing: 'easeInSine',
-      complete: () => {
-        this.sidebar.classList.add('d-none');
-      },
-    });
-  }
-  openSidebar() {
-    anime({
-      targets: this.sidebar,
-      duration: MapNavigation.defaultTime,
-      marginLeft: ['-29.75rem', 0],
-      opacity: [0, 1],
-      easing: 'easeOutSine',
-      begin: () => {
-        this.sidebar.classList.remove('d-none');
-      },
-    });
-  }
-  /**
-   * Open a overlay inside content area
-   *
-   * @param name
-   * @param component
-   * @param icon
-   * @param color
-   */
-  async openOverlay(name, component, icon, color) {
-    anime({
-      targets: this.overlay,
-      duration: MapNavigation.slowTime,
-      backdropFilter: [0, 'blur(1rem)'],
-      translateX: ['-4rem', 0],
-      opacity: [0, 1],
-      easing: 'easeOutSine',
-      begin: () => {
-        this.overlay.classList.remove('d-none');
-      },
-    });
-    const overlayInstance = document.createElement('ix-map-navigation-overlay');
-    overlayInstance.setAttribute('color', color);
-    overlayInstance.setAttribute('name', name);
-    overlayInstance.setAttribute('icon', icon);
-    overlayInstance.addEventListener('closeClick', () => this.closeOverlay());
-    overlayInstance.appendChild(component);
-    this.overlay.appendChild(overlayInstance);
-  }
-  /**
-   * Close current shown overlay
-   */
-  async closeOverlay() {
-    anime({
-      targets: this.overlay,
-      duration: MapNavigation.slowTime,
-      backdropFilter: ['blur(1rem)', 0],
-      translateX: [0, '-4rem'],
-      opacity: [1, 0],
-      easing: 'easeInSine',
-      complete: () => {
-        var _a;
-        (_a = this.overlay.firstChild) === null || _a === void 0 ? void 0 : _a.remove();
-        this.overlay.classList.add('d-none');
-      },
-    });
-  }
-  render() {
-    return (h(Host, null, h("div", { id: "menu-placeholder" }), h("div", { class: "map-nav" }, h("div", { class: "map-nav-sidebar" }, h("div", { class: "map-nav-header" }, h("div", { class: "map-nav-header-brand" }, h("div", { class: "map-nav-brand-logo" }, h("slot", { name: "logo" })), h("span", { class: "map-nav-brand-title" }, this.applicationName))), h("div", { class: "map-nav-sidebar-content" }, h("div", { class: "map-nav-sidebar-static-content" }, h("div", { class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (h("ix-icon-button", { icon: "context-menu", ghost: true, size: "24", variant: "Secondary", onClick: (_) => this.contextMenuClick.emit() }))), h("div", { class: "map-nav-sidebar-user-content" }, h("slot", { name: "sidebar-content" })))), h("div", { class: "content" }, h("div", { class: "map-nav-header-content bg-2" }, h("slot", { name: "content-header" })), h("main", null, h("slot", null)), h("div", { id: "overlay" })))));
-  }
-  get hostElement() { return this; }
-  static get style() { return mapNavigationCss; }
-}, [6, "ix-map-navigation", {
-    "applicationName": [1, "application-name"],
-    "navigationTitle": [1, "navigation-title"],
-    "hideContextMenu": [4, "hide-context-menu"],
-    "isSidebarOpen": [32],
-    "openOverlay": [64],
-    "closeOverlay": [64]
-  }]);
-MapNavigation.defaultTime = 150;
-MapNavigation.slowTime = 500;
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-map-navigation", "ix-icon", "ix-icon-button", "ix-map-navigation-overlay"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-map-navigation":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MapNavigation);
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$4();
-      }
-      break;
-    case "ix-icon-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "ix-map-navigation-overlay":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxMapNavigation = MapNavigation;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxMapNavigation, defineCustomElement };

package/dist/components/ix-menu-about-item.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxMenuAboutItem extends Components.IxMenuAboutItem, HTMLElement {}
-export const IxMenuAboutItem: {
-  prototype: IxMenuAboutItem;
-  new (): IxMenuAboutItem;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ix-menu-about-item.js

@@ -1,34 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const menuAboutItemCss = ".sc-ix-menu-about-item-h{display:block}";
-
-const MenuAboutItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-  }
-  render() {
-    return (h(Host, null, h("slot", null)));
-  }
-  static get style() { return menuAboutItemCss; }
-}, [6, "ix-menu-about-item", {
-    "label": [513]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-menu-about-item"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-menu-about-item":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, MenuAboutItem);
-      }
-      break;
-  } });
-}
-
-const IxMenuAboutItem = MenuAboutItem;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxMenuAboutItem, defineCustomElement };

package/dist/components/ix-menu-about-news.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IxMenuAboutNews extends Components.IxMenuAboutNews, HTMLElement {}
-export const IxMenuAboutNews: {
-  prototype: IxMenuAboutNews;
-  new (): IxMenuAboutNews;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;