@siemens/ix 1.1.0-beta.5 → 1.1.0-beta.6

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

@@ -6,12 +6,15 @@
  * 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, State } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import { FlipTileState } from './flip-tile-state';
 export class FlipTile {
   constructor() {
     this.ANIMATION_DURATION = 150;
     this.index = 0;
+    this.isFlipAnimationActive = undefined;
+    this.state = undefined;
+    this.footer = undefined;
   }
   componentDidLoad() {
     this.contentItems = this.contentContainerElement.querySelectorAll('ix-flip-tile-content');
@@ -45,81 +48,80 @@ export class FlipTile {
     }, 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" })))));
+    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" })))));
   }
   static get is() { return "ix-flip-tile"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["flip-tile.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["flip-tile.css"]
-  }; }
-  static get properties() { return {
-    "state": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "FlipTileState",
-        "resolved": "FlipTileState.Alarm | FlipTileState.Info | FlipTileState.None | FlipTileState.Primary | FlipTileState.Warning",
-        "references": {
-          "FlipTileState": {
-            "location": "import",
-            "path": "./flip-tile-state"
+  static get originalStyleUrls() {
+    return {
+      "$": ["flip-tile.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["flip-tile.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "state": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "FlipTileState",
+          "resolved": "FlipTileState.Alarm | FlipTileState.Info | FlipTileState.None | FlipTileState.Primary | FlipTileState.Warning",
+          "references": {
+            "FlipTileState": {
+              "location": "import",
+              "path": "./flip-tile-state"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Variation of the Flip"
-      },
-      "attribute": "state",
-      "reflect": false
-    },
-    "footer": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Variation of the Flip"
+        },
+        "attribute": "state",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Tmp property name"
-      },
-      "attribute": "footer",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "index": {},
-    "isFlipAnimationActive": {}
-  }; }
+      "footer": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Tmp property name"
+        },
+        "attribute": "footer",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "index": {},
+      "isFlipAnimationActive": {}
+    };
+  }
   static get elementRef() { return "hostElement"; }
 }

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

@@ -6,18 +6,21 @@
  * 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 } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class FlipTileContent {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h(Host, null, h("slot", null)));
   }
   static get is() { return "ix-flip-tile-content"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["flip-tile-content.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["flip-tile-content.css"]
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["flip-tile-content.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["flip-tile-content.css"]
+    };
+  }
 }

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

@@ -6,22 +6,9 @@
  * 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 { h, Host } from '@stencil/core';
 export class Group {
-  constructor() {
-    /**
-     * 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;
-  }
+  constructor() { this.suppressHeaderSelection = false; this.header = undefined; this.subHeader = undefined; this.collapsed = true; this.selected = undefined; this.index = undefined; this.expandOnHeaderClick = false; this.dropdownTriggerRef = undefined; }
   get dropdownItems() {
     return Array.from(this.hostElement.querySelectorAll('ix-group-dropdown-item'));
   }
@@ -109,221 +96,214 @@ export class Group {
     });
   }
   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" })))));
+    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" })))));
   }
   static get is() { return "ix-group"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["group.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["group.css"]
-  }; }
-  static get properties() { return {
-    "suppressHeaderSelection": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Prevent header from being selectable"
-      },
-      "attribute": "suppress-header-selection",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "header": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Group header"
-      },
-      "attribute": "header",
-      "reflect": false
-    },
-    "subHeader": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Group header subtitle"
-      },
-      "attribute": "sub-header",
-      "reflect": false
-    },
-    "collapsed": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Whether the group is collapsed or expanded. Defaults to true."
-      },
-      "attribute": "collapsed",
-      "reflect": true,
-      "defaultValue": "true"
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Whether the group is selected."
-      },
-      "attribute": "selected",
-      "reflect": true
-    },
-    "index": {
-      "type": "number",
-      "mutable": true,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The index of the selected group entry.\nIf undefined no group item is selected."
+  static get originalStyleUrls() {
+    return {
+      "$": ["group.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["group.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "suppressHeaderSelection": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Prevent header from being selectable"
+        },
+        "attribute": "suppress-header-selection",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "attribute": "index",
-      "reflect": true
-    },
-    "expandOnHeaderClick": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "header": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Group header"
+        },
+        "attribute": "header",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Expand the group if the header is clicked"
+      "subHeader": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Group header subtitle"
+        },
+        "attribute": "sub-header",
+        "reflect": false
       },
-      "attribute": "expand-on-header-click",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "dropdownTriggerRef": {}
-  }; }
-  static get events() { return [{
-      "method": "selectGroup",
-      "name": "selectGroup",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emits when whole group gets selected."
+      "collapsed": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Whether the group is collapsed or expanded. Defaults to true."
+        },
+        "attribute": "collapsed",
+        "reflect": true,
+        "defaultValue": "true"
       },
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      }
-    }, {
-      "method": "selectItem",
-      "name": "selectItem",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emits when group item gets selected."
+      "selected": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Whether the group is selected."
+        },
+        "attribute": "selected",
+        "reflect": true
       },
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      }
-    }, {
-      "method": "collapsedChanged",
-      "name": "collapsedChanged",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Group collapsed"
+      "index": {
+        "type": "number",
+        "mutable": true,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The index of the selected group entry.\nIf undefined no group item is selected."
+        },
+        "attribute": "index",
+        "reflect": true
       },
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "expandOnHeaderClick": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Expand the group if the header is clicked"
+        },
+        "attribute": "expand-on-header-click",
+        "reflect": false,
+        "defaultValue": "false"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "dropdownTriggerRef": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "selectGroup",
+        "name": "selectGroup",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emits when whole group gets selected."
+        },
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        }
+      }, {
+        "method": "selectItem",
+        "name": "selectItem",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emits when group item gets selected."
+        },
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        }
+      }, {
+        "method": "collapsedChanged",
+        "name": "collapsedChanged",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Group collapsed"
+        },
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "hostElement"; }
-  static get listeners() { return [{
-      "name": "keydown",
-      "method": "onKeyDown",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }]; }
+  static get listeners() {
+    return [{
+        "name": "keydown",
+        "method": "onKeyDown",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }];
+  }
 }