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

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

@@ -1,200 +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 } from '@stencil/core';
-export class GroupItem {
-  constructor() {
-    /**
-     * Supress the selection of the group
-     */
-    this.suppressSelection = false;
-    /**
-     * The elements tabindex attribute will get set accordingly.
-     * If true tabindex will be 0, -1 otherwise.
-     */
-    this.focusable = true;
-  }
-  clickListen() {
-    if (this.suppressSelection) {
-      return;
-    }
-    this.selectedChanged.emit(this.hostElement);
-  }
-  render() {
-    return (h(Host, { class: {
-        selected: this.selected && !this.suppressSelection,
-        'suppress-selection': this.suppressSelection,
-      }, tabindex: this.focusable ? 0 : -1 },
-      h("div", { class: "group-entry-selection-indicator" }),
-      this.icon ? h("ix-icon", { size: "16", name: this.icon }) : null,
-      this.text ? (h("span", { class: "group-entry-text" },
-        h("span", { title: this.text }, this.text))) : null,
-      this.secondaryText ? (h("span", { class: "group-entry-text-secondary" },
-        h("span", { title: this.secondaryText }, this.secondaryText))) : null,
-      h("slot", null)));
-  }
-  static get is() { return "ix-group-item"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["group-item.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["group-item.css"]
-  }; }
-  static get properties() { return {
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Group item icon"
-      },
-      "attribute": "icon",
-      "reflect": false
-    },
-    "text": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Group item text"
-      },
-      "attribute": "text",
-      "reflect": false
-    },
-    "secondaryText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Group item secondary text"
-      },
-      "attribute": "secondary-text",
-      "reflect": false
-    },
-    "suppressSelection": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Supress the selection of the group"
-      },
-      "attribute": "suppress-selection",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show selected state"
-      },
-      "attribute": "selected",
-      "reflect": false
-    },
-    "focusable": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The elements tabindex attribute will get set accordingly.\nIf true tabindex will be 0, -1 otherwise."
-      },
-      "attribute": "focusable",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "index": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Index"
-      },
-      "attribute": "index",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "selectedChanged",
-      "name": "selectedChanged",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Selection changed"
-      },
-      "complexType": {
-        "original": "HTMLIxGroupItemElement",
-        "resolved": "HTMLIxGroupItemElement",
-        "references": {
-          "HTMLIxGroupItemElement": {
-            "location": "global"
-          }
-        }
-      }
-    }]; }
-  static get elementRef() { return "hostElement"; }
-  static get listeners() { return [{
-      "name": "click",
-      "method": "clickListen",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }]; }
-}

package/dist/collection/components/icon/icon.css

@@ -1,45 +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 */
-:host {
-  display: inline-flex;
-  height: 1.5rem;
-  width: 1.5rem;
-  color: var(--theme-color-std-text);
-}
-:host i {
-  color: inherit;
-  transition: color 150ms;
-}
-
-:host(.size-12) {
-  height: 0.75rem;
-  width: 0.75rem;
-}
-
-:host(.size-16) {
-  height: 1rem;
-  width: 1rem;
-}
-
-:host(.size-32) {
-  height: 2rem;
-  width: 2rem;
-}

package/dist/collection/components/icon/icon.js

@@ -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.
- */
-import { Component, h, Host, Prop } from '@stencil/core';
-export class Icon {
-  render() {
-    return (h(Host, { style: {
-        color: this.color ? `var(--theme-${this.color})` : 'inherit',
-      }, class: {
-        [`size-12`]: this.size === '12',
-        [`size-16`]: this.size === '16',
-        [`size-24`]: this.size === '24',
-        [`size-32`]: this.size === '32',
-      } },
-      h("i", { class: {
-          glyph: true,
-          [`glyph-${this.name}`]: true,
-          'glyph-12': this.size === '12',
-          'glyph-16': this.size === '16',
-          'glyph-24': this.size === '24',
-          'glyph-32': this.size === '32',
-        } },
-        h("slot", null))));
-  }
-  static get is() { return "ix-icon"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["icon.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["icon.css"]
-  }; }
-  static get properties() { return {
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'12' | '16' | '24' | '32'",
-        "resolved": "\"12\" | \"16\" | \"24\" | \"32\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Size of the icon"
-      },
-      "attribute": "size",
-      "reflect": false
-    },
-    "color": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Color of the icon"
-      },
-      "attribute": "color",
-      "reflect": false
-    },
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Use one of our defined icon names e.g. `copy`."
-      },
-      "attribute": "name",
-      "reflect": true
-    }
-  }; }
-}

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

