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

package/dist/components/ix-event-list-item.js

@@ -1,59 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-
-const eventListItemCss = ".ix-event-list-item{display:flex;align-items:center;position:relative;height:2.5rem;max-height:2.5rem;border-radius:0.25rem;background-color:var(--theme-event-list-item-bg);overflow:hidden;cursor:pointer;margin-bottom:0.5rem}.ix-event-list-item:not(.disabled):not(:disabled){cursor:pointer}.ix-event-list-item:not(.disabled):not(:disabled):hover{background-color:var(--theme-event-item--background--hover)}.ix-event-list-item:not(.disabled):not(:disabled){cursor:pointer}.ix-event-list-item:not(.disabled):not(:disabled):active{background-color:var(--theme-event-item--background--active)}.ix-event-list-item .indicator{height:100%;width:0.5rem;max-width:0.5rem;min-width:0.5rem;border-top-left-radius:0.25rem;border-bottom-left-radius:0.25rem}.ix-event-list-item .indicator-empty{border:var(--theme-weak-bdr-1);border-right:none}.ix-event-list-item .event-list-item-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-grow:1;width:calc(100% - (1rem + 0.5rem));height:100%;border:0.062rem solid;border-color:var(--theme-event-list-item-border);border-top-left-radius:0;border-top-right-radius:0.25rem;border-bottom-left-radius:0;border-bottom-right-radius:0.25rem;border-left:none;padding-left:1rem}.ix-event-list-item .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}.ix-event-list-item .event-list-item-container:not(.disabled):not(:disabled):hover{border-color:var(--theme-event-item--border--hover)}.ix-event-list-item .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}.ix-event-list-item .event-list-item-container:not(.disabled):not(:disabled):active{border-color:var(--theme-event-item--border--active)}.ix-event-list-item.selected:not(:active,.active) .event-list-item-container{background-color:var(--theme-event-item--background--selected);border-color:var(--theme-event-item--border--selected)}.ix-event-list-item[disabled],.ix-event-list-item.disabled{pointer-events:none}.ix-event-list-item[disabled] .event-list-item-container,.ix-event-list-item.disabled .event-list-item-container{background-color:var(--theme-event-item--background--disabled);border-color:var(--theme-event-item--border--disabled)}.ix-event-list-item .chevron-icon{display:none;margin-left:auto;margin-right:0.5rem;opacity:0.6;align-self:center}.ix-event-list-item .event-content{display:flex;align-items:center;width:100%;height:100%;overflow:hidden}";
-
-const EventListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.itemClick = createEvent(this, "itemClick", 7);
-    /**
-     * Opacity of the status indicator.
-     * Defaults to 1.0
-     *
-     * @deprecated Will be removed in 7.0.0. Use color with alpha value.
-     */
-    this.opacity = 1;
-  }
-  handleItemClick() {
-    this.itemClick.emit();
-  }
-  render() {
-    return (h("div", { class: {
-        'ix-event-list-item': true,
-        selected: this.selected,
-        disabled: this.disabled,
-      } }, h("div", { class: `indicator ${!this.color ? 'indicator-empty' : ''}`, style: {
-        'background-color': this.color
-          ? `var(--theme-${this.color})`
-          : 'inherit',
-        opacity: `${this.disabled ? 0.4 : this.opacity}`,
-      } }), h("div", { class: "event-list-item-container" }, h("div", { class: "event-content" }, h("slot", null)), h("i", { class: "glyph glyph-16 glyph-chevron-right chevron-icon" }))));
-  }
-  get el() { return this; }
-  static get style() { return eventListItemCss; }
-}, [4, "ix-event-list-item", {
-    "color": [1],
-    "selected": [4],
-    "disabled": [4],
-    "chevron": [4],
-    "opacity": [2]
-  }, [[1, "click", "handleItemClick"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-event-list-item"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-event-list-item":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, EventListItem);
-      }
-      break;
-  } });
-}
-
-const IxEventListItem = EventListItem;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxEventListItem, defineCustomElement };

