@siemens/ix 2.4.1 → 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: 'b83203aa7712519c8d12c8ff55378edc167b43f7', 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: 'dd2f9ba13231244d5eb7071c68f19ec2029b411a' }, h("ix-dropdown-item", { key: '0024bb200f0924ba9e7cdced2cc4958fb8da43df', 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.css

@@ -1,5 +1,5 @@
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *

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

@@ -1,5 +1,5 @@
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -224,13 +224,13 @@ export class Tabs {
         });
     }
     render() {
-        return (h(Host, { key: '014b3afcc4165f3c3aa0800ea6f12c15d138b48b' }, this.showArrowPrevious && (h("div", { key: '6c98e2c2957c96970d42d5abdf959f325e1c05b8', class: "arrow", onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { key: '55f46b38e62a863415fa5d51da48a1be19303b78', name: 'chevron-left-small' }))), h("div", { key: 'c0528e9e703746cc1acc63c1b68c4d9ee3a01a04', 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: 'bb6174f8e9a9543ee928a70de23500edbedaeb04', class: "items-content" }, h("slot", { key: 'ba881f7c4784685ebdb1f0a2581c4691f2a8f1b9' }))), this.showArrowNext && (h("div", { key: '743123a5b14ed6a473c21b742f54cbf4ae4405da', class: "arrow right", onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { key: 'd67ab90bf1b620791ca9e84f7ace8b7a04a7a772', 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"; }