@@ -1,242 +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, h, Prop } from '@stencil/core';
-import { getButtonClasses } from '../button/base-button';
-export class IconButton {
-  constructor() {
-    /**
-     * Variant of button
-     */
-    this.variant = 'Secondary';
-    /**
-     * Size of icon in button
-     */
-    this.size = '24';
-    /**
-     * Selected state only working with outline or invisible
-     */
-    this.selected = false;
-    /**
-     * Disabled
-     */
-    this.disabled = false;
-    /**
-     * Type of the button
-     */
-    this.type = 'button';
-  }
-  getIconButtonClasses() {
-    return Object.assign({ 'btn-icon-xs': this.size === '12', 'btn-icon-s': this.size === '16' }, getButtonClasses(this.variant, this.outline, this.ghost || this.invisible, true, this.oval, this.selected, this.disabled));
-  }
-  render() {
-    return (h("button", { class: this.getIconButtonClasses(), type: this.type },
-      h("ix-icon", { size: this.size, name: this.icon, color: this.color }),
-      h("div", { style: { display: 'none' } },
-        h("slot", null))));
-  }
-  static get is() { return "ix-icon-button"; }
-  static get encapsulation() { return "scoped"; }
-  static get properties() { return {
-    "variant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'Primary' | 'Secondary'",
-        "resolved": "\"Primary\" | \"Secondary\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Variant of button"
-      },
-      "attribute": "variant",
-      "reflect": false,
-      "defaultValue": "'Secondary'"
-    },
-    "outline": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Button outline"
-      },
-      "attribute": "outline",
-      "reflect": false
-    },
-    "invisible": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "deprecated",
-            "text": "use ghost property"
-          }],
-        "text": "Button invisible"
-      },
-      "attribute": "invisible",
-      "reflect": false
-    },
-    "ghost": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Button invisible"
-      },
-      "attribute": "ghost",
-      "reflect": false
-    },
-    "oval": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Button in oval shape"
-      },
-      "attribute": "oval",
-      "reflect": false
-    },
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Button icon"
-      },
-      "attribute": "icon",
-      "reflect": false
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'32' | '24' | '16' | '12'",
-        "resolved": "\"12\" | \"16\" | \"24\" | \"32\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Size of icon in button"
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "'24'"
-    },
-    "color": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Color of icon in  button"
-      },
-      "attribute": "color",
-      "reflect": false
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Selected state only working with outline or invisible"
-      },
-      "attribute": "selected",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Disabled"
-      },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "type": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'button' | 'submit'",
-        "resolved": "\"button\" | \"submit\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Type of the button"
-      },
-      "attribute": "type",
-      "reflect": false,
-      "defaultValue": "'button'"
-    }
-  }; }
-}

package/dist/collection/components/input-group/input-group.css

@@ -1,27 +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 {
-  position: relative;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: stretch;
-  width: 100%;
-}
-:host .group {
-  display: flex;
-  position: absolute;
-  align-items: center;
-  height: 100%;
-}
-:host .group-start {
-  left: 0px;
-}
-:host .group-end {
-  right: 0px;
-}

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

@@ -1,48 +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, h, Host } from '@stencil/core';
-export class InputGroup {
-  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" }))));
-  }
-  static get is() { return "ix-input-group"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["input-group.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["input-group.css"]
-  }; }
-  static get elementRef() { return "host"; }
-}