package/dist/components/ix-event-list.d.ts

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

package/dist/components/ix-event-list.js

@@ -1,135 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as createMutationObserver } from './mutation-observer.js';
-import { a as convertToRemString } from './rwd.util.js';
-
-const eventListCss = ".sc-ix-event-list-h{display:block;position:relative}ul.sc-ix-event-list{list-style:none;padding:0;margin-bottom:0}.sc-ix-event-list-s>.sc-ix-event-list-h:not(.item-size-s) .ix-event-list-item,.sc-ix-event-list-h:not(.item-size-l) .ix-event-list-item.sc-ix-event-list{display:none}.sc-ix-event-list-h.chevron .sc-ix-event-list-s .ix-event-list-item .chevron-icon{display:initial}.item-size-l .sc-ix-event-list-s .ix-event-list-item{height:6.5rem;max-height:6.5rem}.item-size-l .sc-ix-event-list-s .ix-event-list-item .event-content{height:6.5rem;max-height:6.5rem;white-space:normal}.compact .sc-ix-event-list-s .ix-event-list-item{margin-bottom:0px;border-radius:0px}.compact .sc-ix-event-list-s .ix-event-list-item .indicator{border-top-left-radius:0px;border-bottom-left-radius:0px}.compact .sc-ix-event-list-s .ix-event-list-item .event-list-item-container{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.compact .sc-ix-event-list-s .ix-event-list-item i.glyph{display:none}.compact.sc-ix-event-list .compact.sc-ix-event-list:not(:last-child) .event-list-item-container.sc-ix-event-list{border-bottom:none}";
-
-const EventList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.mutationObserver = createMutationObserver(this.onMutation.bind(this));
-    /**
-     * Determines the height of list items.
-     * This can either be one of two predefined sizes ('S' or 'L') or an absolute pixel value.
-     * In case a number is supplied it will get converted to rem internally.
-     * Defaults to 'S'.
-     */
-    this.itemHeight = 'S';
-    /**
-     * Make event-list items more compact
-     */
-    this.compact = false;
-    /**
-     * Animate state change transitions. Defaults to 'true'.
-     */
-    this.animated = true;
-  }
-  componentDidLoad() {
-    if (this.animated) {
-      this.triggerFadeIn();
-    }
-    if (typeof this.itemHeight === 'number') {
-      const height = convertToRemString(this.itemHeight);
-      this.el.querySelectorAll('.ix-event-list-item').forEach((item) => {
-        item.classList.add('d-flex');
-        this.setCustomHeight(item, height);
-      });
-    }
-    this.mutationObserver.observe(this.el, { childList: true, subtree: true });
-  }
-  onMutation(mutationRecords) {
-    this.triggerFadeOut().then(() => {
-      if (typeof this.itemHeight === 'number') {
-        const height = convertToRemString(this.itemHeight);
-        mutationRecords
-          .filter((mutation) => mutation.type === 'childList')
-          .forEach((mutation) => mutation.addedNodes.forEach((item) => {
-          var _a;
-          const itemHtml = item;
-          if (!((_a = itemHtml.classList) === null || _a === void 0 ? void 0 : _a.contains('ix-event-list-item'))) {
-            return;
-          }
-          itemHtml.classList.add('d-flex');
-          this.setCustomHeight(itemHtml, height);
-        }));
-      }
-      this.triggerFadeIn();
-    });
-  }
-  setCustomHeight(item, height) {
-    item.style.height = height;
-    item.style.maxHeight = height;
-  }
-  triggerFadeOut() {
-    if (!this.animated) {
-      return Promise.resolve();
-    }
-    const keyframes = [
-      {
-        opacity: 1,
-        easing: 'ease-in',
-      },
-      { opacity: 0 },
-    ];
-    const listElement = this.el.querySelector('ul');
-    return listElement.animate(keyframes, {
-      duration: EventList.fadeOutDuration,
-    }).finished;
-  }
-  triggerFadeIn() {
-    if (!this.animated) {
-      return;
-    }
-    const listItems = this.el.querySelectorAll('.ix-event-list-item');
-    listItems.forEach((e, i) => {
-      const delay = i * 80;
-      const offset = delay / (delay + EventList.fadeInDuration);
-      const keyframes = [
-        { opacity: 0 },
-        { opacity: 0, easing: 'ease-out', offset },
-        { opacity: 1 },
-      ];
-      const options = {
-        duration: EventList.fadeInDuration + delay,
-        iterations: 1,
-      };
-      e.animate(keyframes, options);
-    });
-  }
-  render() {
-    return (h(Host, { class: {
-        'item-size-s': this.itemHeight === 'S',
-        'item-size-l': this.itemHeight === 'L',
-        compact: this.compact,
-        chevron: this.chevron,
-      } }, h("ul", null, h("slot", null))));
-  }
-  get el() { return this; }
-  static get style() { return eventListCss; }
-}, [6, "ix-event-list", {
-    "itemHeight": [8, "item-height"],
-    "compact": [4],
-    "animated": [4],
-    "chevron": [4]
-  }]);
-EventList.fadeOutDuration = 50;
-EventList.fadeInDuration = 150;
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-event-list"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-event-list":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, EventList);
-      }
-      break;
-  } });
-}
-
-const IxEventList = EventList;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxEventList, defineCustomElement };

