@siemens/ix 2.5.0 → 2.6.0

package/dist/collection/components/spinner/spinner.css

@@ -22,58 +22,61 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-:host(.xx-small) {
+:host {
   /* width */
   /* Track */
   /* Handle */
   /* Handle on hover */
   display: block;
   position: relative;
-  width: 0.75rem;
-  height: 0.75rem;
-  min-width: 0.75rem;
-  min-height: 0.75rem;
-  max-width: 0.75rem;
-  max-height: 0.75rem;
-  border-radius: 100%;
-  position: relative;
-  animation: rotate 2s linear infinite;
 }
-:host(.xx-small) *,
-:host(.xx-small) *::after,
-:host(.xx-small) *::before {
+:host *,
+:host *::after,
+:host *::before {
   box-sizing: border-box;
 }
-:host(.xx-small) ::-webkit-scrollbar-button {
+:host ::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
-  :host(.xx-small) * {
+  :host * {
     scrollbar-color: var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);
     scrollbar-width: thin;
   }
 }
-:host(.xx-small) ::-webkit-scrollbar {
+:host ::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host(.xx-small) ::-webkit-scrollbar-track {
+:host ::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host(.xx-small) ::-webkit-scrollbar-track:hover {
+:host ::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host(.xx-small) ::-webkit-scrollbar-thumb {
+:host ::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host(.xx-small) ::-webkit-scrollbar-thumb:hover {
+:host ::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host(.xx-small) ::-webkit-scrollbar-corner {
+:host ::-webkit-scrollbar-corner {
   display: none;
 }
+
+.xx-small {
+  width: 0.75rem;
+  height: 0.75rem;
+  min-width: 0.75rem;
+  min-height: 0.75rem;
+  max-width: 0.75rem;
+  max-height: 0.75rem;
+  border-radius: 100%;
+  position: relative;
+  animation: rotate 2s linear infinite;
+}
 @keyframes rotate {
   100% {
     transform: rotate(360deg);
@@ -118,7 +121,7 @@
   }
 }
 
-:host(.xx-small)::after {
+.xx-small::after {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -128,7 +131,7 @@
   animation: clipMask 3s linear infinite;
 }
 
-:host(:not(.hide-track)):host(.xx-small)::before {
+.xx-small:not(.hide-track)::before {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -137,66 +140,69 @@
   border: 1px solid var(--theme-color-ghost--hover);
 }
 
-:host(.primary)::after {
+.primary::after {
   border-color: var(--theme-color-dynamic);
 }
 
-:host(.primary)::before {
+.primary::before {
   border-color: var(--theme-color-ghost--hover);
 }
 
-:host(.x-small) {
+:host {
   /* width */
   /* Track */
   /* Handle */
   /* Handle on hover */
   display: block;
   position: relative;
-  width: 1.25rem;
-  height: 1.25rem;
-  min-width: 1.25rem;
-  min-height: 1.25rem;
-  max-width: 1.25rem;
-  max-height: 1.25rem;
-  border-radius: 100%;
-  position: relative;
-  animation: rotate 2s linear infinite;
 }
-:host(.x-small) *,
-:host(.x-small) *::after,
-:host(.x-small) *::before {
+:host *,
+:host *::after,
+:host *::before {
   box-sizing: border-box;
 }
-:host(.x-small) ::-webkit-scrollbar-button {
+:host ::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
-  :host(.x-small) * {
+  :host * {
     scrollbar-color: var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);
     scrollbar-width: thin;
   }
 }
-:host(.x-small) ::-webkit-scrollbar {
+:host ::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host(.x-small) ::-webkit-scrollbar-track {
+:host ::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host(.x-small) ::-webkit-scrollbar-track:hover {
+:host ::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host(.x-small) ::-webkit-scrollbar-thumb {
+:host ::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host(.x-small) ::-webkit-scrollbar-thumb:hover {
+:host ::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host(.x-small) ::-webkit-scrollbar-corner {
+:host ::-webkit-scrollbar-corner {
   display: none;
 }
+
+.x-small {
+  width: 1.25rem;
+  height: 1.25rem;
+  min-width: 1.25rem;
+  min-height: 1.25rem;
+  max-width: 1.25rem;
+  max-height: 1.25rem;
+  border-radius: 100%;
+  position: relative;
+  animation: rotate 2s linear infinite;
+}
 @keyframes rotate {
   100% {
     transform: rotate(360deg);
@@ -241,7 +247,7 @@
   }
 }
 
-:host(.x-small)::after {
+.x-small::after {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -251,7 +257,7 @@
   animation: clipMask 3s linear infinite;
 }
 
-:host(:not(.hide-track)):host(.x-small)::before {
+.x-small:not(.hide-track)::before {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -260,66 +266,69 @@
   border: 2px solid var(--theme-color-ghost--hover);
 }
 
-:host(.primary)::after {
+.primary::after {
   border-color: var(--theme-color-dynamic);
 }
 
-:host(.primary)::before {
+.primary::before {
   border-color: var(--theme-color-ghost--hover);
 }
 
-:host(.small) {
+:host {
   /* width */
   /* Track */
   /* Handle */
   /* Handle on hover */
   display: block;
   position: relative;
-  width: 1.5rem;
-  height: 1.5rem;
-  min-width: 1.5rem;
-  min-height: 1.5rem;
-  max-width: 1.5rem;
-  max-height: 1.5rem;
-  border-radius: 100%;
-  position: relative;
-  animation: rotate 2s linear infinite;
 }
-:host(.small) *,
-:host(.small) *::after,
-:host(.small) *::before {
+:host *,
+:host *::after,
+:host *::before {
   box-sizing: border-box;
 }
-:host(.small) ::-webkit-scrollbar-button {
+:host ::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
-  :host(.small) * {
+  :host * {
     scrollbar-color: var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);
     scrollbar-width: thin;
   }
 }
-:host(.small) ::-webkit-scrollbar {
+:host ::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host(.small) ::-webkit-scrollbar-track {
+:host ::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host(.small) ::-webkit-scrollbar-track:hover {
+:host ::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host(.small) ::-webkit-scrollbar-thumb {
+:host ::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host(.small) ::-webkit-scrollbar-thumb:hover {
+:host ::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host(.small) ::-webkit-scrollbar-corner {
+:host ::-webkit-scrollbar-corner {
   display: none;
 }
+
+.small {
+  width: 1.5rem;
+  height: 1.5rem;
+  min-width: 1.5rem;
+  min-height: 1.5rem;
+  max-width: 1.5rem;
+  max-height: 1.5rem;
+  border-radius: 100%;
+  position: relative;
+  animation: rotate 2s linear infinite;
+}
 @keyframes rotate {
   100% {
     transform: rotate(360deg);
@@ -364,7 +373,7 @@
   }
 }
 
-:host(.small)::after {
+.small::after {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -374,7 +383,7 @@
   animation: clipMask 3s linear infinite;
 }
 
-:host(:not(.hide-track)):host(.small)::before {
+.small:not(.hide-track)::before {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -383,66 +392,69 @@
   border: 2px solid var(--theme-color-ghost--hover);
 }
 
-:host(.primary)::after {
+.primary::after {
   border-color: var(--theme-color-dynamic);
 }
 
-:host(.primary)::before {
+.primary::before {
   border-color: var(--theme-color-ghost--hover);
 }
 
-:host(.medium) {
+:host {
   /* width */
   /* Track */
   /* Handle */
   /* Handle on hover */
   display: block;
   position: relative;
-  width: 2rem;
-  height: 2rem;
-  min-width: 2rem;
-  min-height: 2rem;
-  max-width: 2rem;
-  max-height: 2rem;
-  border-radius: 100%;
-  position: relative;
-  animation: rotate 2s linear infinite;
 }
-:host(.medium) *,
-:host(.medium) *::after,
-:host(.medium) *::before {
+:host *,
+:host *::after,
+:host *::before {
   box-sizing: border-box;
 }
-:host(.medium) ::-webkit-scrollbar-button {
+:host ::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
-  :host(.medium) * {
+  :host * {
     scrollbar-color: var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);
     scrollbar-width: thin;
   }
 }
-:host(.medium) ::-webkit-scrollbar {
+:host ::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host(.medium) ::-webkit-scrollbar-track {
+:host ::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host(.medium) ::-webkit-scrollbar-track:hover {
+:host ::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host(.medium) ::-webkit-scrollbar-thumb {
+:host ::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host(.medium) ::-webkit-scrollbar-thumb:hover {
+:host ::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host(.medium) ::-webkit-scrollbar-corner {
+:host ::-webkit-scrollbar-corner {
   display: none;
 }
+
+.medium {
+  width: 2rem;
+  height: 2rem;
+  min-width: 2rem;
+  min-height: 2rem;
+  max-width: 2rem;
+  max-height: 2rem;
+  border-radius: 100%;
+  position: relative;
+  animation: rotate 2s linear infinite;
+}
 @keyframes rotate {
   100% {
     transform: rotate(360deg);
@@ -487,7 +499,7 @@
   }
 }
 
-:host(.medium)::after {
+.medium::after {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -497,7 +509,7 @@
   animation: clipMask 3s linear infinite;
 }
 
-:host(:not(.hide-track)):host(.medium)::before {
+.medium:not(.hide-track)::before {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -506,66 +518,69 @@
   border: 2px solid var(--theme-color-ghost--hover);
 }
 
-:host(.primary)::after {
+.primary::after {
   border-color: var(--theme-color-dynamic);
 }
 
-:host(.primary)::before {
+.primary::before {
   border-color: var(--theme-color-ghost--hover);
 }
 
-:host(.large) {
+:host {
   /* width */
   /* Track */
   /* Handle */
   /* Handle on hover */
   display: block;
   position: relative;
-  width: 6rem;
-  height: 6rem;
-  min-width: 6rem;
-  min-height: 6rem;
-  max-width: 6rem;
-  max-height: 6rem;
-  border-radius: 100%;
-  position: relative;
-  animation: rotate 2s linear infinite;
 }
-:host(.large) *,
-:host(.large) *::after,
-:host(.large) *::before {
+:host *,
+:host *::after,
+:host *::before {
   box-sizing: border-box;
 }
-:host(.large) ::-webkit-scrollbar-button {
+:host ::-webkit-scrollbar-button {
   display: none;
 }
 @-moz-document url-prefix() {
-  :host(.large) * {
+  :host * {
     scrollbar-color: var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);
     scrollbar-width: thin;
   }
 }
-:host(.large) ::-webkit-scrollbar {
+:host ::-webkit-scrollbar {
   width: 0.5rem;
   height: 0.5rem;
 }
-:host(.large) ::-webkit-scrollbar-track {
+:host ::-webkit-scrollbar-track {
   border-radius: 5px;
   background: var(--theme-scrollbar-track--background);
 }
-:host(.large) ::-webkit-scrollbar-track:hover {
+:host ::-webkit-scrollbar-track:hover {
   background: var(--theme-scrollbar-track--background--hover);
 }
-:host(.large) ::-webkit-scrollbar-thumb {
+:host ::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background: var(--theme-scrollbar-thumb--background);
 }
-:host(.large) ::-webkit-scrollbar-thumb:hover {
+:host ::-webkit-scrollbar-thumb:hover {
   background: var(--theme-scrollbar-thumb--background--hover);
 }
-:host(.large) ::-webkit-scrollbar-corner {
+:host ::-webkit-scrollbar-corner {
   display: none;
 }
+
+.large {
+  width: 6rem;
+  height: 6rem;
+  min-width: 6rem;
+  min-height: 6rem;
+  max-width: 6rem;
+  max-height: 6rem;
+  border-radius: 100%;
+  position: relative;
+  animation: rotate 2s linear infinite;
+}
 @keyframes rotate {
   100% {
     transform: rotate(360deg);
@@ -610,7 +625,7 @@
   }
 }
 
-:host(.large)::after {
+.large::after {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -620,7 +635,7 @@
   animation: clipMask 3s linear infinite;
 }
 
-:host(:not(.hide-track)):host(.large)::before {
+.large:not(.hide-track)::before {
   content: "";
   box-sizing: border-box;
   position: absolute;
@@ -629,10 +644,10 @@
   border: 4px solid var(--theme-color-ghost--hover);
 }
 
-:host(.primary)::after {
+.primary::after {
   border-color: var(--theme-color-dynamic);
 }
 
-:host(.primary)::before {
+.primary::before {
   border-color: var(--theme-color-ghost--hover);
 }

package/dist/collection/components/spinner/spinner.js

@@ -14,15 +14,11 @@ export class Spinner {
         this.hideTrack = false;
     }
     render() {
-        return (h(Host, { key: '0146dd2225f65f26b9e2853cbb13072e4df5206c', class: {
+        return (h(Host, { key: '42aa3bd6891267c0dd6ae422006c51477e464f3b' }, h("div", { key: 'ddf9a95b429188a92b6240f8898706fd165d1742', class: {
                 primary: this.variant === 'primary',
-                'xx-small': this.size === 'xx-small',
-                'x-small': this.size === 'x-small',
-                small: this.size === 'small',
-                medium: this.size === 'medium',
-                large: this.size === 'large',
+                [this.size]: true,
                 'hide-track': this.hideTrack,
-            } }));
+            } })));
     }
     static get is() { return "ix-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spinner/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOlE,MAAM,OAAO,OAAO;;uBAMyB,WAAW;oBAMpD,QAAQ;yBAKU,KAAK;;IAEzB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;gBACnC,UAAU,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU;gBACpC,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;gBAClC,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC5B,MAAM,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;gBAC9B,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC5B,YAAY,EAAE,IAAI,CAAC,SAAS;aAC7B,GACK,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Element() hostElement!: HTMLIxSpinnerElement;\n\n  /**\n   * Variant of spinner\n   */\n  @Prop() variant: 'primary' | 'secondary' = 'secondary';\n\n  /**\n   * Size of spinner\n   */\n  @Prop() size: 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' =\n    'medium';\n\n  /**\n   * @internal\n   */\n  @Prop() hideTrack = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          primary: this.variant === 'primary',\n          'xx-small': this.size === 'xx-small',\n          'x-small': this.size === 'x-small',\n          small: this.size === 'small',\n          medium: this.size === 'medium',\n          large: this.size === 'large',\n          'hide-track': this.hideTrack,\n        }}\n      ></Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOlE,MAAM,OAAO,OAAO;;uBAMyB,WAAW;oBAMpD,QAAQ;yBAKU,KAAK;;IAEzB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAE;oBACL,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;oBACnC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;oBACjB,YAAY,EAAE,IAAI,CAAC,SAAS;iBAC7B,GACI,CACF,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Element() hostElement!: HTMLIxSpinnerElement;\n\n  /**\n   * Variant of spinner\n   */\n  @Prop() variant: 'primary' | 'secondary' = 'secondary';\n\n  /**\n   * Size of spinner\n   */\n  @Prop() size: 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' =\n    'medium';\n\n  /**\n   * @internal\n   */\n  @Prop() hideTrack = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            primary: this.variant === 'primary',\n            [this.size]: true,\n            'hide-track': this.hideTrack,\n          }}\n        ></div>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -38,7 +38,7 @@ export class SplitButton {
                 'left-button-border': !this.outline,
             },
         };
-        return (h(Host, { key: 'e452c205dc4ff169a9c01b757e913506be6cc217' }, h("div", { key: '926ce0fb8cca44d56d2d975a17858de163f67154', class: { 'btn-group': true, 'middle-gap': !this.outline } }, this.label ? (h("ix-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e) }), this.label)) : (h("ix-icon-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e) }))), h("ix-icon-button", Object.assign({ key: 'acc87b0c8506fc0d7e1e4314bbf9d6edd4a2428a' }, buttonAttributes, { ref: (r) => (this.triggerElement = r), class: 'anchor', icon: this.splitIcon }))), h("ix-dropdown", { key: '2bbd1e58b11b0f8c733c969a05a9ad14d8e99c94', ref: (r) => (this.dropdownElement = r), closeBehavior: this.closeBehavior }, h("slot", { key: '1da482f78a3ac0d6b54ee6c903ce11827c2bf7b1' }))));
+        return (h(Host, { key: 'ef6b9460140253c93d73fcdde4dd2dfd1a585167' }, h("div", { key: '084920621d13d2c3f2591a8023792615a5e0328f', class: { 'btn-group': true, 'middle-gap': !this.outline } }, this.label ? (h("ix-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e) }), this.label)) : (h("ix-icon-button", Object.assign({}, buttonAttributes, { icon: this.icon, onClick: (e) => this.buttonClick.emit(e) }))), h("ix-icon-button", Object.assign({ key: '8912184bad2d9c33c8115860521e29d77093551c' }, buttonAttributes, { ref: (r) => (this.triggerElement = r), class: 'anchor', icon: this.splitIcon }))), h("ix-dropdown", { key: '261c7ffd4edc2a34c5314e6649286aa19649815b', ref: (r) => (this.dropdownElement = r), closeBehavior: this.closeBehavior }, h("slot", { key: '092a0646953fccd7118b8d844dd8af12244f87fe' }))));
     }
     static get is() { return "ix-split-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/split-button-item/split-button-item.js

@@ -22,7 +22,7 @@ export class SplitButtonItem {
         return this.wrapperRef.waitForCurrent();
     }
     render() {
-        return (h(Host, { key: '2569c82160826d73102d074efd5a2b13a128b92b' }, h("ix-dropdown-item", { key: 'c46a3b90d3ba24747b0598be971a398ec2febe71', ref: this.wrapperRef, suppressChecked: true, icon: this.icon, label: this.label, onItemClick: (e) => {
+        return (h(Host, { key: '91330ca8eb90a2151566a65cf83aaf463560d57a' }, h("ix-dropdown-item", { key: '0114cf4320b766553382065909db69156b83015f', ref: this.wrapperRef, suppressChecked: true, icon: this.icon, label: this.label, onItemClick: (e) => {
                 e.preventDefault();
                 e.stopPropagation();
             }, onClick: (e) => this.itemClick.emit(e) })));

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

@@ -31,7 +31,7 @@ export class TabItem {
         };
     }
     render() {
-        return (h(Host, { key: 'd066fe09ebb7ac33ef162eafed96189de7215022', class: this.tabItemClasses({
+        return (h(Host, { key: 'aa3777497e986f80e8f6b5bffea01dc2df37f13b', class: this.tabItemClasses({
                 selected: this.selected,
                 disabled: this.disabled,
                 small: this.small,
@@ -46,12 +46,12 @@ export class TabItem {
                 if (clientEvent.defaultPrevented) {
                     event.stopPropagation();
                 }
-            } }, h("div", { key: '944c3beb003abae7f64ed18c3d77fa8d3a576be3', class: {
+            } }, h("div", { key: '5efa7f3f34b94adfeec71af2c99d7f3f5833755f', class: {
                 circle: this.rounded,
                 text: !this.rounded,
                 selected: this.selected,
                 disabled: this.disabled,
-            } }, h("slot", { key: 'ff6b883c8b1ec2e53fe9faa705bbcdb0345ef27b' })), h("div", { key: '292419b01ae7e18db509ad09a83ffa5bbc6480a5', class: {
+            } }, h("slot", { key: 'a7299d374904a1c0dada6733734e95c192e0789d' })), h("div", { key: '1f131f3b776e8a1911b68cfccee8f4864fe79e42', class: {
                 counter: true,
                 selected: this.selected,
                 hidden: !(this.rounded && this.counter !== undefined),

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

@@ -224,13 +224,13 @@ export class Tabs {
         });
     }
     render() {
-        return (h(Host, { key: 'e10ac5f7e421ca20215339ef7e72c309da7132cd' }, this.showArrowPrevious && (h("div", { key: 'e800708e789600cc2784b8c1515e3dc03b002ee9', class: "arrow", onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { key: 'd4c5fbc8e63d595c8fb92bf04d3462ea19446229', name: 'chevron-left-small' }))), h("div", { key: '908f08797515f007fb3320e157fa03a67cadcb25', class: {
+        return (h(Host, { key: '40618db9c5179c15841a181ebaff044a994fa41b' }, this.showArrowPrevious && (h("div", { key: '6470740adb92447a2c15da33d3e3bca217c4c5d2', class: "arrow", onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { key: '4e0775a52a8c7da00f9b07b51accc14ca9ba81bb', name: 'chevron-left-small' }))), h("div", { key: '5acd5d6f79f78ac07b10538c5ad4f1574fc4345c', class: {
                 'tab-items': true,
                 'overflow-shadow': true,
                 'shadow-left': this.showArrowPrevious,
                 'shadow-right': this.showArrowNext,
                 'shadow-both': this.showArrowNext && this.showArrowPrevious,
-            } }, h("div", { key: 'd63da9e8e146f3f7dc4376cb476a1ccfbe674e6a', class: "items-content" }, h("slot", { key: '781307adc791f851938edafb44a3be14a56e5eb8' }))), this.showArrowNext && (h("div", { key: '5ec04a7c0a53b73fdd1de1fdf89e4f48aa105c11', class: "arrow right", onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { key: 'cc7249abe9bfc978461dea999922251a743bdf84', name: 'chevron-right-small' })))));
+            } }, h("div", { key: '5b86235a18ff74dfe29f7aaec0894a10ce94ffd5', class: "items-content" }, h("slot", { key: '39c0c5f320952d5da92e63407c2a2a792c72e44e' }))), this.showArrowNext && (h("div", { key: '82f02f4cccb7edd793a69bf1eb4087c3fab6c75f', class: "arrow right", onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { key: 'c8ef765fbeff3ad9dfac79a4c0188ff67a6c1b76', name: 'chevron-right-small' })))));
     }
     static get is() { return "ix-tabs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -20,17 +20,17 @@ export class Tile {
         this.hasFooterSlot = !!this.hostElement.querySelector('[slot="footer"]');
     }
     render() {
-        return (h(Host, { key: '3591d450b88fa35cabff8ad8b96a9a3e292a46e5', class: {
+        return (h(Host, { key: 'cfc8d6668c5811b204b3e29c007a91f1212ef898', class: {
                 'tile-small': this.size === 'small',
                 'tile-medium': this.size === 'medium',
                 'tile-big': this.size === 'big',
-            } }, h("div", { key: '0da2a87420a4ec6e69cfac5f7025bd66f78bbda1', class: {
+            } }, h("div", { key: 'babc111307d12495e85df1082ba80bc4220141c1', class: {
                 'tile-header': true,
                 'has-content': this.hasHeaderSlot,
-            } }, h("slot", { key: '6eb0ce1872418533244a2057e995cb877afcac62', name: "header", onSlotchange: () => this.handleHeaderSlotChange() })), h("div", { key: 'e89abbd5ec65c8f122a7e1b1bf2882c5d719cfa7', class: "tile-subheader" }, h("slot", { key: 'c409b93907582bd7bd484657111f7204f8b89eb3', name: "subheader" })), h("div", { key: '0155d4a76a0d570a19ad76c968347dc030bb404a', class: "tile-content" }, h("slot", { key: '01f0107469bd358e8a6f17e3eb376f631a393deb' })), h("div", { key: '992a986c36ca4b3f2408cf03d8eda3fcc4f64b94', class: {
+            } }, h("slot", { key: 'e5b3867c6f6b84c2c79cde4e6fa172c9b8f9aece', name: "header", onSlotchange: () => this.handleHeaderSlotChange() })), h("div", { key: '34c3a63614c9dd0197fb8887c7225bd52d8f782b', class: "tile-subheader" }, h("slot", { key: 'f45955002e2cc973b0f71c3ce23152d4bb1ed6f2', name: "subheader" })), h("div", { key: '1bb7411eb62e7f43718b7912efc951ab49795f0d', class: "tile-content" }, h("slot", { key: '84961331ba612b39b157bb455a99187a57fa941d' })), h("div", { key: '55154883296f5d07df9fc45e554980c6bb40d8a0', class: {
                 'tile-footer': true,
                 'has-content': this.hasFooterSlot,
-            } }, h("slot", { key: '9e98bd01282e4ef2aadd1c07aeb4b8f577e2b312', name: "footer", onSlotchange: () => this.handleFooterSlotChange() }))));
+            } }, h("slot", { key: '22449cad3f6068f16555c82bb20d6cf87e76f143', name: "footer", onSlotchange: () => this.handleFooterSlotChange() }))));
     }
     static get is() { return "ix-tile"; }
     static get encapsulation() { return "shadow"; }