@siemens/ix 1.1.0-beta.0 → 1.1.0-beta.2

package/dist/collection/components/menu-about-news/menu-about-news.js

@@ -1,204 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-import { Component, Event, h, Host, Prop } from '@stencil/core';
-export class MenuAboutNews {
-  constructor() {
-    /**
-     * Show about news
-     */
-    this.show = false;
-    /**
-     *
-     */
-    this.i18nShowMore = 'Show more';
-    /**
-     * Bottom offset
-     */
-    this.offsetBottom = 0;
-    /**
-     * Internal
-     */
-    this.expanded = false;
-  }
-  render() {
-    return (h(Host, { class: {
-        expanded: this.expanded,
-        show: !this.show,
-      } },
-      h("div", { class: "banner-container" },
-        h("ix-icon", { color: "color-inv-contrast-text", name: "shout", size: "32" }),
-        h("svg", { viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" },
-          h("polygon", { points: "0 0 48 0 48 56 24 48 0 56" }))),
-      h("div", { class: "cui-popover-news-header" },
-        h("span", { class: "text-l-title" }, this.label)),
-      h("ix-icon-button", { size: "24", icon: "close-small", ghost: true, onClick: () => {
-          this.show = false;
-          this.closePopover.emit();
-        } }),
-      h("slot", null),
-      this.aboutItemLabel ? (h("div", { class: "cui-popover-news-footer" },
-        h("button", { class: "btn btn-primary", onClick: (e) => {
-            this.show = false;
-            this.showMore.emit(e);
-          } }, this.i18nShowMore))) : null,
-      h("svg", { id: "arrow", xmlns: "http://www.w3.org/2000/svg", width: "8", height: "12", viewBox: "0 0 8 12" },
-        h("path", { d: "M8 0 L0 6 L8 12" }))));
-  }
-  static get is() { return "ix-menu-about-news"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["menu-about-news.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["menu-about-news.css"]
-  }; }
-  static get properties() { return {
-    "show": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show about news"
-      },
-      "attribute": "show",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Title of the about news"
-      },
-      "attribute": "label",
-      "reflect": false
-    },
-    "i18nShowMore": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "i-1-8n-show-more",
-      "reflect": false,
-      "defaultValue": "'Show more'"
-    },
-    "aboutItemLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Subtitle of the about news"
-      },
-      "attribute": "about-item-label",
-      "reflect": false
-    },
-    "offsetBottom": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Bottom offset"
-      },
-      "attribute": "offset-bottom",
-      "reflect": false,
-      "defaultValue": "0"
-    },
-    "expanded": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Internal"
-      },
-      "attribute": "expanded",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get events() { return [{
-      "method": "showMore",
-      "name": "showMore",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Show More button is pressed"
-      },
-      "complexType": {
-        "original": "MouseEvent",
-        "resolved": "MouseEvent",
-        "references": {
-          "MouseEvent": {
-            "location": "global"
-          }
-        }
-      }
-    }, {
-      "method": "closePopover",
-      "name": "closePopover",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Popover closed"
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-}

package/dist/collection/components/menu-avatar/menu-avatar.css

@@ -1,91 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/* Dimensions */
-/* Font sizes */
-/* Line heights */
-/* Animation timings */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-:host {
-  display: block;
-  position: relative;
-  margin-bottom: 0.5rem;
-}
-:host .avatar {
-  display: flex;
-  align-items: center;
-  height: 2.5rem;
-  max-height: 2.5rem;
-  padding-left: 0.25rem;
-  margin-left: 0.75rem;
-  margin-right: 0.75rem;
-  transition: 0.15s;
-  border-radius: 1.25rem;
-}
-:host .avatar > svg {
-  height: 2rem;
-  width: 2rem;
-  min-height: 2rem;
-  min-width: 2rem;
-}
-:host .avatar #avatar-path-background {
-  fill: var(--theme-avatar--background);
-}
-:host .avatar #avatar-path-person {
-  fill: var(--theme-avatar--person);
-}
-:host .avatar .avatar-name {
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  white-space: nowrap;
-  margin-left: 1rem;
-  line-height: 1.14;
-}
-:host .avatar .avatar-name .text-default-single {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-:host .avatar:not(.disabled):not(:disabled) {
-  cursor: pointer;
-}
-:host .avatar:not(.disabled):not(:disabled):hover {
-  background-color: var(--theme-avatar-btn--background--hover);
-  color: var(--theme-avatar-btn--color--hover);
-}
-:host .avatar:not(.disabled):not(:disabled) {
-  cursor: pointer;
-}
-:host .avatar:not(.disabled):not(:disabled):active {
-  background-color: var(--theme-avatar-btn--background--active);
-  color: var(--theme-avatar-btn--color--active);
-}

package/dist/collection/components/menu-avatar/menu-avatar.js

@@ -1,136 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-import { Component, Element, Event, h, Host, Listen, Prop, State } from '@stencil/core';
-import { Popover } from '../utils/popover.util';
-export class MenuAvatar {
-  constructor() {
-    /**
-     *
-     */
-    this.i18nLogout = 'Logout';
-  }
-  toggleMenu() {
-    this.outsideListener.open();
-    this.displayMenu = !this.displayMenu;
-  }
-  componentDidLoad() {
-    this.outsideListener = new Popover(this.hostElement, this.hostElement.querySelector('ix-dropdown'), () => {
-      this.displayMenu = false;
-    });
-  }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.outsideListener) === null || _a === void 0 ? void 0 : _a.destroy();
-  }
-  render() {
-    return (h(Host, null,
-      h("li", { class: "nav-item top-item avatar no-hover", title: this.top },
-        h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 32 32" },
-          h("g", { fill: "none", "fill-rule": "evenodd" },
-            h("path", { id: "avatar-path-background", d: "M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n                    16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z" }),
-            h("path", { id: "avatar-path-person", d: "M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n                  6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n                  9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n                  6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z" }))),
-        h("div", { class: "avatar-name" },
-          h("span", { class: "text-default-single", title: this.top }, this.top),
-          h("span", { class: "text-default-single", title: this.bottom }, this.bottom))),
-      h("ix-dropdown", { show: this.displayMenu },
-        h("slot", null),
-        h("ix-menu-avatar-item", { label: this.i18nLogout, icon: "log-out", onClick: (e) => {
-            this.logoutClick.emit(e);
-          } }))));
-  }
-  static get is() { return "ix-menu-avatar"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["menu-avatar.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["menu-avatar.css"]
-  }; }
-  static get properties() { return {
-    "top": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "First line of text"
-      },
-      "attribute": "top",
-      "reflect": false
-    },
-    "bottom": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Second line of text"
-      },
-      "attribute": "bottom",
-      "reflect": false
-    },
-    "i18nLogout": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "i-1-8n-logout",
-      "reflect": false,
-      "defaultValue": "'Logout'"
-    }
-  }; }
-  static get states() { return {
-    "displayMenu": {}
-  }; }
-  static get events() { return [{
-      "method": "logoutClick",
-      "name": "logoutClick",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Logout click"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get elementRef() { return "hostElement"; }
-  static get listeners() { return [{
-      "name": "click",
-      "method": "toggleMenu",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }]; }
-}

package/dist/collection/components/menu-avatar-item/menu-avatar-item.css

@@ -1,12 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-
-:host {
-  display: block;
-}

package/dist/collection/components/menu-avatar-item/menu-avatar-item.js

@@ -1,79 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-import { Component, Element, Event, h, Prop } from '@stencil/core';
-export class MenuAvatarItem {
-  render() {
-    return (h("ix-dropdown-item", { icon: this.icon, label: this.label, onClick: (e) => this.itemClick.emit(e) }));
-  }
-  static get is() { return "ix-menu-avatar-item"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["menu-avatar-item.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["menu-avatar-item.css"]
-  }; }
-  static get properties() { return {
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Avatar dropdown icon"
-      },
-      "attribute": "icon",
-      "reflect": false
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Avatar dropdown label"
-      },
-      "attribute": "label",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "itemClick",
-      "name": "itemClick",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Avatar dropdown item clicked"
-      },
-      "complexType": {
-        "original": "MouseEvent",
-        "resolved": "MouseEvent",
-        "references": {
-          "MouseEvent": {
-            "location": "global"
-          }
-        }
-      }
-    }]; }
-  static get elementRef() { return "hostElement"; }
-}