package/dist/components/ix-expanding-search.d.ts

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

package/dist/components/ix-expanding-search.js

@@ -1,124 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$3 } from './icon.js';
-import { d as defineCustomElement$2 } from './icon-button.js';
-
-const expandingSearchCss = ".sc-ix-expanding-search-h{display:inline-flex;width:auto;height:2rem;align-items:center;justify-content:space-between}.right-position.sc-ix-expanding-search-h{width:11.5625rem !important}.sc-ix-expanding-search-h .input-container.sc-ix-expanding-search{transition:all 0.3s ease-in-out}.sc-ix-expanding-search-h .disable-pointer.sc-ix-expanding-search{pointer-events:none}.sc-ix-expanding-search-h input.sc-ix-expanding-search{box-shadow:var(--theme-input--box-shadow)}.sc-ix-expanding-search-h .expanded.sc-ix-expanding-search{width:11.5625rem}.sc-ix-expanding-search-h .collapsed.sc-ix-expanding-search{width:1.5rem;border:none}.sc-ix-expanding-search-h .btn-search-icon.sc-ix-expanding-search{align-self:center;margin:auto;position:relative}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search{display:flex;max-width:2rem;max-height:2rem;border-radius:var(--theme-input--border-radius);transition:all 0.15s ease-in-out;z-index:1;align-items:center;position:relative;border:none}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):hover{border-color:transparent}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):active{border-color:transparent}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):focus-visible{outline:none}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):focus-visible{outline:var(--focus--border-color);outline-width:1px;outline-style:solid}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:active{width:2rem;height:2rem;border-radius:var(--theme-input--border-radius);border:var(--theme-std-bdr-1) !important}.sc-ix-expanding-search-h .input-container.sc-ix-expanding-search{display:flex;position:absolute;align-items:center;flex-wrap:nowrap}.sc-ix-expanding-search-h .btn-clear.sc-ix-expanding-search{position:absolute;border-radius:var(--theme-input--border-radius);right:0px}.sc-ix-expanding-search-h .input.sc-ix-expanding-search{padding-left:2rem !important;padding-right:2.5rem !important}.sc-ix-expanding-search-h .opacity-before.sc-ix-expanding-search{opacity:0}.sc-ix-expanding-search-h .opacity-after.sc-ix-expanding-search{opacity:1}";
-
-const ExpandingSearch = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.valueChange = createEvent(this, "valueChange", 7);
-    /**
-     * Search icon
-     */
-    this.icon = 'search';
-    /**
-     * Placeholder text
-     */
-    this.placeholder = 'Enter text here';
-    /**
-     * Default value
-     */
-    this.value = '';
-    this.isFieldChanged = false;
-    this.expanded = false;
-    this.hasFocus = false;
-    this.focusTextInput = this.focusTextInput.bind(this);
-  }
-  expandInput() {
-    setTimeout(this.focusTextInput, 300);
-    this.expanded = true;
-  }
-  collapseInput() {
-    if (!this.isFieldChanged && this.expanded) {
-      this.expanded = false;
-    }
-  }
-  clearInput() {
-    this.value = '';
-    this.isFieldChanged = false;
-  }
-  onChange(e) {
-    this.value = e.target.value;
-    if (this.isFieldChanged && this.value === '') {
-      this.isFieldChanged = false;
-    }
-    else {
-      this.isFieldChanged = true;
-    }
-    this.valueChange.emit(this.value);
-  }
-  focusTextInput() {
-    var _a;
-    (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
-  }
-  clearClicked() {
-    var _a;
-    this.clearInput();
-    (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
-    this.valueChange.emit(this.value);
-  }
-  render() {
-    return (h(Host, { class: {
-        expanded: this.expanded,
-        'right-position': this.expanded,
-      } }, h("button", { class: {
-        btn: true,
-        'btn-invisible-primary': true,
-        'btn-icon': true,
-        'btn-search': true,
-        'disable-pointer': this.expanded,
-      }, "data-testid": "button", onClick: () => this.expandInput(), tabindex: this.expanded ? -1 : 0 }, h("ix-icon", { class: "btn-search-icon", name: this.icon, size: this.expanded ? '16' : '24', color: this.hasFocus ? 'input-search-icon--color--focus' : undefined })), h("div", { class: {
-        expanded: this.expanded,
-        collapsed: !this.expanded,
-        'disable-pointer': !this.expanded,
-        'input-container': true,
-      }, "data-testid": "input-wrapper" }, h("input", { class: {
-        'form-control': true,
-        input: this.expanded,
-        'disable-pointer': !this.expanded,
-        'opacity-before': !this.expanded,
-        'opacity-after': this.expanded,
-      }, ref: (el) => (this.textInput = el), "data-testid": "input", placeholder: this.placeholder, type: "text", value: this.value, onBlur: () => {
-        this.collapseInput();
-        this.hasFocus = false;
-      }, onFocus: () => (this.hasFocus = true), onInput: (e) => this.onChange(e), tabindex: this.expanded ? 0 : -1 }), this.isFieldChanged ? (h("ix-icon-button", { class: "btn-clear", icon: "clear", ghost: true, size: "24", "data-testid": "clear-button", onClick: () => this.clearClicked() })) : null)));
-  }
-  static get style() { return expandingSearchCss; }
-}, [2, "ix-expanding-search", {
-    "icon": [1],
-    "placeholder": [1],
-    "value": [1025],
-    "isFieldChanged": [32],
-    "expanded": [32],
-    "hasFocus": [32]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-expanding-search", "ix-icon", "ix-icon-button"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-expanding-search":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, ExpandingSearch);
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "ix-icon-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxExpandingSearch = ExpandingSearch;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxExpandingSearch, defineCustomElement };

package/dist/components/ix-filter-chip.d.ts

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

package/dist/components/ix-filter-chip.js

@@ -1,6 +0,0 @@
-import { F as FilterChip, d as defineCustomElement$1 } from './filter-chip.js';
-
-const IxFilterChip = FilterChip;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxFilterChip, defineCustomElement };

package/dist/components/ix-flip-tile-content.d.ts

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

package/dist/components/ix-flip-tile-content.js

@@ -1,33 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const flipTileContentCss = ":host{display:block}";
-
-const FlipTileContent = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-  }
-  render() {
-    return (h(Host, null, h("slot", null)));
-  }
-  static get style() { return flipTileContentCss; }
-}, [1, "ix-flip-tile-content"]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-flip-tile-content"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-flip-tile-content":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, FlipTileContent);
-      }
-      break;
-  } });
-}
-
-const IxFlipTileContent = FlipTileContent;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxFlipTileContent, defineCustomElement };

