@siemens/ix 1.1.0-beta.5 → 1.1.0

package/dist/collection/components/animated-tabs/animated-tabs.js

@@ -6,26 +6,19 @@
  * 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, Watch } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import anime from 'animejs';
 import Animation from '../utils/animation';
 import { convertToAbbreviationString } from '../utils/rwd.util';
 export class AnimatedTabs {
   constructor() {
-    /**
-     * @deprecated - For debugging purposes only
-     */
+    this.easing = 'easeInOutSine';
+    this.firstRender = true;
+    this.tabs = undefined;
+    this.activeIndex = undefined;
     this.disableAnimations = false;
-    /**
-     * Current selected tab index
-     */
     this.selectedIndex = 0;
-    /**
-     * Placement of the tabs
-     */
     this.tabPlacement = 'top';
-    this.easing = 'easeInOutSine';
-    this.firstRender = true;
   }
   onTabSelectionChange(newSelectionIndex, oldSelectionIndex) {
     this.updateTabAnimation(oldSelectionIndex, newSelectionIndex);
@@ -182,122 +175,128 @@ export class AnimatedTabs {
     this.activeIndex = index;
   }
   render() {
-    return (h(Host, { class: { 'flex-column-reverse': this.tabPlacement === 'bottom' } },
-      h("ul", { class: "tabs-container" },
-        this.animatedTabs.map((element, index) => (h("li", { class: { bottom: this.tabPlacement === 'bottom' }, onClick: () => this.onTabClick(index), onMouseDown: () => this.onTabMouseDown(index) },
-          h("div", { class: {
-              'tab-container': true,
-              selected: this.selectedIndex === index,
-            } },
-            h("ix-icon", { name: element.icon }),
-            element.count ? (h("span", { class: {
-                count: true,
-                bottom: this.tabPlacement === 'bottom',
-              } }, convertToAbbreviationString(element.count))) : (''))))),
-        h("div", { class: {
-            'tab-active-underline': true,
-            bottom: this.tabPlacement === 'bottom',
-          }, style: { 'margin-left': `calc(${this.selectedIndex} * 5rem)` } })),
-      h("div", { class: "content-container" },
-        h("slot", null))));
+    return (h(Host, { class: { 'flex-column-reverse': this.tabPlacement === 'bottom' } }, h("ul", { class: "tabs-container" }, this.animatedTabs.map((element, index) => (h("li", { class: { bottom: this.tabPlacement === 'bottom' }, onClick: () => this.onTabClick(index), onMouseDown: () => this.onTabMouseDown(index) }, h("div", { class: {
+        'tab-container': true,
+        selected: this.selectedIndex === index,
+      } }, h("ix-icon", { name: element.icon }), element.count ? (h("span", { class: {
+        count: true,
+        bottom: this.tabPlacement === 'bottom',
+      } }, convertToAbbreviationString(element.count))) : (''))))), h("div", { class: {
+        'tab-active-underline': true,
+        bottom: this.tabPlacement === 'bottom',
+      }, style: { 'margin-left': `calc(${this.selectedIndex} * 5rem)` } })), h("div", { class: "content-container" }, h("slot", null))));
   }
   static get is() { return "ix-animated-tabs"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["animated-tabs.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["animated-tabs.css"]
-  }; }
-  static get properties() { return {
-    "disableAnimations": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "deprecated",
-            "text": "- For debugging purposes only"
-          }],
-        "text": ""
-      },
-      "attribute": "disable-animations",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "selectedIndex": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Current selected tab index"
-      },
-      "attribute": "selected-index",
-      "reflect": false,
-      "defaultValue": "0"
-    },
-    "tabPlacement": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'top' | 'bottom'",
-        "resolved": "\"bottom\" | \"top\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Placement of the tabs"
+  static get originalStyleUrls() {
+    return {
+      "$": ["animated-tabs.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["animated-tabs.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "disableAnimations": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "deprecated",
+              "text": "- For debugging purposes only"
+            }],
+          "text": ""
+        },
+        "attribute": "disable-animations",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "attribute": "tab-placement",
-      "reflect": false,
-      "defaultValue": "'top'"
-    }
-  }; }
-  static get states() { return {
-    "tabs": {},
-    "activeIndex": {}
-  }; }
-  static get events() { return [{
-      "method": "tabClick",
-      "name": "tabClick",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Tab navigated"
+      "selectedIndex": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Current selected tab index"
+        },
+        "attribute": "selected-index",
+        "reflect": false,
+        "defaultValue": "0"
       },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+      "tabPlacement": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'top' | 'bottom'",
+          "resolved": "\"bottom\" | \"top\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Placement of the tabs"
+        },
+        "attribute": "tab-placement",
+        "reflect": false,
+        "defaultValue": "'top'"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "tabs": {},
+      "activeIndex": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "tabClick",
+        "name": "tabClick",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Tab navigated"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "selectedIndex",
-      "methodName": "onTabSelectionChange"
-    }]; }
-  static get listeners() { return [{
-      "name": "mouseup",
-      "method": "onMouseDown",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "selectedIndex",
+        "methodName": "onTabSelectionChange"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "mouseup",
+        "method": "onMouseDown",
+        "target": undefined,
+        "capture": false,
+        "passive": true
+      }];
+  }
 }

package/dist/collection/components/application-header/application-header.js