package/dist/collection/components/menu-item/menu-item.css

@@ -1,143 +0,0 @@
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/* Dimensions */
-/* Font sizes */
-/* Line heights */
-/* Animation timings */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-/*
- * SPDX-FileCopyrightText: 2022 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.
- */
-ix-menu-item {
-  position: relative;
-  display: block;
-}
-ix-menu-item .tab {
-  display: flex;
-  position: relative;
-  align-items: center;
-  height: 3rem;
-  z-index: 500;
-  padding-left: 1.25rem;
-}
-ix-menu-item .tab:not(.selected) {
-  cursor: pointer;
-}
-ix-menu-item .tab:not(.selected):not(.disabled):not(:disabled).hover, ix-menu-item .tab:not(.selected):not(.disabled):not(:disabled):hover {
-  background-color: var(--theme-ghost--background--hover);
-}
-ix-menu-item .tab:not(.selected):not(.disabled):not(:disabled).active, ix-menu-item .tab:not(.selected):not(.disabled):not(:disabled):active {
-  background-color: var(--theme-ghost--background--active);
-}
-ix-menu-item i.glyph {
-  color: var(--theme-nav-item-primary-icon--color);
-  position: relative;
-}
-ix-menu-item .tab:focus-visible {
-  outline: none;
-}
-ix-menu-item:focus-visible {
-  outline: none;
-}
-ix-menu-item .tab:not(:last-child) {
-  margin-bottom: 0.5rem;
-}
-ix-menu-item .notification {
-  display: inline-flex;
-  position: absolute;
-  top: -0.5rem;
-  right: -50%;
-}
-ix-menu-item .notification .pill {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  height: 1rem;
-  min-width: 1rem;
-  position: relative;
-  border-radius: 6.25rem;
-  background-color: var(--theme-color-primary);
-  border-radius: 6.25rem;
-  font-size: 0.75rem;
-  font-weight: bold;
-  line-height: 1;
-  font-family: Siemens Sans, Arial, sans-serif;
-  color: var(--theme-color-primary--contrast);
-  padding: 0.25rem;
-}
-ix-menu-item .tab-text {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  color: var(--theme-nav-item-primary--color);
-  margin: 0 1.25rem;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
-}
-ix-menu-item.active .tab, ix-menu-item.selected .tab {
-  background-color: var(--theme-nav-item-primary--background--selected);
-}
-ix-menu-item.active .tab::before, ix-menu-item.selected .tab::before {
-  content: "";
-  background-color: var(--theme-nav-item-primary--border-color--selected);
-  height: 3rem;
-  width: 0.25rem;
-  left: 0;
-  position: absolute;
-}
-ix-menu-item.active .tab > .glyph, ix-menu-item.selected .tab > .glyph {
-  color: var(--theme-nav-item-primary-icon--color--selected);
-}
-ix-menu-item.disabled {
-  color: var(--theme-color-weak-text);
-  pointer-events: none;
-  cursor: default;
-}
-ix-menu-item.disabled .tab > .glyph {
-  color: var(--theme-color-weak-text);
-}
-ix-menu-item.disabled .tab-text {
-  color: var(--theme-color-weak-text);
-}
-ix-menu-item.home-tab, ix-menu-item[slot=home] {
-  margin-bottom: 1.5rem;
-}
-ix-menu-item.bottom-tab, ix-menu-item[slot=bottom] {
-  height: 2.25rem;
-}
-ix-menu-item.bottom-tab .tab, ix-menu-item[slot=bottom] .tab {
-  height: 2.25rem;
-}
-ix-menu-item.bottom-tab .tab::before, ix-menu-item[slot=bottom] .tab::before {
-  height: 2.25rem;
-}
-ix-menu-item.bottom-tab.active .tab, ix-menu-item.bottom-tab.selected .tab, ix-menu-item[slot=bottom].active .tab, ix-menu-item[slot=bottom].selected .tab {
-  background-color: var(--theme-color-1);
-}