package/dist/components/ix-flip-tile.d.ts

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

package/dist/components/ix-flip-tile.js

@@ -1,96 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { F as FlipTileState } from './flip-tile-state.js';
-import { d as defineCustomElement$3 } from './icon.js';
-import { d as defineCustomElement$2 } from './icon-button.js';
-
-const flipTileCss = "@keyframes flip-animation{0%{transform:rotateY(0)}50%{transform:rotateY(90deg)}51%{transform:rotateY(270deg)}100%{transform:rotateY(360deg)}}.sc-ix-flip-tile-h{display:flex;flex-direction:column;width:16rem;min-width:16rem;max-width:16rem;height:15.125rem;perspective:1000px}.sc-ix-flip-tile-h .flip-tile-header.sc-ix-flip-tile{display:flex;align-items:center;height:2.5rem;padding:0 0.5rem 0 1rem}.sc-ix-flip-tile-h .flip-tile-header.sc-ix-flip-tile .header-slot-container.sc-ix-flip-tile{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;min-width:0}.sc-ix-flip-tile-h .content-container.sc-ix-flip-tile{flex-grow:1;margin:1rem}.sc-ix-flip-tile-h .flip-tile-container.sc-ix-flip-tile{display:flex;flex-direction:column;height:100%;background-color:var(--theme-blind-base--background);border:solid 1px var(--theme-blind-base--border-color);border-radius:var(--theme-flip-tile--border-radius) var(--theme-flip-tile--border-radius) 0 0;transform-style:preserve-3d}.sc-ix-flip-tile-h .flip-tile-container.flip-animation-active.sc-ix-flip-tile{animation:flip-animation 300ms, ease-in-out}.sc-ix-flip-tile-h .flip-tile-container.sc-ix-flip-tile .footer.sc-ix-flip-tile{display:flex;height:3rem;align-items:center;justify-content:center;padding:0 0.5rem;color:var(--theme-flip-footer--color);background-color:var(--theme-blind-base--background)}.sc-ix-flip-tile-h .flip-tile-container.sc-ix-flip-tile .footer.sc-ix-flip-tile .sc-ix-flip-tile:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:100%}.sc-ix-flip-tile-h .flip-tile-container .sc-ix-flip-tile-s>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;align-items:center;min-width:0}.sc-ix-flip-tile-h .flip-tile-container.primary.sc-ix-flip-tile{border-color:var(--theme-color-primary)}.sc-ix-flip-tile-h .flip-tile-container.primary.sc-ix-flip-tile .footer.sc-ix-flip-tile{background-color:var(--theme-color-primary);color:var(--theme-color-primary--contrast)}.sc-ix-flip-tile-h .flip-tile-container.info.sc-ix-flip-tile{border-color:var(--theme-color-info)}.sc-ix-flip-tile-h .flip-tile-container.info.sc-ix-flip-tile .footer.sc-ix-flip-tile{background-color:var(--theme-color-info);color:var(--theme-color-info--contrast)}.sc-ix-flip-tile-h .flip-tile-container.warning.sc-ix-flip-tile{border-color:var(--theme-color-warning)}.sc-ix-flip-tile-h .flip-tile-container.warning.sc-ix-flip-tile .footer.sc-ix-flip-tile{background-color:var(--theme-color-warning);color:var(--theme-color-warning--contrast)}.sc-ix-flip-tile-h .flip-tile-container.alarm.sc-ix-flip-tile{border-color:var(--theme-color-alarm)}.sc-ix-flip-tile-h .flip-tile-container.alarm.sc-ix-flip-tile .footer.sc-ix-flip-tile{background-color:var(--theme-color-alarm);color:var(--theme-color-alarm--contrast)}.sc-ix-flip-tile-h:hover .flip-tile-container.sc-ix-flip-tile .footer.sc-ix-flip-tile ix-icon.sc-ix-flip-tile{color:var(--theme-color-std-text)}";
-
-const FlipTile = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.ANIMATION_DURATION = 150;
-    this.index = 0;
-  }
-  componentDidLoad() {
-    this.contentItems = this.contentContainerElement.querySelectorAll('ix-flip-tile-content');
-    this.contentItems.forEach((_, index) => {
-      if (index !== this.index) {
-        this.toggleContentItem(index);
-      }
-    });
-  }
-  toggleIndex() {
-    this.doFlipAnimation();
-  }
-  toggleContentItem(index) {
-    const item = this.contentItems[index];
-    item.classList.toggle('d-none');
-  }
-  doFlipAnimation() {
-    this.isFlipAnimationActive = true;
-    setTimeout(() => {
-      this.toggleContentItem(this.index);
-      if (this.index >= this.contentItems.length - 1) {
-        this.index = 0;
-      }
-      else {
-        this.index++;
-      }
-      this.toggleContentItem(this.index);
-    }, this.ANIMATION_DURATION);
-    setTimeout(() => {
-      this.isFlipAnimationActive = false;
-    }, 2 * this.ANIMATION_DURATION);
-  }
-  render() {
-    return (h(Host, null, h("div", { class: {
-        'flip-tile-container': true,
-        info: this.state === FlipTileState.Info,
-        warning: this.state === FlipTileState.Warning,
-        alarm: this.state === FlipTileState.Alarm,
-        primary: this.state === FlipTileState.Primary,
-        'flip-animation-active': this.isFlipAnimationActive,
-      } }, h("div", { class: "flip-tile-header" }, h("div", { class: "header-slot-container text-l-title" }, h("slot", { name: "header" })), h("ix-icon-button", { icon: "eye", variant: "Primary", ghost: true, onClick: () => this.toggleIndex() })), h("div", { class: "content-container", ref: (el) => (this.contentContainerElement = el) }, h("slot", null)), h("div", { class: {
-        footer: true,
-        'contrast-light': this.state === FlipTileState.Warning,
-        'contrast-dark': this.state === FlipTileState.Info ||
-          this.state === FlipTileState.Alarm,
-      } }, h("slot", { name: "footer" })))));
-  }
-  get hostElement() { return this; }
-  static get style() { return flipTileCss; }
-}, [6, "ix-flip-tile", {
-    "state": [1],
-    "footer": [1],
-    "index": [32],
-    "isFlipAnimationActive": [32]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-flip-tile", "ix-icon", "ix-icon-button"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-flip-tile":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, FlipTile);
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "ix-icon-button":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxFlipTile = FlipTile;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxFlipTile, defineCustomElement };