@@ -6,8 +6,11 @@
  * 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, Prop } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class ApplicationHeader {
+  constructor() {
+    this.name = undefined;
+  }
   componentDidLoad() {
     this.attachSiemensLogoIfLoaded();
   }
@@ -19,38 +22,40 @@ export class ApplicationHeader {
     }
   }
   render() {
-    return (h(Host, null,
-      h("div", { class: "logo" },
-        h("slot", { name: "logo" })),
-      h("span", { class: "name" }, this.name),
-      h("slot", null)));
+    return (h(Host, null, h("div", { class: "logo" }, h("slot", { name: "logo" })), h("span", { class: "name" }, this.name), h("slot", null)));
   }
   static get is() { return "ix-application-header"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["application-header.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["application-header.css"]
-  }; }
-  static get properties() { return {
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Application name"
-      },
-      "attribute": "name",
-      "reflect": false
-    }
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["application-header.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["application-header.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Application name"
+        },
+        "attribute": "name",
+        "reflect": false
+      }
+    };
+  }
   static get elementRef() { return "host"; }
 }

package/dist/collection/components/basic-navigation/basic-navigation.js

@@ -6,12 +6,10 @@
  * 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, Prop } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class BasicNavigation {
   constructor() {
-    /**
-     * Hide application header
-     */
+    this.applicationName = undefined;
     this.hideHeader = false;
   }
   get menu() {
@@ -35,57 +33,58 @@ export class BasicNavigation {
   render() {
     return (h(Host, { class: {
         'hide-header': this.hideHeader,
-      } },
-      !this.hideHeader ? (h("ix-application-header", { name: this.applicationName },
-        h("slot", { name: "logo" }))) : null,
-      h("div", { id: "menu-placeholder" }),
-      h("div", { class: "content", onClick: () => this.menu.toggleMenu(false) },
-        h("slot", null))));
+      } }, !this.hideHeader ? (h("ix-application-header", { name: this.applicationName }, h("slot", { name: "logo" }))) : null, h("div", { id: "menu-placeholder" }), h("div", { class: "content", onClick: () => this.menu.toggleMenu(false) }, h("slot", null))));
   }
   static get is() { return "ix-basic-navigation"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["basic-navigation.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["basic-navigation.css"]
-  }; }
-  static get properties() { return {
-    "applicationName": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Application name"
-      },
-      "attribute": "application-name",
-      "reflect": false
-    },
-    "hideHeader": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Hide application header"
+  static get originalStyleUrls() {
+    return {
+      "$": ["basic-navigation.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["basic-navigation.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "applicationName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Application name"
+        },
+        "attribute": "application-name",
+        "reflect": false
       },
-      "attribute": "hide-header",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
+      "hideHeader": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Hide application header"
+        },
+        "attribute": "hide-header",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
   static get elementRef() { return "hostElement"; }
 }

package/dist/collection/components/blind/blind.js

@@ -6,15 +6,10 @@
  * 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, Prop, Watch } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import anime from 'animejs';
 export class Blind {
-  constructor() {
-    /**
-     * Collapsed state
-     */
-    this.collapsed = false;
-  }
+  constructor() { this.collapsed = false; this.label = undefined; }
   onHeaderClick(e) {
     e.preventDefault();
     e.stopImmediatePropagation();
@@ -67,86 +62,91 @@ export class Blind {
     });
   }
   render() {
-    return (h(Host, null,
-      h("div", { class: {
-          'blind-header': true,
-          closed: this.collapsed,
-        }, onClick: (e) => this.onHeaderClick(e) },
-        h("span", { ref: (ref) => (this.chevronRef = ref), class: {
-            glyph: true,
-            'glyph-chevron-right-small': true,
-          } }),
-        h("div", { class: "blind-header-title" }, this.label !== undefined ? (h("span", { class: "blind-header-title-default" }, this.label)) : (h("slot", { name: "custom-header" })))),
-      h("div", { class: {
-          'blind-content': true,
-          hide: this.collapsed,
-        } },
-        h("slot", null))));
+    return (h(Host, null, h("div", { class: {
+        'blind-header': true,
+        closed: this.collapsed,
+      }, onClick: (e) => this.onHeaderClick(e) }, h("span", { ref: (ref) => (this.chevronRef = ref), class: {
+        glyph: true,
+        'glyph-chevron-right-small': true,
+      } }), h("div", { class: "blind-header-title" }, this.label !== undefined ? (h("span", { class: "blind-header-title-default" }, this.label)) : (h("slot", { name: "custom-header" })))), h("div", { class: {
+        'blind-content': true,
+        hide: this.collapsed,
+      } }, h("slot", null))));
   }
   static get is() { return "ix-blind"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["blind.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["blind.css"]
-  }; }
-  static get properties() { return {
-    "collapsed": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Collapsed state"
-      },
-      "attribute": "collapsed",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Label of blind"
-      },
-      "attribute": "label",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "collapsedChange",
-      "name": "collapsedChange",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Collapsed state changed"
+  static get originalStyleUrls() {
+    return {
+      "$": ["blind.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["blind.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "collapsed": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Collapsed state"
+        },
+        "attribute": "collapsed",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Label of blind"
+        },
+        "attribute": "label",
+        "reflect": false
       }
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "collapsedChange",
+        "name": "collapsedChange",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Collapsed state changed"
+        },
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "collapsed",
-      "methodName": "animation"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "collapsed",
+        "methodName": "animation"
+      }];
+  }
 }