package/dist/components/ix-group-dropdown-item.d.ts

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

package/dist/components/ix-group-dropdown-item.js

@@ -1,47 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$3 } from './dropdown-item.js';
-import { d as defineCustomElement$2 } from './icon.js';
-
-const groupDropdownItemCss = ".sc-ix-group-dropdown-item-h{display:contents}";
-
-const GroupDropdownItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-  }
-  render() {
-    return (h(Host, null, h("ix-dropdown-item", { label: this.label, icon: this.icon }, h("slot", null))));
-  }
-  static get style() { return groupDropdownItemCss; }
-}, [6, "ix-group-dropdown-item", {
-    "label": [1],
-    "icon": [1]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["ix-group-dropdown-item", "ix-dropdown-item", "ix-icon"];
-  components.forEach(tagName => { switch (tagName) {
-    case "ix-group-dropdown-item":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, GroupDropdownItem);
-      }
-      break;
-    case "ix-dropdown-item":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "ix-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const IxGroupDropdownItem = GroupDropdownItem;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxGroupDropdownItem, defineCustomElement };

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

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

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

@@ -1,6 +0,0 @@
-import { G as GroupItem, d as defineCustomElement$1 } from './group-item.js';
-
-const IxGroupItem = GroupItem;
-const defineCustomElement = defineCustomElement$1;
-
-export { IxGroupItem, defineCustomElement };

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

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